@firecms/core 3.0.0-beta.12 → 3.0.0-beta.13

package/src/preview/property_previews/ArrayOfStringsPreview.tsx

@@ -3,7 +3,7 @@ import { ResolvedStringProperty } from "../../types";
 
 import { resolveArrayProperty } from "../../util";
 import { PropertyPreviewProps, StringPropertyPreview } from "../../preview";
-import { useCustomizationController } from "../../hooks";
+import { useAuthController, useCustomizationController } from "../../hooks";
 import { ErrorBoundary } from "../../components";
 
 /**
@@ -16,12 +16,13 @@ export function ArrayOfStringsPreview({
                                           // entity,
                                           size
                                       }: PropertyPreviewProps<string[]>) {
-
+    const authController = useAuthController();
     const customizationController = useCustomizationController();
     const property = resolveArrayProperty({
         propertyKey,
         property: inputProperty,
-        propertyConfigs: customizationController.propertyConfigs
+        propertyConfigs: customizationController.propertyConfigs,
+        authController
     });
 
     if (Array.isArray(property.of)) {

package/src/preview/property_previews/ArrayOneOfPreview.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import { resolveArrayProperty } from "../../util";
 import { ResolvedProperty } from "../../types";
-import { useCustomizationController } from "../../hooks";
+import { useAuthController, useCustomizationController } from "../../hooks";
 import { PreviewSize, PropertyPreviewProps } from "../PropertyPreviewProps";
 import { PropertyPreview } from "../PropertyPreview";
 import { cls, defaultBorderMixin } from "@firecms/ui";
@@ -19,11 +19,13 @@ export function ArrayOneOfPreview({
                                       // entity
                                   }: PropertyPreviewProps<any[]>) {
 
+    const authController = useAuthController();
     const customizationController = useCustomizationController();
     const property = resolveArrayProperty({
         propertyKey,
         property: inputProperty,
-        propertyConfigs: customizationController.propertyConfigs
+        propertyConfigs: customizationController.propertyConfigs,
+        authController
     });
 
     if (property?.dataType !== "array")

package/src/preview/property_previews/ArrayPropertyPreview.tsx

@@ -2,7 +2,7 @@ import React from "react";
 
 import { resolveArrayProperty } from "../../util";
 import { ResolvedProperty } from "../../types";
-import { useCustomizationController } from "../../hooks";
+import { useAuthController, useCustomizationController } from "../../hooks";
 import { PreviewSize, PropertyPreviewProps } from "../PropertyPreviewProps";
 import { PropertyPreview } from "../PropertyPreview";
 import { cls, defaultBorderMixin } from "@firecms/ui";
@@ -19,11 +19,13 @@ export function ArrayPropertyPreview({
                                          size
                                      }: PropertyPreviewProps<any[]>) {
 
+    const authController = useAuthController();
     const customizationController = useCustomizationController();
     const property = resolveArrayProperty({
         propertyKey,
         property: inputProperty,
-        propertyConfigs: customizationController.propertyConfigs
+        propertyConfigs: customizationController.propertyConfigs,
+        authController
     });
 
     if (!property.of) {

package/src/routes/FireCMSRoute.tsx

@@ -13,6 +13,7 @@ import { useBreadcrumbsController } from "../hooks/useBreadcrumbsController";
 import { toArray } from "../util/arrays";
 import { EntityCollectionView, NotFoundPage } from "../components";
 import { UnsavedChangesDialog } from "../components/UnsavedChangesDialog";
+import { EntityCollection } from "../types";
 
 export function FireCMSRoute() {
 
@@ -68,7 +69,10 @@ export function FireCMSRoute() {
     }
 
     if (navigationEntries.length === 1 && navigationEntries[0].type === "collection") {
-        const collection = navigation.getCollection(navigationEntries[0].path);
+        let collection: EntityCollection<any> | undefined;
+        collection = navigation.getCollectionById(navigationEntries[0].id);
+        if (!collection)
+            collection = navigation.getCollection(navigationEntries[0].path);
         if (!collection)
             return null;
         return <EntityCollectionView
@@ -84,11 +88,16 @@ export function FireCMSRoute() {
     if (isSidePanel) {
         const lastCollectionEntry = navigationEntries.findLast((entry) => entry.type === "collection");
         if (lastCollectionEntry) {
-            const collection = navigation.getCollection(lastCollectionEntry.path);
+            let collection: EntityCollection<any> | undefined;
+            const firstEntry = navigationEntries[0] as NavigationViewCollectionInternal<any>;
+            collection = navigation.getCollectionById(firstEntry.id);
+            if (!collection)
+                collection = navigation.getCollection(firstEntry.path);
             if (!collection)
                 return null;
             return <EntityCollectionView
                 key={`collection_view_${collection.id ?? collection.path}`}
+                fullIdPath={collection.id}
                 isSubCollection={false}
                 parentCollectionIds={[]}
                 fullPath={collection.id}
@@ -175,7 +184,7 @@ function EntityFullScreenRoute({
             return blocked.current;
         });
     } catch (e) {
-        console.warn("Blocker not available, navigation will not be blocked");
+        // console.warn("Blocker not available, navigation will not be blocked");
     }
 
     const lastCollectionEntry = navigationEntries.findLast((entry) => entry.type === "collection");
@@ -189,12 +198,14 @@ function EntityFullScreenRoute({
     }
 
     const collection = isNew ? lastCollectionEntry!.collection : lastEntityEntry!.parentCollection;
-    const collectionPath = navigation.resolveIdsFrom(isNew ? lastCollectionEntry!.path : lastEntityEntry!.path);
+    const fullIdPath = isNew ? lastCollectionEntry!.path : lastEntityEntry!.path;
+    const collectionPath = navigation.resolveIdsFrom(fullIdPath);
 
     return <>
         <EntityEditView
             key={collection.id + "_" + (isNew ? "new" : (isCopy ? entityId + "_copy" : entityId))}
             entityId={isNew ? undefined : entityId}
+            fullIdPath={fullIdPath}
             collection={collection}
             layout={"full_screen"}
             path={collectionPath}

package/src/types/collections.ts

@@ -215,6 +215,7 @@ export interface EntityCollection<M extends Record<string, any> = any, USER exte
      * Force a filter in this view. If applied, the rest of the filters will
      * be disabled. Filters applied with this prop cannot be changed.
      * e.g. `forceFilter: { age: [">=", 18] }`
+     * e.g. `forceFilter: { related_user: ["==", new EntityReference("sdc43dsw2", "users")] }`
      */
     forceFilter?: FilterValues<Extract<keyof M, string>>;
 
@@ -222,6 +223,7 @@ export interface EntityCollection<M extends Record<string, any> = any, USER exte
      * Initial filters applied to the collection this collection is related to.
      * Defaults to none. Filters applied with this prop can be changed.
      * e.g. `initialFilter: { age: [">=", 18] }`
+     * e.g. `initialFilter: { related_user: ["==", new EntityReference("sdc43dsw2", "users")] }`
      */
     initialFilter?: FilterValues<Extract<keyof M, string>>; // setting FilterValues<M> can break defining collections by code
 
@@ -330,6 +332,11 @@ export interface EntityCollection<M extends Record<string, any> = any, USER exte
      * Defaults to false.
      */
     alwaysApplyDefaultValues?: boolean;
+
+    /**
+     * If set to true, a tab including the JSON representation of the entity will be included.
+     */
+    includeJsonView?: boolean;
 }
 
 /**

package/src/types/fields.tsx

@@ -171,9 +171,13 @@ export interface FormContext<M extends Record<string, any> = any> {
     openEntityMode: "side_panel" | "full_screen";
 
     /**
-     * This is the underlying formex controller that powers the form
+     * This is the underlying formex controller that powers the form.
+     * If you are in a red only mode, the formex controller is there, but you can't
+     * operate with it
      */
     formex: FormexController<M>;
+
+    disabled: boolean;
 }
 
 /**

package/src/types/firecms.tsx

@@ -47,7 +47,7 @@ export type CMSViewsBuilder = (params: {
 /**
  * @group Models
  */
-export type FireCMSProps<USER extends User, EC extends EntityCollection> = {
+export type FireCMSProps<USER extends User> = {
 
     /**
      * Use this function to return the components you want to render under

package/src/types/navigation.ts

@@ -59,6 +59,11 @@ export type NavigationController<EC extends EntityCollection = EntityCollection<
      */
     getCollection: (pathOrId: string, includeUserOverride?: boolean) => EC | undefined;
 
+    /**
+     * Get the top level collection configuration for a given id
+     */
+    getCollectionById: (id: string) => EC | undefined;
+
     /**
      * Get the collection configuration from its parent ids.
      */

package/src/types/plugins.tsx

@@ -192,6 +192,7 @@ export interface PluginFormActionProps<USER extends User = User, EC extends Enti
     path: string;
     status: EntityStatus;
     collection: EC;
+    disabled: boolean;
     formContext?: FormContext<any>;
     context: FireCMSContext<USER>;
     currentEntityId?: string;

package/src/types/properties.ts

@@ -5,6 +5,7 @@ import { EntityReference, EntityValues, GeoPoint, Vector } from "./entities";
 import { ResolvedArrayProperty, ResolvedStringProperty } from "./resolved_entities";
 import { FilterValues } from "./collections";
 import { ChipColorKey, ChipColorScheme } from "@firecms/ui";
+import { AuthController } from "./auth";
 
 /**
  * @group Entity properties
@@ -270,6 +271,11 @@ export type PropertyBuilderProps<M extends Record<string, any> = any> =
          * Entity ID
          */
         entityId?: string;
+
+        /**
+         * Controller to manage authentication
+         */
+        authController: AuthController;
     };
 
 /**
@@ -285,7 +291,8 @@ export type PropertyBuilder<T extends CMSType = any, M extends Record<string, an
          propertyValue,
          index,
          path,
-         entityId
+         entityId,
+         authController
      }: PropertyBuilderProps<M>) => Property<T> | null;
 
 /**
@@ -481,6 +488,18 @@ export interface ArrayProperty<T extends ArrayT[] = any[], ArrayT extends CMSTyp
      */
     minimalistView?: boolean;
 
+    /**
+     * Can the elements in this array be reordered. Defaults to `true`.
+     * This prop has no effect if `disabled` is set to true.
+     */
+    sortable?: boolean;
+
+    /**
+     * Can the elements in this array be added. Defaults to `true`
+     * This prop has no effect if `disabled` is set to true.
+     */
+    canAddElements?: boolean;
+
 }
 
 /**
@@ -796,6 +815,13 @@ export type StorageConfig = {
      */
     maxSize?: number,
 
+    /**
+     * Use this callback to process the file before uploading it to the storage.
+     * If nothing is returned, the file is uploaded as it is.
+     * @param file
+     */
+    processFile?: (file: File) => Promise<File> | undefined;
+
     /**
      * Postprocess the saved value (storage path or URL)
      * after it has been resolved.

package/src/types/side_entity_controller.tsx

@@ -20,6 +20,11 @@ export interface EntitySidePanelProps<M extends Record<string, any> = any> {
      */
     entityId?: string;
 
+    // /**
+    //  * Navigation path with ids of the entity
+    //  */
+    // fullIdPath: string;
+
     /**
      * Set this flag to true if you want to make a copy of an existing entity
      */

package/src/util/createFormexStub.tsx

@@ -0,0 +1,62 @@
+import { FormexController } from "@firecms/formex";
+
+export function createFormexStub<T extends object>(values: T): FormexController<T> {
+    const errorMessage = "You are in a read-only context. You cannot modify the formex controller.";
+
+    return {
+        values,
+        initialValues: values,
+        touched: {} as Record<string, boolean>,
+        dirty: false,
+        errors: {} as Record<string, string>,
+        submitCount: 0,
+        isSubmitting: false,
+        isValidating: false,
+        version: 0,
+        canUndo: false,
+        canRedo: false,
+
+        setValues: () => {
+            throw new Error(errorMessage);
+        },
+        setFieldValue: () => {
+            throw new Error(errorMessage);
+        },
+        setFieldTouched: () => {
+            throw new Error(errorMessage);
+        },
+        setDirty: () => {
+            throw new Error(errorMessage);
+        },
+        setSubmitCount: () => {
+            throw new Error(errorMessage);
+        },
+        setFieldError: () => {
+            throw new Error(errorMessage);
+        },
+        handleChange: () => {
+            throw new Error(errorMessage);
+        },
+        handleBlur: () => {
+            throw new Error(errorMessage);
+        },
+        handleSubmit: () => {
+            throw new Error(errorMessage);
+        },
+        validate: () => {
+            throw new Error(errorMessage);
+        },
+        resetForm: () => {
+            throw new Error(errorMessage);
+        },
+        setSubmitting: () => {
+            throw new Error(errorMessage);
+        },
+        undo: () => {
+            throw new Error(errorMessage);
+        },
+        redo: () => {
+            throw new Error(errorMessage);
+        }
+    };
+}

package/src/util/join_collections.ts

@@ -78,6 +78,7 @@ export function mergeCollection(target: EntityCollection,
                                 modifyCollection?: (props: ModifyCollectionProps) => EntityCollection | void
 ): EntityCollection {
 
+
     const subcollectionsMerged = joinCollectionLists(
         target?.subcollections ?? [],
         source?.subcollections ?? [],
@@ -94,7 +95,7 @@ export function mergeCollection(target: EntityCollection,
             propertiesMerged[key] = source.properties[key] as PropertyOrBuilder;
     });
 
-    const mergedCollection = mergeDeep(target, source);
+    const mergedCollection = mergeDeep(target, source, true);
     const targetPropertiesOrder = getCollectionKeys(target);
     const sourcePropertiesOrder = getCollectionKeys(source);
     const mergedPropertiesOrder = [...new Set([...sourcePropertiesOrder, ...targetPropertiesOrder])];
@@ -118,6 +119,7 @@ export function mergeCollection(target: EntityCollection,
 
     // @ts-ignore
     resultCollection["merged"] = true;
+
     return resultCollection
 }
 

package/src/util/navigation_from_path.ts

@@ -51,7 +51,11 @@ export function getNavigationEntriesFromPath(props: {
     for (let i = 0; i < subpathCombinations.length; i++) {
         const subpathCombination = subpathCombinations[i];
 
-        const collection: EntityCollection<any> | undefined = collections && collections.find((entry) => entry.id === subpathCombination || entry.path === subpathCombination);
+        let collection: EntityCollection<any> | undefined;
+        collection = collections && collections.find((entry) => entry.id === subpathCombination);
+        if (!collection) {
+            collection = collections && collections.find((entry) => entry.path === subpathCombination);
+        }
 
         if (collection) {
             const pathOrAlias = collection.id ?? collection.path;

package/src/util/navigation_utils.ts

@@ -32,29 +32,75 @@ export function getLastSegment(path: string) {
 }
 
 export function resolveCollectionPathIds(path: string, allCollections: EntityCollection[]): string {
-
     const cleanPath = removeInitialAndTrailingSlashes(path);
     const subpaths = cleanPath.split("/");
+
     if (subpaths.length % 2 === 0) {
-        throw Error(`resolveCollectionPathAliases: Collection paths must have an odd number of segments: ${path}`);
+        throw Error(`resolveCollectionPathIds: Collection paths must have an odd number of segments: ${path}`);
     }
 
-    const aliasedCollection = allCollections.find((col) => col.id === subpaths[0]);
-    let resolvedAliased;
-    if (aliasedCollection) {
-        resolvedAliased = aliasedCollection.path;
+    // Check if the path exactly matches a collection path
+    const exactMatch = allCollections.find(col => col.path === cleanPath);
+    if (exactMatch) {
+        return exactMatch.path;
     }
 
-    if (subpaths.length > 1) {
-        const segmentCollection = getCollectionByPathOrId(resolvedAliased ?? subpaths[0], allCollections);
-        if (!segmentCollection?.subcollections) {
+    if (subpaths.length === 1) {
+        // Find collection by ID and return its path
+        const aliasedCollection = allCollections.find((col) => col.id === subpaths[0]);
+        return aliasedCollection?.path ?? subpaths[0];
+    }
+
+    // Try to match a multi-segment collection path
+    let matchingCollection: EntityCollection | undefined;
+    let entityIndex = 1;
+
+    // Check if the path starts with a multi-segment collection path
+    for (const collection of allCollections) {
+        const pathSegments = collection.path.split("/");
+        if (pathSegments.length > 1 &&
+            subpaths.slice(0, pathSegments.length).join("/") === collection.path) {
+            matchingCollection = collection;
+            entityIndex = pathSegments.length;
+            break;
+        }
+    }
+
+    // If no multi-segment match, fall back to single segment matching
+    if (!matchingCollection) {
+        const matchingCollections = allCollections.filter(col =>
+            col.id === subpaths[0] || col.path === subpaths[0]
+        );
+
+        if (!matchingCollections.length) {
             return cleanPath;
         }
-        const restOfThePath = cleanPath.split("/").slice(2).join("/");
-        return (resolvedAliased ?? subpaths[0]) + "/" + subpaths[1] + "/" + resolveCollectionPathIds(restOfThePath, segmentCollection.subcollections);
-    } else {
-        return resolvedAliased ?? cleanPath;
+
+        matchingCollection = matchingCollections[0];
     }
+
+    const entityId = subpaths[entityIndex];
+    const remainingPath = subpaths.slice(entityIndex + 1);
+
+    // If we have a subcollection ID, try to resolve it
+    if (remainingPath.length > 0) {
+        const subcollectionId = remainingPath[0];
+        const subcollection = matchingCollection.subcollections?.find(
+            subcol => subcol.id === subcollectionId
+        );
+
+        if (subcollection) {
+            return `${matchingCollection.path}/${entityId}/${subcollection.path}`;
+        }
+    }
+
+    // If there are no remaining path segments, just return the collection path with entity ID
+    if (remainingPath.length === 0) {
+        return `${matchingCollection.path}/${entityId}`;
+    }
+
+    // Default case - couldn't match subcollection
+    return `${matchingCollection.path}/${entityId}/${remainingPath.join("/")}`;
 }
 
 /**
@@ -116,6 +162,7 @@ export function navigateToEntity({
                                      entityId,
                                      copy,
                                      path,
+                                     fullIdPath,
                                      selectedTab,
                                      sideEntityController,
                                      onClose,
@@ -129,6 +176,7 @@ export function navigateToEntity({
                                      selectedTab?: string;
                                      copy?: boolean;
                                      path: string;
+                                     fullIdPath?: string;
                                      sideEntityController: SideEntityController;
                                      onClose?: () => void;
                                      navigation: NavigationController
@@ -138,7 +186,8 @@ export function navigateToEntity({
 
         sideEntityController.open({
             entityId,
-            path,
+            path: fullIdPath ?? path,
+            // fullIdPath,
             copy,
             selectedTab,
             collection,
@@ -147,7 +196,7 @@ export function navigateToEntity({
         });
 
     } else {
-        let to = navigation.buildUrlCollectionPath(entityId ? `${path}/${entityId}` : path);
+        let to = navigation.buildUrlCollectionPath(entityId ? `${fullIdPath ?? path}/${entityId}` : fullIdPath ?? path);
         if (entityId && selectedTab) {
             to += `/${selectedTab}`;
         }

package/src/util/objects.ts

@@ -12,12 +12,16 @@ export function isObject(item: any) {
     return item && typeof item === "object" && !Array.isArray(item);
 }
 
-export function mergeDeep<T extends Record<any, any>, U extends Record<any, any>>(target: T, source: U): T & U {
+export function mergeDeep<T extends Record<any, any>, U extends Record<any, any>>(target: T, source: U, ignoreUndefined: boolean = false): T & U {
     const targetIsObject = isObject(target);
     const output = targetIsObject ? { ...target } : target;
     if (targetIsObject && isObject(source)) {
         Object.keys(source).forEach(key => {
             const sourceElement = source[key];
+            // Skip undefined values when ignoreUndefined is true
+            if (ignoreUndefined && sourceElement === undefined) {
+                return;
+            }
             if (sourceElement instanceof Date) {
                 // Assign a new Date instance with the same time value
                 Object.assign(output, { [key]: new Date(sourceElement.getTime()) });

package/src/util/property_utils.tsx

@@ -1,6 +1,7 @@
 import React from "react";
 
 import {
+    AuthController,
     EntityCollection,
     PropertiesOrBuilders,
     PropertyConfig,
@@ -13,12 +14,15 @@ import { resolveProperty } from "./resolutions";
 import { CircleIcon, FunctionsIcon } from "@firecms/ui";
 import { getFieldConfig } from "../core";
 
-export function isReferenceProperty(propertyOrBuilder: PropertyOrBuilder,
-                                    fields: Record<string, PropertyConfig>) {
+export function isReferenceProperty(
+    authController: AuthController,
+    propertyOrBuilder: PropertyOrBuilder,
+    fields: Record<string, PropertyConfig>) {
     const resolvedProperty = resolveProperty({
         propertyKey: "ignore", // TODO
         propertyOrBuilder,
-        propertyConfigs: fields
+        propertyConfigs: fields,
+        authController
     });
     if (!resolvedProperty) return null;
     if (resolvedProperty.dataType === "reference") {

package/src/util/references.ts

@@ -1,12 +1,14 @@
-import { EntityCollection, PropertyConfig, ResolvedEntityCollection } from "../types";
+import { AuthController, EntityCollection, PropertyConfig, ResolvedEntityCollection } from "../types";
 import { isReferenceProperty } from "./property_utils";
 import { isPropertyBuilder } from "./entities";
 import { getFieldConfig } from "../core";
 
-export function getEntityPreviewKeys(targetCollection: EntityCollection<any>,
-                                     fields: Record<string, PropertyConfig>,
-                                     previewProperties?: string[],
-                                     limit = 3) {
+export function getEntityPreviewKeys(
+    authController: AuthController,
+    targetCollection: EntityCollection<any>,
+    fields: Record<string, PropertyConfig>,
+    previewProperties?: string[],
+    limit = 3) {
     const allProperties = Object.keys(targetCollection.properties);
     let listProperties = previewProperties?.filter(p => allProperties.includes(p as string));
     if (!listProperties && targetCollection.previewProperties) {
@@ -18,7 +20,7 @@ export function getEntityPreviewKeys(targetCollection: EntityCollection<any>,
         listProperties = allProperties;
         return listProperties.filter(key => {
             const propertyOrBuilder = targetCollection.properties[key];
-            return propertyOrBuilder && !isPropertyBuilder(propertyOrBuilder) && !isReferenceProperty(propertyOrBuilder, fields);
+            return propertyOrBuilder && !isPropertyBuilder(propertyOrBuilder) && !isReferenceProperty(authController, propertyOrBuilder, fields);
         }).slice(0, limit);
     }
 }