@bygghammar/cms-platform 0.96.0 → 0.97.0

package/src/backoffice/BookingSettingsCard.tsx

@@ -11,6 +11,7 @@ import { toast } from "sonner";
 import { Plus, Trash2 } from "lucide-react";
 
 import { ConfirmDialog } from "./media/ConfirmDialog";
+import { BookingLandingSection, type BookingLandingData, type BookingLandingDeps } from "./BookingLandingSection";
 
 export type BookingSettingsData = {
   enabled: boolean;
@@ -24,6 +25,8 @@ export type BookingSettingsData = {
   }>;
   /** Versions of every stored exception row, removed ones included. */
   rowVersions?: Record<string, string | null>;
+  /** Booking-off landing pages; absent from a server without them. */
+  landing?: BookingLandingData;
 };
 
 export type BookingSettingsDeps = {
@@ -31,8 +34,8 @@ export type BookingSettingsDeps = {
   settings: BookingSettingsData | undefined;
   /** A failed read: the card says so and offers nothing it cannot back up. */
   error: Error | null;
-  /** Pages an exception can be added for. */
-  pages: Array<{ id: string; key: string; name: string }> | undefined;
+  /** Pages an exception or a landing page can be added for. */
+  pages: Array<{ id: string; key: string; name: string; protected?: boolean }> | undefined;
   /** Public path of a page key, for the list. */
   pathFor: (key: string) => string;
   setEnabled: (input: { enabled: boolean; expectedVersion: string | null }) => Promise<unknown>;
@@ -42,6 +45,14 @@ export type BookingSettingsDeps = {
     expectedVersion: string | null;
   }) => Promise<unknown>;
   refresh: () => void;
+  /**
+   * Booking-off landing pages. Optional: without them the subsection is not
+   * shown, and the card is what it was.
+   */
+  setLanding?: BookingLandingDeps["setLanding"];
+  setLandingDefault?: BookingLandingDeps["setLandingDefault"];
+  /** Locales the notice is written in; the site's own. */
+  locales?: readonly string[];
 };
 
 const cardClass = "border border-ink/10 bg-white p-6";
@@ -67,8 +78,10 @@ export function BookingSettingsCard({ deps }: { deps: BookingSettingsDeps }): Re
   };
 
   const exceptionIds = new Set((settings?.exceptions ?? []).map((row) => row.pageId));
+  // A booking-off landing page cannot also keep its booking links.
+  const landingIds = new Set((settings?.landing?.pages ?? []).map((row) => row.pageId));
   const candidates = (pages ?? [])
-    .filter((page) => !exceptionIds.has(page.id.toLowerCase()))
+    .filter((page) => !exceptionIds.has(page.id.toLowerCase()) && !landingIds.has(page.id.toLowerCase()))
     .sort((a, b) => a.name.localeCompare(b.name));
 
   return (
@@ -127,7 +140,8 @@ export function BookingSettingsCard({ deps }: { deps: BookingSettingsDeps }): Re
             <p className="mt-2 max-w-2xl text-sm text-ink/60">
               While booking is hidden, these pages still show the booking links in their own
               content — for example a link-only page for one group. The booking button in the menu
-              stays hidden on them too.
+              stays hidden on them too. A page hidden from the website while booking is hidden (see
+              below) cannot also be one of these.
             </p>
             <ul className="mt-4 divide-y divide-ink/10 border border-ink/10">
               {settings.exceptions.length === 0 ? (
@@ -216,6 +230,22 @@ export function BookingSettingsCard({ deps }: { deps: BookingSettingsDeps }): Re
               </button>
             </div>
           </div>
+
+          {settings.landing && deps.setLanding && deps.setLandingDefault ? (
+            <BookingLandingSection
+              deps={{
+                data: settings.landing,
+                bookingEnabled: settings.enabled,
+                pages,
+                exceptionIds,
+                pathFor,
+                locales: deps.locales && deps.locales.length > 0 ? deps.locales : ["sv", "en"],
+                setLanding: deps.setLanding,
+                setLandingDefault: deps.setLandingDefault,
+                refresh: deps.refresh,
+              }}
+            />
+          ) : null}
         </>
       )}
 

package/src/backoffice/routes/host.ts

@@ -319,6 +319,13 @@ export type BackofficeHost = {
       getBookingSettings: HostServerFn;
       setBookingEnabled: HostServerFn;
       setBookingException: HostServerFn;
+      /**
+       * Booking-off landing pages (`setBookingLandingCore`,
+       * `setBookingLandingDefaultCore`). Optional: without both, the card has
+       * no landing-page subsection.
+       */
+      setBookingLanding?: HostServerFn;
+      setBookingLandingDefault?: HostServerFn;
     };
   };
   /**

package/src/backoffice/routes/index.tsx

@@ -238,6 +238,11 @@ function BookingSettingsSection() {
   const load = useServerFn(booking?.fns.getBookingSettings ?? notRegistered);
   const setEnabled = useServerFn(booking?.fns.setBookingEnabled ?? notRegistered);
   const setException = useServerFn(booking?.fns.setBookingException ?? notRegistered);
+  const setLanding = useServerFn(booking?.fns.setBookingLanding ?? notRegistered);
+  const setLandingDefault = useServerFn(booking?.fns.setBookingLandingDefault ?? notRegistered);
+  const landingRegistered = Boolean(
+    booking?.fns.setBookingLanding && booking?.fns.setBookingLandingDefault,
+  );
   const listPages = useServerFn(host.pages?.fns.listPages ?? notRegistered);
   const q = useQuery({
     queryKey: ["admin", "booking-settings"],
@@ -256,13 +261,27 @@ function BookingSettingsSection() {
       deps={{
         settings: q.data as BookingSettingsData | undefined,
         error: (q.error as Error | null) ?? null,
-        pages: (pagesQ.data as Array<{ id: string; key: string; name: string }> | undefined)?.map(
-          (page) => ({ id: page.id, key: page.key, name: page.name }),
-        ),
+        pages: (
+          pagesQ.data as
+            | Array<{ id: string; key: string; name: string; protected?: boolean }>
+            | undefined
+        )?.map((page) => ({
+          id: page.id,
+          key: page.key,
+          name: page.name,
+          protected: page.protected === true,
+        })),
         pathFor: (key) =>
           resolveUrl ? resolveUrl(key, host.siteConfig.defaultLocale).path : `/${key}`,
         setEnabled: (input) => setEnabled({ data: input } as never),
         setException: (input) => setException({ data: input } as never),
+        ...(landingRegistered
+          ? {
+              setLanding: (input) => setLanding({ data: input } as never),
+              setLandingDefault: (input) => setLandingDefault({ data: input } as never),
+            }
+          : {}),
+        locales: host.locales,
         refresh: () => {
           void q.refetch();
           void qc.invalidateQueries({ queryKey: ["admin", "link-visibility"] });

package/src/blocks/components/CountdownBlock.tsx

@@ -3,6 +3,7 @@ import { useEffect, useMemo, useState, type CSSProperties, type ReactNode } from
 import { useT } from "../../i18n";
 import type { LocalizedString } from "../../i18n";
 import { Reveal } from "../../ui/Reveal";
+import { useDiscoverableLink } from "../../site/link-visibility";
 import { countdownColorStyle, countdownRadius } from "../countdown-colors";
 import { countdownParts, resolveCountdownTarget } from "../countdown-time";
 import { countdownTextClasses } from "../countdown-typography";
@@ -51,6 +52,7 @@ const pad = (n: number) => String(n).padStart(2, "0");
  */
 export function CountdownBlock({ props: p }: { props: CountdownProps }) {
   const { t } = useT();
+  const discoverable = useDiscoverableLink();
   const replacement = useCountdownReplacement();
 
   const target = useMemo(
@@ -137,7 +139,7 @@ export function CountdownBlock({ props: p }: { props: CountdownProps }) {
     return section(
       <>
         {heading(p.expiredTitle, p.expiredBody)}
-        {href && label ? (
+        {href && label && discoverable(href) ? (
           <a
             href={href}
             className="mt-8 inline-flex items-center gap-2 rounded-[var(--cd-radius)] bg-[var(--cd-tile-bg)] px-7 py-4 text-xs uppercase tracking-[0.22em] text-[var(--cd-digit)] transition-opacity hover:opacity-90"

package/src/blocks/components/CtaBannerBlock.tsx

@@ -2,11 +2,13 @@ import { ArrowRight } from "lucide-react";
 import { useT } from "../../i18n";
 import { resolveCta, resolvedText } from "../optional-content";
 import { Reveal } from "../../ui/Reveal";
+import { useDiscoverableLink } from "../../site/link-visibility";
 import type { CtaBannerProps } from "../types";
 
 /** Localized call-to-action banner with up to two links. */
 export function CtaBannerBlock({ props }: { props: CtaBannerProps }) {
   const { locale } = useT();
+  const discoverable = useDiscoverableLink();
   const tone = props.tone ?? "ink";
   const dark = tone === "ink";
   const bg = dark ? "bg-ink text-paper" : tone === "sea" ? "bg-ice text-ink" : "bg-paper text-ink";
@@ -23,11 +25,15 @@ export function CtaBannerBlock({ props }: { props: CtaBannerProps }) {
   const title = resolvedText(props.title, locale);
   const body = resolvedText(props.body, locale);
 
-  // Both a visible label and a usable link, or the whole element goes.
+  // Both a visible label and a usable link, or the whole element goes — as
+  // does a button to a page hidden while booking is hidden.
   const links = [
     { cta: resolveCta(props.cta, locale), className: primary },
     { cta: resolveCta(props.secondaryCta, locale), className: secondary },
-  ].filter((l): l is { cta: NonNullable<typeof l.cta>; className: string } => l.cta !== null);
+  ].filter(
+    (l): l is { cta: NonNullable<typeof l.cta>; className: string } =>
+      l.cta !== null && discoverable(l.cta.href),
+  );
 
   return (
     <section className={`${bg} py-20 md:py-28`}>

package/src/blocks/components/HeroFullBlock.tsx

@@ -4,6 +4,7 @@ import { resolveCta, resolvedText } from "../optional-content";
 import { FocalImage } from "../../host";
 import { LazyVideo } from "../../host";
 import { useClaimPriority } from "../../media/priority";
+import { useDiscoverableLink } from "../../site/link-visibility";
 import type { HeroFullProps } from "../types";
 
 const HEIGHTS: Record<NonNullable<HeroFullProps["height"]>, string> = {
@@ -43,6 +44,7 @@ const OVERLAYS: Record<NonNullable<HeroFullProps["overlay"]>, string> = {
  */
 export function HeroFullBlock({ props: p }: { props: HeroFullProps }) {
   const { t, locale } = useT();
+  const discoverable = useDiscoverableLink();
 
   const align = p.textAlign ?? "left";
   const vertical = p.verticalAlign ?? "center";
@@ -113,10 +115,14 @@ export function HeroFullBlock({ props: p }: { props: HeroFullProps }) {
   // Both halves or nothing: a label with no link is not a button, and a link
   // with no label is an empty target. Dropped entirely, so no border, arrow,
   // anchor or gap is left where the call to action would have been.
+  // A button to a page hidden while booking is hidden is dropped the same way.
   const ctas = [
     { cta: resolveCta(p.primaryCta, locale), className: primaryBtn },
     { cta: resolveCta(p.secondaryCta, locale), className: secondaryBtn },
-  ].filter((c): c is { cta: NonNullable<typeof c.cta>; className: string } => c.cta !== null);
+  ].filter(
+    (c): c is { cta: NonNullable<typeof c.cta>; className: string } =>
+      c.cta !== null && discoverable(c.cta.href),
+  );
 
   return (
     <section

package/src/blocks/components/IconGridBlock.tsx

@@ -1,5 +1,6 @@
 import { useT } from "../../i18n";
 import { Reveal } from "../../ui/Reveal";
+import { useDiscoverableLink } from "../../site/link-visibility";
 import { MobileCarousel, clampAutoplayMs } from "../../ui/MobileCarousel";
 import { resolveBlockIcon } from "../icons";
 import type { IconGridProps } from "../types";
@@ -28,6 +29,7 @@ const TONE: Record<string, string> = {
  */
 export function IconGridBlock({ props }: { props: IconGridProps }) {
   const { t } = useT();
+  const discoverable = useDiscoverableLink();
   const items = props.items ?? [];
   const tone = TONE[props.tone ?? "white"] ?? "bg-white";
   const cols = COLS[props.columns ?? 3] ?? COLS[3];
@@ -74,7 +76,9 @@ export function IconGridBlock({ props }: { props: IconGridProps }) {
     const cls = bare
       ? `flex h-full flex-col ${textAlignClass}`
       : `flex h-full flex-col p-7 md:p-8 ${tone} ${textAlignClass} transition-colors hover:bg-ice/40`;
-    return item.href ? (
+    // A card keeps its content; only a link to a page hidden while booking
+    // is hidden is taken off it.
+    return item.href && discoverable(item.href) ? (
       <a key={item.id ?? i} href={item.href} className={`${cls} group`}>
         {inner}
       </a>

package/src/blocks/components/InstagramBlock.tsx

@@ -4,6 +4,7 @@ import { useT } from "../../i18n";
 import type { InstagramProps } from "../types";
 import { NearViewport, ChunkErrorBoundary } from "../../ui/NearViewport";
 import { ASPECT_CLASS } from "./InstagramTiles";
+import { useDiscoverableLink } from "../../site/link-visibility";
 
 const GAP_CLASS: Record<NonNullable<InstagramProps["gap"]>, string> = {
   none: "gap-0",
@@ -24,6 +25,7 @@ function clamp(n: number | undefined, min: number, max: number, fallback: number
 
 export function InstagramBlock({ props }: { props: InstagramProps }) {
   const { t } = useT();
+  const discoverable = useDiscoverableLink();
   const layout = props.layout ?? "grid";
   const cM = clamp(props.columnsMobile, 1, 4, 2);
   const cT = clamp(props.columnsTablet, 2, 6, 3);
@@ -39,8 +41,10 @@ export function InstagramBlock({ props }: { props: InstagramProps }) {
   const items = allItems.slice(0, limit);
 
   const handle = (props.handle ?? "").replace(/^@/, "");
-  const profileHref =
+  const configuredProfile =
     props.profileHref ?? (handle ? `https://instagram.com/${handle}` : undefined);
+  // Normally Instagram; never a page hidden while booking is hidden.
+  const profileHref = configuredProfile && discoverable(configuredProfile) ? configuredProfile : undefined;
 
   // Reserve the tile wall's height so nothing moves when the chunk arrives:
   // the same aspect ratio, the same number of rows, the same gaps.

package/src/blocks/components/InstagramTiles.tsx

@@ -9,6 +9,7 @@
 import { Instagram as InstagramIcon } from "lucide-react";
 import { useT } from "../../i18n";
 import { FocalImage } from "../../host";
+import { useDiscoverableLink } from "../../site/link-visibility";
 import type { InstagramProps, InstagramItem } from "../types";
 
 export const ASPECT_CLASS: Record<NonNullable<InstagramProps["aspect"]>, string> = {
@@ -40,6 +41,7 @@ function Tile({
   sizes: string;
 }) {
   const { t } = useT();
+  const discoverable = useDiscoverableLink();
   const alt = item.alt ? t(item.alt as Parameters<typeof t>[0]) : "";
   const inner = (
     <div className={`relative ${ASPECT_CLASS[aspect]} bg-ink/5 overflow-hidden group`}>
@@ -63,7 +65,7 @@ function Tile({
     </div>
   );
 
-  if (item.href) {
+  if (item.href && discoverable(item.href)) {
     return (
       <a href={item.href} target="_blank" rel="noreferrer noopener" className="block">
         {inner}

package/src/blocks/components/LinkTilesBlock.tsx

@@ -1,4 +1,5 @@
 import { useT } from "../../i18n";
+import { useDiscoverableLink } from "../../site/link-visibility";
 import { Reveal } from "../../ui/Reveal";
 import { FocalImage } from "../../host";
 import type { LinkTilesProps, LinkTilesItem } from "../types";
@@ -120,10 +121,16 @@ function Tile({
 /**
  * Row of linked image tiles with an overlay label.
  * Every tile's image, text and link is editable in the backoffice.
+ *
+ * Tiles are page cards: one leading to a booking-off landing page is left out
+ * while booking is hidden, like its menu entry, and returns when booking is
+ * shown again. Nothing stored changes. Outside the public site (the builder,
+ * the backoffice) no policy is provided and every tile is shown.
  */
 export function LinkTilesBlock({ props }: { props: LinkTilesProps }) {
   const { t } = useT();
-  const items = props.items ?? [];
+  const discoverable = useDiscoverableLink();
+  const items = (props.items ?? []).filter((item) => discoverable(item.href));
   const tone = TONE[props.tone ?? "white"] ?? "bg-white";
   const dark = (props.tone ?? "white") === "ink";
   const gap = GAP[props.gap ?? "md"] ?? GAP.md;

package/src/blocks/components/MediaSplitBlock.tsx

@@ -15,6 +15,7 @@ import { Lightbox } from "../../ui/Lightbox";
 import { FocalImage } from "../../host";
 import { LazyVideo } from "../../host";
 import { useClaimPriority } from "../../media/priority";
+import { useDiscoverableLink } from "../../site/link-visibility";
 import type { MediaSplitProps, MediaSplitSlide } from "../types";
 
 const PADDING: Record<NonNullable<MediaSplitProps["padding"]>, string> = {
@@ -55,6 +56,7 @@ function Slideshow({
   radius: string;
 }) {
   const { t, locale } = useT();
+  const discoverable = useDiscoverableLink();
   // The first slide is the only slide visible on load, so it is this block's
   // priority candidate — but only if no earlier block already claimed it.
   const slidePriority = useClaimPriority(slides[0]?.image ?? null);
@@ -154,7 +156,8 @@ function Slideshow({
           );
           return (
             <div key={s.id ?? i} className="w-full shrink-0 snap-center">
-              {s.href ? (
+              {/* A slide linking to a page hidden while booking is hidden keeps its picture, not the link. */}
+              {s.href && discoverable(s.href) ? (
                 <a
                   href={s.href}
                   target="_blank"
@@ -230,6 +233,7 @@ export function MediaSplitBlock({ props }: { props: MediaSplitProps }) {
       : (props.image ?? null),
   );
   const { t, locale } = useT();
+  const discoverable = useDiscoverableLink();
   const side = props.mediaSide ?? "left";
   const tone = props.tone ?? "white";
   const dark = tone === "ink";
@@ -355,13 +359,14 @@ export function MediaSplitBlock({ props }: { props: MediaSplitProps }) {
   const body = resolvedText(props.body, locale);
   const hasHead = Boolean(eyebrow || title);
 
-  // Both a visible label and a usable link, or the whole element goes.
+  // Both a visible label and a usable link, or the whole element goes — as
+  // does a button to a page hidden while booking is hidden.
   const links = [
     { cta: resolveCta(props.cta, locale), className: primaryBtn },
     { cta: resolveCta(props.secondaryCta, locale), className: secondaryBtn },
   ].filter(
     (l): l is { cta: NonNullable<typeof l.cta>; className: string } =>
-      l.cta !== null,
+      l.cta !== null && discoverable(l.cta.href),
   );
 
   const inner = (

package/src/blocks/components/PriceTableBlock.tsx

@@ -2,6 +2,7 @@ import { useT } from "../../i18n";
 import { resolveCta, resolvedText } from "../optional-content";
 import { BUTTON_COLOR_CLASS, buttonColorStyle } from "../button-colors";
 import { Reveal } from "../../ui/Reveal";
+import { useDiscoverableLink } from "../../site/link-visibility";
 import type { PriceTableProps } from "../types";
 
 const TONE: Record<string, string> = {
@@ -22,11 +23,11 @@ export function PriceTableBlock({ props }: { props: PriceTableProps }) {
   const lead = resolvedText(props.lead, locale);
   const note = resolvedText(props.note, locale);
   const unitLabel = resolvedText(props.unitLabel, locale);
-  // An empty label or link renders nothing rather than a bare button.
-  const cta = resolveCta(
-    { label: props.ctaLabel, href: props.ctaHref },
-    locale,
-  );
+  const discoverable = useDiscoverableLink();
+  // An empty label or link renders nothing rather than a bare button, and
+  // neither does a button to a page hidden while booking is hidden.
+  const resolved = resolveCta({ label: props.ctaLabel, href: props.ctaHref }, locale);
+  const cta = resolved && discoverable(resolved.href) ? resolved : null;
   const groups = props.groups ?? [];
   const dark = (props.tone ?? "paper") === "ink";
   const tone = TONE[props.tone ?? "paper"] ?? "bg-paper";

package/src/blocks/components/TripListBlock.tsx

@@ -3,6 +3,7 @@ import { ArrowRight, Sparkles } from "lucide-react";
 import { useT } from "../../i18n";
 import { Reveal } from "../../ui/Reveal";
 import { useHostSiteActions, useHostTripSource } from "../../host";
+import { useDiscoverableLink } from "../../site/link-visibility";
 import { tripNumber, type TripItem, type TripListProps } from "../../trips";
 
 /**
@@ -17,6 +18,9 @@ import { tripNumber, type TripItem, type TripListProps } from "../../trips";
  */
 export function TripListBlock({ props }: { props: TripListProps }) {
   const { t } = useT();
+  // A trip's button normally goes to booking (stripped while booking is
+  // hidden); never to a page hidden while booking is hidden either.
+  const discoverable = useDiscoverableLink();
   const actions = useHostSiteActions();
   const source = useHostTripSource() as TripItem[];
   const globalItems = (source ?? []).map((c, i) => ({ ...c, id: c.id ?? `global-${i}` }));
@@ -165,7 +169,7 @@ export function TripListBlock({ props }: { props: TripListProps }) {
                       <span className="text-sm text-ink/65 line-through">{t(c.oldPrice)}</span>
                     ) : null}
                   </div>
-                  {c.bookUrl ? (
+                  {c.bookUrl && discoverable(c.bookUrl) ? (
                     <a
                       href={c.bookUrl}
                       target="_blank"