@bygghammar/cms-platform 0.80.1 → 0.90.0-m7.2

package/src/backoffice/shell/nav-model.ts

@@ -8,22 +8,23 @@
 import type { LucideProps } from "lucide-react";
 import {
   Blocks,
-  Calendar,
-  ClipboardList,
   FileText,
-  Globe,
-  GraduationCap,
   ImageIcon,
   Layers,
   LayoutDashboard,
   LayoutList,
-  MessageSquareQuote,
   ShieldCheck,
 } from "lucide-react";
 
 import type { SiteConfig } from "../../config/site-config";
+import { CMS_MODULE_LIST, type CmsModuleKey } from "../../config/modules";
 import type { BackofficeNavigationItem } from "../../navigation";
 
+/**
+ * Sidebar keys: the always-present screens plus every module that declares a
+ * nav entry. Module keys are no longer repeated here — a module contributing a
+ * sidebar item is a fact about the module, kept in one place.
+ */
 export type BackofficeNavKey =
   | "dashboard"
   | "pages"
@@ -32,12 +33,8 @@ export type BackofficeNavKey =
   | "sections"
   | "media"
   | "seo"
-  | "domains"
-  | "trips"
-  | "courses"
-  | "forms"
-  | "reviews"
-  | "admin";
+  | "admin"
+  | CmsModuleKey;
 
 export type BackofficeNavItem = BackofficeNavigationItem<LucideProps>;
 
@@ -51,7 +48,8 @@ type Definition = {
   feature?: keyof SiteConfig["features"];
 };
 
-const DEFINITIONS: readonly Definition[] = [
+/** Screens every site has, regardless of which modules are on. */
+const CORE: readonly Definition[] = [
   { key: "dashboard", path: "", label: "Dashboard", icon: LayoutDashboard, exact: true },
   { key: "pages", path: "/pages-builder", label: "Page builder", icon: Blocks },
   { key: "global-sections", path: "/global-sections", label: "Global Sections", icon: Layers },
@@ -59,17 +57,28 @@ const DEFINITIONS: readonly Definition[] = [
   { key: "sections", path: "/sections", label: "Shared content", icon: LayoutList },
   { key: "media", path: "/media", label: "Media", icon: ImageIcon },
   { key: "seo", path: "/seo", label: "SEO", icon: FileText },
-  { key: "domains", path: "/domains", label: "Domains", icon: Globe, feature: "domains" },
-  { key: "trips", path: "/trips", label: "Trips", icon: Calendar, feature: "trips" },
-  { key: "courses", path: "/kurser", label: "Courses", icon: GraduationCap, feature: "courses" },
-  { key: "forms", path: "/forms", label: "Forms", icon: ClipboardList, feature: "forms" },
-  {
-    key: "reviews",
-    path: "/recensioner",
-    label: "Reviews",
-    icon: MessageSquareQuote,
-    feature: "reviews",
-  },
+];
+
+/** Entries contributed by modules, each gated on its own flag. */
+const MODULE_ITEMS: readonly Definition[] = CMS_MODULE_LIST.flatMap((module) =>
+  module.nav === undefined
+    ? []
+    : [
+        {
+          key: module.key,
+          path: module.nav.path,
+          label: module.nav.label,
+          icon: module.nav.icon,
+          ...(module.nav.exact === undefined ? {} : { exact: module.nav.exact }),
+          feature: module.key,
+        },
+      ],
+);
+
+// Admin stays last: it is the catch-all for everything a module did not claim.
+const DEFINITIONS: readonly Definition[] = [
+  ...CORE,
+  ...MODULE_ITEMS,
   { key: "admin", path: "/admin", label: "Admin", icon: ShieldCheck },
 ];
 

package/src/config/modules.ts

@@ -0,0 +1,184 @@
+/**
+ * The CMS module table.
+ *
+ * "Modules" were previously described in four separate places that had to agree
+ * by hand: the `SiteFeatureFlags` type, the defaults object, the label map on
+ * the Modules screen, and the sidebar definitions. Adding one meant editing all
+ * four and hoping none was missed.
+ *
+ * This is the single description each of those now derives from. It is
+ * deliberately NOT a plugin registry: the key space stays a closed, typed union
+ * so an unknown value in `site_settings` is still rejected rather than trusted.
+ * What it buys is that a new first-party module is one entry here plus one line
+ * in the flag type, instead of five edits across the package.
+ */
+import type { ComponentType } from "react";
+import type { LucideProps } from "lucide-react";
+import {
+  Blocks,
+  Calendar,
+  ClipboardList,
+  Globe,
+  GraduationCap,
+  MessageSquare,
+  MessageSquareQuote,
+} from "lucide-react";
+
+/**
+ * Every module a site can switch on.
+ *
+ * Adding a key here is the one type-level edit a new module needs; the compiler
+ * then requires the matching table entry below.
+ */
+export type SiteFeatureFlags = {
+  /** Trips / departures module (`/kontoret/trips`). */
+  trips: boolean;
+  /** Courses module (`/kontoret/kurser`). */
+  courses: boolean;
+  /** Reviews module (`/kontoret/recensioner`). */
+  reviews: boolean;
+  /** Transactional email + provider settings screens. */
+  email: boolean;
+  /** Head/body code injection and analytics pixels. */
+  tracking: boolean;
+  /** Backup & restore tooling (superadmin only). */
+  backup: boolean;
+  /** Custom domain management screen. */
+  domains: boolean;
+  /** Public forms module. */
+  forms: boolean;
+  /** Popups module: public popup runtime + backoffice administration. */
+  popups: boolean;
+};
+
+export type CmsModuleKey = keyof SiteFeatureFlags;
+
+/** A sidebar entry a module contributes when it is enabled. */
+export type CmsModuleNav = {
+  /** Appended to the site's configured backoffice path. Never hardcode `/kontoret`. */
+  readonly path: string;
+  readonly label: string;
+  readonly icon: ComponentType<LucideProps>;
+  readonly exact?: boolean;
+};
+
+export type CmsModuleDefinition = {
+  readonly key: CmsModuleKey;
+  /** Shown on the Modules screen. */
+  readonly label: string;
+  /** Whether a site that says nothing gets this module. */
+  readonly defaultEnabled: boolean;
+  /** One line of help on the Modules screen. */
+  readonly description?: string;
+  /**
+   * Sidebar contribution. Absent for modules with no screen of their own —
+   * `email`, `tracking` and `backup` live under Admin.
+   */
+  readonly nav?: CmsModuleNav;
+  /**
+   * Minimum role for the module's own screens. `superadmin` is used by modules
+   * that can destroy or exfiltrate data.
+   */
+  readonly requiresRole?: "staff" | "superadmin";
+  /**
+   * True when the module contributes a component to the public site. The public
+   * runtime host renders only the modules that both declare this and are
+   * enabled, so a disabled module mounts nothing.
+   */
+  readonly hasPublicRuntime?: boolean;
+};
+
+/**
+ * Every module, in sidebar order.
+ *
+ * `satisfies` pins the array to the flag union, so a key added to
+ * `SiteFeatureFlags` without an entry here — or an entry whose key is not a
+ * flag — is a compile error rather than a module that silently never appears.
+ */
+export const CMS_MODULES = [
+  {
+    key: "trips",
+    label: "Trips & departures",
+    defaultEnabled: false,
+    nav: { path: "/trips", label: "Trips", icon: Calendar },
+    requiresRole: "staff",
+  },
+  {
+    key: "courses",
+    label: "Courses",
+    defaultEnabled: false,
+    nav: { path: "/kurser", label: "Courses", icon: GraduationCap },
+    requiresRole: "staff",
+  },
+  {
+    key: "reviews",
+    label: "Reviews",
+    defaultEnabled: false,
+    nav: { path: "/recensioner", label: "Reviews", icon: MessageSquareQuote },
+    requiresRole: "staff",
+  },
+  { key: "email", label: "Transactional email", defaultEnabled: true, requiresRole: "staff" },
+  { key: "tracking", label: "Code & tracking", defaultEnabled: true, requiresRole: "staff" },
+  { key: "backup", label: "Backup & restore", defaultEnabled: true, requiresRole: "superadmin" },
+  {
+    key: "domains",
+    label: "Custom domains",
+    defaultEnabled: false,
+    nav: { path: "/domains", label: "Domains", icon: Globe },
+    requiresRole: "staff",
+  },
+  {
+    key: "forms",
+    label: "Forms",
+    defaultEnabled: true,
+    nav: { path: "/forms", label: "Forms", icon: ClipboardList },
+    requiresRole: "staff",
+  },
+  {
+    key: "popups",
+    label: "Popups",
+    defaultEnabled: false,
+    description: "Timed popups on the public site, with their own statistics.",
+    nav: { path: "/popups", label: "Popups", icon: MessageSquare },
+    requiresRole: "staff",
+    hasPublicRuntime: true,
+  },
+] as const satisfies readonly CmsModuleDefinition[];
+
+/** Compile-time proof that every flag has exactly one module entry. */
+type DeclaredKeys = (typeof CMS_MODULES)[number]["key"];
+type MissingModule = Exclude<CmsModuleKey, DeclaredKeys>;
+type AssertNever<T extends never> = T;
+type _EveryFlagIsDeclared = AssertNever<MissingModule>;
+
+/**
+ * The table widened to the declaration type.
+ *
+ * `CMS_MODULES` is `as const` so the exhaustiveness check above can see the
+ * literal keys; consumers want the declared shape, where every optional field
+ * exists whether or not a particular entry uses it.
+ */
+export const CMS_MODULE_LIST: readonly CmsModuleDefinition[] = CMS_MODULES;
+
+export const CMS_MODULE_KEYS: readonly CmsModuleKey[] = CMS_MODULES.map((m) => m.key);
+
+export function findCmsModule(key: CmsModuleKey): CmsModuleDefinition | undefined {
+  return CMS_MODULES.find((module) => module.key === key);
+}
+
+/** The defaults a site starts from, derived so the two can never disagree. */
+export const DEFAULT_FEATURE_FLAGS: SiteFeatureFlags = Object.fromEntries(
+  CMS_MODULES.map((module) => [module.key, module.defaultEnabled]),
+) as SiteFeatureFlags;
+
+/** Labels for the Modules screen, derived from the same table. */
+export const CMS_MODULE_LABELS: Readonly<Record<CmsModuleKey, string>> = Object.fromEntries(
+  CMS_MODULES.map((module) => [module.key, module.label]),
+) as Record<CmsModuleKey, string>;
+
+/**
+ * Blocks that unnecessary icon imports are not the reason a public bundle grows:
+ * this module table is imported by the public runtime host as well, so keep it
+ * free of anything heavier than the icon components already used by the sidebar.
+ */
+export type { LucideProps };

package/src/config/site-config.ts

@@ -8,36 +8,12 @@
  * path or feature set.
  */
 
-/** Feature modules a site can switch on. Unknown flags are ignored. */
-export type SiteFeatureFlags = {
-  /** Trips / departures module (`/kontoret/trips`). */
-  trips: boolean;
-  /** Courses module (`/kontoret/kurser`). */
-  courses: boolean;
-  /** Reviews module (`/kontoret/recensioner`). */
-  reviews: boolean;
-  /** Transactional email + provider settings screens. */
-  email: boolean;
-  /** Head/body code injection and analytics pixels. */
-  tracking: boolean;
-  /** Backup & restore tooling (superadmin only). */
-  backup: boolean;
-  /** Custom domain management screen. */
-  domains: boolean;
-  /** Public forms module. */
-  forms: boolean;
-};
-
-export const DEFAULT_FEATURE_FLAGS: SiteFeatureFlags = {
-  trips: false,
-  courses: false,
-  reviews: false,
-  email: true,
-  tracking: true,
-  backup: true,
-  domains: false,
-  forms: true,
-};
+// Modules — their keys, defaults and labels — are described once in
+// `./modules`. Re-exported here so every existing import keeps working.
+export type { SiteFeatureFlags } from "./modules";
+export { DEFAULT_FEATURE_FLAGS } from "./modules";
+import type { SiteFeatureFlags } from "./modules";
+import { CMS_MODULE_KEYS, DEFAULT_FEATURE_FLAGS } from "./modules";
 
 /** Official company / contact details. Locale-neutral by design. */
 export type SiteCompany = {
@@ -254,7 +230,9 @@ export function parseSiteSettingOverrides(raw: unknown): SiteSettingOverrides {
   }
   if (isRecord(raw["features"])) {
     const features: Partial<SiteFeatureFlags> = {};
-    for (const key of Object.keys(DEFAULT_FEATURE_FLAGS) as (keyof SiteFeatureFlags)[]) {
+    // Still a closed allowlist: an unknown key in the database is dropped on
+    // read and on write. Modules made the list derived, not arbitrary.
+    for (const key of CMS_MODULE_KEYS) {
       const value = (raw["features"] as Record<string, unknown>)[key];
       if (typeof value === "boolean") features[key] = value;
     }

package/src/forms/FormRenderer.tsx

@@ -14,6 +14,9 @@ import {
 } from "./conditions";
 import { renderLinkedText } from "./rich-text";
 import { useHostPublicFormFns, useHostTripSource } from "../host";
+import { emitFormSubmissionSuccess } from "./success-listeners";
+import { isStoredSubmission } from "./submission-result";
+import type { FormSubmissionSuccess } from "./submission-result";
 
 const TOKEN_PREFIX = "form-draft-token:";
 
@@ -45,11 +48,18 @@ export function FormRenderer({
   dark = false,
   className,
   preview = false,
+  onSuccess,
 }: {
   form: PublicForm;
   dark?: boolean;
   className?: string;
   preview?: boolean;
+  /**
+   * Called only for a submission the host actually stored. A honeypot
+   * rejection — `{ ok: true, skipped: true }` — never reaches it, and neither
+   * does preview mode, which contacts no server at all.
+   */
+  onSuccess?: (event: FormSubmissionSuccess) => void;
 }) {
   const { t } = useT();
   const locale = useLocale();
@@ -216,16 +226,32 @@ export function FormRenderer({
     try {
       // Send only the answers to fields the visitor actually saw.
       const visible = Object.fromEntries(fields.map((f) => [f.key, values[f.key] ?? ""]));
-      await send({
+      const pagePath = typeof window !== "undefined" ? window.location.pathname : undefined;
+      const result = await send({
         key: form.key,
         locale,
-        pagePath: typeof window !== "undefined" ? window.location.pathname : undefined,
+        pagePath,
         consent,
         elapsedMs: Date.now() - mountedAt.current,
         hp,
         clientToken: form.savePartials ? draftToken(form.key) : undefined,
         values: visible,
       });
+
+      // Announced before the redirect below, not after: assigning
+      // window.location.href tears the page down, and a listener that has not
+      // run by then never will. Only a stored submission counts — a honeypot
+      // rejection answers ok:true and must not look like a conversion.
+      if (isStoredSubmission(result)) {
+        const event: FormSubmissionSuccess = {
+          formKey: form.key,
+          locale,
+          ...(pagePath === undefined ? {} : { pagePath }),
+        };
+        emitFormSubmissionSuccess(event);
+        onSuccess?.(event);
+      }
+
       if (form.thankyouMode === "redirect" && form.thankyouRedirect) {
         window.location.href = form.thankyouRedirect;
         return;
@@ -412,10 +438,13 @@ export function ManagedForm({
   formKey,
   dark = false,
   className,
+  onSuccess,
 }: {
   formKey: string;
   dark?: boolean;
   className?: string;
+  /** Forwarded to `FormRenderer`; fires only for a stored submission. */
+  onSuccess?: (event: FormSubmissionSuccess) => void;
 }) {
   const { getPublicForm } = useHostPublicFormFns();
   const { data: form, isLoading } = useQuery({
@@ -432,7 +461,15 @@ export function ManagedForm({
     );
   }
   if (!form) return null;
-  return <FormRenderer form={form} dark={dark} className={className} />;
+  return (
+    <FormRenderer
+      form={form}
+      dark={dark}
+      className={className}
+      {...(onSuccess === undefined ? {} : { onSuccess })}
+    />
+  );
 }
 
 export type { PublicForm };
+export type { FormSubmissionSuccess };

package/src/forms/submission-result.ts

@@ -0,0 +1,35 @@
+/**
+ * What the host's submit endpoint answered.
+ *
+ * The distinction that matters is `skipped`. A site's spam protection may
+ * accept a request and deliberately store nothing — a honeypot hit answers
+ * `{ ok: true, skipped: true }`. Nothing was saved, no notification was sent,
+ * and no person is behind it. Treating that as a completed submission is how a
+ * bot inflates every conversion figure a site reports.
+ */
+export type FormSubmitResult = {
+  readonly ok: boolean;
+  /** True when the request was accepted but deliberately not stored. */
+  readonly skipped?: boolean;
+};
+
+/** Details handed to a success listener. Never carries what the visitor typed. */
+export type FormSubmissionSuccess = {
+  readonly formKey: string;
+  readonly locale: string;
+  /** The page the form was submitted from, when the host knows it. */
+  readonly pagePath?: string;
+};
+
+/**
+ * True only for a submission the host actually stored.
+ *
+ * Deliberately conservative: an endpoint that answers with something this
+ * cannot read is treated as *not* a confirmed success, because over-counting a
+ * conversion is worse than under-counting one.
+ */
+export function isStoredSubmission(result: unknown): boolean {
+  if (typeof result !== "object" || result === null) return false;
+  const { ok, skipped } = result as FormSubmitResult;
+  return ok === true && skipped !== true;
+}

package/src/forms/success-listeners.ts

@@ -0,0 +1,46 @@
+/**
+ * A generic notification seam for genuinely successful form submissions.
+ *
+ * The form system knows nothing about who is listening. Any CMS module — popups
+ * today, something else later — subscribes here, and the form runtime keeps
+ * working with no listener at all. That is the whole point: `FormRenderer` must
+ * never import a module in order to tell it something happened.
+ */
+import type { FormSubmissionSuccess } from "./submission-result";
+
+type Listener = (event: FormSubmissionSuccess) => void;
+
+const listeners = new Set<Listener>();
+
+/**
+ * Subscribe to stored submissions. Returns an unsubscribe function.
+ *
+ * Only genuine submissions arrive here — a honeypot rejection never does.
+ */
+export function onFormSubmissionSuccess(listener: Listener): () => void {
+  listeners.add(listener);
+  return () => {
+    listeners.delete(listener);
+  };
+}
+
+/**
+ * Notify every listener.
+ *
+ * Each is isolated: a listener that throws must not break the visitor's
+ * submission, which has already succeeded by the time this runs.
+ */
+export function emitFormSubmissionSuccess(event: FormSubmissionSuccess): void {
+  for (const listener of [...listeners]) {
+    try {
+      listener(event);
+    } catch {
+      /* A subscriber must never break a form. */
+    }
+  }
+}
+
+/** Test helper: drops every subscription. */
+export function clearFormSubmissionListeners(): void {
+  listeners.clear();
+}

package/src/host/index.tsx

@@ -1,6 +1,7 @@
 import type { ComponentType, ImgHTMLAttributes } from "react";
 import type { UseQueryOptions } from "@tanstack/react-query";
 import type { LocalizedString } from "../i18n/types";
+import type { FormSubmitResult } from "../forms/submission-result";
 
 /**
  * Host component contract.
@@ -191,7 +192,15 @@ export type HostSavePartialInput = {
  */
 export type HostPublicFormFns = {
   getPublicForm: (key: string) => Promise<unknown>;
-  submitForm: (input: HostSubmitFormInput) => Promise<unknown>;
+  /**
+   * Stores a submission.
+   *
+   * The result is read, not discarded: `skipped: true` means the request was
+   * accepted and deliberately not stored (a honeypot hit), which must never be
+   * reported as a completed submission. A host that answers with something
+   * else is treated as unconfirmed rather than successful.
+   */
+  submitForm: (input: HostSubmitFormInput) => Promise<FormSubmitResult | unknown>;
   savePartialSubmission: (input: HostSavePartialInput) => Promise<unknown>;
 };
 

package/src/modules/index.ts

@@ -0,0 +1,28 @@
+export {
+  CmsModuleAdmin,
+  CmsModuleRuntimes,
+  clearModuleRuntimes,
+  enabledModuleRuntimes,
+  moduleAdminLoader,
+  registerModuleAdmin,
+  registerModuleRuntime,
+} from "./public-runtime";
+export type {
+  CmsModuleAdminProps,
+  CmsModuleRuntimesProps,
+  ModuleComponentLoader,
+} from "./public-runtime";
+export {
+  CMS_MODULES,
+  CMS_MODULE_KEYS,
+  CMS_MODULE_LABELS,
+  CMS_MODULE_LIST,
+  DEFAULT_FEATURE_FLAGS,
+  findCmsModule,
+} from "../config/modules";
+export type {
+  CmsModuleDefinition,
+  CmsModuleKey,
+  CmsModuleNav,
+  SiteFeatureFlags,
+} from "../config/modules";