@bygghammar/cms-platform 0.19.1 → 0.20.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bygghammar/cms-platform",
-  "version": "0.19.1",
+  "version": "0.20.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,
@@ -107,7 +107,8 @@
     "./server/guards": "./src/server/guards.ts",
     "./server/redirects-core": "./src/server/redirects-core.ts",
     "./server/page-seo-core": "./src/server/page-seo-core.ts",
-    "./server/media-cleanup-core": "./src/server/media-cleanup-core.ts"
+    "./server/media-cleanup-core": "./src/server/media-cleanup-core.ts",
+    "./server/media-usage-core": "./src/server/media-usage-core.ts"
   },
   "dependencies": {
     "fflate": "^0.8.3"
@@ -180,4 +181,4 @@
       "optional": true
     }
   }
-}
+}

package/src/server/guards.ts

@@ -10,7 +10,7 @@
 /** Minimal shape of an authenticated request context a host must provide. */
 export type PlatformAuthContext = {
   /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
-  supabase: { rpc: (fn: any, args: any) => Promise<{ data: any; error: any }> };
+  supabase: { rpc: (fn: any, args: any) => PromiseLike<{ data: any; error: any }> };
   userId: string;
   claims?: { email?: string | null } | null;
 };

package/src/server/media-usage-core.ts

@@ -0,0 +1,478 @@
+/**
+ * Host-agnostic media usage scanning, external-media import and reference
+ * rewriting.
+ *
+ * The scan walks every CMS-owned JSON column, matches the URLs it finds against
+ * the media library listing, and reports both library usage and importable
+ * external media. The host injects its clients, its storage provider and the
+ * facts only a site knows: the backoffice route prefix and the public path of a
+ * page key.
+ */
+import { variantSiblings } from "../media/srcset";
+import { cleanFileName, splitExt, uniqueFileName } from "../media/filename";
+import type { MediaImportResult, MediaUsage, MediaUsageReport } from "../media/usage-types";
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
+/** Storage surface the usage tools need — satisfied by `getMediaStorage()`. */
+export type UsageStorage = {
+  list: () => Promise<Array<{ name: string; size?: number }>>;
+  download: (path: string) => Promise<Uint8Array>;
+  upload: (
+    path: string,
+    body: Uint8Array,
+    contentType: string,
+    options?: { upsert?: boolean },
+  ) => Promise<unknown>;
+  publicUrl: (path: string) => string;
+};
+
+export type MediaUsageHost = {
+  /** Reader client; RLS applies as the signed-in user. */
+  db: any;
+  storage: UsageStorage;
+  /** Backoffice route prefix, e.g. `/kontoret`. */
+  backofficePrefix?: string;
+  /** Public URL path for a CMS page key, when the site has one. */
+  pagePublicPath?: (pageKey: string) => string | undefined;
+};
+
+export type MediaImportHost = MediaUsageHost & {
+  /** Privileged client used to rewrite references across CMS content. */
+  admin: any;
+  /** User-Agent sent when fetching remote media. */
+  userAgent?: string;
+};
+
+const URL_RE = /https?:\/\/[^\s"'<>)]+/gi;
+const MEDIA_EXT_RE =
+  /\.(png|jpe?g|gif|webp|avif|svg|mp4|webm|mov|m4v|mp3|wav|ogg|pdf)(\?[^\s"'<>)]*)?$/i;
+
+function walk(value: unknown, onString: (s: string, path: string) => void, path = "") {
+  if (!value) return;
+  if (typeof value === "string") {
+    if (
+      value.length > 4 &&
+      (value.startsWith("http") || value.startsWith("/") || MEDIA_EXT_RE.test(value))
+    ) {
+      onString(value, path);
+    }
+    return;
+  }
+  if (Array.isArray(value)) {
+    value.forEach((v, i) => walk(v, onString, `${path}[${i}]`));
+    return;
+  }
+  if (typeof value === "object") {
+    for (const [k, v] of Object.entries(value as Record<string, unknown>)) {
+      walk(v, onString, path ? `${path}.${k}` : k);
+    }
+  }
+}
+
+function extractUrlsFromString(s: string): string[] {
+  if (s.startsWith("/") && !s.startsWith("//")) return [s];
+  const matches = s.match(URL_RE);
+  return matches ?? (MEDIA_EXT_RE.test(s) ? [s] : []);
+}
+
+function safeDecodeURIComponent(value: string) {
+  try {
+    return decodeURIComponent(value);
+  } catch {
+    return value;
+  }
+}
+
+function normalizeUrlPath(rawUrl: string, form: "NFC" | "NFD") {
+  try {
+    const url = new URL(rawUrl);
+    const pathname = url.pathname
+      .split("/")
+      .map((part) => encodeURIComponent(safeDecodeURIComponent(part).normalize(form)))
+      .join("/");
+    return `${url.origin}${pathname}${url.search}${url.hash}`;
+  } catch {
+    return null;
+  }
+}
+
+function encodeUrlPath(rawUrl: string) {
+  try {
+    const url = new URL(rawUrl);
+    const pathname = url.pathname
+      .split("/")
+      .map((part) => encodeURIComponent(safeDecodeURIComponent(part)))
+      .join("/");
+    return `${url.origin}${pathname}${url.search}${url.hash}`;
+  } catch {
+    return null;
+  }
+}
+
+/** WordPress exports link resized copies; the original is the same name without `-WxH`. */
+function removeWordPressSizeSuffix(rawUrl: string) {
+  try {
+    const url = new URL(rawUrl);
+    const decodedPath = url.pathname
+      .split("/")
+      .map((part) => safeDecodeURIComponent(part))
+      .join("/");
+    const originalPath = decodedPath.replace(/-\d+x\d+(\.[a-z0-9]+)$/i, "$1");
+    if (originalPath === decodedPath) return null;
+    const encodedPath = originalPath
+      .split("/")
+      .map((part) => encodeURIComponent(part))
+      .join("/");
+    return `${url.origin}${encodedPath}${url.search}${url.hash}`;
+  } catch {
+    return null;
+  }
+}
+
+/** Every spelling of a remote URL worth trying: encoding, unicode form, original size. */
+export function remoteUrlCandidates(rawUrl: string): string[] {
+  const candidates = new Set<string>();
+  const add = (candidate: string | null) => {
+    if (candidate) candidates.add(candidate);
+  };
+
+  const trimmed = rawUrl.trim();
+  add(trimmed);
+  add(encodeUrlPath(trimmed));
+  add(normalizeUrlPath(trimmed, "NFD"));
+  add(normalizeUrlPath(trimmed, "NFC"));
+
+  const original = removeWordPressSizeSuffix(trimmed);
+  add(original);
+  if (original) {
+    add(encodeUrlPath(original));
+    add(normalizeUrlPath(original, "NFD"));
+    add(normalizeUrlPath(original, "NFC"));
+  }
+
+  return Array.from(candidates);
+}
+
+async function fetchRemoteMedia(rawUrl: string, userAgent: string) {
+  let lastStatus: number | null = null;
+  let lastError: string | null = null;
+
+  const headers = {
+    "User-Agent": userAgent,
+    Accept:
+      "image/avif,image/webp,image/apng,image/svg+xml,image/*,video/*,application/pdf,*/*;q=0.8",
+  };
+
+  for (const url of remoteUrlCandidates(rawUrl)) {
+    try {
+      const response = await fetch(url, { headers, redirect: "follow" });
+      if (response.ok) return { response, resolvedUrl: url };
+      lastStatus = response.status;
+    } catch (error) {
+      lastError = error instanceof Error ? error.message : "Network error";
+    }
+  }
+
+  const reason = lastStatus ? `Fetch failed: ${lastStatus}` : (lastError ?? "Fetch failed");
+  return { error: `${reason} for ${rawUrl}` };
+}
+
+/** Scan every CMS content column and report which library files are used where. */
+export async function scanMediaUsageCore(host: MediaUsageHost): Promise<MediaUsageReport> {
+  const sb = host.db;
+  const prefix = host.backofficePrefix ?? "/kontoret";
+  const publicPathOf = host.pagePublicPath ?? (() => undefined);
+
+  const libPaths = new Set<string>();
+  for (const file of await host.storage.list()) libPaths.add(file.name);
+
+  const [sectionsR, pagesR, versionsR, gSectionsR, gVersionsR, seoR, templatesR] =
+    await Promise.all([
+      sb.from("content_sections").select("key, data"),
+      sb.from("pages").select("id, key, name, current_version_id"),
+      sb.from("page_versions").select("id, page_id, blocks"),
+      sb.from("global_sections").select("id, key, name, current_version_id"),
+      sb.from("global_section_versions").select("id, section_id, blocks"),
+      sb.from("page_seo").select("page_key, slugs, seo"),
+      sb.from("block_templates").select("id, name, block"),
+    ]);
+
+  const pageById = new Map<string, { key: string; name: string; current: string | null }>();
+  for (const page of pagesR.data ?? []) {
+    pageById.set(page.id, { key: page.key, name: page.name, current: page.current_version_id });
+  }
+
+  const globalSectionById = new Map<
+    string,
+    { key: string; name: string; current: string | null }
+  >();
+  for (const section of gSectionsR.data ?? []) {
+    globalSectionById.set(section.id, {
+      key: section.key,
+      name: section.name,
+      current: section.current_version_id,
+    });
+  }
+
+  const byPath: Record<string, MediaUsage[]> = {};
+  const externalMap = new Map<string, MediaUsage[]>();
+  const seen = new Set<string>();
+
+  /**
+   * The library only lists the primary variant of a responsive bundle, so a
+   * reference to any sibling width (`…-1200.webp`) must count on that primary.
+   */
+  const canonicalPath = (path: string) => {
+    const siblings = variantSiblings(path);
+    if (!siblings.length) return path;
+    const suffix = path.match(/-(\d+)\.webp$/i);
+    if (!suffix) return path;
+    const base = path.slice(0, path.length - suffix[0].length);
+    for (const width of [2560, 1920]) {
+      const candidate = `${base}-${width}.webp`;
+      if (libPaths.has(candidate)) return candidate;
+    }
+    return path;
+  };
+
+  const record = (rawUrl: string, jsonPath: string, usage: Omit<MediaUsage, "jsonPath">) => {
+    const url = rawUrl.trim();
+    if (!url) return;
+
+    let matched: string | null = null;
+    for (const path of libPaths) {
+      if (url.endsWith(`/${path}`) || url === path || url.endsWith(`/media/${path}`)) {
+        matched = path;
+        break;
+      }
+    }
+
+    const rec: MediaUsage = { ...usage, jsonPath };
+    if (matched) {
+      const target = canonicalPath(matched);
+      // One srcSet string references every width — count that as a single use.
+      const dedupeKey = `${target}|${usage.entity}|${usage.entityKey}|${jsonPath}`;
+      if (seen.has(dedupeKey)) return;
+      seen.add(dedupeKey);
+      (byPath[target] ||= []).push(rec);
+    } else if (MEDIA_EXT_RE.test(url.split("?")[0]!) || MEDIA_EXT_RE.test(url)) {
+      // Only real media files are importable — never link URLs (booking, pages…).
+      const usages = externalMap.get(url) ?? [];
+      usages.push(rec);
+      externalMap.set(url, usages);
+    }
+  };
+
+  for (const row of sectionsR.data ?? []) {
+    walk(row.data, (s, path) => {
+      for (const url of extractUrlsFromString(s)) {
+        record(url, path, {
+          entity: "section",
+          entityKey: row.key,
+          label: `Section: ${row.key}`,
+          editPath: `${prefix}/sections/${row.key}`,
+          publicPath: "/",
+        });
+      }
+    });
+  }
+
+  for (const version of versionsR.data ?? []) {
+    const page = pageById.get(version.page_id);
+    if (!page || page.current !== version.id) continue;
+    walk(version.blocks, (s, path) => {
+      for (const url of extractUrlsFromString(s)) {
+        record(url, path, {
+          entity: "page",
+          entityKey: page.key,
+          label: `Page: ${page.name}`,
+          editPath: `${prefix}/pages-builder/${page.key}`,
+          publicPath: publicPathOf(page.key),
+        });
+      }
+    });
+  }
+
+  for (const version of gVersionsR.data ?? []) {
+    const section = globalSectionById.get(version.section_id);
+    if (!section || section.current !== version.id) continue;
+    walk(version.blocks, (s, path) => {
+      for (const url of extractUrlsFromString(s)) {
+        record(url, path, {
+          entity: "global_section",
+          entityKey: section.key,
+          label: `Global block: ${section.name}`,
+          editPath: `${prefix}/global-sections/${section.key}`,
+        });
+      }
+    });
+  }
+
+  for (const row of seoR.data ?? []) {
+    walk(row.seo, (s, path) => {
+      for (const url of extractUrlsFromString(s)) {
+        record(url, `seo.${path}`, {
+          entity: "page_seo",
+          entityKey: row.page_key,
+          label: `SEO: ${row.page_key}`,
+          editPath: `${prefix}/seo/${row.page_key}`,
+          publicPath: publicPathOf(row.page_key),
+        });
+      }
+    });
+  }
+
+  for (const template of templatesR.data ?? []) {
+    walk(template.block, (s, path) => {
+      for (const url of extractUrlsFromString(s)) {
+        record(url, path, {
+          entity: "block_template",
+          entityKey: template.id,
+          label: `Template: ${template.name}`,
+          editPath: `${prefix}/pages-builder`,
+        });
+      }
+    });
+  }
+
+  const external = Array.from(externalMap.entries())
+    .map(([url, usages]) => ({ url, usages }))
+    .sort((a, b) => b.usages.length - a.usages.length);
+
+  return { byPath, external };
+}
+
+/** Replace every stored reference to `oldUrls` with `newUrl` across CMS content. */
+export async function rewriteMediaReferencesCore(
+  sb: any,
+  oldUrls: string[],
+  newUrl: string,
+): Promise<number> {
+  const targets = Array.from(new Set(oldUrls.map((u) => u.trim()).filter(Boolean)));
+  if (!targets.length) return 0;
+
+  let changes = 0;
+  const replaceDeep = (value: any): any => {
+    if (typeof value === "string") {
+      let out = value;
+      for (const t of targets) {
+        if (out.includes(t)) {
+          out = out.split(t).join(newUrl);
+          changes++;
+        }
+      }
+      return out;
+    }
+    if (Array.isArray(value)) return value.map(replaceDeep);
+    if (value && typeof value === "object") {
+      const next: Record<string, any> = {};
+      for (const [k, v] of Object.entries(value)) next[k] = replaceDeep(v);
+      return next;
+    }
+    return value;
+  };
+
+  const tables: Array<{ table: string; column: string; idColumn: string }> = [
+    { table: "content_sections", column: "data", idColumn: "key" },
+    { table: "page_versions", column: "blocks", idColumn: "id" },
+    { table: "global_section_versions", column: "blocks", idColumn: "id" },
+    { table: "page_seo", column: "seo", idColumn: "page_key" },
+    { table: "block_templates", column: "block", idColumn: "id" },
+  ];
+
+  for (const { table, column, idColumn } of tables) {
+    const { data: rows } = await sb.from(table).select(`${idColumn}, ${column}`);
+    for (const row of rows ?? []) {
+      const before = JSON.stringify(row[column] ?? null);
+      const updated = replaceDeep(row[column]);
+      const after = JSON.stringify(updated ?? null);
+      if (before === after) continue;
+      await sb
+        .from(table)
+        .update({ [column]: updated })
+        .eq(idColumn, row[idColumn]);
+    }
+  }
+
+  return changes;
+}
+
+async function sha256Hex(bytes: Uint8Array) {
+  const hash = await crypto.subtle.digest("SHA-256", bytes.slice().buffer as ArrayBuffer);
+  return Array.from(new Uint8Array(hash))
+    .map((b) => b.toString(16).padStart(2, "0"))
+    .join("");
+}
+
+/**
+ * Download a remote media file into the library under `imported/`, keeping its
+ * original filename for SEO, then repoint CMS references at the local copy.
+ * Identical bytes are never stored twice.
+ */
+export async function importRemoteUrlCore(
+  data: { url: string; filename?: string },
+  host: MediaImportHost,
+): Promise<MediaImportResult> {
+  const remote = await fetchRemoteMedia(
+    data.url,
+    host.userAgent ?? "Mozilla/5.0 (compatible; CmsMediaImporter/1.0)",
+  );
+  if ("error" in remote) {
+    return { path: "", url: "", skipped: true, error: remote.error ?? "Fetch failed" };
+  }
+
+  const contentType = remote.response.headers.get("content-type") ?? "application/octet-stream";
+  const buffer = new Uint8Array(await remote.response.arrayBuffer());
+  const urlObj = new URL(remote.resolvedUrl);
+  const rawName =
+    data.filename ||
+    urlObj.pathname.split("/").filter(Boolean).map(safeDecodeURIComponent).pop() ||
+    "imported-file";
+  const clean = cleanFileName(rawName, "imported-file");
+
+  const all = await host.storage.list();
+  const existing = all
+    .filter((f) => f.name.startsWith("imported/"))
+    .map((f) => ({ name: f.name.slice("imported/".length), size: f.size }));
+  const taken = new Set<string>(existing.map((f) => f.name));
+
+  const incomingHash = await sha256Hex(buffer);
+  const { base, ext } = splitExt(clean);
+  const family = new RegExp(
+    `^${base.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")}(-\\d+)?${ext.replace(/\./g, "\\.")}$`,
+  );
+  let duplicateOf: string | null = null;
+  for (const file of existing) {
+    if (!family.test(file.name)) continue;
+    if (typeof file.size === "number" && file.size > 0 && file.size !== buffer.byteLength) continue;
+    let bytes: Uint8Array;
+    try {
+      bytes = await host.storage.download(`imported/${file.name}`);
+    } catch {
+      continue;
+    }
+    if ((await sha256Hex(bytes)) === incomingHash) {
+      duplicateOf = `imported/${file.name}`;
+      break;
+    }
+  }
+
+  if (duplicateOf) {
+    const existingUrl = host.storage.publicUrl(duplicateOf);
+    const rewrittenDup = existingUrl
+      ? await rewriteMediaReferencesCore(host.admin, remoteUrlCandidates(data.url), existingUrl)
+      : 0;
+    return { path: duplicateOf, url: existingUrl, rewritten: rewrittenDup, deduped: true };
+  }
+
+  const path = `imported/${uniqueFileName(clean, taken)}`;
+  await host.storage.upload(path, buffer, contentType, { upsert: false });
+
+  const newUrl = host.storage.publicUrl(path);
+  const rewritten = newUrl
+    ? await rewriteMediaReferencesCore(host.admin, remoteUrlCandidates(data.url), newUrl)
+    : 0;
+
+  return { path, url: newUrl, rewritten };
+}