@firecms/core 3.4.0-canary.e2466ba → 3.4.0

package/dist/index.umd.js

@@ -408,6 +408,9 @@
         onClose
       });
     } else {
+      if (!fullIdPath && pathSegments?.some((segment) => segment.includes("/"))) {
+        console.warn(`navigateToEntity: no "fullIdPath" was given and "${path}" contains an entity id with a "/", so no unambiguous URL can be built for it. The link will point at a different location. Pass "fullIdPath" — the escaped chain — alongside "path".`);
+      }
       let to = navigation.buildUrlCollectionPath(entityId ? `${fullIdPath ?? path}/${encodeEntityId(entityId)}` : fullIdPath ?? path);
       if (entityId && selectedTab) {
         to += `/${selectedTab}`;
@@ -1311,7 +1314,12 @@
                 path: newPath,
                 collections: collection.subcollections,
                 currentFullPath: fullPath,
-                currentFullIdPath: fullIdPath,
+                // The entity id is a hop in the id chain exactly as it is in the
+                // other two. Without it a nested `fullIdPath` was
+                // "products/locales" rather than "products/pid/locales", so any
+                // URL built from it pointed at a collection that does not exist.
+                // Escaped, because `fullIdPath` is URL-facing.
+                currentFullIdPath: fullIdPath + "/" + encodedEntityId,
                 currentFullUrlPath: fullUrlPath,
                 currentPathSegments: entitySegments,
                 contextEntityViews: props.contextEntityViews
@@ -4887,6 +4895,129 @@
       ...e_1
     };
   }
+  function entityCacheKey(path, entityId) {
+    return `${path}/${entityId === void 0 ? entityId : encodeEntityId(entityId)}`;
+  }
+  const LOCAL_STORAGE_PREFIX = "entity_cache::";
+  const entityCache = /* @__PURE__ */ new Map();
+  const isLocalStorageAvailable = typeof localStorage !== "undefined";
+  function customReplacer(key) {
+    const value = this[key];
+    if (value instanceof Date) {
+      return {
+        __type: "Date",
+        value: value.toISOString()
+      };
+    }
+    if (value instanceof EntityReference) {
+      return {
+        __type: "EntityReference",
+        id: value.id,
+        path: value.path,
+        databaseId: value.databaseId
+      };
+    }
+    if (value instanceof GeoPoint) {
+      return {
+        __type: "GeoPoint",
+        latitude: value.latitude,
+        longitude: value.longitude
+      };
+    }
+    if (value instanceof Vector) {
+      return {
+        __type: "Vector",
+        value: value.value
+      };
+    }
+    return value;
+  }
+  function customReviver(key, value) {
+    if (value && typeof value === "object" && "__type" in value) {
+      switch (value.__type) {
+        case "Date":
+          return new Date(value.value);
+        case "EntityReference":
+          return new EntityReference(value.id, value.path, value.databaseId);
+        case "GeoPoint":
+          return new GeoPoint(value.latitude, value.longitude);
+        case "Vector":
+          return new Vector(value.value);
+        default:
+          return value;
+      }
+    }
+    return value;
+  }
+  function saveEntityToCache(path, data) {
+    if (isLocalStorageAvailable) {
+      try {
+        const key = LOCAL_STORAGE_PREFIX + path;
+        const entityString = JSON.stringify(data, customReplacer);
+        console.debug("Saving entity to localStorage:", {
+          key,
+          entityString
+        });
+        localStorage.setItem(key, entityString);
+      } catch (error) {
+        console.error(`Failed to save entity for path "${path}" to localStorage:`, error);
+      }
+    }
+  }
+  function removeEntityFromMemoryCache(path) {
+    entityCache.delete(path);
+  }
+  function saveEntityToMemoryCache(path, data) {
+    entityCache.set(path, data);
+  }
+  function getEntityFromMemoryCache(path) {
+    return entityCache.get(path);
+  }
+  function getEntityFromCache(path) {
+    if (isLocalStorageAvailable) {
+      try {
+        const key = LOCAL_STORAGE_PREFIX + path;
+        const entityString = localStorage.getItem(key);
+        if (entityString) {
+          const entity = JSON.parse(entityString, customReviver);
+          return entity;
+        }
+      } catch (error) {
+        console.error(`Failed to load entity for path "${path}" from localStorage:`, error);
+      }
+    }
+    return void 0;
+  }
+  function removeEntityFromCache(path) {
+    if (isLocalStorageAvailable) {
+      try {
+        const key = LOCAL_STORAGE_PREFIX + path;
+        localStorage.removeItem(key);
+      } catch (error) {
+        console.error(`Failed to remove entity for path "${path}" from localStorage:`, error);
+      }
+    }
+  }
+  function flattenKeys(obj, prefix = "", result = []) {
+    if (isObject(obj) || Array.isArray(obj)) {
+      const plainObject = isPlainObject(obj);
+      if (!plainObject && prefix) {
+        result.push(prefix);
+      } else {
+        for (const key in obj) {
+          if (Object.prototype.hasOwnProperty.call(obj, key)) {
+            const newKey = prefix ? Array.isArray(obj) ? `${prefix}[${key}]` : `${prefix}.${key}` : key;
+            if (isObject(obj[key]) || Array.isArray(obj[key])) {
+              flattenKeys(obj[key], newKey, result);
+            } else {
+              result.push(newKey);
+            }
+          }
+        }
+      }
+    }
+    return result;
+  }
   const CACHE = {};
   function useEntityFetch(t0) {
     const $ = reactCompilerRuntime.c(23);
@@ -4951,7 +5082,7 @@
               console.error(e);
             }
           }
-          CACHE[`${path}/${entityId}`] = updatedEntity;
+          CACHE[entityCacheKey(path, entityId)] = updatedEntity;
           setEntity(updatedEntity);
           setDataLoading(false);
           setDataLoadingError(void 0);
@@ -4962,8 +5093,8 @@
           setEntity(void 0);
           setDataLoadingError(error);
         };
-        if (entityId && useCache && CACHE[`${path}/${entityId}`]) {
-          setEntity(CACHE[`${path}/${entityId}`]);
+        if (entityId && useCache && CACHE[entityCacheKey(path, entityId)]) {
+          setEntity(CACHE[entityCacheKey(path, entityId)]);
           setDataLoading(false);
           setDataLoadingError(void 0);
           return _temp$C;
@@ -6875,7 +7006,7 @@
     return t4;
   }
   function ReferencePreviewExisting(t0) {
-    const $ = reactCompilerRuntime.c(36);
+    const $ = reactCompilerRuntime.c(37);
     const {
       reference,
       collection,
@@ -6909,37 +7040,38 @@
       dataLoading
     } = useEntityFetch(t1);
     if (entity) {
-      referencesCache.set(reference.pathWithId, entity);
+      referencesCache.set(entityCacheKey(reference.path, reference.id), entity);
     }
     let t2;
-    if ($[5] !== entity || $[6] !== reference.pathWithId) {
-      t2 = entity ?? referencesCache.get(reference.pathWithId);
+    if ($[5] !== entity || $[6] !== reference.id || $[7] !== reference.path) {
+      t2 = entity ?? referencesCache.get(entityCacheKey(reference.path, reference.id));
       $[5] = entity;
-      $[6] = reference.pathWithId;
-      $[7] = t2;
+      $[6] = reference.id;
+      $[7] = reference.path;
+      $[8] = t2;
     } else {
-      t2 = $[7];
+      t2 = $[8];
     }
     const usedEntity = t2;
     let body;
     if (!reference) {
       let t32;
-      if ($[8] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+      if ($[9] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
         t32 = /* @__PURE__ */ jsxRuntime.jsx(ErrorView, { error: "Reference not set" });
-        $[8] = t32;
+        $[9] = t32;
       } else {
-        t32 = $[8];
+        t32 = $[9];
       }
       body = t32;
     } else {
       if (usedEntity && !usedEntity.values) {
         let t32;
-        if ($[9] !== reference.path) {
+        if ($[10] !== reference.path) {
           t32 = /* @__PURE__ */ jsxRuntime.jsx(ErrorView, { error: "Reference does not exist", tooltip: reference.path });
-          $[9] = reference.path;
-          $[10] = t32;
+          $[10] = reference.path;
+          $[11] = t32;
         } else {
-          t32 = $[10];
+          t32 = $[11];
         }
         body = t32;
       }
@@ -6948,15 +7080,15 @@
       const t32 = disabled ? void 0 : onClick;
       const t4 = disabled ? void 0 : hover;
       let t5;
-      if ($[11] !== body || $[12] !== size || $[13] !== t32 || $[14] !== t4) {
+      if ($[12] !== body || $[13] !== size || $[14] !== t32 || $[15] !== t4) {
         t5 = /* @__PURE__ */ jsxRuntime.jsx(EntityPreviewContainer, { onClick: t32, hover: t4, size, children: body });
-        $[11] = body;
-        $[12] = size;
-        $[13] = t32;
-        $[14] = t4;
-        $[15] = t5;
+        $[12] = body;
+        $[13] = size;
+        $[14] = t32;
+        $[15] = t4;
+        $[16] = t5;
       } else {
-        t5 = $[15];
+        t5 = $[16];
       }
       return t5;
     }
@@ -6964,21 +7096,21 @@
       const t32 = disabled ? void 0 : onClick;
       const t4 = disabled ? void 0 : hover;
       let t5;
-      if ($[16] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+      if ($[17] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
         t5 = /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, {});
-        $[16] = t5;
+        $[17] = t5;
       } else {
-        t5 = $[16];
+        t5 = $[17];
       }
       let t6;
-      if ($[17] !== size || $[18] !== t32 || $[19] !== t4) {
+      if ($[18] !== size || $[19] !== t32 || $[20] !== t4) {
         t6 = /* @__PURE__ */ jsxRuntime.jsx(EntityPreviewContainer, { onClick: t32, hover: t4, size, children: t5 });
-        $[17] = size;
-        $[18] = t32;
-        $[19] = t4;
-        $[20] = t6;
+        $[18] = size;
+        $[19] = t32;
+        $[20] = t4;
+        $[21] = t6;
       } else {
-        t6 = $[20];
+        t6 = $[21];
       }
       return t6;
     }
@@ -6986,39 +7118,39 @@
       const t32 = disabled ? void 0 : onClick;
       const t4 = disabled ? void 0 : hover;
       let t5;
-      if ($[21] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+      if ($[22] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
         t5 = /* @__PURE__ */ jsxRuntime.jsx(ErrorView, { error: "Entity not found" });
-        $[21] = t5;
+        $[22] = t5;
       } else {
-        t5 = $[21];
+        t5 = $[22];
       }
       let t6;
-      if ($[22] !== size || $[23] !== t32 || $[24] !== t4) {
+      if ($[23] !== size || $[24] !== t32 || $[25] !== t4) {
         t6 = /* @__PURE__ */ jsxRuntime.jsx(EntityPreviewContainer, { onClick: t32, hover: t4, size, children: t5 });
-        $[22] = size;
-        $[23] = t32;
-        $[24] = t4;
-        $[25] = t6;
+        $[23] = size;
+        $[24] = t32;
+        $[25] = t4;
+        $[26] = t6;
       } else {
-        t6 = $[25];
+        t6 = $[26];
       }
       return t6;
     }
     let t3;
-    if ($[26] !== collection || $[27] !== disabled || $[28] !== hover || $[29] !== includeEntityLink || $[30] !== includeId || $[31] !== onClick || $[32] !== previewProperties || $[33] !== size || $[34] !== usedEntity) {
+    if ($[27] !== collection || $[28] !== disabled || $[29] !== hover || $[30] !== includeEntityLink || $[31] !== includeId || $[32] !== onClick || $[33] !== previewProperties || $[34] !== size || $[35] !== usedEntity) {
       t3 = /* @__PURE__ */ jsxRuntime.jsx(EntityPreview, { size, previewKeys: previewProperties, disabled, entity: usedEntity, collection, onClick, includeEntityLink, includeId, hover });
-      $[26] = collection;
-      $[27] = disabled;
-      $[28] = hover;
-      $[29] = includeEntityLink;
-      $[30] = includeId;
-      $[31] = onClick;
-      $[32] = previewProperties;
-      $[33] = size;
-      $[34] = usedEntity;
-      $[35] = t3;
+      $[27] = collection;
+      $[28] = disabled;
+      $[29] = hover;
+      $[30] = includeEntityLink;
+      $[31] = includeId;
+      $[32] = onClick;
+      $[33] = previewProperties;
+      $[34] = size;
+      $[35] = usedEntity;
+      $[36] = t3;
     } else {
-      t3 = $[35];
+      t3 = $[36];
     }
     return t3;
   }
@@ -9181,13 +9313,12 @@
     constructor(props) {
       super(props);
       this.state = {
-        hasError: false
+        error: null
       };
     }
     // eslint-disable-next-line n/handle-callback-err
     static getDerivedStateFromError(error) {
       return {
-        hasError: true,
         error
       };
     }
@@ -9195,20 +9326,23 @@
       console.error(error);
     }
     render() {
-      if (this.state.hasError) {
-        return /* @__PURE__ */ jsxRuntime.jsx(FallbackView, { message: this.state.error?.message });
+      if (this.state.error) {
+        return /* @__PURE__ */ jsxRuntime.jsx(FallbackView, { message: this.state.error.message });
       }
       return this.props.children;
     }
   }
   function FallbackView(t0) {
-    const $ = reactCompilerRuntime.c(12);
+    const $ = reactCompilerRuntime.c(13);
+    const {
+      message
+    } = t0;
     const {
       t
     } = useTranslation();
     let t1;
     if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
-      t1 = /* @__PURE__ */ jsxRuntime.jsx(ui.ErrorIcon, {});
+      t1 = /* @__PURE__ */ jsxRuntime.jsx(ui.ErrorIcon, { color: "error", size: "small" });
       $[0] = t1;
     } else {
       t1 = $[0];
@@ -9223,7 +9357,7 @@
     }
     let t3;
     if ($[3] !== t2) {
-      t3 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center mb-4 text-red-500 dark:text-red-400", children: [
+      t3 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center m-2", children: [
         t1,
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ml-4", children: t2 })
       ] });
@@ -9233,32 +9367,33 @@
       t3 = $[4];
     }
     let t4;
-    if ($[5] !== t) {
-      t4 = t("see_console_details");
-      $[5] = t;
-      $[6] = t4;
+    if ($[5] !== message || $[6] !== t) {
+      t4 = message ?? t("see_console_details");
+      $[5] = message;
+      $[6] = t;
+      $[7] = t4;
     } else {
-      t4 = $[6];
+      t4 = $[7];
     }
     let t5;
-    if ($[7] !== t4) {
-      t5 = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center text-gray-500 dark:text-gray-400", children: t4 });
-      $[7] = t4;
-      $[8] = t5;
+    if ($[8] !== t4) {
+      t5 = /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "caption", children: t4 });
+      $[8] = t4;
+      $[9] = t5;
     } else {
-      t5 = $[8];
+      t5 = $[9];
     }
     let t6;
-    if ($[9] !== t3 || $[10] !== t5) {
-      t6 = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full w-full bg-slate-100 dark:bg-surface-900 flex items-center justify-center p-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center m-4 bg-white dark:bg-surface-800 p-8 rounded-lg shadow-sm border border-gray-200 dark:border-surface-700", children: [
+    if ($[10] !== t3 || $[11] !== t5) {
+      t6 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col m-2", children: [
         t3,
         t5
-      ] }) });
-      $[9] = t3;
-      $[10] = t5;
-      $[11] = t6;
+      ] });
+      $[10] = t3;
+      $[11] = t5;
+      $[12] = t6;
     } else {
-      t6 = $[11];
+      t6 = $[12];
     }
     return t6;
   }
@@ -11315,126 +11450,6 @@
   function areEqual(prevProps, nextProps) {
     return prevProps.height === nextProps.height && prevProps.propertyKey === nextProps.propertyKey && prevProps.align === nextProps.align && prevProps.width === nextProps.width && equal(prevProps.property, nextProps.property) && equal(prevProps.value, nextProps.value) && equal(prevProps.entity.id, nextProps.entity.id) && equal(prevProps.entity.values, nextProps.entity.values) && prevProps.isDragging === nextProps.isDragging && prevProps.isDraggable === nextProps.isDraggable && prevProps.frozen === nextProps.frozen;
   }
-  const LOCAL_STORAGE_PREFIX = "entity_cache::";
-  const entityCache = /* @__PURE__ */ new Map();
-  const isLocalStorageAvailable = typeof localStorage !== "undefined";
-  function customReplacer(key) {
-    const value = this[key];
-    if (value instanceof Date) {
-      return {
-        __type: "Date",
-        value: value.toISOString()
-      };
-    }
-    if (value instanceof EntityReference) {
-      return {
-        __type: "EntityReference",
-        id: value.id,
-        path: value.path,
-        databaseId: value.databaseId
-      };
-    }
-    if (value instanceof GeoPoint) {
-      return {
-        __type: "GeoPoint",
-        latitude: value.latitude,
-        longitude: value.longitude
-      };
-    }
-    if (value instanceof Vector) {
-      return {
-        __type: "Vector",
-        value: value.value
-      };
-    }
-    return value;
-  }
-  function customReviver(key, value) {
-    if (value && typeof value === "object" && "__type" in value) {
-      switch (value.__type) {
-        case "Date":
-          return new Date(value.value);
-        case "EntityReference":
-          return new EntityReference(value.id, value.path, value.databaseId);
-        case "GeoPoint":
-          return new GeoPoint(value.latitude, value.longitude);
-        case "Vector":
-          return new Vector(value.value);
-        default:
-          return value;
-      }
-    }
-    return value;
-  }
-  function saveEntityToCache(path, data) {
-    if (isLocalStorageAvailable) {
-      try {
-        const key = LOCAL_STORAGE_PREFIX + path;
-        const entityString = JSON.stringify(data, customReplacer);
-        console.debug("Saving entity to localStorage:", {
-          key,
-          entityString
-        });
-        localStorage.setItem(key, entityString);
-      } catch (error) {
-        console.error(`Failed to save entity for path "${path}" to localStorage:`, error);
-      }
-    }
-  }
-  function removeEntityFromMemoryCache(path) {
-    entityCache.delete(path);
-  }
-  function saveEntityToMemoryCache(path, data) {
-    entityCache.set(path, data);
-  }
-  function getEntityFromMemoryCache(path) {
-    return entityCache.get(path);
-  }
-  function getEntityFromCache(path) {
-    if (isLocalStorageAvailable) {
-      try {
-        const key = LOCAL_STORAGE_PREFIX + path;
-        const entityString = localStorage.getItem(key);
-        if (entityString) {
-          const entity = JSON.parse(entityString, customReviver);
-          return entity;
-        }
-      } catch (error) {
-        console.error(`Failed to load entity for path "${path}" from localStorage:`, error);
-      }
-    }
-    return void 0;
-  }
-  function removeEntityFromCache(path) {
-    if (isLocalStorageAvailable) {
-      try {
-        const key = LOCAL_STORAGE_PREFIX + path;
-        localStorage.removeItem(key);
-      } catch (error) {
-        console.error(`Failed to remove entity for path "${path}" from localStorage:`, error);
-      }
-    }
-  }
-  function flattenKeys(obj, prefix = "", result = []) {
-    if (isObject(obj) || Array.isArray(obj)) {
-      const plainObject = isPlainObject(obj);
-      if (!plainObject && prefix) {
-        result.push(prefix);
-      } else {
-        for (const key in obj) {
-          if (Object.prototype.hasOwnProperty.call(obj, key)) {
-            const newKey = prefix ? Array.isArray(obj) ? `${prefix}[${key}]` : `${prefix}.${key}` : key;
-            if (isObject(obj[key]) || Array.isArray(obj[key])) {
-              flattenKeys(obj[key], newKey, result);
-            } else {
-              result.push(newKey);
-            }
-          }
-        }
-      }
-    }
-    return result;
-  }
   function FieldHelperText(t0) {
     const $ = reactCompilerRuntime.c(10);
     const {
@@ -16957,7 +16972,7 @@
     const [savingError, setSavingError] = React.useState();
     const autoSave = collection.formAutoSave && !collection.customId;
     const baseInitialValues = React.useMemo(() => getInitialEntityValues(authController, collection, path, status, entity, customizationController.propertyConfigs), [authController, collection, path, status, entity, customizationController.propertyConfigs]);
-    const localChangesDataRaw = React.useMemo(() => entityId ? getEntityFromCache(path + "/" + entityId) : getEntityFromCache(path + "#new"), [entityId, path]);
+    const localChangesDataRaw = React.useMemo(() => entityId ? getEntityFromCache(entityCacheKey(path, entityId)) : getEntityFromCache(path + "#new"), [entityId, path]);
     const [localChangesCleared, setLocalChangesCleared] = React.useState(false);
     const localChangesBackup = getLocalChangesBackup(collection);
     const autoApplyLocalChanges = localChangesBackup === "auto_apply";
@@ -17019,7 +17034,7 @@
         onValuesModified?.(false, initialValues_0);
       },
       onValuesChangeDeferred: (values_0, controller) => {
-        const key = status === "new" || status === "copy" ? path + "#new" : path + "/" + entityId;
+        const key = status === "new" || status === "copy" ? path + "#new" : entityCacheKey(path, entityId);
         if (controller.dirty && localChangesBackup !== false) {
           const touchedValues = removeEmptyContainers(extractTouchedValues(values_0, controller.touched));
           if (touchedValues && Object.keys(touchedValues).length > 0) {
@@ -17084,8 +17099,8 @@
         removeEntityFromMemoryCache(path + "#new");
         removeEntityFromCache(path + "#new");
       } else {
-        removeEntityFromMemoryCache(path + "/" + entityId);
-        removeEntityFromCache(path + "/" + entityId);
+        removeEntityFromMemoryCache(entityCacheKey(path, entityId));
+        removeEntityFromCache(entityCacheKey(path, entityId));
       }
     }
     const onSaveSuccess = (updatedEntity) => {
@@ -17376,7 +17391,7 @@
     }), noValidate: true, className: ui.cls("flex-1 flex flex-row w-full overflow-y-auto justify-center", className), children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { id: `form_${path}`, className: ui.cls("relative flex flex-row max-w-4xl lg:max-w-3xl xl:max-w-4xl 2xl:max-w-6xl w-full h-fit"), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cls("flex flex-col w-full pt-12 pb-16 px-4 sm:px-8 md:px-10"), children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row gap-4 self-end sticky top-4 z-10", children: [
-          manualApplyLocalChanges && hasLocalChanges && /* @__PURE__ */ jsxRuntime.jsx(LocalChangesMenu, { cacheKey: status === "new" || status === "copy" ? path + "#new" : path + "/" + entityId, properties: resolvedCollection.properties, cachedData: localChangesDataRaw, formex: formex$1, onClearLocalChanges: () => setLocalChangesCleared(true) }),
+          manualApplyLocalChanges && hasLocalChanges && /* @__PURE__ */ jsxRuntime.jsx(LocalChangesMenu, { cacheKey: status === "new" || status === "copy" ? path + "#new" : entityCacheKey(path, entityId), properties: resolvedCollection.properties, cachedData: localChangesDataRaw, formex: formex$1, onClearLocalChanges: () => setLocalChangesCleared(true) }),
           formex$1.dirty ? /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { title: "This form has been modified", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Chip, { size: "small", className: "py-1", colorScheme: "orangeDarker", children: /* @__PURE__ */ jsxRuntime.jsx(ui.EditIcon, { size: "smallest" }) }) }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { title: "The current form is in sync with the database", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Chip, { size: "small", className: "py-1", children: /* @__PURE__ */ jsxRuntime.jsx(ui.CheckIcon, { size: "smallest" }) }) })
         ] }),
         formView
@@ -17467,7 +17482,7 @@
     const collapsedActions = actions.filter((a_0) => a_0.collapsed || a_0.collapsed === void 0);
     const uncollapsedActions = actions.filter((a_1) => a_1.collapsed === false);
     const enableLocalChangesBackup = collection ? getLocalChangesBackup(collection) : false;
-    const cachedData = enableLocalChangesBackup ? getEntityFromCache(fullPath + "/" + entity.id) : void 0;
+    const cachedData = enableLocalChangesBackup ? getEntityFromCache(entityCacheKey(fullPath, entity.id)) : void 0;
     const hasDraft = (() => {
       if (!cachedData || typeof cachedData !== "object" || Object.keys(cachedData).length === 0) return false;
       const realChanges = getChanges(cachedData, entity?.values ?? {});
@@ -20296,10 +20311,10 @@
     const [sortBy_0, setSortBy] = React.useState((updateUrl ? initialSortUrl : void 0) ?? initialSortInternal);
     const [searchString, setSearchString] = React.useState(updateUrl ? initialSearchUrl : void 0);
     useUpdateUrl(filterValues_0, sortBy_0, searchString, updateUrl);
-    const collectionScroll = scrollRestoration?.getCollectionScroll(fullPath, filterValues_0);
-    const initialItemCount = collectionScroll?.data.length ?? pageSize;
+    const collectionScroll = scrollRestoration?.getCollectionScroll(resolvedPath, filterValues_0);
+    const initialItemCount = collectionScroll?.data.length || pageSize;
     React.useEffect(() => {
-      if (scrollRestoration) {
+      if (scrollRestoration && rawData.length > 0) {
         scrollRestoration.updateCollectionScroll({
           fullPath: resolvedPath,
           scrollOffset: collectionScroll?.scrollOffset ?? 0,
@@ -20843,6 +20858,7 @@
       context,
       fullPath,
       pathSegments,
+      fullIdPath,
       highlightEntity,
       unhighlightEntity,
       openEntityMode
@@ -20857,14 +20873,14 @@
       });
       const path = collection?.collectionGroup ? collection.path : fullPath ?? collection?.path ?? entity.path;
       const resolvedPathSegments = collection?.collectionGroup ? void 0 : pathSegments ?? entity.pathSegments;
-      const fullIdPath = collection?.collectionGroup ? collection.id : fullPath ?? collection?.id ?? entity.path;
+      const newFullIdPath = collection?.collectionGroup ? collection.id : fullIdPath ?? collection?.id;
       navigateToEntity({
         openEntityMode,
         collection,
         entityId: entity.id,
         path,
         pathSegments: resolvedPathSegments,
-        fullIdPath,
+        fullIdPath: newFullIdPath,
         copy: true,
         sideEntityController: context.sideEntityController,
         onClose: () => unhighlightEntity?.(entity),
@@ -26732,7 +26748,7 @@
         }) => {
           const collectionsWithPath = navigation.getParentReferencesFromPath(entity_4.path, entity_4.pathSegments);
           return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2 w-full", children: collectionsWithPath.map((reference) => {
-            return /* @__PURE__ */ jsxRuntime.jsx(ReferencePreview, { reference, size: "small" }, reference.path + "/" + reference.id);
+            return /* @__PURE__ */ jsxRuntime.jsx(ReferencePreview, { reference, size: "small" }, entityCacheKey(reference.path, reference.id));
           }) });
         }
       }] : [];
@@ -29877,7 +29893,7 @@
     }) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { className: "self-center", size: "smallest", onClick: onClose, children: /* @__PURE__ */ jsxRuntime.jsx(ui.CloseIcon, { size: "smallest" }) }),
       allowFullScreen && /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { className: "self-center", size: "smallest", onClick: () => {
-        const key = status === "new" || status === "copy" ? path + "#new" : path + "/" + entityId;
+        const key = status === "new" || status === "copy" ? path + "#new" : entityCacheKey(path, entityId);
         saveEntityToMemoryCache(key, values);
         if (entityId) navigate(location.pathname + location.search);
         else navigate(location.pathname + location.search + "#new");
@@ -30385,7 +30401,7 @@
       databaseId: props.databaseId,
       useCache: false
     });
-    const initialDirtyValues = entityId ? getEntityFromMemoryCache(props.path + "/" + entityId) : getEntityFromMemoryCache(props.path + "#new");
+    const initialDirtyValues = entityId ? getEntityFromMemoryCache(entityCacheKey(props.path, entityId)) : getEntityFromMemoryCache(props.path + "#new");
     const authController = useAuthController();
     const initialStatus = props.copy ? "copy" : entityId ? "existing" : "new";
     const [status, setStatus] = React.useState(initialStatus);
@@ -30836,19 +30852,21 @@
     return sidePanel ? [sidePanel] : [];
   }
   const propsToSidePanel = (props, buildUrlCollectionPath, resolveIdsFrom, smallLayout, customizationController, authController, locationSearch) => {
-    const collectionPath = removeInitialAndTrailingSlashes(props.path);
-    const urlPath = props.entityId ? buildUrlCollectionPath(`${collectionPath}/${encodeEntityId(props.entityId)}${props.selectedTab ? "/" + props.selectedTab : ""}${locationSearch}#${SIDE_URL_HASH}`) : buildUrlCollectionPath(`${collectionPath}${locationSearch}#${NEW_URL_HASH}`);
+    const urlChain = removeInitialAndTrailingSlashes(props.fullIdPath ?? props.path);
+    const urlPath = props.entityId ? buildUrlCollectionPath(`${urlChain}/${encodeEntityId(props.entityId)}${props.selectedTab ? "/" + props.selectedTab : ""}${locationSearch}#${SIDE_URL_HASH}`) : buildUrlCollectionPath(`${urlChain}${locationSearch}#${NEW_URL_HASH}`);
     const resolvedPanelProps = {
       ...props,
       formProps: props.formProps
     };
     const entityViewWidth = getEntityViewWidth(props, smallLayout, customizationController, authController);
     return {
-      key: `${props.path}/${props.entityId}`,
+      // Built from the escaped chain so that two different chains which happen to flatten
+      // to the same raw string are still two different panels.
+      key: `${urlChain}/${props.entityId ? encodeEntityId(props.entityId) : ""}`,
       component: void 0,
       // Lazy render in SideDialogs for better performance
       urlPath,
-      parentUrlPath: buildUrlCollectionPath(collectionPath),
+      parentUrlPath: buildUrlCollectionPath(urlChain),
       width: entityViewWidth,
       onClose: props.onClose,
       additional: resolvedPanelProps
@@ -39213,12 +39231,27 @@
     translations,
     children
   }) {
+    const parentI18n = React.useContext(reactI18next.I18nContext)?.i18n;
+    const parentInstance = parentI18n?.hasResourceBundle?.("en", FIRECMS_NS) ? parentI18n : void 0;
     const i18nRef = React.useRef(null);
     const [ready, setReady] = React.useState(false);
     if (!i18nRef.current) {
       const instance = i18next.createInstance();
       const resources = buildResources(translations);
-      let initialLocale = locale;
+      if (parentInstance) {
+        const inherited = parentInstance.services?.resourceStore?.data ?? {};
+        for (const [lang, namespaces] of Object.entries(inherited)) {
+          const bundle = namespaces?.[FIRECMS_NS];
+          if (!bundle) continue;
+          resources[lang] = {
+            [FIRECMS_NS]: {
+              ...bundle,
+              ...translations?.[lang] ?? {}
+            }
+          };
+        }
+      }
+      let initialLocale = parentInstance?.language ?? locale;
       if (typeof window !== "undefined") {
         const stored = localStorage.getItem(FIRECMS_LOCALE_STORAGE_KEY);
         if (stored) initialLocale = stored;
@@ -39243,6 +39276,17 @@
       });
       i18nRef.current = instance;
     }
+    React.useEffect(() => {
+      if (!parentInstance || !i18nRef.current) return;
+      const instance_0 = i18nRef.current;
+      const follow = (lng_0) => {
+        if (instance_0.language !== lng_0) instance_0.changeLanguage(lng_0);
+      };
+      parentInstance.on("languageChanged", follow);
+      return () => {
+        parentInstance.off("languageChanged", follow);
+      };
+    }, [parentInstance]);
     React.useEffect(() => {
       if (i18nRef.current && i18nRef.current.language !== locale) {
         const hasUserPreference = typeof window !== "undefined" && Boolean(localStorage.getItem(FIRECMS_LOCALE_STORAGE_KEY));
@@ -39254,11 +39298,11 @@
     React.useEffect(() => {
       if (!i18nRef.current) return;
       const resources_0 = buildResources(translations);
-      for (const [lang, bundle] of Object.entries(resources_0)) {
+      for (const [lang_0, bundle_0] of Object.entries(resources_0)) {
         i18nRef.current.addResourceBundle(
-          lang,
+          lang_0,
           FIRECMS_NS,
-          bundle[FIRECMS_NS],
+          bundle_0[FIRECMS_NS],
           true,
           // deep merge
           true