@gigamusic/links 0.1.0

package/src/api/handlers.ts

@@ -0,0 +1,267 @@
+import { revalidateTag } from "next/cache";
+import type { LinkPageQueries } from "../types";
+import { verifyAdminSession } from "./auth";
+import {
+  INVALID_SLUG_MESSAGE,
+  RESERVED_SLUGS,
+  RESERVED_SLUG_MESSAGE,
+  SLUG_PATTERN,
+  isUniqueConstraintError,
+} from "./validation";
+
+/** Cache tag flipped by every mutation so consumers can `revalidateTag` once. */
+export const LINK_PAGES_TAG = "link-pages";
+
+/**
+ * Loose `Request`-handler shape compatible with Next.js App Router route
+ * files. The `ctx.params` is generic so handlers for both dynamic-id and
+ * static routes can share the type.
+ */
+export type RouteHandler<Params = Record<string, string>> = (
+  req: Request,
+  ctx: { params: Promise<Params> },
+) => Promise<Response> | Response;
+
+export interface LinkPagesAdminDeps {
+  queries: LinkPageQueries;
+  adminSessionSecret: string;
+}
+
+function json(body: unknown, init?: ResponseInit): Response {
+  return new Response(JSON.stringify(body), {
+    ...init,
+    headers: {
+      "content-type": "application/json",
+      ...(init?.headers ?? {}),
+    },
+  });
+}
+
+async function requireAdmin(
+  req: Request,
+  secret: string,
+): Promise<Response | null> {
+  if (await verifyAdminSession(req, secret)) return null;
+  return json({ error: "Unauthorized" }, { status: 401 });
+}
+
+interface LinkPageBody {
+  title?: string;
+  slug?: string;
+  description?: string | null;
+  releaseId?: number | null;
+  coverImageUrl?: string | null;
+  isPublished?: boolean;
+}
+
+function validateSlug(slug: string): { ok: true } | { ok: false; res: Response } {
+  if (!SLUG_PATTERN.test(slug)) {
+    return { ok: false, res: json({ error: INVALID_SLUG_MESSAGE }, { status: 400 }) };
+  }
+  if (RESERVED_SLUGS.has(slug)) {
+    return { ok: false, res: json({ error: RESERVED_SLUG_MESSAGE }, { status: 400 }) };
+  }
+  return { ok: true };
+}
+
+/**
+ * `app/api/admin/link-pages/route.ts` handlers — list + create.
+ */
+export function createAdminLinkPagesHandlers(deps: LinkPagesAdminDeps): {
+  GET: RouteHandler<Record<string, never>>;
+  POST: RouteHandler<Record<string, never>>;
+} {
+  return {
+    GET: async (req) => {
+      const unauth = await requireAdmin(req, deps.adminSessionSecret);
+      if (unauth) return unauth;
+      const pages = await deps.queries.listAllLinkPages();
+      return json(pages);
+    },
+
+    POST: async (req) => {
+      const unauth = await requireAdmin(req, deps.adminSessionSecret);
+      if (unauth) return unauth;
+      const body = (await req.json()) as LinkPageBody;
+      const title = body.title?.trim();
+      const slug = body.slug?.trim().toLowerCase();
+
+      if (!title) return json({ error: "Title is required" }, { status: 400 });
+      if (!slug) return json({ error: INVALID_SLUG_MESSAGE }, { status: 400 });
+      const slugCheck = validateSlug(slug);
+      if (!slugCheck.ok) return slugCheck.res;
+
+      try {
+        const page = await deps.queries.createLinkPage({
+          title,
+          slug,
+          description: body.description ?? null,
+          releaseId: body.releaseId ?? null,
+          coverImageUrl: body.coverImageUrl ?? null,
+          isPublished: body.isPublished ?? true,
+        });
+        revalidateTag(LINK_PAGES_TAG, "max");
+        return json(page, { status: 201 });
+      } catch (err) {
+        if (isUniqueConstraintError(err)) {
+          return json({ error: "Slug already exists" }, { status: 400 });
+        }
+        throw err;
+      }
+    },
+  };
+}
+
+/**
+ * `app/api/admin/link-pages/[id]/route.ts` handlers — single-page CRUD.
+ */
+export function createAdminLinkPageByIdHandlers(deps: LinkPagesAdminDeps): {
+  GET: RouteHandler<{ id: string }>;
+  PUT: RouteHandler<{ id: string }>;
+  DELETE: RouteHandler<{ id: string }>;
+} {
+  return {
+    GET: async (req, { params }) => {
+      const unauth = await requireAdmin(req, deps.adminSessionSecret);
+      if (unauth) return unauth;
+      const { id: idParam } = await params;
+      const id = Number(idParam);
+      if (!Number.isFinite(id)) return json({ error: "Not found" }, { status: 404 });
+      const page = await deps.queries.getLinkPageById(id);
+      if (!page) return json({ error: "Not found" }, { status: 404 });
+      return json(page);
+    },
+
+    PUT: async (req, { params }) => {
+      const unauth = await requireAdmin(req, deps.adminSessionSecret);
+      if (unauth) return unauth;
+      const { id: idParam } = await params;
+      const id = Number(idParam);
+      if (!Number.isFinite(id)) return json({ error: "Not found" }, { status: 404 });
+      const body = (await req.json()) as LinkPageBody;
+
+      const update: LinkPageBody = {};
+      if (body.title !== undefined) {
+        const title = body.title.trim();
+        if (!title) return json({ error: "Title is required" }, { status: 400 });
+        update.title = title;
+      }
+      if (body.slug !== undefined) {
+        const slug = body.slug.trim().toLowerCase();
+        const slugCheck = validateSlug(slug);
+        if (!slugCheck.ok) return slugCheck.res;
+        update.slug = slug;
+      }
+      if (body.description !== undefined) update.description = body.description;
+      if (body.releaseId !== undefined) update.releaseId = body.releaseId;
+      if (body.coverImageUrl !== undefined)
+        update.coverImageUrl = body.coverImageUrl;
+      if (body.isPublished !== undefined) update.isPublished = body.isPublished;
+
+      try {
+        const page = await deps.queries.updateLinkPage(id, update);
+        revalidateTag(LINK_PAGES_TAG, "max");
+        return json(page);
+      } catch (err) {
+        if (isUniqueConstraintError(err)) {
+          return json({ error: "Slug already exists" }, { status: 400 });
+        }
+        throw err;
+      }
+    },
+
+    DELETE: async (req, { params }) => {
+      const unauth = await requireAdmin(req, deps.adminSessionSecret);
+      if (unauth) return unauth;
+      const { id: idParam } = await params;
+      const id = Number(idParam);
+      if (!Number.isFinite(id)) return json({ error: "Not found" }, { status: 404 });
+      await deps.queries.deleteLinkPage(id);
+      revalidateTag(LINK_PAGES_TAG, "max");
+      return json({ ok: true });
+    },
+  };
+}
+
+interface LinkPageItemBody {
+  itemId?: number;
+  title?: string;
+  url?: string;
+  position?: number;
+  isVisible?: boolean;
+}
+
+/**
+ * `app/api/admin/link-pages/[id]/items/route.ts` handlers — item CRUD.
+ *
+ * POST creates a new item at the bottom of the list.
+ * PUT updates a single item by `itemId` in the JSON body.
+ * DELETE removes an item by `itemId` in the query string.
+ */
+export function createAdminLinkPageItemsHandlers(
+  deps: LinkPagesAdminDeps,
+): {
+  POST: RouteHandler<{ id: string }>;
+  PUT: RouteHandler<{ id: string }>;
+  DELETE: RouteHandler<{ id: string }>;
+} {
+  return {
+    POST: async (req, { params }) => {
+      const unauth = await requireAdmin(req, deps.adminSessionSecret);
+      if (unauth) return unauth;
+      const { id: pageIdParam } = await params;
+      const pageId = Number(pageIdParam);
+      if (!Number.isFinite(pageId)) {
+        return json({ error: "Not found" }, { status: 404 });
+      }
+      const { title, url } = (await req.json()) as { title?: string; url?: string };
+      if (!title?.trim() || !url?.trim()) {
+        return json({ error: "Title and URL are required" }, { status: 400 });
+      }
+      const item = await deps.queries.addLinkPageItem(pageId, {
+        title: title.trim(),
+        url: url.trim(),
+      });
+      revalidateTag(LINK_PAGES_TAG, "max");
+      return json(item, { status: 201 });
+    },
+
+    PUT: async (req) => {
+      const unauth = await requireAdmin(req, deps.adminSessionSecret);
+      if (unauth) return unauth;
+      const body = (await req.json()) as LinkPageItemBody;
+      if (body.itemId == null) {
+        return json({ error: "itemId is required" }, { status: 400 });
+      }
+      const itemId = Number(body.itemId);
+      if (!Number.isFinite(itemId)) {
+        return json({ error: "itemId is required" }, { status: 400 });
+      }
+      const item = await deps.queries.updateLinkPageItem(itemId, {
+        title: body.title,
+        url: body.url,
+        position: body.position,
+        isVisible: body.isVisible,
+      });
+      revalidateTag(LINK_PAGES_TAG, "max");
+      return json(item);
+    },
+
+    DELETE: async (req) => {
+      const unauth = await requireAdmin(req, deps.adminSessionSecret);
+      if (unauth) return unauth;
+      const { searchParams } = new URL(req.url);
+      const itemIdRaw = searchParams.get("itemId");
+      if (!itemIdRaw) {
+        return json({ error: "itemId is required" }, { status: 400 });
+      }
+      const itemId = Number(itemIdRaw);
+      if (!Number.isFinite(itemId)) {
+        return json({ error: "itemId is required" }, { status: 400 });
+      }
+      await deps.queries.deleteLinkPageItem(itemId);
+      revalidateTag(LINK_PAGES_TAG, "max");
+      return json({ ok: true });
+    },
+  };
+}

package/src/api/validation.ts

@@ -0,0 +1,15 @@
+export const SLUG_PATTERN = /^[a-z0-9]+(?:-[a-z0-9]+)*$/;
+export const RESERVED_SLUGS = new Set(["new", "edit", "admin", "api"]);
+
+export const INVALID_SLUG_MESSAGE =
+  "Slug must be lowercase letters, numbers, and dashes";
+export const RESERVED_SLUG_MESSAGE = "Slug is reserved";
+
+/** True for Prisma's "unique constraint violated" code (P2002). */
+export function isUniqueConstraintError(err: unknown): boolean {
+  return (
+    typeof err === "object" &&
+    err !== null &&
+    (err as { code?: string }).code === "P2002"
+  );
+}

package/src/cli/index.ts

@@ -0,0 +1,95 @@
+import { readFileSync } from "node:fs";
+import { resolve } from "node:path";
+import { fragmentsDir } from "./paths";
+import { doctorFragments, syncFragments } from "./sync";
+
+interface ParsedArgs {
+  command: "sync" | "doctor" | "help" | "version";
+  target?: string;
+  dryRun: boolean;
+}
+
+function parseArgs(argv: string[]): ParsedArgs {
+  const [command = "help", ...rest] = argv;
+  const parsed: ParsedArgs = {
+    command: (["sync", "doctor", "help", "version"].includes(command)
+      ? command
+      : "help") as ParsedArgs["command"],
+    dryRun: false,
+  };
+  for (let i = 0; i < rest.length; i++) {
+    const arg = rest[i];
+    if (arg === "--dry-run") parsed.dryRun = true;
+    else if (arg === "--target") parsed.target = rest[++i];
+    else if (arg?.startsWith("--target=")) parsed.target = arg.slice("--target=".length);
+  }
+  return parsed;
+}
+
+function readPackageVersion(metaUrl: string): string {
+  try {
+    const pkgPath = resolve(fragmentsDir(metaUrl), "..", "package.json");
+    const pkg = JSON.parse(readFileSync(pkgPath, "utf8")) as { version?: string };
+    return pkg.version ?? "0.0.0";
+  } catch {
+    return "0.0.0";
+  }
+}
+
+function printHelp() {
+  console.log(`gigamusic-links — Prisma fragment sync for @gigamusic/links
+
+Usage:
+  gigamusic-links sync   [--target <prismaSchemaFolder>] [--dry-run]
+  gigamusic-links doctor [--target <prismaSchemaFolder>]
+  gigamusic-links version
+  gigamusic-links help
+
+Fragments are written with a "20-" prefix so they sort AFTER @gigamusic/db's
+"10-" fragments and BEFORE consumer-owned "99-" files. Default --target is
+./prisma/schema (Prisma 6 prismaSchemaFolder layout).
+`);
+}
+
+export async function main(argv: string[], metaUrl: string): Promise<number> {
+  const args = parseArgs(argv);
+  const sourceDir = fragmentsDir(metaUrl);
+  const version = readPackageVersion(metaUrl);
+
+  if (args.command === "help") {
+    printHelp();
+    return 0;
+  }
+  if (args.command === "version") {
+    console.log(version);
+    return 0;
+  }
+  if (args.command === "sync") {
+    syncFragments(
+      { target: args.target, dryRun: args.dryRun },
+      { sourceDir, version },
+    );
+    return 0;
+  }
+  if (args.command === "doctor") {
+    const result = doctorFragments({ target: args.target }, { sourceDir, version });
+    if (!result.ok) {
+      console.error(
+        `gigamusic-links doctor: ${result.stale.length} stale, ${result.missing.length} missing`,
+      );
+      return 1;
+    }
+    console.log("gigamusic-links doctor: all fragments are up to date.");
+    return 0;
+  }
+  printHelp();
+  return 1;
+}
+
+main(process.argv.slice(2), import.meta.url).then(
+  (code) => process.exit(code),
+  (err) => {
+    console.error(err);
+    process.exit(1);
+  },
+);

package/src/cli/paths.ts

@@ -0,0 +1,11 @@
+import { fileURLToPath } from "node:url";
+import { dirname, resolve } from "node:path";
+
+/**
+ * Locate the shipped `prisma/` fragments directory. At runtime the CLI bundle
+ * lives at `<pkg>/dist/cli.js`; the fragments live at `<pkg>/prisma/`.
+ */
+export function fragmentsDir(metaUrl: string): string {
+  const here = dirname(fileURLToPath(metaUrl));
+  return resolve(here, "..", "prisma");
+}

package/src/cli/sync.ts

@@ -0,0 +1,169 @@
+import {
+  existsSync,
+  mkdirSync,
+  readFileSync,
+  readdirSync,
+  statSync,
+  writeFileSync,
+} from "node:fs";
+import { join, resolve } from "node:path";
+
+export interface SyncOptions {
+  /** Where the consumer's prisma schema folder lives. Defaults to `<cwd>/prisma/schema`. */
+  target?: string;
+  /** When true, log planned writes without touching the filesystem. */
+  dryRun?: boolean;
+  /** Override for testing — defaults to process.cwd(). */
+  cwd?: string;
+}
+
+export interface SyncResult {
+  written: string[];
+  skipped: { file: string; reason: string }[];
+}
+
+export interface SyncDeps {
+  sourceDir: string;
+  version: string;
+  today?: string;
+  logger?: { info: (msg: string) => void; warn: (msg: string) => void };
+}
+
+/**
+ * Sync prefix — `20-` orders after `10-` (gigamusic/db) and before `99-`
+ * (consumer-owned). Keeping the prefix shared with @gigamusic/db's sort
+ * convention so consumers don't need to learn a new rule.
+ */
+const SYNC_PREFIX = "20-";
+
+const VERSION_RE = /AUTOGENERATED by @gigamusic\/links@([^\s]+) on (\d{4}-\d{2}-\d{2})/;
+
+export function listFragmentFiles(sourceDir: string): string[] {
+  return readdirSync(sourceDir)
+    .filter((f) => f.endsWith(".prisma") && !f.startsWith("_"))
+    .sort();
+}
+
+function buildHeader(version: string, today: string): string {
+  return `// AUTOGENERATED by @gigamusic/links@${version} on ${today} — do not edit; re-run \`pnpm gigamusic-links sync\`\n`;
+}
+
+function readExistingVersion(filePath: string): string | null {
+  if (!existsSync(filePath)) return null;
+  const head = readFileSync(filePath, "utf8").split("\n", 2).join("\n");
+  const match = VERSION_RE.exec(head);
+  return match?.[1] ?? null;
+}
+
+/**
+ * Semver-ish comparison — accepts `x.y.z` or pre-release suffixes. Returns
+ * 1/0/-1 like `Array.prototype.sort`. Workspace `workspace:*` and similar
+ * non-numeric strings compare equal so we never refuse to overwrite during
+ * local dev.
+ */
+export function compareVersions(a: string, b: string): number {
+  if (a === b) return 0;
+  const aParts = a.split(/[.-]/);
+  const bParts = b.split(/[.-]/);
+  const len = Math.max(aParts.length, bParts.length);
+  for (let i = 0; i < len; i++) {
+    const ai = parseInt(aParts[i] ?? "0", 10);
+    const bi = parseInt(bParts[i] ?? "0", 10);
+    if (Number.isNaN(ai) || Number.isNaN(bi)) {
+      const as = aParts[i] ?? "";
+      const bs = bParts[i] ?? "";
+      if (as === bs) continue;
+      return as < bs ? -1 : 1;
+    }
+    if (ai !== bi) return ai < bi ? -1 : 1;
+  }
+  return 0;
+}
+
+export function syncFragments(opts: SyncOptions, deps: SyncDeps): SyncResult {
+  const cwd = opts.cwd ?? process.cwd();
+  const target = resolve(cwd, opts.target ?? join("prisma", "schema"));
+  const today = deps.today ?? new Date().toISOString().slice(0, 10);
+  const logger = deps.logger ?? console;
+  const header = buildHeader(deps.version, today);
+
+  const written: string[] = [];
+  const skipped: { file: string; reason: string }[] = [];
+
+  if (!opts.dryRun) {
+    mkdirSync(target, { recursive: true });
+  } else if (!existsSync(target) || !statSync(target).isDirectory()) {
+    logger.info(`(dry-run) would create directory ${target}`);
+  }
+
+  for (const file of listFragmentFiles(deps.sourceDir)) {
+    const srcPath = join(deps.sourceDir, file);
+    const destPath = join(target, `${SYNC_PREFIX}${file}`);
+    const existingVersion = readExistingVersion(destPath);
+
+    if (existingVersion && compareVersions(existingVersion, deps.version) > 0) {
+      skipped.push({
+        file: destPath,
+        reason: `existing version ${existingVersion} is newer than installed ${deps.version}`,
+      });
+      logger.warn(
+        `skip ${destPath} — existing v${existingVersion} is newer than installed v${deps.version}`,
+      );
+      continue;
+    }
+
+    const body = readFileSync(srcPath, "utf8");
+    const contents = header + body;
+
+    if (opts.dryRun) {
+      logger.info(`(dry-run) would write ${destPath}`);
+    } else {
+      writeFileSync(destPath, contents, "utf8");
+      logger.info(`wrote ${destPath}`);
+    }
+    written.push(destPath);
+  }
+
+  return { written, skipped };
+}
+
+export interface DoctorOptions {
+  target?: string;
+  cwd?: string;
+}
+
+export interface DoctorResult {
+  ok: boolean;
+  stale: { file: string; installed: string; found: string }[];
+  missing: string[];
+}
+
+export function doctorFragments(opts: DoctorOptions, deps: SyncDeps): DoctorResult {
+  const cwd = opts.cwd ?? process.cwd();
+  const target = resolve(cwd, opts.target ?? join("prisma", "schema"));
+  const stale: { file: string; installed: string; found: string }[] = [];
+  const missing: string[] = [];
+  const logger = deps.logger ?? console;
+
+  for (const file of listFragmentFiles(deps.sourceDir)) {
+    const destPath = join(target, `${SYNC_PREFIX}${file}`);
+    const existingVersion = readExistingVersion(destPath);
+    if (existingVersion === null) {
+      missing.push(destPath);
+      logger.warn(`missing: ${destPath}`);
+      continue;
+    }
+    if (compareVersions(existingVersion, deps.version) < 0) {
+      stale.push({
+        file: destPath,
+        installed: deps.version,
+        found: existingVersion,
+      });
+      logger.warn(
+        `stale: ${destPath} is v${existingVersion}; installed @gigamusic/links is v${deps.version}`,
+      );
+    }
+  }
+
+  return { ok: stale.length === 0 && missing.length === 0, stale, missing };
+}

package/src/client.ts

@@ -0,0 +1,10 @@
+"use client";
+
+// Client-only entry — components that use React context or browser APIs.
+export { LinksSlotsProvider, useLinksSlot, defaultLinkSlots } from "./slots-context";
+export { LinkPageView } from "./components/LinkPageView";
+export { DefaultLinkButton } from "./components/LinkButton";
+export { DefaultLinkPageHeader } from "./components/LinkPageHeader";
+export { LinkPageForm } from "./components/admin/LinkPageForm";
+export { NewLinkPageForm } from "./components/admin/NewLinkPageForm";
+export { DeleteLinkPageButton } from "./components/admin/DeleteLinkPageButton";

package/src/components/LinkButton.tsx

@@ -0,0 +1,20 @@
+import { LinkPlatformIcon } from "../platforms/icon";
+import type { LinkButtonProps } from "../slots";
+
+/**
+ * Default link-button: a pill anchor with the platform icon (if known) and the
+ * link title. External URLs open in a new tab; same-origin URLs stay in-tab.
+ * Consumers can override via `<GigamusicProvider components={{ LinkButton: ... }}>`.
+ */
+export function DefaultLinkButton({ href, title, platform, internal }: LinkButtonProps) {
+  return (
+    <a
+      href={href}
+      {...(!internal && { target: "_blank", rel: "noopener noreferrer" })}
+      className="flex items-center justify-center gap-3 w-full py-3.5 px-4 rounded-full border border-[var(--gm-color-primary)]/30 bg-[var(--gm-color-primary)]/10 backdrop-blur-sm text-[color:var(--gm-color-foreground,white)] font-medium text-sm uppercase tracking-wide hover:bg-[var(--gm-color-primary)]/20 hover:border-[var(--gm-color-primary)]/60 transition-all duration-200"
+    >
+      {platform && <LinkPlatformIcon platform={platform} size={18} />}
+      <span>{title}</span>
+    </a>
+  );
+}

package/src/components/LinkPageHeader.tsx

@@ -0,0 +1,35 @@
+import type { LinkPageHeaderProps } from "../slots";
+
+/**
+ * Default header for `LinkPageView`: optional cover image, page title, and
+ * description. Consumers can override via `<GigamusicProvider components={{
+ * LinkPageHeader: ... }}>` to swap in a logo, custom typography, etc.
+ */
+export function DefaultLinkPageHeader({ title, description, cover }: LinkPageHeaderProps) {
+  return (
+    <>
+      {cover && (
+        <div className="w-36 h-36 sm:w-44 sm:h-44 rounded-2xl overflow-hidden ring-2 ring-white/20">
+          {/* Plain <img> to keep the component framework-agnostic; consumers
+              wanting next/image can override this slot. */}
+          {/* eslint-disable-next-line @next/next/no-img-element */}
+          <img
+            src={cover.src}
+            alt={cover.alt}
+            width={400}
+            height={400}
+            className="w-full h-full object-cover"
+            loading="eager"
+            decoding="async"
+          />
+        </div>
+      )}
+      <div className="text-center">
+        <h1 className="text-2xl font-semibold tracking-tight">{title}</h1>
+        {description && (
+          <p className="text-white/60 text-sm mt-1 whitespace-pre-line">{description}</p>
+        )}
+      </div>
+    </>
+  );
+}

package/src/components/LinkPageView.tsx

@@ -0,0 +1,64 @@
+"use client";
+
+import { detectLinkPlatform } from "../platforms/detect";
+import { isInternalUrl } from "./url-helpers";
+import { useLinksSlot } from "../slots-context";
+import type { LinkPageWithItems } from "../types";
+import type { LinksSlots } from "../slots";
+
+interface LinkPageViewProps {
+  page: LinkPageWithItems;
+  /**
+   * Per-call slot overrides. Most consumers register slots once on
+   * `<LinksSlotsProvider>` and omit this prop. Keys not present here fall
+   * back to the provider, then to the package defaults.
+   */
+  slots?: Partial<LinksSlots>;
+}
+
+/**
+ * Public-facing render of a `LinkPage`. Renders the resolved cover, header,
+ * and a vertical list of link buttons. Slots:
+ *  - `LinkButton` — the rendered pill for each item.
+ *  - `LinkPageHeader` — the title block above the buttons.
+ *
+ * Cover image resolution: explicit `page.coverImageUrl` override → linked
+ * release's `coverImageUrl` (only when the release is published, to avoid
+ * leaking a draft's art) → `null`.
+ */
+export function LinkPageView({ page, slots }: LinkPageViewProps) {
+  const providerHeader = useLinksSlot("LinkPageHeader");
+  const providerButton = useLinksSlot("LinkButton");
+  const Header = slots?.LinkPageHeader ?? providerHeader;
+  const LinkButton = slots?.LinkButton ?? providerButton;
+
+  const releaseCover = page.release?.isPublished
+    ? page.release.coverImageUrl
+    : null;
+  const coverSrc = page.coverImageUrl ?? releaseCover ?? null;
+  const cover = coverSrc ? { src: coverSrc, alt: page.title } : null;
+
+  return (
+    <div className="min-h-dvh flex items-start justify-center px-4 py-10">
+      <div className="w-full max-w-md flex flex-col items-center gap-5">
+        <Header title={page.title} description={page.description} cover={cover} />
+
+        <div className="w-full flex flex-col gap-3 mt-2">
+          {page.items.map((item) => {
+            const platform = detectLinkPlatform(item.url);
+            const internal = isInternalUrl(item.url);
+            return (
+              <LinkButton
+                key={item.id}
+                href={item.url}
+                title={item.title}
+                platform={platform}
+                internal={internal}
+              />
+            );
+          })}
+        </div>
+      </div>
+    </div>
+  );
+}