@firecms/core 3.4.0 → 3.5.0

package/src/util/entity_cache.ts

@@ -25,8 +25,16 @@ const LOCAL_STORAGE_PREFIX = "entity_cache::";
 // In-memory cache to store entities for quick access
 const entityCache: Map<string, object> = new Map();
 
-// Check `localStorage` availability once during initialization
-const isLocalStorageAvailable = typeof localStorage !== "undefined";
+// Check `localStorage` availability once during initialization. Reading it
+// throws where the browser blocks site data, which would fail this module's
+// import and take the whole CMS down with it.
+const isLocalStorageAvailable = (() => {
+    try {
+        return typeof localStorage !== "undefined";
+    } catch {
+        return false;
+    }
+})();
 
 // Define custom replacer for JSON.stringify
 function customReplacer(key: string): any {

package/src/util/index.ts

@@ -28,3 +28,4 @@ export * from "./storage";
 export * from "./callbacks";
 export * from "./conditions";
 export * from "./lazy_eager";
+export * from "./date_fns_locales";

package/src/util/lazy_eager.tsx

@@ -1,9 +1,35 @@
 import React from "react";
 
 /**
- * Returns a React.lazy component that is also preloaded immediately using
- * requestIdleCallback or setTimeout.
- * This ensures that chunks are split, but fetched in the background before they are actually needed.
+ * Prefetch after the page has loaded, never during it.
+ *
+ * An idle callback scheduled at module evaluation time fires in the gaps between
+ * the tasks of the initial load — which is exactly when the critical chunks are
+ * still in flight. With a dozen route components each queueing one, the
+ * background prefetch was competing with the render path for connections and
+ * bandwidth. Waiting for the load event costs the prefetch nothing that matters:
+ * it exists to be ready before a navigation, not before first paint.
+ */
+function schedulePrefetch(load: () => void) {
+    const whenIdle = () => {
+        if ("requestIdleCallback" in window) {
+            (window as any).requestIdleCallback(load);
+        } else {
+            setTimeout(load, 500);
+        }
+    };
+
+    if (document.readyState === "complete") {
+        whenIdle();
+    } else {
+        window.addEventListener("load", whenIdle, { once: true });
+    }
+}
+
+/**
+ * Returns a React.lazy component that is also preloaded in the background, once
+ * the page has finished loading.
+ * This ensures that chunks are split, but fetched before they are actually needed.
  */
 export function lazyEager<T extends React.ComponentType<any>>(
     factory: () => Promise<any>,
@@ -22,11 +48,7 @@ export function lazyEager<T extends React.ComponentType<any>>(
     };
 
     if (typeof window !== "undefined") {
-        if ("requestIdleCallback" in window) {
-            (window as any).requestIdleCallback(load);
-        } else {
-            setTimeout(load, 500);
-        }
+        schedulePrefetch(load);
     }
 
     return React.lazy(load);

package/src/util/local_storage.ts

@@ -0,0 +1,52 @@
+/**
+ * `localStorage` access that never throws.
+ *
+ * Merely reading `window.localStorage` throws a SecurityError when the browser
+ * blocks site data (all cookies blocked, some sandboxed iframes), and `setItem`
+ * throws when the quota is full. Nothing the CMS keeps there is worth failing a
+ * render over, so a failed read counts as "nothing stored" and a failed write
+ * is dropped.
+ *
+ * @internal
+ */
+export function getLocalStorageItem(key: string): string | null {
+    try {
+        return typeof window !== "undefined" ? window.localStorage.getItem(key) : null;
+    } catch {
+        return null;
+    }
+}
+
+/**
+ * The stored JSON value for `key`, or `fallback` when there is none, it is not
+ * valid JSON, or storage cannot be read.
+ *
+ * @internal
+ */
+export function getLocalStorageJSON<T>(key: string, fallback: T): T {
+    const item = getLocalStorageItem(key);
+    if (!item) return fallback;
+    try {
+        return JSON.parse(item);
+    } catch {
+        return fallback;
+    }
+}
+
+/** @internal */
+export function setLocalStorageItem(key: string, value: string): void {
+    try {
+        if (typeof window !== "undefined") window.localStorage.setItem(key, value);
+    } catch {
+        // Blocked or full: the value lives only as long as the page.
+    }
+}
+
+/** @internal */
+export function removeLocalStorageItem(key: string): void {
+    try {
+        if (typeof window !== "undefined") window.localStorage.removeItem(key);
+    } catch {
+        // Blocked: nothing was stored to remove.
+    }
+}

package/src/util/navigation_utils.ts

@@ -281,7 +281,12 @@ export function resolveCollectionPathIds(path: string, allCollections: EntityCol
                 col,
                 match: col.id
             }])
-            .filter(p => p.match && remainingPath.startsWith(p.match))
+            // A match has to end where a path segment ends. Matching any prefix made
+            // "products-test" resolve to the "products" collection with an entity called
+            // "-test" (FirebaseError: Invalid document reference), and any collection whose
+            // path merely starts with another's — "products_archive", which the collection
+            // editor generates from "Products archive" — resolve to the wrong one.
+            .filter(p => p.match && (remainingPath === p.match || remainingPath.startsWith(p.match + "/")))
             .sort((a, b) => b.match.length - a.match.length);
 
         if (potentialMatches.length > 0) {

package/src/util/useStorageUploadController.tsx

@@ -1,4 +1,4 @@
-import Compressor from "compressorjs";
+import type CompressorType from "compressorjs";
 import equal from "react-fast-compare";
 
 import {
@@ -321,6 +321,11 @@ export async function resizeImage(
         mimeType = `image/${imageResize.format}`;
     }
 
+    // Loaded here rather than imported: compressing an image is something a
+    // small fraction of sessions ever does, and a static import put the library
+    // in `@firecms/core` for everyone.
+    const Compressor: typeof CompressorType = (await import("compressorjs")).default;
+
     return new Promise<File>((resolve, reject) => {
         new Compressor(file, {
             quality,