diff --git a/bun.lockb b/bun.lockb index d82408f9..5a2509bb 100755 Binary files a/bun.lockb and b/bun.lockb differ diff --git a/lib/routes/Character/components/CharacterDialog/CharacterV3Dialog.tsx b/lib/routes/Character/components/CharacterDialog/CharacterV3Dialog.tsx index 68d87569..4816dc71 100644 --- a/lib/routes/Character/components/CharacterDialog/CharacterV3Dialog.tsx +++ b/lib/routes/Character/components/CharacterDialog/CharacterV3Dialog.tsx @@ -131,8 +131,8 @@ export const CharacterV3Dialog: React.FC<{ const theme = useTheme(); const query = useQuery<"card" | "advanced">(); - const showCharacterCard = query.get("card") === "true"; - const defaultAdvanced = query.get("advanced") === "true"; + const showCharacterCard = query?.get("card") === "true"; + const defaultAdvanced = query?.get("advanced") === "true"; const logger = useLogger(); const autoSaveTimeout = useRef(null); const characterManager = useCharacter(props.character, () => { diff --git a/lib/routes/Character/hooks/useCharacter.tsx b/lib/routes/Character/hooks/useCharacter.tsx index 8b7bd5f5..8d68a586 100644 --- a/lib/routes/Character/hooks/useCharacter.tsx +++ b/lib/routes/Character/hooks/useCharacter.tsx @@ -46,7 +46,7 @@ export function useCharacter( }, [characterFromProps]); async function loadTemplate(template: ICharacterTemplate) { - const defaultCharacter = await CharacterFactory.make(template); + const defaultCharacter = await CharacterFactory.make({ template }); setCharacter( produce((draft: ICharacter | undefined) => { diff --git a/lib/routes/NewCharacter/NewCharacterRoute.tsx b/lib/routes/NewCharacter/NewCharacterRoute.tsx index dfaa86b8..25894d81 100644 --- a/lib/routes/NewCharacter/NewCharacterRoute.tsx +++ b/lib/routes/NewCharacter/NewCharacterRoute.tsx @@ -57,7 +57,7 @@ export function NewCharacterRoute() { return categoryMatch && nameMatch; }); if (template) { - const fake = await CharacterFactory.make(template); + const fake = await CharacterFactory.make({ template }); setFakeCharacter(fake); setTemplate(template); setStatus("success"); @@ -68,9 +68,9 @@ export function NewCharacterRoute() { }, [params.category, params.name]); async function handleLoadTemplate() { setLoadingTemplate(true); - const newCharacter = await charactersManager.actions.add( - template as ICharacterTemplate, - ); + const newCharacter = await charactersManager.actions.add({ + template: template as ICharacterTemplate, + }); router.push(`/characters/${newCharacter.id}`); } const [fakeCharacter, setFakeCharacter] = useState(); diff --git a/package.json b/package.json index 50ff143f..737928bd 100644 --- a/package.json +++ b/package.json @@ -49,6 +49,7 @@ "@tldraw/tldraw": "^1.29.2", "@types/hoist-non-react-statics": "^3.3.1", "@types/node": "^20.4.8", + "@vitejs/plugin-legacy": "^4.1.1", "@vitejs/plugin-react": "^4.0.4", "canvas-confetti": "^1.6.0", "dayjs": "^1.11.9", diff --git a/stories/CharacterCard.stories.tsx b/stories/CharacterCard.stories.tsx index 87291452..728ceb60 100644 --- a/stories/CharacterCard.stories.tsx +++ b/stories/CharacterCard.stories.tsx @@ -3,12 +3,14 @@ import { action } from "@storybook/addon-actions"; import { Meta, Story } from "@storybook/react"; import { CharacterCard } from "../lib/components/Scene/components/PlayerRow/CharacterCard/CharacterCard"; import { Toolbox } from "../lib/components/Toolbox/Toolbox"; +import { CharacterTemplatesProvider } from "../lib/contexts/CharacterTemplatesContext/CharacterTemplatesContext"; import { CharacterFactory } from "../lib/domains/character/CharacterFactory"; +import { ICharacter } from "../lib/domains/character/types"; +import { dayJS } from "../lib/domains/dayjs/getDayJS"; import { MiniThemeContext, useMiniTheme, } from "../lib/routes/Character/components/CharacterDialog/MiniThemeContext"; -import { ICharacterTemplate } from "../lib/services/character-templates/CharacterTemplateService"; import { StoryProvider } from "./StoryProvider"; function StorybookCharacterCard( @@ -24,21 +26,27 @@ function StorybookCharacterCard( return ( <> - {}, + - - {}} + > + {}, + }} + hideDefaultRightActions={true} /> - - + + {}} + /> + + + ); } @@ -74,33 +82,33 @@ const Template: Story = (args, context) => { ); }; -export const FateCondensed = Template.bind({}); -(FateCondensed as any).loaders = [ - async () => { - const template: ICharacterTemplate = { - name: "", - publisher: "", - fetchPath: - "/public/character-templates/Fate Condensed/Fate Condensed.json", - }; +export const FateCondensed = makeCharacterSheetStory({ + importPath: + "../public/character-templates/Fate Condensed/Fate Condensed.json", +}); - const character = await CharacterFactory.make(template); +export const Charge = makeCharacterSheetStory({ + importPath: "../public/character-templates/Fari RPGs/Charge RPG.json", +}); - return { character }; - }, -]; +function makeCharacterSheetStory({ importPath }: { importPath: string }) { + const story = Template.bind({}); + (story as any).loaders = [ + async () => { + const file = await import(importPath); + const character = await CharacterFactory.make({ json: file.default }); + return { character: overrideCharacterDateForStorybook(character) }; + }, + ]; + return story; -export const Charge = Template.bind({}); -(Charge as any).loaders = [ - async () => { - const template: ICharacterTemplate = { - name: "", - publisher: "", - fetchPath: "/public/character-templates/Fari RPGs/Charge RPG.json", + function overrideCharacterDateForStorybook( + character: ICharacter, + ): ICharacter { + return { + ...character, + id: "50fa2", + lastUpdated: dayJS("2021-01-01").unix(), }; - - const character = await CharacterFactory.make(template); - - return { character }; - }, -]; + } +} diff --git a/stories/CharacterSheet.stories.tsx b/stories/CharacterSheet.stories.tsx index ccea8676..e800cf9a 100644 --- a/stories/CharacterSheet.stories.tsx +++ b/stories/CharacterSheet.stories.tsx @@ -2,11 +2,11 @@ import { Box } from "@mui/material"; import { action } from "@storybook/addon-actions"; import { Meta, Story } from "@storybook/react"; import { Toolbox } from "../lib/components/Toolbox/Toolbox"; +import { CharacterTemplatesProvider } from "../lib/contexts/CharacterTemplatesContext/CharacterTemplatesContext"; import { CharacterFactory } from "../lib/domains/character/CharacterFactory"; import { ICharacter } from "../lib/domains/character/types"; import { dayJS } from "../lib/domains/dayjs/getDayJS"; import { CharacterV3Dialog } from "../lib/routes/Character/components/CharacterDialog/CharacterV3Dialog"; -import { ICharacterTemplate } from "../lib/services/character-templates/CharacterTemplateService"; import { StoryProvider } from "./StoryProvider"; function StorybookCharacterSheet( @@ -17,23 +17,31 @@ function StorybookCharacterSheet( ) { return ( <> - {}, + - - + > + {}, + }} + hideDefaultRightActions={true} + /> + + + + + ); } @@ -66,22 +74,20 @@ const Template: Story = (args, context) => { }; export const FateCondensed = makeCharacterSheetStory({ - name: "", - publisher: "", - fetchPath: "/public/character-templates/Fate Condensed/Fate Condensed.json", + importPath: + "../public/character-templates/Fate Condensed/Fate Condensed.json", }); export const Charge = makeCharacterSheetStory({ - name: "", - publisher: "", - fetchPath: "/public/character-templates/Fari RPGs/Charge RPG.json", + importPath: "../public/character-templates/Fari RPGs/Charge RPG.json", }); -function makeCharacterSheetStory(template: ICharacterTemplate) { +function makeCharacterSheetStory({ importPath }: { importPath: string }) { const story = Template.bind({}); (story as any).loaders = [ async () => { - const character = await CharacterFactory.make(template); + const file = await import(importPath); + const character = await CharacterFactory.make({ json: file.default }); return { character: overrideCharacterDateForStorybook(character) }; }, ]; diff --git a/vite.config.ts b/vite.config.ts index e6cfcb55..c202ea07 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,3 +1,4 @@ +import legacy from "@vitejs/plugin-legacy"; import react from "@vitejs/plugin-react"; import { defineConfig } from "vitest/config"; @@ -9,7 +10,12 @@ export default defineConfig({ ), "process.env.JEST_WORKER_ID": JSON.stringify(false), }, - plugins: [react()], + plugins: [ + react(), + legacy({ + targets: ["defaults", "not IE 11"], + }), + ], server: { port: 1234, proxy: {