@actuate-media/cms-admin 0.58.1 → 0.60.0

package/src/views/page-editor/useSitePreview.ts

@@ -21,6 +21,8 @@ interface UseSitePreviewOptions {
   saveState: SaveState
   /** Persist the draft; resolves `false` when the save failed. */
   saveDraft: () => Promise<boolean>
+  /** Open Site preview on load when the document is saved (has id + slug). */
+  defaultActive?: boolean
 }
 
 export interface SitePreviewState {
@@ -49,12 +51,55 @@ export function useSitePreview({
   dirty,
   saveState,
   saveDraft,
+  defaultActive = false,
 }: UseSitePreviewOptions): SitePreviewState {
   const [active, setActive] = useState(false)
   const [url, setUrl] = useState<string | null>(null)
   const [reloadKey, setReloadKey] = useState(0)
   const tokenRef = useRef<string | null>(null)
   const prevSaveState = useRef(saveState)
+  const autoOpenRef = useRef(false)
+
+  const activatePreview = useCallback(async () => {
+    if (!documentId || !slug) {
+      toast.error('Save the page before opening the site preview')
+      return false
+    }
+    setActive(true)
+    setUrl(null)
+    try {
+      if (dirty) {
+        const ok = await saveDraft()
+        if (!ok) {
+          setActive(false)
+          return false
+        }
+      }
+      const { token } = await createPreviewToken(collection, documentId)
+      tokenRef.current = token
+      setUrl(
+        buildPublicPreviewUrl({
+          siteUrl: resolveSiteUrl(siteUrl),
+          urlPrefix: urlPrefix ?? '',
+          slug,
+          token,
+        }),
+      )
+      return true
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : 'Failed to open site preview')
+      setActive(false)
+      return false
+    }
+  }, [collection, documentId, slug, urlPrefix, siteUrl, dirty, saveDraft])
+
+  // Opt-in default: open the iframe once a saved document is loaded.
+  useEffect(() => {
+    if (!defaultActive || autoOpenRef.current) return
+    if (!documentId || !slug) return
+    autoOpenRef.current = true
+    void activatePreview()
+  }, [defaultActive, documentId, slug, activatePreview])
 
   // After a save completes while the preview is open, rebuild the URL (the
   // slug may have changed in settings — the token is bound to the document
@@ -81,37 +126,8 @@ export function useSitePreview({
       setActive(false)
       return
     }
-    if (!documentId || !slug) {
-      toast.error('Save the page before opening the site preview')
-      return
-    }
-    setActive(true)
-    setUrl(null)
-    void (async () => {
-      try {
-        if (dirty) {
-          const ok = await saveDraft()
-          if (!ok) {
-            setActive(false)
-            return
-          }
-        }
-        const { token } = await createPreviewToken(collection, documentId)
-        tokenRef.current = token
-        setUrl(
-          buildPublicPreviewUrl({
-            siteUrl: resolveSiteUrl(siteUrl),
-            urlPrefix: urlPrefix ?? '',
-            slug,
-            token,
-          }),
-        )
-      } catch (err) {
-        toast.error(err instanceof Error ? err.message : 'Failed to open site preview')
-        setActive(false)
-      }
-    })()
-  }, [active, collection, documentId, slug, urlPrefix, siteUrl, dirty, saveDraft])
+    void activatePreview()
+  }, [active, activatePreview])
 
   return { active, url, reloadKey, toggle }
 }

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

@@ -18,6 +18,8 @@ interface PostEditorCanvasProps {
   onAddSection: () => void
   /** Section types rendered as placeholders — shows the "Structure view" notice. */
   structuralTypes?: string[]
+  /** Site preview toggle is available — show WYSIWYG nudge on the canvas. */
+  sitePreviewAvailable?: boolean
 }
 
 /**
@@ -35,6 +37,7 @@ export function PostEditorCanvas({
   onSelect,
   onAddSection,
   structuralTypes = [],
+  sitePreviewAvailable = false,
 }: PostEditorCanvasProps) {
   const vp = getViewport(viewport)
   const containerRef = useRef<HTMLDivElement>(null)
@@ -74,7 +77,10 @@ export function PostEditorCanvas({
 
   return (
     <div ref={containerRef} className="bg-muted h-full overflow-auto p-6">
-      <StructureNotice structuralTypes={structuralTypes} />
+      <StructureNotice
+        structuralTypes={structuralTypes}
+        sitePreviewAvailable={sitePreviewAvailable}
+      />
       <div
         className="mx-auto"
         style={{ width: vp.width * scale, height: surfaceHeight ?? undefined }}

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

@@ -48,6 +48,7 @@ import { SectionsPanel } from '../page-editor/SectionsPanel.js'
 import { SectionInspector } from '../page-editor/SectionInspector.js'
 import { AddSectionModal } from '../page-editor/AddSectionModal.js'
 import { ValidationSummary } from '../page-editor/ValidationSummary.js'
+import { resolveDefaultSitePreview } from '../../lib/editor-preview.js'
 import { PostEditorCanvas } from './PostEditorCanvas.js'
 import { PostFieldsModal, type PostFieldConfig } from './PostFieldsModal.js'
 
@@ -63,6 +64,7 @@ interface EditorConfig {
     | undefined
   >
   seo?: { siteUrl?: string }
+  admin?: { editor?: { defaultSitePreview?: boolean | { pages?: boolean; posts?: boolean } } }
 }
 
 /** The slice of the admin session this editor reads. */
@@ -324,8 +326,11 @@ export function PostSectionEditor({
     dirty,
     saveState,
     saveDraft: handleSaveDraft,
+    defaultActive: resolveDefaultSitePreview(config?.admin?.editor, 'posts'),
   })
 
+  const sitePreviewAvailable = Boolean(post?.id && post?.slug)
+
   const requestPublish = useCallback(() => {
     if (!post) return
     const result = validatePost(post, true)
@@ -570,6 +575,7 @@ export function PostSectionEditor({
                 onSelect={setSelectedId}
                 onAddSection={() => setAddOpen(true)}
                 structuralTypes={structuralTypes}
+                sitePreviewAvailable={sitePreviewAvailable && !sitePreview.active}
               />
             )}
           </div>

package/src/views/seo/AuditTab.tsx

@@ -26,6 +26,8 @@ import {
 } from '../../components/seo/primitives.js'
 import { SeoIssueFixDrawer } from '../../components/seo/SeoIssueFixDrawer.js'
 import { SeoIssueFixPanel, SeoIssueFixToggle } from '../../components/seo/SeoIssueFixPanel.js'
+import { PlanUpgradeCallout } from '../../components/PlanUpgradeCallout.js'
+import { hasPlanFeature, type PlanInfo } from '../../lib/plan.js'
 import { useSeoResource } from './useSeoResource.js'
 
 const SEVERITY_FILTERS: { id: SeoSeverity | 'all'; label: string }[] = [
@@ -95,10 +97,12 @@ export function AuditTab({
   refetchKey = 0,
   initialIssueId,
   onNavigate,
+  planInfo,
 }: {
   refetchKey?: number
   initialIssueId?: string | null
   onNavigate?: (path: string) => void
+  planInfo?: PlanInfo | null
 }) {
   const [severity, setSeverity] = useState<SeoSeverity | 'all'>('all')
   const [status, setStatus] = useState<SeoIssueStatus | 'all'>('open')
@@ -119,6 +123,7 @@ export function AuditTab({
     () => issues.filter((i) => supportsSeoContentBrief(i.type)).length,
     [issues],
   )
+  const batchBriefsEnabled = hasPlanFeature(planInfo, 'seo.batchContentBriefs')
 
   function toggleExpanded(issueId: string) {
     setExpandedIssueId((current) => (current === issueId ? null : issueId))
@@ -231,16 +236,23 @@ export function AuditTab({
             </div>
           </div>
           <div className="flex flex-wrap gap-2">
-            <button
-              type="button"
-              className={btnSecondary}
-              onClick={handleBatchGenerateBriefs}
-              disabled={batchGenerating || loading || briefEligibleCount === 0}
-              aria-busy={batchGenerating}
-            >
-              <Sparkles className="h-4 w-4" aria-hidden />
-              {batchGenerating ? 'Generating…' : 'Generate briefs'}
-            </button>
+            {batchBriefsEnabled ? (
+              <button
+                type="button"
+                className={btnSecondary}
+                onClick={handleBatchGenerateBriefs}
+                disabled={batchGenerating || loading || briefEligibleCount === 0}
+                aria-busy={batchGenerating}
+              >
+                <Sparkles className="h-4 w-4" aria-hidden />
+                {batchGenerating ? 'Generating…' : 'Generate briefs'}
+              </button>
+            ) : (
+              <PlanUpgradeCallout
+                feature="seo.batchContentBriefs"
+                upgradeUrl={planInfo?.upgradeUrl}
+              />
+            )}
             <button
               type="button"
               className={btnSecondary}
@@ -330,6 +342,7 @@ export function AuditTab({
                         onChanged={handleChanged}
                         onNavigate={onNavigate}
                         onOpenDetails={() => setDetailIssueId(issue.id)}
+                        planInfo={planInfo}
                       />
                     </Fragment>
                   )

package/src/views/settings/MonthlyUsageCard.tsx

@@ -104,7 +104,8 @@ export function MonthlyUsageCard({
             </p>
           ) : (
             <p className="text-muted-foreground mt-1 text-sm">
-              Leave blank for no limit. Enforcement and alerts arrive with usage metering.
+              Leave blank for no limit. When set, new AI requests are blocked with HTTP 429 after
+              the limit is reached.
             </p>
           )}
         </div>