diff --git a/src/components/App.tsx b/src/components/App.tsx index 3158cefac..13ae637a2 100644 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -1178,10 +1178,12 @@ class App extends React.Component { app={this} > {this.props.children} - + {this.state.activeTool.type === "mermaid" && ( + + )}
diff --git a/src/components/MermaidToExcalidraw.tsx b/src/components/MermaidToExcalidraw.tsx index 9fc504d7a..d974c9acf 100644 --- a/src/components/MermaidToExcalidraw.tsx +++ b/src/components/MermaidToExcalidraw.tsx @@ -18,6 +18,31 @@ import { import { NonDeletedExcalidrawElement } from "../element/types"; import { canvasToBlob } from "../data/blob"; +const LOCAL_STORAGE_KEY_MERMAID_TO_EXCALIDRAW = "mermaid-to-excalidraw"; + +const saveMermaidDataToStorage = (data: string) => { + try { + localStorage.setItem(LOCAL_STORAGE_KEY_MERMAID_TO_EXCALIDRAW, data); + } catch (error: any) { + // Unable to access window.localStorage + console.error(error); + } +}; + +const importMermaidDataFromStorage = () => { + try { + const data = localStorage.getItem(LOCAL_STORAGE_KEY_MERMAID_TO_EXCALIDRAW); + if (data) { + return data; + } + } catch (error: any) { + // Unable to access localStorage + console.error(error); + } + + return null; +}; + const MermaidToExcalidraw = ({ appState, elements, @@ -34,6 +59,13 @@ const MermaidToExcalidraw = ({ const canvasRef = useRef(null); const app = useApp(); + useEffect(() => { + const data = importMermaidDataFromStorage(); + if (data) { + setText(data); + } + }, []); + useEffect(() => { const canvasNode = canvasRef.current; if (!canvasNode) { @@ -86,13 +118,11 @@ const MermaidToExcalidraw = ({ }, [text]); const setAppState = useExcalidrawSetAppState(); - if (appState?.activeTool?.type !== "mermaid") { - return null; - } const onClose = () => { const activeTool = updateActiveTool(appState, { type: "selection" }); setAppState({ activeTool }); + saveMermaidDataToStorage(text); }; const onSelect = () => { diff --git a/vitest.config.ts b/vitest.config.ts index 51a4df95f..64158e652 100644 --- a/vitest.config.ts +++ b/vitest.config.ts @@ -1,5 +1,4 @@ import { defineConfig } from "vitest/config"; - export default defineConfig({ test: { setupFiles: ["./src/setupTests.ts"],