diff --git a/excalidraw-app/components/ExportToExcalidrawPlus.tsx b/excalidraw-app/components/ExportToExcalidrawPlus.tsx index 0b577ad7..c0818c96 100644 --- a/excalidraw-app/components/ExportToExcalidrawPlus.tsx +++ b/excalidraw-app/components/ExportToExcalidrawPlus.tsx @@ -80,7 +80,8 @@ export const ExportToExcalidrawPlus: React.FC<{ appState: Partial; files: BinaryFiles; onError: (error: Error) => void; -}> = ({ elements, appState, files, onError }) => { + onSuccess: () => void; +}> = ({ elements, appState, files, onError, onSuccess }) => { const { t } = useI18n(); return ( @@ -107,6 +108,7 @@ export const ExportToExcalidrawPlus: React.FC<{ try { trackEvent("export", "eplus", `ui (${getFrame()})`); await exportToExcalidrawPlus(elements, appState, files); + onSuccess(); } catch (error: any) { console.error(error); if (error.name !== "AbortError") { diff --git a/excalidraw-app/index.tsx b/excalidraw-app/index.tsx index 9156d501..5b2e2981 100644 --- a/excalidraw-app/index.tsx +++ b/excalidraw-app/index.tsx @@ -608,7 +608,7 @@ const ExcalidrawWrapper = () => { canvas: HTMLCanvasElement, ) => { if (exportedElements.length === 0) { - return window.alert(t("alerts.cannotExportEmptyCanvas")); + throw new Error(t("alerts.cannotExportEmptyCanvas")); } if (canvas) { try { @@ -624,7 +624,7 @@ const ExcalidrawWrapper = () => { ); if (errorMessage) { - setErrorMessage(errorMessage); + throw new Error(errorMessage); } if (url) { @@ -634,7 +634,7 @@ const ExcalidrawWrapper = () => { if (error.name !== "AbortError") { const { width, height } = canvas; console.error(error, { width, height }); - setErrorMessage(error.message); + throw new Error(error.message); } } } @@ -714,6 +714,11 @@ const ExcalidrawWrapper = () => { }, }); }} + onSuccess={() => { + excalidrawAPI?.updateScene({ + appState: { openDialog: null }, + }); + }} /> ); }, diff --git a/src/actions/actionExport.tsx b/src/actions/actionExport.tsx index 2c94a986..9622023f 100644 --- a/src/actions/actionExport.tsx +++ b/src/actions/actionExport.tsx @@ -191,7 +191,15 @@ export const actionSaveFileToDisk = register({ }, app.files, ); - return { commitToHistory: false, appState: { ...appState, fileHandle } }; + return { + commitToHistory: false, + appState: { + ...appState, + openDialog: null, + fileHandle, + toast: { message: t("toast.fileSaved") }, + }, + }; } catch (error: any) { if (error?.name !== "AbortError") { console.error(error); diff --git a/src/components/JSONExportDialog.tsx b/src/components/JSONExportDialog.tsx index e4d51da4..59cffbba 100644 --- a/src/components/JSONExportDialog.tsx +++ b/src/components/JSONExportDialog.tsx @@ -23,12 +23,15 @@ export type ExportCB = ( const JSONExportModal = ({ elements, appState, + setAppState, files, actionManager, exportOpts, canvas, + onCloseRequest, }: { appState: UIAppState; + setAppState: React.Component["setState"]; files: BinaryFiles; elements: readonly NonDeletedExcalidrawElement[]; actionManager: ActionManager; @@ -72,9 +75,14 @@ const JSONExportModal = ({ title={t("exportDialog.link_button")} aria-label={t("exportDialog.link_button")} showAriaLabel={true} - onClick={() => { - onExportToBackend(elements, appState, files, canvas); - trackEvent("export", "link", `ui (${getFrame()})`); + onClick={async () => { + try { + trackEvent("export", "link", `ui (${getFrame()})`); + await onExportToBackend(elements, appState, files, canvas); + onCloseRequest(); + } catch (error: any) { + setAppState({ errorMessage: error.message }); + } }} /> @@ -114,6 +122,7 @@ export const JSONExportDialog = ({ { } }; - useEffect( - () => () => { + useEffect(() => { + isMountedRef.current = true; + return () => { isMountedRef.current = false; - }, - [], - ); + }; + }, []); const lastPointerTypeRef = useRef(null);