@bygghammar/cms-platform 0.40.0 → 0.42.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # Changelog
 
+## 0.42.0
+
+- Backoffice host registry gains email-settings, locale-domain, shared-content,
+  editor-component and backup adapters plus site placeholders.
+- New package-owned routes: `AdminLayoutRoute`, `AdminOverviewRoute` (cards
+  driven by `SiteConfig.features` and superadmin role), `EmailSettingsRoute`,
+  `NavigationRoute`, `DomainsRoute`, `ReviewsRoute` and `BackupRoute`.
+- `backofficePaths()` now derives every admin path from `backofficePath`.
+
+## 0.41.0
+
+- New `backoffice/routes`: a host registry (`registerBackofficeHost`) plus package-owned
+  route components for audit, email logs, log index, roles, users, version, site
+  settings, redirects, tracking, contact details and form settings. A site route
+  file is now just `createFileRoute(...)({ component: XRoute })`.
+
 ## 0.40.0
 
 - New `backoffice/shell`: shared `BackofficeShell` (auth gate, no-access screen,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bygghammar/cms-platform",
-  "version": "0.40.0",
+  "version": "0.42.0",
   "description": "Shared CMS platform: blocks, block types, i18n core, UI primitives and design-token contract used by every Bygghammar/Voyara site.",
   "type": "module",
   "sideEffects": false,
@@ -155,7 +155,9 @@
     "./server/forms-delivery-core": "./src/server/forms-delivery-core.ts",
     "./server/forms-submissions-core": "./src/server/forms-submissions-core.ts",
     "./server/backup-core": "./src/server/backup-core.ts",
-    "./backoffice/shell": "./src/backoffice/shell/index.ts"
+    "./backoffice/shell": "./src/backoffice/shell/index.ts",
+    "./backoffice/routes": "./src/backoffice/routes/index.tsx",
+    "./backoffice/routes/host": "./src/backoffice/routes/host.ts"
   },
   "dependencies": {
     "fflate": "^0.8.3"

package/src/backoffice/routes/host.ts

@@ -0,0 +1,156 @@
+/**
+ * Backoffice host registry.
+ *
+ * A site registers its server functions and site-level facts once; the package
+ * then owns the backoffice route components themselves, so a site's route file
+ * is a two-line `createFileRoute(...)({ component: XRoute })`.
+ */
+
+import type { ReactNode } from "react";
+
+import type { SiteConfig } from "../../config/site-config";
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/** Media field component as the reviews editor consumes it. */
+export type MediaFieldComponent = (props: any) => ReactNode;
+/** Review image uploader component as the reviews editor consumes it. */
+export type ReviewImageUploadComponent = (props: any) => ReactNode;
+/* eslint-enable @typescript-eslint/no-explicit-any */
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/** A TanStack server function as seen from the host (called via `useServerFn`). */
+export type HostServerFn = (...args: any[]) => Promise<any>;
+/* eslint-enable @typescript-eslint/no-explicit-any */
+
+/** Everything the package needs from a host to render the backoffice routes. */
+export type BackofficeHost = {
+  /** Site configuration used for defaults on the settings screen. */
+  siteConfig: SiteConfig;
+  /** Locales the site publishes, used by tracking/domain screens. */
+  locales: readonly string[];
+  /** Role identifiers this platform build supports. */
+  allRoles: string[];
+  /** Company details used as code defaults on the contact screen. */
+  company: Record<string, string>;
+  /** Locale used to preview form copy in the backoffice. */
+  previewLocale?: string;
+  /** Server functions, grouped per module. */
+  fns: {
+    // admin
+    listAuditLogs: HostServerFn;
+    listEmailLogs: HostServerFn;
+    listUsers: HostServerFn;
+    getMyRoles: HostServerFn;
+    createUser: HostServerFn;
+    deleteUser: HostServerFn;
+    setUserPassword: HostServerFn;
+    sendPasswordResetEmail: HostServerFn;
+    setUserRoles: HostServerFn;
+    getSystemVersion: HostServerFn;
+    // site settings
+    getSiteSettings: HostServerFn;
+    saveSiteSettings: HostServerFn;
+    clearSiteSetting: HostServerFn;
+    // redirects
+    listRedirects: HostServerFn;
+    saveRedirect: HostServerFn;
+    deleteRedirect: HostServerFn;
+    // tracking + domains
+    listInjections: HostServerFn;
+    saveInjection: HostServerFn;
+    deleteInjection: HostServerFn;
+    getLocaleDomains: HostServerFn;
+    // shared content
+    getContentOverrides: HostServerFn;
+    saveContentSection: HostServerFn;
+    // forms
+    getFormDefaults: HostServerFn;
+    saveFormDefaults: HostServerFn;
+    purgeOldSubmissions: HostServerFn;
+    // email settings
+    getEmailSettings: HostServerFn;
+    saveEmailSettings: HostServerFn;
+    listEmailProviders: HostServerFn;
+    upsertEmailProvider: HostServerFn;
+    deleteEmailProvider: HostServerFn;
+    sendTestEmail: HostServerFn;
+    // locale domains
+    saveLocaleDomain: HostServerFn;
+    deleteLocaleDomain: HostServerFn;
+  };
+  /** Site-specific example values shown as input placeholders. */
+  placeholders?: {
+    fromEmail?: string;
+    notifyTo?: string;
+    domain?: string;
+  };
+  /** Shared-content adapters: resolved site content plus its cache key. */
+  content: {
+    /** React hook returning the resolved (defaults + overrides) site content. */
+    useSite: () => Record<string, unknown>;
+    /** React hook returning the stored overrides, or undefined while loading. */
+    useOverrides: () => Record<string, unknown> | undefined;
+    /** Query key of the overrides query, so routes can invalidate it. */
+    overridesQueryKey: readonly unknown[];
+    /** Code defaults for the whole site content tree. */
+    defaults: Record<string, unknown>;
+    /** Code default for a single shared section. */
+    defaultForSection: (key: string) => unknown;
+  };
+  /** Editor components a site wires with its own locales, media and forms. */
+  components: {
+    /** Recursive shared-content editor. */
+    SectionForm: (props: { value: unknown; onChange: (next: unknown) => void }) => ReactNode;
+    /** Single media field used by the reviews editor. */
+    MediaField: MediaFieldComponent;
+    /** Review portrait uploader. */
+    ReviewImageUpload: ReviewImageUploadComponent;
+  };
+  /** Backup screen adapters — auth headers plus browser media archiving. */
+  backup?: {
+    authHeaders: () => Promise<Record<string, string>>;
+    /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+    buildBrowserMediaArchive: (args: any) => Promise<any>;
+  };
+};
+
+let current: BackofficeHost | null = null;
+
+/** Registers the host adapters. Call once, from a module the routes import. */
+export function registerBackofficeHost(host: BackofficeHost): BackofficeHost {
+  current = host;
+  return host;
+}
+
+/** Reads the registered host, failing loudly when a site forgot to register. */
+export function backofficeHost(): BackofficeHost {
+  if (!current) {
+    throw new Error(
+      "Backoffice host not registered — call registerBackofficeHost() before rendering backoffice routes.",
+    );
+  }
+  return current;
+}
+
+/** Absolute backoffice paths derived from the site's configured base path. */
+export function backofficePaths(host: BackofficeHost = backofficeHost()) {
+  const base = host.siteConfig.backofficePath;
+  return {
+    base,
+    admin: `${base}/admin`,
+    audit: `${base}/admin/audit`,
+    emailLogs: `${base}/admin/email-logs`,
+    users: `${base}/admin/users`,
+    forms: `${base}/forms`,
+    settings: `${base}/admin/settings`,
+    roles: `${base}/admin/roles`,
+    logs: `${base}/admin/logs`,
+    email: `${base}/admin/email`,
+    contact: `${base}/admin/contact`,
+    tracking: `${base}/admin/tracking`,
+    redirects: `${base}/admin/redirects`,
+    navigation: `${base}/admin/navigation`,
+    version: `${base}/admin/version`,
+    backup: `${base}/admin/backup`,
+  };
+}

package/src/backoffice/routes/index.tsx

@@ -0,0 +1,556 @@
+/**
+ * Package-owned backoffice route components.
+ *
+ * Each component is a complete screen: it reads the host adapters from the
+ * registry, wires queries/mutations and renders the shared view. A site route
+ * file only maps a URL to one of these.
+ */
+
+import { Link, Outlet, useNavigate, useRouterState } from "@tanstack/react-router";
+import {
+  AlertCircle,
+  ArrowLeft,
+  Building2,
+  Code2,
+  DatabaseBackup,
+  FileText,
+  Mail,
+  Menu,
+  Package,
+  ScrollText,
+  Shield,
+  Signpost,
+  SlidersHorizontal,
+  Users,
+} from "lucide-react";
+import { useQuery, useQueryClient } from "@tanstack/react-query";
+import { useServerFn } from "@tanstack/react-start";
+
+import type { SiteSettingOverrides } from "../../config/site-config";
+import { AuditView } from "../AuditView";
+import { BackupView } from "../BackupView";
+import { DomainsView } from "../DomainsView";
+import { EmailSettingsView } from "../EmailSettingsView";
+import { NavigationView } from "../NavigationView";
+import { ReviewsView, type ReviewsSection } from "../ReviewsView";
+import { ContactDetailsView } from "../ContactDetailsView";
+import { EmailLogsView } from "../EmailLogsView";
+import { FormSettingsView } from "../FormSettingsView";
+import { LogsView } from "../LogsView";
+import { RedirectsView } from "../RedirectsView";
+import { RolesView } from "../RolesView";
+import { SiteSettingsView } from "../SiteSettingsView";
+import { TrackingView } from "../TrackingView";
+import { UsersView } from "../UsersView";
+import { VersionView } from "../VersionView";
+import { backofficeHost, backofficePaths } from "./host";
+
+export * from "./host";
+
+/** Audit trail screen. */
+export function AuditRoute() {
+  const { fns } = backofficeHost();
+  const fetchLogs = useServerFn(fns.listAuditLogs);
+  const q = useQuery({
+    queryKey: ["admin", "audit"],
+    queryFn: () => fetchLogs({ data: { limit: 300 } }),
+  });
+  return <AuditView rows={(q.data ?? []) as never} />;
+}
+
+/** Outbound email log screen. */
+export function EmailLogsRoute() {
+  const { fns } = backofficeHost();
+  const fetchLogs = useServerFn(fns.listEmailLogs);
+  const q = useQuery({
+    queryKey: ["admin", "email-logs"],
+    queryFn: () => fetchLogs({ data: { limit: 300 } }),
+  });
+  return <EmailLogsView rows={(q.data ?? []) as never} />;
+}
+
+/** Log index linking the audit trail and email log. */
+export function LogsRoute() {
+  const paths = backofficePaths();
+  return <LogsView auditPath={paths.audit} emailLogsPath={paths.emailLogs} />;
+}
+
+/** Role reference screen. */
+export function RolesRoute() {
+  const host = backofficeHost();
+  return <RolesView allRoles={host.allRoles} usersPath={backofficePaths(host).users} />;
+}
+
+/** User administration screen. */
+export function UsersRoute() {
+  const { fns, allRoles } = backofficeHost();
+  const qc = useQueryClient();
+  const fetchUsers = useServerFn(fns.listUsers);
+  const fetchMyRoles = useServerFn(fns.getMyRoles);
+  const runCreate = useServerFn(fns.createUser);
+  const runDelete = useServerFn(fns.deleteUser);
+  const runSetPw = useServerFn(fns.setUserPassword);
+  const runReset = useServerFn(fns.sendPasswordResetEmail);
+  const runSetRoles = useServerFn(fns.setUserRoles);
+
+  const usersQ = useQuery({ queryKey: ["admin", "users"], queryFn: () => fetchUsers() });
+  const myRolesQ = useQuery({ queryKey: ["admin", "my-roles"], queryFn: () => fetchMyRoles() });
+
+  return (
+    <UsersView
+      deps={{
+        users: (usersQ.data ?? []) as never,
+        myRoles: myRolesQ.data ?? [],
+        allRoles,
+        createUser: (input) => runCreate(input as never),
+        deleteUser: (input) => runDelete(input),
+        setUserPassword: (input) => runSetPw(input),
+        sendPasswordResetEmail: (input) => runReset(input),
+        setUserRoles: (input) => runSetRoles(input as never),
+        refresh: () => qc.invalidateQueries({ queryKey: ["admin", "users"] }),
+      }}
+    />
+  );
+}
+
+/** CMS build and platform version screen. */
+export function VersionRoute() {
+  const { fns } = backofficeHost();
+  const fetchVersion = useServerFn(fns.getSystemVersion);
+  const q = useQuery({ queryKey: ["admin", "system-version"], queryFn: () => fetchVersion() });
+  return (
+    <VersionView
+      deps={{ build: q.data?.build, releases: q.data?.releases ?? [], loading: q.isLoading }}
+    />
+  );
+}
+
+/** Site settings screen (code defaults plus database overrides). */
+export function SiteSettingsRoute() {
+  const { fns, siteConfig } = backofficeHost();
+  const load = useServerFn(fns.getSiteSettings);
+  const save = useServerFn(fns.saveSiteSettings);
+  const clear = useServerFn(fns.clearSiteSetting);
+  const q = useQuery({ queryKey: ["admin", "site-settings"], queryFn: () => load() });
+
+  return (
+    <SiteSettingsView
+      deps={{
+        config: q.data?.config ?? siteConfig,
+        overrides: (q.data?.overrides ?? {}) as SiteSettingOverrides,
+        saveSettings: (input) => save(input as never),
+        clearSetting: (input) => clear(input as never),
+        refresh: () => q.refetch(),
+        originSource: q.data?.originSource ?? "code",
+      }}
+    />
+  );
+}
+
+/** URL redirect administration. */
+export function RedirectsRoute() {
+  const { fns } = backofficeHost();
+  const list = useServerFn(fns.listRedirects);
+  const save = useServerFn(fns.saveRedirect);
+  const remove = useServerFn(fns.deleteRedirect);
+  const q = useQuery({ queryKey: ["cms", "redirects"], queryFn: () => list() });
+
+  return (
+    <RedirectsView
+      deps={{
+        rows: q.data ?? [],
+        saveRedirect: (input) => save(input),
+        deleteRedirect: (input) => remove(input),
+        refresh: () => q.refetch(),
+      }}
+    />
+  );
+}
+
+/** Code & tracking injection screen. */
+export function TrackingRoute() {
+  const { fns, locales } = backofficeHost();
+  const list = useServerFn(fns.listInjections);
+  const save = useServerFn(fns.saveInjection);
+  const remove = useServerFn(fns.deleteInjection);
+  const domains = useServerFn(fns.getLocaleDomains);
+
+  const q = useQuery({ queryKey: ["admin", "injections"], queryFn: () => list() });
+  const domainsQ = useQuery({ queryKey: ["admin", "locale-domains"], queryFn: () => domains() });
+
+  return (
+    <TrackingView
+      deps={{
+        profiles: q.data ?? [],
+        domains: domainsQ.data ?? [],
+        locales: locales as never,
+        saveInjection: (input) => save(input as never),
+        deleteInjection: (input) => remove(input),
+        refresh: () => q.refetch(),
+      }}
+    />
+  );
+}
+
+/** Company contact details screen. */
+export function ContactDetailsRoute() {
+  const { fns, company } = backofficeHost();
+  const fetchOverrides = useServerFn(fns.getContentOverrides);
+  const save = useServerFn(fns.saveContentSection);
+  const qc = useQueryClient();
+  const overridesQ = useQuery({
+    queryKey: ["cms", "content-overrides"],
+    queryFn: () => fetchOverrides(),
+  });
+
+  return (
+    <ContactDetailsView
+      deps={{
+        defaults: company,
+        stored: overridesQ.data?.company as Record<string, string> | undefined,
+        loading: overridesQ.isLoading,
+        saveSection: (input) => save(input as never),
+        refresh: () => qc.invalidateQueries({ queryKey: ["cms", "content-overrides"] }),
+      }}
+    />
+  );
+}
+
+/** Form defaults and retention screen. */
+export function FormSettingsRoute() {
+  const host = backofficeHost();
+  const { fns } = host;
+  const load = useServerFn(fns.getFormDefaults);
+  const save = useServerFn(fns.saveFormDefaults);
+  const purge = useServerFn(fns.purgeOldSubmissions);
+  const formsPath = backofficePaths(host).forms;
+  const { data, isLoading } = useQuery({ queryKey: ["form-defaults"], queryFn: () => load() });
+
+  return (
+    <FormSettingsView
+      deps={{
+        defaults: data,
+        isLoading,
+        saveDefaults: (input) => save(input as never),
+        purgeOldSubmissions: (input) => purge(input),
+        previewLocale: host.previewLocale ?? host.siteConfig.defaultLocale,
+        BackLink: ({ className, children }) => (
+          <Link to={formsPath} className={className}>
+            {children}
+          </Link>
+        ),
+      }}
+    />
+  );
+}
+
+/** Shared-content SEO detail helper: back navigation to the SEO list. */
+export function useSeoListNavigate() {
+  const navigate = useNavigate();
+  const paths = backofficePaths();
+  return () => navigate({ to: `${paths.base}/seo` });
+}
+
+/* ------------------------------------------------------------------ *
+ * Admin section: layout, overview and the remaining admin screens.
+ * ------------------------------------------------------------------ */
+
+/** Chrome around every `/admin/*` screen: a back link plus the section title. */
+export function AdminLayoutRoute() {
+  const paths = backofficePaths();
+  const pathname = useRouterState({ select: (s) => s.location.pathname });
+  const isOverview = pathname.replace(/\/$/, "") === paths.admin;
+  const backTo = isOverview ? paths.base : paths.admin;
+  const backLabel = isOverview ? "Back to backoffice" : "Back to admin";
+
+  return (
+    <div className="min-h-screen">
+      <div className="border-b border-ink/10 bg-white">
+        <div className="px-8 md:px-12 py-6">
+          <Link
+            to={backTo}
+            className="inline-flex items-center gap-2 text-[0.7rem] uppercase tracking-[0.22em] text-ink/55 hover:text-sea transition-colors"
+          >
+            <ArrowLeft className="size-3.5" />
+            {backLabel}
+          </Link>
+          <h1 className="mt-3 font-serif text-2xl text-ink">System administration</h1>
+        </div>
+      </div>
+      <Outlet />
+    </div>
+  );
+}
+
+/** Card grid linking to every admin screen the signed-in user may open. */
+export function AdminOverviewRoute() {
+  const host = backofficeHost();
+  const paths = backofficePaths(host);
+  const fetchRoles = useServerFn(host.fns.getMyRoles);
+  const rolesQ = useQuery({ queryKey: ["admin", "my-roles"], queryFn: () => fetchRoles() });
+  const isSuper = ((rolesQ.data ?? []) as string[]).includes("superadmin");
+
+  const cards = [
+    {
+      to: paths.settings,
+      title: "Site settings",
+      body: "Site name, company details, active modules and brand tokens — with reset to code defaults.",
+      icon: SlidersHorizontal,
+    },
+    {
+      to: paths.users,
+      title: "Users",
+      body: "Create, edit, delete users and reset passwords.",
+      icon: Users,
+    },
+    {
+      to: paths.roles,
+      title: "User roles",
+      body: "Assign superadmin, admin, seo or user roles.",
+      icon: Shield,
+    },
+    { to: paths.logs, title: "Logs", body: "System logs (admin+).", icon: ScrollText },
+    {
+      to: paths.emailLogs,
+      title: "Email logs",
+      body: "Outgoing email history.",
+      icon: FileText,
+    },
+    {
+      to: paths.audit,
+      title: "Audit logs",
+      body: "Every backoffice action.",
+      icon: AlertCircle,
+    },
+    ...(host.siteConfig.features.email
+      ? [
+          {
+            to: paths.email,
+            title: "Email settings",
+            body: "SMTP / Amazon SES, from/reply-to.",
+            icon: Mail,
+          },
+        ]
+      : []),
+    {
+      to: paths.contact,
+      title: "Contact details",
+      body: "Company address, org. number, email and phone.",
+      icon: Building2,
+    },
+    ...(host.siteConfig.features.tracking
+      ? [
+          {
+            to: paths.tracking,
+            title: "Code & tracking",
+            body: "Head/body code injection, GTM, GA4, Meta and TikTok pixels.",
+            icon: Code2,
+          },
+        ]
+      : []),
+    {
+      to: paths.redirects,
+      title: "Redirects",
+      body: "Old URLs pointing to new ones, created automatically on slug changes.",
+      icon: Signpost,
+    },
+    {
+      to: paths.navigation,
+      title: "Navigation & footer",
+      body: "Site-wide top menu and footer content.",
+      icon: Menu,
+    },
+    {
+      to: paths.version,
+      title: "CMS & platform version",
+      body: "Current CMS build, shared platform package version and release history with dates.",
+      icon: Package,
+    },
+    ...(isSuper && host.siteConfig.features.backup
+      ? [
+          {
+            to: paths.backup,
+            title: "Backup & restore",
+            body: "Export everything — content, forms, submissions, media and roles — and restore it again.",
+            icon: DatabaseBackup,
+          },
+        ]
+      : []),
+  ];
+
+  return (
+    <div className="p-8 md:p-12 w-full">
+      <div className="grid gap-4 md:grid-cols-3">
+        {cards.map((c) => (
+          <Link
+            key={c.to}
+            to={c.to}
+            className="group border border-ink/10 bg-white p-6 hover:border-sea transition-colors"
+          >
+            <c.icon className="size-6 text-ink/70 group-hover:text-sea" />
+            <div className="mt-4 font-serif text-lg text-ink">{c.title}</div>
+            <p className="mt-2 text-sm text-ink/60">{c.body}</p>
+          </Link>
+        ))}
+      </div>
+    </div>
+  );
+}
+
+/** Email sending settings plus provider credentials. */
+export function EmailSettingsRoute() {
+  const host = backofficeHost();
+  const { fns } = host;
+  const fetchSettings = useServerFn(fns.getEmailSettings);
+  const fetchRoles = useServerFn(fns.getMyRoles);
+  const fetchProviders = useServerFn(fns.listEmailProviders);
+  const save = useServerFn(fns.saveEmailSettings);
+  const saveProvider = useServerFn(fns.upsertEmailProvider);
+  const removeProvider = useServerFn(fns.deleteEmailProvider);
+  const sendTest = useServerFn(fns.sendTestEmail);
+
+  const settingsQ = useQuery({
+    queryKey: ["admin", "email-settings"],
+    queryFn: () => fetchSettings(),
+  });
+  const providersQ = useQuery({
+    queryKey: ["admin", "email-providers"],
+    queryFn: () => fetchProviders(),
+  });
+  const rolesQ = useQuery({ queryKey: ["admin", "my-roles"], queryFn: () => fetchRoles() });
+
+  return (
+    <EmailSettingsView
+      deps={{
+        settings: (settingsQ.data ?? null) as never,
+        providers: (providersQ.data ?? []) as never,
+        isSuper: ((rolesQ.data ?? []) as string[]).includes("superadmin"),
+        loadingProviders: providersQ.isLoading,
+        saveSettings: (input) => save(input as never),
+        saveProvider: (input) => saveProvider(input as never),
+        deleteProvider: (input) => removeProvider(input),
+        sendTestEmail: (input) => sendTest(input),
+        refreshSettings: () => settingsQ.refetch(),
+        refreshProviders: () => providersQ.refetch(),
+        placeholders: {
+          fromEmail: host.placeholders?.fromEmail ?? "",
+          notifyTo: host.placeholders?.notifyTo ?? "",
+        },
+      }}
+    />
+  );
+}
+
+/** Site-wide navigation and footer editor. */
+export function NavigationRoute() {
+  const host = backofficeHost();
+  const qc = useQueryClient();
+  const site = host.content.useSite();
+  const overrides = host.content.useOverrides();
+  const save = useServerFn(host.fns.saveContentSection);
+
+  return (
+    <NavigationView
+      deps={{
+        overrides,
+        site,
+        defaults: host.content.defaults,
+        SectionForm: host.components.SectionForm,
+        saveSection: (input) => save(input as never),
+        refresh: () => qc.invalidateQueries({ queryKey: host.content.overridesQueryKey }),
+      }}
+    />
+  );
+}
+
+/** Per-locale domain mapping. */
+export function DomainsRoute() {
+  const host = backofficeHost();
+  const paths = backofficePaths(host);
+  const qc = useQueryClient();
+  const list = useServerFn(host.fns.getLocaleDomains);
+  const save = useServerFn(host.fns.saveLocaleDomain);
+  const del = useServerFn(host.fns.deleteLocaleDomain);
+  const q = useQuery({ queryKey: ["locale-domains"], queryFn: () => list() });
+
+  return (
+    <DomainsView
+      deps={{
+        domains: q.data ?? [],
+        locales: host.siteConfig.locales,
+        defaultLocale: host.siteConfig.defaultLocale,
+        backPath: paths.base,
+        domainPlaceholder: host.placeholders?.domain ?? "",
+        saveDomain: (input) => save(input as never),
+        deleteDomain: (input) => del(input as never),
+        refresh: () => qc.invalidateQueries({ queryKey: ["locale-domains"] }),
+      }}
+    />
+  );
+}
+
+/** Testimonials / reviews editor backed by the shared content section. */
+export function ReviewsRoute() {
+  const host = backofficeHost();
+  const paths = backofficePaths(host);
+  const qc = useQueryClient();
+  const site = host.content.useSite();
+  const overrides = host.content.useOverrides();
+  const save = useServerFn(host.fns.saveContentSection);
+
+  const source = (overrides?.["testimonials"] ??
+    site["testimonials"] ??
+    host.content.defaultForSection("testimonials")) as ReviewsSection;
+
+  return (
+    <ReviewsView
+      deps={{
+        source,
+        locale: host.previewLocale ?? host.siteConfig.defaultLocale,
+        save: async (section) => {
+          await save({
+            data: { key: "testimonials", data: section as unknown as Record<string, unknown> },
+          });
+          await qc.invalidateQueries({ queryKey: host.content.overridesQueryKey });
+        },
+        MediaField: host.components.MediaField as never,
+        ReviewImageUpload: host.components.ReviewImageUpload as never,
+        BackLink: ({ className, children }) => (
+          <Link to={paths.base} className={className}>
+            {children}
+          </Link>
+        ),
+      }}
+    />
+  );
+}
+
+/** Backup and restore, superadmin only. */
+export function BackupRoute() {
+  const host = backofficeHost();
+  const backup = host.backup;
+  if (!backup) {
+    throw new Error("Backup host adapters missing — register `backup` to use BackupRoute.");
+  }
+  const fetchRoles = useServerFn(host.fns.getMyRoles);
+  const rolesQ = useQuery({
+    queryKey: ["admin", "my-roles"],
+    queryFn: async () => (await fetchRoles()) as string[],
+    retry: 3,
+    retryDelay: (attempt) => Math.min(1000 * 2 ** attempt, 4000),
+    staleTime: 60_000,
+  });
+
+  return (
+    <BackupView
+      deps={{
+        isSuper: ((rolesQ.data ?? []) as string[]).includes("superadmin"),
+        loading: rolesQ.isLoading,
+        error: rolesQ.isError,
+        retry: () => void rolesQ.refetch(),
+        authHeaders: backup.authHeaders,
+        buildBrowserMediaArchive: backup.buildBrowserMediaArchive as never,
+      }}
+    />
+  );
+}