diff --git a/packages/sanity/src/structure/panes/document/documentPanel/documentViews/FormView.tsx b/packages/sanity/src/structure/panes/document/documentPanel/documentViews/FormView.tsx index b5eaa2114b25..776ad802e0e5 100644 --- a/packages/sanity/src/structure/panes/document/documentPanel/documentViews/FormView.tsx +++ b/packages/sanity/src/structure/panes/document/documentPanel/documentViews/FormView.tsx @@ -67,14 +67,19 @@ export const FormView = forwardRef(function FormV const isLocked = editState?.transactionSyncLock?.enabled const {t} = useTranslation(structureLocaleNamespace) - useConditionalToast({ - id: `sync-lock-${documentId}`, - status: 'warning', - enabled: isLocked, - title: t('document-view.form-view.sync-lock-toast.title'), - description: t('document-view.form-view.sync-lock-toast.description'), - closable: true, - }) + const conditionalToastParams = useMemo( + () => ({ + id: `sync-lock-${documentId}`, + status: 'warning' as const, + enabled: isLocked, + title: t('document-view.form-view.sync-lock-toast.title'), + description: t('document-view.form-view.sync-lock-toast.description'), + closable: true, + }), + [documentId, isLocked, t], + ) + + useConditionalToast(conditionalToastParams) useEffect(() => { const sub = documentStore.pair diff --git a/packages/sanity/src/structure/panes/document/documentPanel/documentViews/useConditionalToast.ts b/packages/sanity/src/structure/panes/document/documentPanel/documentViews/useConditionalToast.ts index 1b8b1340f2c0..9702d3b4641c 100644 --- a/packages/sanity/src/structure/panes/document/documentPanel/documentViews/useConditionalToast.ts +++ b/packages/sanity/src/structure/panes/document/documentPanel/documentViews/useConditionalToast.ts @@ -32,5 +32,15 @@ export function useConditionalToast(params: ToastParams & {id: string; enabled?: duration: 0.01, }) } + return () => { + // Close the toast when the component unmounts + if (params.enabled) { + toast.push({ + ...params, + // Note: @sanity/ui fallbacks to the default duration of 4s in case of falsey values + duration: 0.01, + }) + } + } }, [params, toast, wasEnabled]) }