@actuate-media/cms-admin 0.76.0 → 0.76.1

package/src/views/page-editor/PageSectionEditor.tsx

@@ -4,6 +4,7 @@ import { useCallback, useEffect, useMemo, useState } from 'react'
 import { AlertTriangle, Blocks, Loader2, Lock } from 'lucide-react'
 import { toast } from 'sonner'
 import { ConfirmDialog } from '../../components/ui/ConfirmDialog.js'
+import { useNavigationBlocker } from '../../router/index.js'
 import { SchedulePublishDialog } from '../../components/SchedulePublishDialog.js'
 import { EditorSeoAside } from '../../components/EditorSeoAside.js'
 import { ErrorBoundary } from '../../components/ErrorBoundary.js'
@@ -190,16 +191,8 @@ export function PageSectionEditor({
     }
   }, [documentId, initialParentId, schemaError])
 
-  // ─── Unsaved-changes guard (browser unload) ──────────────────────────
-  useEffect(() => {
-    if (!dirty) return
-    function onBeforeUnload(e: BeforeUnloadEvent) {
-      e.preventDefault()
-      e.returnValue = ''
-    }
-    window.addEventListener('beforeunload', onBeforeUnload)
-    return () => window.removeEventListener('beforeunload', onBeforeUnload)
-  }, [dirty])
+  // ─── Unsaved-changes guard (client-side navigation + browser unload) ──
+  useNavigationBlocker(dirty)
 
   // ─── Section mutations ───────────────────────────────────────────────
   const mutateSections = useCallback(

package/src/views/page-editor/sections/ArticleBodySection.tsx

@@ -37,10 +37,7 @@ export function ArticleBodySection({
         </div>
       )}
       {html.trim() ? (
-        <div
-          className="prose prose-zinc text-foreground max-w-none text-base leading-relaxed"
-          dangerouslySetInnerHTML={{ __html: html }}
-        />
+        <div className="actuate-rich-text max-w-none" dangerouslySetInnerHTML={{ __html: html }} />
       ) : (
         <p className="text-muted-foreground text-base leading-relaxed italic">
           {source === 'field'

package/src/views/post-editor/PostSectionEditor.tsx

@@ -4,6 +4,7 @@ import { useCallback, useEffect, useMemo, useState } from 'react'
 import { AlertTriangle, Loader2, Lock } from 'lucide-react'
 import { toast } from 'sonner'
 import { ConfirmDialog } from '../../components/ui/ConfirmDialog.js'
+import { useNavigationBlocker } from '../../router/index.js'
 import { SchedulePublishDialog } from '../../components/SchedulePublishDialog.js'
 import { EditorSeoAside } from '../../components/EditorSeoAside.js'
 import { ErrorBoundary } from '../../components/ErrorBoundary.js'
@@ -227,16 +228,8 @@ export function PostSectionEditor({
     }
   }, [postType, documentId, schemaError])
 
-  // ─── Unsaved-changes guard ───────────────────────────────────────────
-  useEffect(() => {
-    if (!dirty) return
-    function onBeforeUnload(e: BeforeUnloadEvent) {
-      e.preventDefault()
-      e.returnValue = ''
-    }
-    window.addEventListener('beforeunload', onBeforeUnload)
-    return () => window.removeEventListener('beforeunload', onBeforeUnload)
-  }, [dirty])
+  // ─── Unsaved-changes guard (client-side navigation + browser unload) ──
+  useNavigationBlocker(dirty)
 
   const context: PostRenderContext = useMemo(
     () => ({

package/src/views/post-editor/PostTemplateEditor.tsx

@@ -4,6 +4,7 @@ import { useCallback, useEffect, useMemo, useState } from 'react'
 import { AlertTriangle, ArrowLeft, Layout, Loader2, Save } from 'lucide-react'
 import { toast } from 'sonner'
 import { ConfirmDialog } from '../../components/ui/ConfirmDialog.js'
+import { useNavigationBlocker } from '../../router/index.js'
 import { ErrorBoundary } from '../../components/ErrorBoundary.js'
 import {
   addSection,
@@ -99,15 +100,8 @@ export function PostTemplateEditor({
     }
   }, [postType])
 
-  useEffect(() => {
-    if (!dirty) return
-    function onBeforeUnload(e: BeforeUnloadEvent) {
-      e.preventDefault()
-      e.returnValue = ''
-    }
-    window.addEventListener('beforeunload', onBeforeUnload)
-    return () => window.removeEventListener('beforeunload', onBeforeUnload)
-  }, [dirty])
+  // Unsaved-changes guard (client-side navigation + browser unload).
+  useNavigationBlocker(dirty)
 
   const mutateSections = useCallback(
     (fn: (sections: EditorPostTemplate['sections']) => EditorPostTemplate['sections']) => {