@bygghammar/cms-platform 0.94.0 → 0.96.0

package/src/server/schemas.ts

@@ -131,6 +131,23 @@ export const pageSchemas = {
     status: z.enum(["draft", "published"]),
     editSessionId: editSessionId.optional(),
   }),
+  /** Listing only: never publishes, unpublishes or reschedules. */
+  setPageListing: z.object({
+    pageId: uuid,
+    listing: z.enum(["listed", "link-only"]),
+    /** The version the editor was shown; null when nothing was stored yet. */
+    expectedVersion: z.string().min(1).max(64).nullable(),
+    editSessionId: editSessionId.optional(),
+  }),
+  setBookingEnabled: z.object({
+    enabled: z.boolean(),
+    expectedVersion: z.string().min(1).max(64).nullable(),
+  }),
+  setBookingException: z.object({
+    pageId: uuid,
+    exception: z.boolean(),
+    expectedVersion: z.string().min(1).max(64).nullable(),
+  }),
   duplicatePage: z.object({
     pageId: uuid,
     name: z.string().min(1).max(120),

package/src/site/PageRenderer.tsx

@@ -177,14 +177,24 @@ export function createPageQueryOptions(
   fetchPublishedPage: (key: string) => Promise<RenderedPage | null>,
   defaultStaleTimeMs: number = PAGE_STALE_TIME_MS,
 ) {
-  return (key: string) =>
+  /*
+   * `variant` partitions the cache by whatever the site's public policy says
+   * about the page (booking shown or not, say). The server stays the
+   * authority on what it returns; the partition only stops an answer fetched
+   * under one policy being reused under another, so switching booking back
+   * on is not answered from a copy fetched while it was off.
+   */
+  return (key: string, variant?: string) =>
     queryOptions({
-      queryKey: ["cms", "page", key],
+      queryKey: variant ? ["cms", "page", key, variant] : ["cms", "page", key],
       queryFn: () => fetchPublishedPage(key),
       staleTime: (query) => publishedPageStaleTime(query.state.data, defaultStaleTimeMs),
     });
 }
 
+/** A rendering-time view of a fetched page, e.g. with links the policy forbids removed. */
+export type PageTransform = (page: RenderedPage) => RenderedPage;
+
 /**
  * Build the published-page renderer for a site.
  * `fetchPublishedPage` is the site's `getPublishedPage` server function.
@@ -195,9 +205,28 @@ export function createPageRenderer(
 ) {
   const pageQueryOptions = createPageQueryOptions(fetchPublishedPage);
 
-  function PageRenderer({ pageKey }: { pageKey: string }) {
-    const { data } = useSuspenseQuery(pageQueryOptions(pageKey));
-    const page = data as RenderedPage | null;
+  /*
+   * `transform` is applied to whatever the cache holds, on every render: a
+   * page cached before the policy changed, or one still being refetched in
+   * the background, is shown as the current policy says, never as it was
+   * fetched. The cached original is not changed, so a later policy can show
+   * it again. Pass a stable function, or none.
+   */
+  function PageRenderer({
+    pageKey,
+    variant,
+    transform,
+  }: {
+    pageKey: string;
+    variant?: string;
+    transform?: PageTransform;
+  }) {
+    const { data } = useSuspenseQuery(pageQueryOptions(pageKey, variant));
+    const fetched = data as RenderedPage | null;
+    const page = useMemo(
+      () => (fetched && transform ? transform(fetched) : fetched),
+      [fetched, transform],
+    );
     if (!page) return null;
     return (
       <DraftPageRendererView blocks={page.blocks} globals={page.globals} registry={registry} />

package/src/site/SiteFooter.tsx

@@ -12,6 +12,8 @@ import type { SiteTypography } from "../config/typography";
 import { useT } from "../i18n";
 import type { LocalizedString } from "../i18n/types";
 import { SiteFontLinks, fontStyle, slotFont, typographyFontRequests } from "./typography";
+import { filterFooterColumnsForPolicy } from "../navigation/visibility";
+import { useLinkVisibility } from "./link-visibility";
 
 export type SiteFooterCompany = {
   legalName: string;
@@ -81,12 +83,19 @@ export function SiteFooter({
   // boundary rather than on the next full page load.
   const now = useScheduleClock(footerSchedules(columns));
   const footerFont = slotFont(typography, "footer");
-  const visibleColumns = columns
+  const linkPolicy = useLinkVisibility();
+  // Scheduled-out links first, then links the site must not offer right now
+  // (an offline or link-only page, booking while it is off). A column left with
+  // nothing to link to is not rendered as an empty heading.
+  const scheduled = columns
     .filter((column) => isVisibleAt(column.schedule, now))
     .map((column) => ({
       ...column,
-      links: (column.links ?? []).filter((link) => isVisibleAt(link.schedule, now)),
+      links: (column.links ?? []).filter(
+        (link) => isVisibleAt(link.schedule, now) && (link.href ?? "").trim() !== "",
+      ),
     }));
+  const visibleColumns = filterFooterColumnsForPolicy(scheduled, linkPolicy);
 
   const jsonLd = {
     "@context": "https://schema.org",

package/src/site/SiteHeader.tsx

@@ -21,6 +21,8 @@ import {
   type NavigationItem,
 } from "../navigation";
 import { SiteFontLinks, fontStyle, slotFont, typographyFontRequests } from "./typography";
+import { filterNavigationForPolicy, linkHideReason } from "../navigation/visibility";
+import { useLinkVisibility } from "./link-visibility";
 
 export type SiteHeaderProps = {
   /**
@@ -39,8 +41,13 @@ export type SiteHeaderProps = {
   logoAlt?: string;
   /** Set false when the logo artwork is already dark. */
   invertLogoOnLightSurface?: boolean;
-  /** Primary call to action shown on desktop and at the end of the mobile panel. */
-  primaryCta: { href: string; label: LocalizedString };
+  /**
+   * Primary call to action shown on desktop and at the end of the mobile panel.
+   * `null` shows none. With `booking: true` it is a booking action, hidden
+   * while the site's booking is switched off; either way it is hidden when the
+   * page it leads to is offline or link-only (see `LinkVisibilityProvider`).
+   */
+  primaryCta: { href: string; label: LocalizedString; booking?: boolean } | null;
   /** Mobile menu toggle labels. */
   menuLabels: { open: LocalizedString; close: LocalizedString };
   /** Optional backoffice shortcut, rendered only when `signedIn` is true. */
@@ -252,8 +259,17 @@ export function SiteHeader({
   // A page left open past a scheduled publish/hide time re-renders on the
   // boundary instead of showing what was true when it loaded.
   const now = useScheduleClock(navigationSchedules(nav));
+  // Links to offline or link-only pages, and booking links while booking is
+  // off, are left out here; the saved menu itself is untouched.
+  const linkPolicy = useLinkVisibility();
   // Half-finished entries are the editor's business, not a visitor's.
-  const items = renderableNavigation(nav, locale, now);
+  const items = renderableNavigation(filterNavigationForPolicy(nav, linkPolicy), locale, now);
+  const cta =
+    primaryCta &&
+    !(primaryCta.booking && !linkPolicy.bookingVisible) &&
+    linkHideReason(primaryCta.href, linkPolicy) === null
+      ? primaryCta
+      : null;
   const menuFont = slotFont(typography, "menu");
 
   return (
@@ -297,17 +313,19 @@ export function SiteHeader({
               {backoffice.label}
             </Link>
           )}
-          <Link
-            to={primaryCta.href}
-            className={[
-              "inline-flex items-center border px-5 py-2.5 text-xs uppercase tracking-[0.2em] transition-colors",
-              !lightText
-                ? "border-foreground text-foreground hover:bg-foreground hover:text-background"
-                : "border-paper text-paper hover:bg-paper hover:text-ink",
-            ].join(" ")}
-          >
-            {t(primaryCta.label)}
-          </Link>
+          {cta ? (
+            <Link
+              to={cta.href}
+              className={[
+                "inline-flex items-center border px-5 py-2.5 text-xs uppercase tracking-[0.2em] transition-colors",
+                !lightText
+                  ? "border-foreground text-foreground hover:bg-foreground hover:text-background"
+                  : "border-paper text-paper hover:bg-paper hover:text-ink",
+              ].join(" ")}
+            >
+              {t(cta.label)}
+            </Link>
+          ) : null}
         </div>
 
         <button
@@ -395,13 +413,15 @@ export function SiteHeader({
                 {backoffice.label}
               </Link>
             )}
-            <Link
-              to={primaryCta.href}
-              className="mt-4 inline-flex items-center justify-center border border-foreground px-5 py-3 text-xs uppercase tracking-[0.2em]"
-              onClick={() => setOpen(false)}
-            >
-              {t(primaryCta.label)}
-            </Link>
+            {cta ? (
+              <Link
+                to={cta.href}
+                className="mt-4 inline-flex items-center justify-center border border-foreground px-5 py-3 text-xs uppercase tracking-[0.2em]"
+                onClick={() => setOpen(false)}
+              >
+                {t(cta.label)}
+              </Link>
+            ) : null}
           </nav>
         </div>
       )}

package/src/site/link-visibility.tsx

@@ -0,0 +1,28 @@
+/**
+ * The public link policy, made available to the site chrome.
+ *
+ * A site resolves the policy on the server (which pages are offline or
+ * link-only, whether booking is on) and provides it here; the shared header and
+ * footer read it to leave out links a visitor must not be offered. Without a
+ * provider nothing is filtered, which is what the backoffice and any screen
+ * that renders the chrome outside the public site get.
+ */
+import { createContext, useContext, type ReactNode } from "react";
+
+import { OPEN_LINK_POLICY, type LinkVisibilityPolicy } from "../navigation/visibility";
+
+const LinkVisibilityContext = createContext<LinkVisibilityPolicy>(OPEN_LINK_POLICY);
+
+export function LinkVisibilityProvider({
+  policy,
+  children,
+}: {
+  policy: LinkVisibilityPolicy;
+  children: ReactNode;
+}) {
+  return <LinkVisibilityContext.Provider value={policy}>{children}</LinkVisibilityContext.Provider>;
+}
+
+export function useLinkVisibility(): LinkVisibilityPolicy {
+  return useContext(LinkVisibilityContext);
+}

package/src/site/preview-messaging.ts

@@ -0,0 +1,232 @@
+/**
+ * The page builder's channel to its preview canvas.
+ *
+ * The builder renders the page being edited in an iframe (the preview route)
+ * and streams unsaved drafts into it; the canvas answers with a ready signal
+ * and block selections. The preview route is public, so its page can be
+ * opened or framed by anyone — a message that only *says* it comes from the
+ * builder proves nothing. Both ends therefore check who is talking:
+ *
+ * - the canvas accepts the builder's messages only from its own parent frame
+ *   (`event.source`), only from an expected origin (its own, plus any origin a
+ *   site explicitly names), and only in one builder session, in order;
+ * - the builder accepts the canvas's messages only from its own iframe's
+ *   window and the iframe's origin;
+ * - nothing is ever posted to `"*"`: every message names the origin that may
+ *   receive it, so unsaved drafts never reach a page that navigated elsewhere.
+ *
+ * Malformed, oversized, out-of-order and repeated messages are ignored.
+ */
+
+export const EDITOR_SOURCE = "lovable-editor";
+export const PREVIEW_SOURCE = "lovable-preview";
+
+/** Largest draft accepted, measured as JSON. A whole page with its globals is far smaller. */
+export const PREVIEW_MESSAGE_MAX_BYTES = 4 * 1024 * 1024;
+
+const MAX_ID = 200;
+const KEYS_THAT_ARE_NOT_DATA = new Set(["__proto__", "constructor", "prototype"]);
+
+export type EditorDraftMessage = {
+  source: typeof EDITOR_SOURCE;
+  session: string;
+  seq: number;
+  type: "draft";
+  blocks: unknown[];
+  globals: Record<string, unknown[]>;
+  selectedId: string | null;
+  locale?: string;
+  sharedContent?: Record<string, unknown>;
+};
+
+export type EditorScrollMessage = {
+  source: typeof EDITOR_SOURCE;
+  session: string;
+  seq: number;
+  type: "scrollTo";
+  blockId: string;
+};
+
+export type EditorMessage = EditorDraftMessage | EditorScrollMessage;
+
+export type PreviewMessage =
+  | { source: typeof PREVIEW_SOURCE; type: "ready" }
+  | { source: typeof PREVIEW_SOURCE; type: "select"; blockId: string };
+
+/** The parts of a `MessageEvent` the guards read. */
+export type IncomingMessage = { data: unknown; origin: string; source: unknown };
+
+/** A serialized origin (`https://host[:port]`), or null for anything else. */
+export function normalizeOrigin(value: string | null | undefined): string | null {
+  if (!value) return null;
+  try {
+    const url = new URL(value);
+    if (url.protocol !== "https:" && url.protocol !== "http:") return null;
+    if (url.username || url.password) return null;
+    return url.origin;
+  } catch {
+    return null;
+  }
+}
+
+/** The origins the canvas trusts: its own first, then any the site names explicitly. */
+export function trustedEditorOrigins(own: string, extra: readonly string[] = []): string[] {
+  const out: string[] = [];
+  for (const value of [own, ...extra]) {
+    const origin = normalizeOrigin(value);
+    if (origin && !out.includes(origin)) out.push(origin);
+  }
+  return out;
+}
+
+/** The origin of the page the builder frames, resolved against the builder's address. */
+export function previewOriginOf(previewUrl: string, base: string): string | null {
+  try {
+    return normalizeOrigin(new URL(previewUrl, base).href);
+  } catch {
+    return null;
+  }
+}
+
+/** A fresh, unguessable builder session id. */
+export function newPreviewSession(): string {
+  const bytes = new Uint8Array(16);
+  globalThis.crypto.getRandomValues(bytes);
+  return Array.from(bytes, (b) => b.toString(16).padStart(2, "0")).join("");
+}
+
+function isPlainObject(value: unknown): value is Record<string, unknown> {
+  if (value === null || typeof value !== "object" || Array.isArray(value)) return false;
+  const proto = Object.getPrototypeOf(value) as unknown;
+  return proto === Object.prototype || proto === null;
+}
+
+function hasOnlyDataKeys(value: Record<string, unknown>): boolean {
+  return Object.keys(value).every((key) => !KEYS_THAT_ARE_NOT_DATA.has(key));
+}
+
+const isId = (value: unknown): value is string =>
+  typeof value === "string" && value.length > 0 && value.length <= MAX_ID;
+
+function sizeWithin(value: unknown, maxBytes: number): boolean {
+  try {
+    const json = JSON.stringify(value);
+    return typeof json === "string" && json.length <= maxBytes;
+  } catch {
+    return false;
+  }
+}
+
+/** The builder's message, checked for shape; null when it is not one. */
+export function parseEditorMessage(
+  data: unknown,
+  maxBytes = PREVIEW_MESSAGE_MAX_BYTES,
+): EditorMessage | null {
+  if (!isPlainObject(data) || data["source"] !== EDITOR_SOURCE) return null;
+  const session = data["session"];
+  const seq = data["seq"];
+  if (typeof session !== "string" || session.length < 16 || session.length > 128) return null;
+  if (typeof seq !== "number" || !Number.isSafeInteger(seq) || seq < 0) return null;
+  if (!sizeWithin(data, maxBytes)) return null;
+
+  if (data["type"] === "scrollTo") {
+    if (!isId(data["blockId"])) return null;
+    return { source: EDITOR_SOURCE, session, seq, type: "scrollTo", blockId: data["blockId"] };
+  }
+  if (data["type"] !== "draft") return null;
+
+  const blocks = data["blocks"];
+  const globals = data["globals"];
+  const selectedId = data["selectedId"] ?? null;
+  const locale = data["locale"];
+  const sharedContent = data["sharedContent"];
+  if (!Array.isArray(blocks)) return null;
+  if (!isPlainObject(globals) || !hasOnlyDataKeys(globals)) return null;
+  if (!Object.values(globals).every((value) => Array.isArray(value))) return null;
+  if (selectedId !== null && !isId(selectedId)) return null;
+  if (locale !== undefined && (typeof locale !== "string" || locale.length > 16)) return null;
+  if (sharedContent !== undefined && (!isPlainObject(sharedContent) || !hasOnlyDataKeys(sharedContent))) {
+    return null;
+  }
+  return {
+    source: EDITOR_SOURCE,
+    session,
+    seq,
+    type: "draft",
+    blocks,
+    globals: globals as Record<string, unknown[]>,
+    selectedId,
+    ...(locale !== undefined ? { locale: locale as string } : {}),
+    ...(sharedContent !== undefined ? { sharedContent } : {}),
+  };
+}
+
+/**
+ * The canvas's side: accepts the builder's messages from its parent frame and
+ * a trusted origin, in one session and in order.
+ */
+export function createEditorMessageGuard(options: {
+  trustedOrigins: readonly string[];
+  /** The window that framed the canvas (`window.parent`). */
+  parent: () => unknown;
+  /** The canvas's own window, to tell "not framed" apart. */
+  self: () => unknown;
+  maxBytes?: number;
+}) {
+  const trusted = new Set(options.trustedOrigins);
+  let session: string | null = null;
+  let lastSeq = -1;
+  let origin: string | null = null;
+
+  return {
+    accept(event: IncomingMessage): EditorMessage | null {
+      const parent = options.parent();
+      if (!parent || parent === options.self()) return null;
+      if (event.source !== parent) return null;
+      if (!trusted.has(event.origin)) return null;
+      if (origin !== null && event.origin !== origin) return null;
+      const message = parseEditorMessage(event.data, options.maxBytes);
+      if (!message) return null;
+      if (session !== null && message.session !== session) return null;
+      if (message.seq <= lastSeq) return null;
+      session = message.session;
+      origin = event.origin;
+      lastSeq = message.seq;
+      return message;
+    },
+    /** Where replies may go: the builder's verified origin, or every trusted one before it spoke. */
+    replyOrigins(): string[] {
+      return origin !== null ? [origin] : [...trusted];
+    },
+  };
+}
+
+/** The canvas's message, checked for shape; null when it is not one. */
+export function parsePreviewMessage(data: unknown): PreviewMessage | null {
+  if (!isPlainObject(data) || data["source"] !== PREVIEW_SOURCE) return null;
+  if (data["type"] === "ready") return { source: PREVIEW_SOURCE, type: "ready" };
+  if (data["type"] === "select" && isId(data["blockId"])) {
+    return { source: PREVIEW_SOURCE, type: "select", blockId: data["blockId"] };
+  }
+  return null;
+}
+
+/** The builder's side: accepts only its own iframe's messages, from the iframe's origin. */
+export function acceptPreviewMessage(
+  event: IncomingMessage,
+  options: { frame: unknown; previewOrigin: string | null },
+): PreviewMessage | null {
+  if (!options.frame || event.source !== options.frame) return null;
+  if (!options.previewOrigin || event.origin !== options.previewOrigin) return null;
+  return parsePreviewMessage(event.data);
+}
+
+/** Posts to each origin in turn; a window at any other origin receives nothing. */
+export function postToOrigins(
+  target: { postMessage: (message: unknown, targetOrigin: string) => void } | null | undefined,
+  message: unknown,
+  origins: readonly string[],
+): void {
+  if (!target) return;
+  for (const origin of origins) target.postMessage(message, origin);
+}

package/src/site/route-aliases.ts

@@ -0,0 +1,74 @@
+/**
+ * Every address that reaches each page, the way the path resolver sees them.
+ *
+ * Hiding links to an unlisted page has to recognise all of its addresses — the
+ * Swedish slug, the English one under `/en`, a slug changed in the SEO screen,
+ * the bare `/<key>` every builder page answers to — and none that belong to a
+ * different page. This builds the same map `resolvePathCore` consults, in the
+ * same order of precedence:
+ *
+ * 1. slug overrides from `page_seo`;
+ * 2. the site's static page registry, for pages with no override;
+ * 3. the bare key, `/<key>` and `/<locale>/<key>`, for pages that exist, only
+ *    where no slug already claims the address.
+ *
+ * Within one precedence level the first page (in key order) wins an address,
+ * matching the resolver's "first entered wins" for the rare collision instead
+ * of guessing differently.
+ */
+import { normalizeRoutePath, servedPath } from "./route-index";
+
+/** Slug map of a page in a site's static registry (as `resolvePathCore` takes it). */
+export type AliasSlugRegistry = Record<string, { slug: Record<string, string | undefined> }>;
+
+export type RouteAliasInput = {
+  /** The site's static page registry. */
+  registry: AliasSlugRegistry;
+  /** `page_seo.slugs` per page key, for pages that have a row. */
+  overrides: ReadonlyMap<string, Record<string, string | undefined>>;
+  /** Keys of CMS pages that exist (not in the trash): their `/<key>` answers too. */
+  existingKeys: readonly string[];
+  locales: readonly string[];
+  defaultLocale: string;
+  /** The locale an unprefixed address resolves in on this request's domain. */
+  requestLocale: string;
+};
+
+const BARE_KEY = /^[a-z0-9_-]+$/;
+
+/** Normalized served path → the page key the resolver would answer with. */
+export function routeAliasMap(input: RouteAliasInput): Map<string, string> {
+  const policy = { locales: input.locales };
+  const prefixed = input.locales.filter((locale) => locale !== input.defaultLocale);
+  const map = new Map<string, string>();
+  const claim = (path: string, key: string) => {
+    const normalized = normalizeRoutePath(path, policy);
+    if (!map.has(normalized)) map.set(normalized, key);
+  };
+
+  const slugPaths = (key: string, slugs: Record<string, string | undefined>) => {
+    const pick = (locale: string) => slugs[locale] ?? slugs[input.defaultLocale];
+    // Unprefixed: the slug of the locale this domain resolves bare paths in.
+    const bare = pick(input.requestLocale);
+    if (bare !== undefined && bare !== null) claim(servedPath(bare, input.defaultLocale, input.defaultLocale), key);
+    // Prefixed: every other locale, each under its own prefix.
+    for (const locale of prefixed) {
+      const slug = pick(locale);
+      if (slug !== undefined && slug !== null) claim(servedPath(slug, locale, input.defaultLocale), key);
+    }
+  };
+
+  for (const key of [...input.overrides.keys()].sort()) {
+    slugPaths(key, input.overrides.get(key) ?? {});
+  }
+  for (const key of Object.keys(input.registry).sort()) {
+    if (input.overrides.has(key)) continue;
+    slugPaths(key, input.registry[key]!.slug);
+  }
+  for (const key of [...input.existingKeys].sort()) {
+    if (!BARE_KEY.test(key)) continue;
+    claim(`/${key}`, key);
+    for (const locale of input.locales) claim(`/${locale}/${key}`, key);
+  }
+  return map;
+}