@prenta/admin 1.13.0 → 1.15.0

package/src/views/seo/RedirectsTab.tsx

@@ -1,6 +1,6 @@
 'use client'
 
-import { useEffect, useRef, useState } from 'react'
+import { useEffect, useId, useRef, useState } from 'react'
 import {
   Plus,
   Trash2,
@@ -46,6 +46,8 @@ import { InspectorPane, SplitPaneLayout, SplitPaneList } from '../../components/
 import { ConfirmDialog } from '../../components/ui/ConfirmDialog.js'
 import { useSeoResource } from './useSeoResource.js'
 
+const SEO_SETTINGS_PATH = '/settings?tab=seo'
+
 function OverviewCards({ onRefetchKey }: { onRefetchKey: number }) {
   const { data, loading, error, refetch } = useSeoResource(fetchRedirectOverview, [onRefetchKey])
   if (loading) return <SeoLoading label="Loading redirect overview…" />
@@ -70,10 +72,16 @@ function OverviewCards({ onRefetchKey }: { onRefetchKey: number }) {
   )
 }
 
-function RecoverySettingsCard() {
+/**
+ * 404 recovery settings. Only AI re-ranking lives here; the auto-apply policy
+ * (threshold, budget, gate) moved to SEO Autopilot, so the card points there
+ * instead of exposing a second copy of the controls.
+ */
+function RecoverySettingsCard({ onNavigate }: { onNavigate?: (path: string) => void }) {
   const { data, loading, error, refetch } = useSeoResource(fetchRedirectRecoverySettings, [])
   const [saving, setSaving] = useState(false)
   const [local, setLocal] = useState<RedirectRecoverySettings | null>(null)
+  const aiRerankId = useId()
 
   useEffect(() => {
     if (data) setLocal(data)
@@ -82,7 +90,7 @@ function RecoverySettingsCard() {
   async function handleSave() {
     if (!local) return
     setSaving(true)
-    const res = await saveRedirectRecoverySettings(local)
+    const res = await saveRedirectRecoverySettings({ aiRerank: local.aiRerank })
     setSaving(false)
     if (res.error) return toast.error(res.error)
     toast.success('Recovery settings saved.')
@@ -96,58 +104,39 @@ function RecoverySettingsCard() {
   return (
     <SectionCard
       title="404 recovery settings"
-      description="Control AI re-ranking and optional auto-redirect for high-confidence matches"
+      description="Control how suggested redirects are ranked before you review them"
     >
       <div className="space-y-4">
-        <label className="flex items-start gap-3">
+        <div className="flex items-start gap-3">
           <input
+            id={aiRerankId}
             type="checkbox"
-            className="border-border mt-1 h-4 w-4 rounded"
+            className="border-border focus-visible:ring-ring mt-1 h-4 w-4 rounded focus-visible:ring-2 focus-visible:outline-none"
             checked={local.aiRerank}
             onChange={(e) => setLocal({ ...local, aiRerank: e.target.checked })}
+            aria-describedby={`${aiRerankId}-help`}
           />
-          <span>
-            <span className="text-foreground text-sm font-medium">AI re-ranking</span>
-            <span className="text-muted-foreground block text-sm">
+          <div>
+            <label htmlFor={aiRerankId} className="text-foreground text-sm font-medium">
+              AI re-ranking
+            </label>
+            <p id={`${aiRerankId}-help`} className="text-muted-foreground text-sm">
               Use semantic search to resolve ambiguous matches (40–84% heuristic confidence).
-            </span>
-          </span>
-        </label>
-        <label className="flex items-start gap-3">
-          <input
-            type="checkbox"
-            className="border-border mt-1 h-4 w-4 rounded"
-            checked={local.autoApply}
-            onChange={(e) => setLocal({ ...local, autoApply: e.target.checked })}
-          />
-          <span>
-            <span className="text-foreground text-sm font-medium">
-              Auto-apply high-confidence redirects
-            </span>
-            <span className="text-muted-foreground block text-sm">
-              Create 301 redirects automatically when confidence meets the threshold (off by
-              default).
-            </span>
-          </span>
-        </label>
-        <label className="block max-w-xs">
-          <span className="text-foreground text-sm font-medium">Auto-apply minimum confidence</span>
-          <input
-            type="number"
-            min={50}
-            max={100}
-            value={local.autoApplyMinConfidence}
-            disabled={!local.autoApply}
-            onChange={(e) =>
-              setLocal({
-                ...local,
-                autoApplyMinConfidence: Math.max(50, Math.min(100, Number(e.target.value) || 85)),
-              })
-            }
-            className="border-border bg-input-background text-foreground focus-visible:ring-ring mt-1 w-full rounded-md border px-3 py-2 text-sm focus-visible:ring-2 focus-visible:outline-none disabled:opacity-50"
-          />
-        </label>
-        <button className={btnSecondary} onClick={handleSave} disabled={saving}>
+            </p>
+          </div>
+        </div>
+        <p className="text-muted-foreground text-sm">
+          Auto-apply for high-confidence redirects is managed by{' '}
+          <button
+            type="button"
+            className="text-primary focus-visible:ring-ring rounded-sm font-medium underline-offset-2 hover:underline focus-visible:ring-2 focus-visible:outline-none"
+            onClick={() => onNavigate?.(SEO_SETTINGS_PATH)}
+          >
+            SEO Autopilot
+          </button>
+          .
+        </p>
+        <button type="button" className={btnSecondary} onClick={handleSave} disabled={saving}>
           {saving ? 'Saving…' : 'Save settings'}
         </button>
       </div>
@@ -167,17 +156,7 @@ function Ai404RecoveryCard({ onApplied }: { onApplied: () => void }) {
       toast.error(res.error)
       return
     }
-    const autoMsg =
-      res.autoApplied && res.autoApplied > 0
-        ? ` ${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}`)
-    }
+    toast.success('Generated 404 recovery suggestions.')
     refetch()
   }
 
@@ -313,7 +292,7 @@ function ChainMapCard({ onFlattened }: { onFlattened: () => void }) {
   )
 }
 
-export function RedirectsTab() {
+export function RedirectsTab({ onNavigate }: { onNavigate?: (path: string) => void }) {
   const [refetchKey, setRefetchKey] = useState(0)
   const { data, loading, error, refetch } = useSeoResource(fetchRedirectRules, [refetchKey])
   const [editor, setEditor] = useState<{ rule: RedirectRule | null } | null>(null)
@@ -371,7 +350,7 @@ export function RedirectsTab() {
       <OverviewCards onRefetchKey={refetchKey} />
 
       <div className="grid grid-cols-1 gap-4 xl:grid-cols-2">
-        <RecoverySettingsCard />
+        <RecoverySettingsCard onNavigate={onNavigate} />
         <Ai404RecoveryCard onApplied={refetchAll} />
         <ChainMapCard onFlattened={refetchAll} />
       </div>

package/src/views/seo/relative-age.ts

@@ -0,0 +1,15 @@
+/**
+ * Compact "how long ago" label shared by the SEO review surfaces (proposal age,
+ * autopilot ledger). Returns `''` for missing, unparsable, or future timestamps
+ * so callers can fall back to an absolute date.
+ */
+export function relativeAge(iso: string | null, now: number = Date.now()): string {
+  if (!iso) return ''
+  const ms = now - new Date(iso).getTime()
+  if (!Number.isFinite(ms) || ms < 0) return ''
+  const minutes = Math.round(ms / 60_000)
+  if (minutes < 60) return `${Math.max(1, minutes)}m ago`
+  const hours = Math.round(minutes / 60)
+  if (hours < 48) return `${hours}h ago`
+  return `${Math.round(hours / 24)}d ago`
+}