storyloco 2.7.2 → 2.8.0

package/README.md

@@ -393,10 +393,12 @@ export const handle = handle_redirects
 The plugin will:
 
 - Fetch redirect entries from your Storyblok datasource
-- Generate a redirects map during build
+- Bake them into the build as a fallback
 - Support exact matches and wildcard patterns
 - Handle both internal and external redirects
 
+Redirects stay live without a rebuild: the handle fetches the datasource on a server's first request, then serves from memory and refreshes in the background once the list is a minute old. If Storyblok can't be reached, it keeps the last list it had, or the one baked in at build.
+
 ## 🔧 Development
 
 ### Prerequisites

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "storyloco",
-	"version": "2.7.2",
+	"version": "2.8.0",
 	"description": "A collection of slick Storyblok field plugins built with Svelte 5, TypeScript, and Tailwind CSS",
 	"keywords": [
 		"storyblok",

package/packages/shared/dist/plugin.css

@@ -133,7 +133,8 @@
 			z-index: 1;
 		}
 
-		& input {
+		/* the :not() matches the general input rule's, so this outranks it wherever it sits */
+		& input:not([type='checkbox'], [type='radio']) {
 			flex: 1;
 			min-inline-size: 0;
 			padding-inline-start: 34px;

package/packages/vite/dist/redirects/fetch.d.ts

@@ -0,0 +1,7 @@
+/** A redirect as `[from, to]`, the way the datasource stores it (`name` → `value`). */
+export type Redirect = [string, string];
+/**
+ * Every entry in a Storyblok datasource, as `[from, to]` pairs. A missing datasource is no
+ * redirects; any other failure throws, so a caller holding redirects can keep them.
+ */
+export declare function fetch_redirects(datasource: string, token: string): Promise<Array<Redirect>>;

package/packages/vite/dist/redirects/fetch.js

@@ -0,0 +1,31 @@
+/**
+ * Every entry in a Storyblok datasource, as `[from, to]` pairs. A missing datasource is no
+ * redirects; any other failure throws, so a caller holding redirects can keep them.
+ */
+export async function fetch_redirects(datasource, token) {
+    const per_page = 100;
+    const cv = Date.now().toString();
+    const entries = [];
+    for (let page = 1;; page++) {
+        const url = new URL("https://api.storyblok.com/v2/cdn/datasource_entries");
+        url.search = new URLSearchParams({
+            datasource,
+            token,
+            cv,
+            per_page: String(per_page),
+            page: String(page),
+        }).toString();
+        const response = await fetch(url, { signal: AbortSignal.timeout(3000) });
+        if (response.status === 404)
+            return [];
+        if (!response.ok)
+            throw new Error(`Storyblok datasource "${datasource}" → ${response.status}`);
+        const { datasource_entries = [] } = (await response.json());
+        entries.push(...datasource_entries);
+        const total = Number(response.headers.get("total"));
+        if (datasource_entries.length < per_page || (total && entries.length >= total))
+            break;
+    }
+    const pairs = entries.filter((e) => e.name && e.value).map((e) => [e.name, e.value]);
+    return [...new Map(pairs)];
+}

package/packages/vite/dist/redirects/handle.js

@@ -1,27 +1,8 @@
 import { match, compile } from "path-to-regexp";
 import { Logger } from "../shared/logger.js";
+import { fetch_redirects } from "./fetch.js";
 const name = "vite-storyblok-redirects";
 const logger = new Logger(name);
-// Lazy load the redirects map to avoid import errors during dev
-let redirects_map = null;
-async function load_redirects_map() {
-    if (redirects_map)
-        return redirects_map;
-    try {
-        // import from virtual module
-        // @ts-expect-error - virtual module resolved at runtime by vite plugin
-        const module = await import("virtual:storyblok-redirects");
-        const redirects = module.redirects;
-        redirects_map = new Map(redirects);
-        return redirects_map;
-    }
-    catch (err) {
-        logger.warn(`Failed to load redirects from virtual module, using empty redirects map`);
-        logger.warn(String(err));
-        redirects_map = new Map();
-        return redirects_map;
-    }
-}
 /** Normalise to a leading-slash path. Empty → '/' */
 function normalize_path(pathname) {
     if (!pathname)
@@ -43,32 +24,62 @@ function to_dst_pattern(glob) {
     let i = 1;
     return normalize_path(glob).replaceAll("*", () => `:w${i++}`);
 }
-/** Precompiled wildcard rules generated from the redirects map. */
-let wildcard_rules = [];
-/** Exact redirect lookups, with and without leading slash variants. */
-let exact_map = new Map();
-let rules_initialized = false;
-async function initialize_rules() {
-    if (rules_initialized)
-        return;
-    const map = await load_redirects_map();
-    wildcard_rules = [];
-    exact_map = new Map();
-    for (const [key, value] of map.entries()) {
+function build_rules(redirects) {
+    const rules = { exact: new Map(), wildcards: [] };
+    for (const [key, value] of redirects) {
         if (key.includes("*")) {
-            const src_pattern = to_src_pattern(key);
-            const dst_pattern = to_dst_pattern(value);
-            wildcard_rules.push({
-                matcher: match(src_pattern, { decode: decodeURIComponent, end: true }),
-                builder: compile(dst_pattern, { encode: (x) => x }),
-            });
+            try {
+                rules.wildcards.push({
+                    matcher: match(to_src_pattern(key), { decode: decodeURIComponent, end: true }),
+                    builder: compile(to_dst_pattern(value), { encode: (x) => x }),
+                });
+            }
+            catch (err) {
+                logger.warn(`Skipping redirect ${key} -> ${value}: ${err}`);
+            }
         }
         else {
-            exact_map.set(normalize_path(key), value);
-            exact_map.set(key.startsWith("/") ? key.slice(1) : key, value);
+            rules.exact.set(normalize_path(key), value);
+            rules.exact.set(key.startsWith("/") ? key.slice(1) : key, value);
         }
     }
-    rules_initialized = true;
+    return rules;
+}
+/** How long a fetched list is used before it's refreshed in the background. */
+const MAX_AGE = 60_000;
+let rules;
+let refresh;
+let fetched_at = 0;
+/**
+ * The current rules. The first request waits for the live datasource, falling back to the list baked
+ * in at build; after that, a list older than MAX_AGE keeps serving while a fresh one loads, and a
+ * failed refresh keeps the last good list.
+ */
+async function current_rules() {
+    rules ??= (async () => {
+        let config;
+        try {
+            // @ts-expect-error - virtual module resolved at runtime by vite plugin
+            config = await import("virtual:storyblok-redirects");
+        }
+        catch (err) {
+            logger.warn(`Failed to load redirects from virtual module, using no redirects: ${err}`);
+            return build_rules([]);
+        }
+        refresh = config.token ? () => fetch_redirects(config.datasource, config.token) : undefined;
+        fetched_at = Date.now();
+        return build_rules((await refresh?.().catch(warn)) ?? config.redirects);
+    })();
+    if (refresh && Date.now() - fetched_at > MAX_AGE) {
+        fetched_at = Date.now();
+        refresh()
+            .then((redirects) => (rules = Promise.resolve(build_rules(redirects))))
+            .catch(warn);
+    }
+    return rules;
+}
+function warn(err) {
+    logger.warn(`Couldn't refresh redirects, keeping the current ones: ${err}`);
 }
 /**
  * Resolve a redirect for the given pathname.
@@ -77,15 +88,15 @@ async function initialize_rules() {
  * Self-redirects are ignored.
  */
 async function resolve_redirect(url) {
-    await initialize_rules();
+    const { exact, wildcards } = await current_rules();
     try {
         const source = normalize_path(url.pathname + (url.search || ""));
         const source_plain = source.includes("?") ? source.split("?")[0] : source;
-        const lookup = (key) => exact_map.get(key) ?? exact_map.get(key.startsWith("/") ? key.slice(1) : key);
+        const lookup = (key) => exact.get(key) ?? exact.get(key.startsWith("/") ? key.slice(1) : key);
         // Prefer exact including query, then plain path
         let target = lookup(source) ?? lookup(source_plain) ?? null;
         if (!target) {
-            for (const { matcher, builder } of wildcard_rules) {
+            for (const { matcher, builder } of wildcards) {
                 const m = matcher(source_plain);
                 if (!m)
                     continue;

package/packages/vite/dist/redirects/plugin.d.ts

@@ -5,7 +5,8 @@ interface Options {
 }
 /**
  * @remarks
- * Vite plugin that automatically generates TypeScript redirects from Storyblok datasource entries
+ * Vite plugin that bakes a Storyblok datasource's redirects into the build, along with what
+ * `handle_redirects` needs to keep them live: it refreshes them from Storyblok every minute.
  *
  * @param [options] - The options for the plugin.
  * @param [options.datasource] - The Storyblok datasource name to fetch redirects from. Defaults to 'redirects'.

package/packages/vite/dist/redirects/plugin.js

@@ -1,48 +1,12 @@
 import { loadEnv } from "vite";
 import { Logger } from "../shared/logger.js";
+import { fetch_redirects } from "./fetch.js";
 const name = "vite-storyblok-redirects";
 const logger = new Logger(name);
-async function get_redirects(datasource = "redirects", public_storyblok_access_token) {
-    const env_token = loadEnv("", "", "").PUBLIC_STORYBLOK_ACCESS_TOKEN;
-    const token = public_storyblok_access_token ?? env_token;
-    const per_page = 100;
-    let page = 1;
-    const all_entries = [];
-    const cache_version = Date.now().toString();
-    let total = null;
-    while (true) {
-        const url = new URL("https://api.storyblok.com/v2/cdn/datasource_entries");
-        url.searchParams.set("datasource", datasource);
-        url.searchParams.set("token", token);
-        url.searchParams.set("cv", cache_version);
-        url.searchParams.set("per_page", String(per_page));
-        url.searchParams.set("page", String(page));
-        const request = await fetch(url);
-        if (request.status === 404) {
-            return { datasource_entries: [] };
-        }
-        // capture total from headers once
-        if (total === null) {
-            const total_header = request.headers.get("total");
-            total = total_header ? Number(total_header) : null;
-        }
-        const { datasource_entries } = (await request.json());
-        all_entries.push(...(datasource_entries ?? []));
-        // stop conditions:
-        // - if we know total, stop when we've collected that many
-        // - otherwise, stop when a page returns fewer than per_page
-        if ((total !== null && all_entries.length >= total) ||
-            !datasource_entries ||
-            datasource_entries.length < per_page) {
-            break;
-        }
-        page += 1;
-    }
-    return { datasource_entries: all_entries };
-}
 /**
  * @remarks
- * Vite plugin that automatically generates TypeScript redirects from Storyblok datasource entries
+ * Vite plugin that bakes a Storyblok datasource's redirects into the build, along with what
+ * `handle_redirects` needs to keep them live: it refreshes them from Storyblok every minute.
  *
  * @param [options] - The options for the plugin.
  * @param [options.datasource] - The Storyblok datasource name to fetch redirects from. Defaults to 'redirects'.
@@ -92,7 +56,12 @@ async function get_redirects(datasource = "redirects", public_storyblok_access_t
  * ```
  */
 export default function redirects({ datasource = "redirects", public_storyblok_access_token, } = {}) {
-    let redirects_data = [];
+    const token = public_storyblok_access_token ?? loadEnv("", "", "").PUBLIC_STORYBLOK_ACCESS_TOKEN ?? "";
+    let baked;
+    const load_redirects = () => (baked ??= fetch_redirects(datasource, token).catch((err) => {
+        logger.fail(`Error generating redirects: ${err instanceof Error ? err.message : err}`);
+        return [];
+    }));
     return {
         name,
         resolveId(id) {
@@ -100,43 +69,22 @@ export default function redirects({ datasource = "redirects", public_storyblok_a
                 return id;
         },
         async load(id) {
-            if (id === "virtual:storyblok-redirects") {
-                try {
-                    const { datasource_entries } = await get_redirects(datasource, public_storyblok_access_token);
-                    redirects_data = Array.from(new Map(datasource_entries
-                        .filter((e) => Boolean(e?.name) && Boolean(e?.value))
-                        .map((e) => [e.name, e.value])).entries());
-                    return `export const redirects = ${JSON.stringify(redirects_data, null, 2)}`;
-                }
-                catch (err) {
-                    const message = err instanceof Error && typeof err.message === "string" ? err.message : "Unknown error";
-                    logger.fail(`Error generating redirects: ${message}`);
-                    return `export const redirects = []`;
-                }
-            }
+            if (id !== "virtual:storyblok-redirects")
+                return;
+            return [
+                `export const redirects = ${JSON.stringify(await load_redirects(), null, 2)}`,
+                `export const datasource = ${JSON.stringify(datasource)}`,
+                `export const token = ${JSON.stringify(token)}`,
+            ].join("\n");
         },
         async buildStart() {
-            // preload redirects for build
-            try {
-                const { datasource_entries } = await get_redirects(datasource, public_storyblok_access_token);
-                redirects_data = Array.from(new Map(datasource_entries
-                    .filter((e) => Boolean(e?.name) && Boolean(e?.value))
-                    .map((e) => [e.name, e.value])).entries());
-                logger.start("Generating redirects");
-                logger.succeed("Redirects virtual module generated");
-                if (redirects_data.length === 0) {
-                    logger.info("No redirects configured");
-                }
-                else {
-                    for (const [from, to] of redirects_data) {
-                        logger.info(`${from} -> ${to}`);
-                    }
-                }
-            }
-            catch (err) {
-                const message = err instanceof Error && typeof err.message === "string" ? err.message : "Unknown error";
-                logger.fail(`Error generating redirects: ${message}`);
-            }
+            baked = undefined;
+            const redirects = await load_redirects();
+            logger.succeed(`Redirects virtual module generated`);
+            if (redirects.length === 0)
+                logger.info("No redirects configured");
+            for (const [from, to] of redirects)
+                logger.info(`${from} -> ${to}`);
         },
     };
 }