@prenta/admin 1.10.1 → 1.12.0

package/src/lib/seo-service.ts

@@ -144,6 +144,46 @@ export async function fetchSearchPerformance(
   return res.data?.rows ?? []
 }
 
+// ─── Per-document search insight (synced GSC + CrUX) ─────────────────
+
+export interface SearchInsightTopQuery {
+  query: string
+  clicks: number
+  impressions: number
+  position: number
+}
+
+export interface SearchInsight {
+  path: string
+  clicks28d: number
+  impressions28d: number
+  avgPosition28d: number | null
+  clicksPrev28d: number
+  impressionsPrev28d: number
+  avgPositionPrev28d: number | null
+  topQueries: SearchInsightTopQuery[]
+  lcpMs: number | null
+  inpMs: number | null
+  cls: number | null
+  cwvStatus: 'good' | 'needs-improvement' | 'poor' | null
+  lastSyncedAt: string | null
+}
+
+/**
+ * Synced search stats for one document. `insight` is null when Search Console
+ * isn't connected or no data has synced for the page yet — the editor pane
+ * renders a quiet hint instead of an error in that case.
+ */
+export async function fetchSearchInsight(
+  entityId: string,
+): Promise<{ connected: boolean; insight: SearchInsight | null }> {
+  const res = await cmsApi<{ connected: boolean; insight: SearchInsight | null }>(
+    `/seo/search-insights/${encodeURIComponent(entityId)}`,
+  )
+  throwIfError(res)
+  return res.data ?? { connected: false, insight: null }
+}
+
 // ─── Content SEO ─────────────────────────────────────────────────────
 
 /** Schema.org types available in document SEO editors. */
@@ -995,12 +1035,24 @@ export async function saveRedirectRecoverySettings(
 export async function generate404RecoverySuggestions(): Promise<{
   error?: string
   autoApplied?: number
+  /**
+   * Set when AI governance vetoed a requested auto-apply (eligible plans were
+   * stored as pending suggestions instead). Human-readable reason to surface.
+   */
+  governanceBlocked?: string
 }> {
-  const res = await cmsApi<{ created?: number; autoApplied?: number }>('/seo/redirects/suggest', {
+  const res = await cmsApi<{
+    created?: number
+    autoApplied?: number
+    governanceBlocked?: string | null
+  }>('/seo/redirects/suggest', {
     method: 'POST',
   })
   if (res.error) return { error: res.error }
-  return { autoApplied: res.data?.autoApplied ?? 0 }
+  return {
+    autoApplied: res.data?.autoApplied ?? 0,
+    governanceBlocked: res.data?.governanceBlocked ?? undefined,
+  }
 }
 
 export async function acceptRedirectSuggestion(suggestionId: string): Promise<{ error?: string }> {
@@ -1047,6 +1099,12 @@ export interface SeoAiResult {
   brandAlignment?: BrandAlignmentScoreResult
   /** True when the AI provider is not configured (graceful fallback). */
   unavailable?: boolean
+  /**
+   * Server-reported refusal (daily request cap, monthly budget, disabled
+   * feature). Surface verbatim — the runtime crafts these messages to tell the
+   * user which limit was hit and where to raise it.
+   */
+  error?: string
 }
 
 /**
@@ -1073,6 +1131,7 @@ export async function generateSeoField(
     body: JSON.stringify({ field, ...context }),
   })
   if (isAiUnavailable(res.status)) return { unavailable: true }
+  if (res.error) return { error: res.error }
   return res.data ?? {}
 }
 
@@ -1082,6 +1141,7 @@ export async function explainSeoIssue(issueId: string): Promise<SeoAiResult> {
     body: JSON.stringify({ issueId }),
   })
   if (isAiUnavailable(res.status)) return { unavailable: true }
+  if (res.error) return { error: res.error }
   return res.data ?? {}
 }
 
@@ -1095,12 +1155,14 @@ export async function generateStructuredData(context: {
     body: JSON.stringify(context),
   })
   if (isAiUnavailable(res.status)) return { unavailable: true }
+  if (res.error) return { error: res.error }
   return res.data ?? {}
 }
 
 export async function summarizeSeoAudit(): Promise<SeoAiResult> {
   const res = await cmsApi<SeoAiResult>('/ai/seo/summarize', { method: 'POST' })
   if (isAiUnavailable(res.status)) return { unavailable: true }
+  if (res.error) return { error: res.error }
   return res.data ?? {}
 }
 

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

@@ -8,7 +8,7 @@ import { ContentField, FIELD_INPUT, FIELD_LABEL } from './section-fields.js'
 import { RichTextField } from '../../fields/RichTextField.js'
 import type { PageSection } from '../../lib/page-editor-service.js'
 import type { SectionSettings } from './section-types.js'
-import { getSectionType } from './section-types.js'
+import { getSectionType, isSectionTypeHideable } from './section-types.js'
 
 interface SectionInspectorProps {
   section: PageSection
@@ -62,6 +62,7 @@ export function SectionInspector({
   onPostBodyChange,
 }: SectionInspectorProps) {
   const def = getSectionType(section.sectionType)
+  const showVisibilityToggle = !def || isSectionTypeHideable(def)
   const bodySource = String(section.content.source ?? 'field')
   const editPostBodyField =
     section.sectionType === 'article-body' &&
@@ -193,25 +194,27 @@ export function SectionInspector({
               onChange={(e) => onMetaChange({ internalLabel: e.target.value })}
             />
           </div>
-          <button
-            type="button"
-            onClick={onToggleVisibility}
-            disabled={!canEdit}
-            aria-pressed={!section.visible}
-            className="border-border text-foreground hover:bg-accent flex w-full items-center justify-between rounded-md border px-2.5 py-1.5 text-sm disabled:opacity-50"
-          >
-            <span className="flex items-center gap-2">
-              {section.visible ? (
-                <Eye className="h-4 w-4" aria-hidden />
-              ) : (
-                <EyeOff className="h-4 w-4" aria-hidden />
-              )}
-              {section.visible ? 'Visible on page' : 'Hidden from page'}
-            </span>
-            <span className="text-muted-foreground text-xs">
-              {section.visible ? 'Hide' : 'Show'}
-            </span>
-          </button>
+          {showVisibilityToggle && (
+            <button
+              type="button"
+              onClick={onToggleVisibility}
+              disabled={!canEdit}
+              aria-pressed={!section.visible}
+              className="border-border text-foreground hover:bg-accent flex w-full items-center justify-between rounded-md border px-2.5 py-1.5 text-sm disabled:opacity-50"
+            >
+              <span className="flex items-center gap-2">
+                {section.visible ? (
+                  <Eye className="h-4 w-4" aria-hidden />
+                ) : (
+                  <EyeOff className="h-4 w-4" aria-hidden />
+                )}
+                {section.visible ? 'Visible on page' : 'Hidden from page'}
+              </span>
+              <span className="text-muted-foreground text-xs">
+                {section.visible ? 'Hide' : 'Show'}
+              </span>
+            </button>
+          )}
         </fieldset>
 
         {/* Appearance */}

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

@@ -32,6 +32,11 @@ import * as DropdownMenu from '@radix-ui/react-dropdown-menu'
 import { adminPortalContainer } from '../../lib/portal-container.js'
 import type { PageSection } from '../../lib/page-editor-service.js'
 import { sectionIconFor } from './section-icons.js'
+import {
+  getSectionType,
+  isSectionEffectivelyVisible,
+  isSectionTypeHideable,
+} from './section-types.js'
 
 interface SectionsPanelProps {
   sections: PageSection[]
@@ -290,6 +295,9 @@ function SectionRow({
   // to view the read-only notice.
   const locked = section.unmanaged === true
   const Icon = sectionIconFor(section.sectionType)
+  const typeDef = getSectionType(section.sectionType)
+  const showVisibilityToggle = !typeDef || isSectionTypeHideable(typeDef)
+  const effectivelyVisible = isSectionEffectivelyVisible(section)
 
   return (
     <div
@@ -314,7 +322,7 @@ function SectionRow({
           <Icon className="h-4 w-4" aria-hidden />
         </span>
         <span
-          className={`truncate text-sm ${section.visible ? 'text-foreground' : 'text-muted-foreground line-through'}`}
+          className={`truncate text-sm ${effectivelyVisible ? 'text-foreground' : 'text-muted-foreground line-through'}`}
         >
           {section.name}
         </span>
@@ -330,22 +338,24 @@ function SectionRow({
         </span>
       ) : (
         <>
-          {/* Visibility survives the design-owned lockdown: `visible` is the one
-              structural property the content model gives an editor. */}
-          <button
-            type="button"
-            onClick={() => onToggleVisibility(section.id)}
-            disabled={!canEdit}
-            aria-pressed={!section.visible}
-            aria-label={section.visible ? `Hide ${section.name}` : `Show ${section.name}`}
-            className="prenta-touch-target text-muted-foreground hover:text-foreground shrink-0 rounded p-1 disabled:opacity-40"
-          >
-            {section.visible ? (
-              <Eye className="h-4 w-4" aria-hidden />
-            ) : (
-              <EyeOff className="h-4 w-4" aria-hidden />
-            )}
-          </button>
+          {/* Visibility survives the design-owned lockdown for hideable types.
+              hideable: false types omit the control entirely. */}
+          {showVisibilityToggle && (
+            <button
+              type="button"
+              onClick={() => onToggleVisibility(section.id)}
+              disabled={!canEdit}
+              aria-pressed={!section.visible}
+              aria-label={section.visible ? `Hide ${section.name}` : `Show ${section.name}`}
+              className="prenta-touch-target text-muted-foreground hover:text-foreground shrink-0 rounded p-1 disabled:opacity-40"
+            >
+              {section.visible ? (
+                <Eye className="h-4 w-4" aria-hidden />
+              ) : (
+                <EyeOff className="h-4 w-4" aria-hidden />
+              )}
+            </button>
+          )}
 
           {/* Disclosure. The row itself already toggles, but a visible chevron
               is what says the row opens at all — without one the list looks

package/src/views/page-editor/section-types.ts

@@ -13,6 +13,8 @@ export {
   getSectionTypesForScope,
   getAddableSectionTypesForScope,
   isSectionTypeAddable,
+  isSectionTypeHideable,
+  isSectionEffectivelyVisible,
   sectionTypeLabel,
   isKnownSectionType,
   resolveRepeaterField,

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

@@ -4,7 +4,7 @@ import { Puzzle } from 'lucide-react'
 import { fieldPathFromEventTarget } from '../../../lib/preview-bridge.js'
 import type { PageSection } from '../../../lib/page-editor-service.js'
 import { ErrorBoundary } from '../../../components/ErrorBoundary.js'
-import { getSectionType } from '../section-types.js'
+import { getSectionType, isSectionEffectivelyVisible } from '../section-types.js'
 import { ADMIN_RENDER_OPTIONS, useAdminSectionRenderers } from './admin-renderers.js'
 import { backgroundClass, paddingClass, type PostRenderContext } from './parts.js'
 import { HeroBannerSection } from './HeroBannerSection.js'
@@ -204,7 +204,7 @@ export function SectionRenderer({
   // the editor's own view of it, and a hidden section that rendered solid here
   // would misreport what was live at that moment.
   const chromed = editable || reviewing
-  const hidden = chromed && !section.visible
+  const hidden = chromed && !isSectionEffectivelyVisible(section)
   // Review mode is read-only. Click-to-select would edit the CURRENT page
   // while the canvas shows a past one.
   const interactive = editable && !reviewing

package/src/views/seo/OverviewTab.tsx

@@ -200,7 +200,7 @@ export function OverviewTab({
           <SeoEmptyState
             icon={<BarChart3 size={24} />}
             title="Search Console not connected"
-            description="Add a Google Search Console verification token in Settings → SEO. Performance charts will appear here when the Search Analytics API is wired."
+            description="Connect a Google service account in Settings → SEO → Search data, then run a sync. Real clicks, impressions, and positions will appear here."
           />
         ) : searchPerformance.length === 0 ? (
           <SeoEmptyState title="No search performance data" />

package/src/views/seo/RedirectsTab.tsx

@@ -172,6 +172,12 @@ function Ai404RecoveryCard({ onApplied }: { onApplied: () => void }) {
         ? ` ${res.autoApplied} high-confidence redirect${res.autoApplied === 1 ? '' : 's'} applied automatically.`
         : ''
     toast.success(`Generated 404 recovery suggestions.${autoMsg}`)
+    if (res.governanceBlocked) {
+      // AI governance vetoed the auto-apply (eligible plans were stored as
+      // pending suggestions). Tell the operator why, since the SEO module's
+      // "Auto-apply" toggle alone no longer decides.
+      toast.info(`Auto-apply skipped: ${res.governanceBlocked}`)
+    }
     refetch()
   }
 

package/src/views/settings/AISettingsTab.tsx

@@ -122,6 +122,7 @@ export function AISettingsTab({ role, config }: AISettingsTabProps) {
         canEdit={canEdit}
         onToggle={ai.toggleFeature}
         onSetFeatureModel={ai.setFeatureModel}
+        onSetGovernance={ai.setFeatureGovernance}
       />
       <BrandVoiceCard
         value={ai.form.brandVoice}

package/src/views/settings/AiFeaturesCard.tsx

@@ -13,8 +13,8 @@ const SELECT_CLASS =
  * Global AI feature toggles with per-feature model routing. Each switch persists
  * (via the Save bar) to the shared `ai.features.*` flags; the optional model
  * picker overrides which model that feature uses (otherwise it inherits the
- * default). Enforcement across modules lands in a later phase; here we surface
- * and store the operator's intent.
+ * default). The governance flags (approval, bulk apply, daily cap) are enforced
+ * by the governed AI runtime and the auto-apply gates in core.
  */
 export function AiFeaturesCard({
   features,
@@ -23,6 +23,7 @@ export function AiFeaturesCard({
   canEdit,
   onToggle,
   onSetFeatureModel,
+  onSetGovernance,
 }: {
   features: AiFeatureView[]
   models: AiModelView[]
@@ -30,6 +31,14 @@ export function AiFeaturesCard({
   canEdit: boolean
   onToggle: (key: string, enabled: boolean) => void
   onSetFeatureModel: (key: string, modelId: string) => void
+  onSetGovernance: (
+    key: string,
+    patch: Partial<{
+      approvalRequired: boolean
+      allowBulkApply: boolean
+      maxRequestsPerDay: string
+    }>,
+  ) => void
 }) {
   return (
     <SettingsCard
@@ -49,6 +58,7 @@ export function AiFeaturesCard({
               canEdit={canEdit}
               onToggle={onToggle}
               onSetFeatureModel={onSetFeatureModel}
+              onSetGovernance={onSetGovernance}
             />
           ))}
         </div>
@@ -64,6 +74,7 @@ function FeatureRow({
   canEdit,
   onToggle,
   onSetFeatureModel,
+  onSetGovernance,
 }: {
   feature: AiFeatureView
   models: AiModelView[]
@@ -71,8 +82,17 @@ function FeatureRow({
   canEdit: boolean
   onToggle: (key: string, enabled: boolean) => void
   onSetFeatureModel: (key: string, modelId: string) => void
+  onSetGovernance: (
+    key: string,
+    patch: Partial<{
+      approvalRequired: boolean
+      allowBulkApply: boolean
+      maxRequestsPerDay: string
+    }>,
+  ) => void
 }) {
   const selectId = useId()
+  const capId = useId()
   const required = feature.requiredCapabilities ?? []
   const effective = effectiveFeatureModel(feature.modelId, defaultModelId, required, models)
   const defaultModel = models.find(
@@ -141,6 +161,43 @@ function FeatureRow({
               needs. Pick a compatible model.
             </p>
           )}
+
+          <div className="border-border mt-4 space-y-3 border-t pt-3">
+            <SettingsToggleRow
+              label="Require approval"
+              description="AI output must be human-approved before it is applied."
+              checked={feature.approvalRequired}
+              disabled={!canEdit}
+              onChange={(v) => onSetGovernance(feature.key, { approvalRequired: v })}
+            />
+            <SettingsToggleRow
+              label="Allow bulk apply"
+              description="Permit applying many AI results in one operation."
+              checked={feature.allowBulkApply}
+              disabled={!canEdit}
+              onChange={(v) => onSetGovernance(feature.key, { allowBulkApply: v })}
+            />
+            <div>
+              <label htmlFor={capId} className="text-muted-foreground mb-1 block text-sm">
+                Max requests per day
+              </label>
+              <input
+                id={capId}
+                type="text"
+                inputMode="numeric"
+                value={feature.maxRequestsPerDay}
+                placeholder="Unlimited"
+                disabled={!canEdit}
+                onChange={(e) =>
+                  onSetGovernance(feature.key, { maxRequestsPerDay: e.target.value })
+                }
+                className={SELECT_CLASS}
+              />
+              <p className="text-muted-foreground mt-1 text-sm">
+                Site-wide daily cap for this feature. Leave empty for unlimited.
+              </p>
+            </div>
+          </div>
         </div>
       )}
     </div>