@firecms/core 3.0.0-canary.18 → 3.0.0-canary.182

package/src/util/resolutions.ts

@@ -26,7 +26,7 @@ import { getDefaultValuesFor, isPropertyBuilder } from "./entities";
 import { DEFAULT_ONE_OF_TYPE } from "./common";
 import { getIn } from "@firecms/formex";
 import { enumToObjectEntries } from "./enums";
-import { isDefaultFieldConfigId } from "../core";
+import { isDefaultFieldConfigId } from "../core/field_configs";
 
 // import util from "util";
 
@@ -38,7 +38,8 @@ export const resolveCollection = <M extends Record<string, any>, >
      values,
      previousValues,
      userConfigPersistence,
-     fields
+     propertyConfigs,
+     ignoreMissingFields = false
  }: {
     collection: EntityCollection<M> | ResolvedEntityCollection<M>;
     path: string,
@@ -46,7 +47,8 @@ export const resolveCollection = <M extends Record<string, any>, >
     values?: Partial<EntityValues<M>>,
     previousValues?: Partial<EntityValues<M>>,
     userConfigPersistence?: UserConfigurationPersistence;
-    fields?: Record<string, PropertyConfig>;
+    propertyConfigs?: Record<string, PropertyConfig>;
+    ignoreMissingFields?: boolean;
 }): ResolvedEntityCollection<M> => {
 
     const collectionOverride = userConfigPersistence?.getCollectionConfig<M>(path);
@@ -58,16 +60,15 @@ export const resolveCollection = <M extends Record<string, any>, >
 
     const resolvedProperties = Object.entries(collection.properties)
         .map(([key, propertyOrBuilder]) => {
-            const propertyValue = usedValues ? getIn(usedValues, key) : undefined;
             const childResolvedProperty = resolveProperty({
                 propertyKey: key,
                 propertyOrBuilder: propertyOrBuilder as PropertyOrBuilder | ResolvedProperty,
                 values: usedValues,
                 previousValues: usedPreviousValues,
                 path,
-                propertyValue,
                 entityId,
-                fields
+                propertyConfigs: propertyConfigs,
+                ignoreMissingFields
             });
             if (!childResolvedProperty) return {};
             return ({
@@ -95,24 +96,23 @@ export const resolveCollection = <M extends Record<string, any>, >
  * Resolve property builders, enums and arrays.
  * @param propertyOrBuilder
  * @param propertyValue
- * @param values
  */
 export function resolveProperty<T extends CMSType = CMSType, M extends Record<string, any> = any>({
                                                                                                       propertyOrBuilder,
-                                                                                                      propertyValue,
                                                                                                       fromBuilder = false,
+                                                                                                      ignoreMissingFields = false,
                                                                                                       ...props
                                                                                                   }: {
     propertyKey?: string,
     propertyOrBuilder: PropertyOrBuilder<T, M> | ResolvedProperty<T>,
-    propertyValue?: unknown,
     values?: Partial<M>,
     previousValues?: Partial<M>,
     path?: string,
     entityId?: string,
     index?: number,
     fromBuilder?: boolean;
-    fields?: Record<string, PropertyConfig<any>>;
+    propertyConfigs?: Record<string, PropertyConfig<any>>;
+    ignoreMissingFields?: boolean;
 }): ResolvedProperty<T> | null {
 
     if (typeof propertyOrBuilder === "object" && "resolved" in propertyOrBuilder) {
@@ -128,10 +128,11 @@ export function resolveProperty<T extends CMSType = CMSType, M extends Record<st
         if (!path)
             throw Error("Trying to resolve a property builder without specifying the entity path");
 
+        const usedPropertyValue = props.propertyKey ? getIn(props.values, props.propertyKey) : undefined;
         const result: Property<T> | null = propertyOrBuilder({
             ...props,
             path,
-            propertyValue,
+            propertyValue: usedPropertyValue,
             values: props.values ?? {},
             previousValues: props.previousValues ?? props.values ?? {}
         });
@@ -142,17 +143,17 @@ export function resolveProperty<T extends CMSType = CMSType, M extends Record<st
 
         resolvedProperty = resolveProperty({
             ...props,
-            propertyValue,
             propertyOrBuilder: result,
-            fromBuilder: true
+            fromBuilder: true,
+            ignoreMissingFields
         });
     } else {
         const property = propertyOrBuilder as Property<T>;
         if (property.dataType === "map" && property.properties) {
             const properties = resolveProperties({
+                ignoreMissingFields,
                 ...props,
                 properties: property.properties,
-                propertyValue
             });
             resolvedProperty = {
                 ...property,
@@ -163,8 +164,8 @@ export function resolveProperty<T extends CMSType = CMSType, M extends Record<st
         } else if (property.dataType === "array") {
             resolvedProperty = resolveArrayProperty({
                 property,
-                propertyValue,
                 fromBuilder,
+                ignoreMissingFields,
                 ...props
             }) as ResolvedProperty<any>;
         } else if ((property.dataType === "string" || property.dataType === "number") && property.enumValues) {
@@ -181,13 +182,13 @@ export function resolveProperty<T extends CMSType = CMSType, M extends Record<st
     }
 
     if (resolvedProperty.propertyConfig && !isDefaultFieldConfigId(resolvedProperty.propertyConfig)) {
-        const cmsFields = props.fields;
-        if (!cmsFields) {
-            throw Error(`Trying to resolve a property with key ${resolvedProperty.propertyConfig} that inherits from a custom property config but no custom property configs were provided. Use the property \`propertyConfigs\` in your app config to provide them`);
+        const cmsFields = props.propertyConfigs;
+        if (!cmsFields && !ignoreMissingFields) {
+            throw Error(`Trying to resolve a property with key '${resolvedProperty.propertyConfig}' that inherits from a custom property config but no custom property configs were provided. Use the property 'propertyConfigs' in your app config to provide them`);
         }
-        const customField: PropertyConfig<any> = cmsFields[resolvedProperty.propertyConfig];
+        const customField: PropertyConfig | undefined = cmsFields?.[resolvedProperty.propertyConfig];
         if (!customField) {
-            console.warn(`Trying to resolve a property with key ${resolvedProperty.propertyConfig} that inherits from a custom property config but no custom property config with that key was found. Check the \`propertyConfigs\` in your app config`)
+            console.warn(`Trying to resolve a property with key '${resolvedProperty.propertyConfig}' that inherits from a custom property config but no custom property config with that key was found. Check the 'propertyConfigs' in your app config`)
             console.warn("Available property configs", cmsFields);
             return null;
         }
@@ -198,7 +199,7 @@ export function resolveProperty<T extends CMSType = CMSType, M extends Record<st
             }
             const customFieldProperty = resolveProperty<any>({
                 propertyOrBuilder: configPropertyOrBuilder,
-                propertyValue,
+                ignoreMissingFields,
                 ...props
             });
             if (customFieldProperty) {
@@ -216,23 +217,56 @@ export function resolveProperty<T extends CMSType = CMSType, M extends Record<st
         : null;
 }
 
+export function getArrayResolvedProperties<M>({
+                                           propertyKey,
+                                           propertyValue,
+                                           property,
+                                           ...props
+                                       }: {
+    propertyValue: any,
+    propertyKey?: string,
+    property: ArrayProperty<any> | ResolvedArrayProperty<any>,
+    ignoreMissingFields: boolean,
+    values?: Partial<M>;
+    previousValues?: Partial<M>;
+    path?: string;
+    entityId?: string;
+    index?: number;
+    fromBuilder?: boolean;
+    propertyConfigs?: Record<string, PropertyConfig>
+}) {
+
+    const of = property.of;
+    return Array.isArray(propertyValue)
+        ? propertyValue.map((v: any, index: number) => {
+            return resolveProperty({
+                propertyKey: `${propertyKey}.${index}`,
+                propertyOrBuilder: of,
+                ...props,
+                index
+            });
+        }).filter(e => Boolean(e)) as ResolvedProperty[]
+        : [];
+}
+
 export function resolveArrayProperty<T extends any[], M>({
                                                              propertyKey,
                                                              property,
-                                                             propertyValue,
+                                                             ignoreMissingFields = false,
                                                              ...props
                                                          }: {
     propertyKey?: string,
     property: ArrayProperty<T> | ResolvedArrayProperty<T>,
-    propertyValue: any,
     values?: Partial<M>,
     previousValues?: Partial<M>,
     path?: string,
     entityId?: string,
     index?: number,
     fromBuilder?: boolean;
-    fields?: Record<string, PropertyConfig>;
+    propertyConfigs?: Record<string, PropertyConfig>;
+    ignoreMissingFields?: boolean;
 }): ResolvedArrayProperty {
+    const propertyValue = propertyKey ? getIn(props.values, propertyKey) : undefined;
 
     if (property.of) {
         if (Array.isArray(property.of)) {
@@ -244,7 +278,7 @@ export function resolveArrayProperty<T extends any[], M>({
                     return resolveProperty({
                         propertyKey: `${propertyKey}.${index}`,
                         propertyOrBuilder: p as Property<any>,
-                        propertyValue: Array.isArray(propertyValue) ? propertyValue[index] : undefined,
+                        ignoreMissingFields,
                         ...props,
                         index
                     });
@@ -252,22 +286,19 @@ export function resolveArrayProperty<T extends any[], M>({
             } as ResolvedArrayProperty;
         } else {
             const of = property.of;
-            const resolvedProperties: ResolvedProperty[] = Array.isArray(propertyValue)
-                ? propertyValue.map((v: any, index: number) => resolveProperty({
-                    propertyKey: `${propertyKey}.${index}`,
-                    propertyOrBuilder: of,
-                    propertyValue: v,
-                    ...props,
-                    index
-                })).filter(e => Boolean(e)) as ResolvedProperty[]
-                : [];
+            const resolvedProperties = getArrayResolvedProperties({
+                propertyValue,
+                propertyKey,
+                property,
+                ignoreMissingFields,
+                ...props
+            });
             const ofProperty = resolveProperty({
-                propertyKey: `${propertyKey}`,
                 propertyOrBuilder: of,
-                propertyValue: undefined,
+                ignoreMissingFields,
                 ...props
             });
-            if (!ofProperty)
+            if (!ofProperty && !ignoreMissingFields)
                 throw Error("When using a property builder as the 'of' prop of an ArrayProperty, you must return a valid child property")
             return {
                 ...property,
@@ -287,14 +318,15 @@ export function resolveArrayProperty<T extends any[], M>({
                 return resolveProperty({
                     propertyKey: `${propertyKey}.${index}`,
                     propertyOrBuilder: childProperty,
-                    propertyValue,
+                    ignoreMissingFields,
                     ...props
                 });
             }).filter(e => Boolean(e)) as ResolvedProperty[]
             : [];
         const properties = resolveProperties<any>({
+            propertyKey,
             properties: property.oneOf.properties,
-            propertyValue: undefined,
+            ignoreMissingFields,
             ...props
         });
         return {
@@ -325,27 +357,28 @@ export function resolveArrayProperty<T extends any[], M>({
  * @param value
  */
 export function resolveProperties<M extends Record<string, any>>({
+                                                                     propertyKey,
                                                                      properties,
-                                                                     propertyValue,
+                                                                     ignoreMissingFields,
                                                                      ...props
                                                                  }: {
+    propertyKey?: string,
     properties: PropertiesOrBuilders<M>,
-    propertyValue: unknown,
     values?: Partial<M>,
     previousValues?: Partial<M>,
     path?: string,
     entityId?: string,
     index?: number,
     fromBuilder?: boolean;
-    fields?: Record<string, PropertyConfig>;
+    propertyConfigs?: Record<string, PropertyConfig>;
+    ignoreMissingFields?: boolean;
 }): ResolvedProperties<M> {
     return Object.entries<PropertyOrBuilder>(properties as Record<string, PropertyOrBuilder>)
         .map(([key, property]) => {
-            const thisPropertyValue = propertyValue && typeof propertyValue === "object" ? getValueInPath(propertyValue, key) : undefined;
             const childResolvedProperty = resolveProperty({
-                propertyKey: key,
+                propertyKey: propertyKey ? `${propertyKey}.${key}` : undefined,
                 propertyOrBuilder: property,
-                propertyValue: thisPropertyValue,
+                ignoreMissingFields,
                 ...props
             });
             if (!childResolvedProperty) return {};
@@ -367,7 +400,7 @@ export function resolvePropertyEnum(property: StringProperty | NumberProperty, f
         return {
             ...property,
             resolved: true,
-            enumValues: enumToObjectEntries(property.enumValues)?.filter((value) => value && value.id && value.label) ?? [],
+            enumValues: enumToObjectEntries(property.enumValues)?.filter((value) => value && (value.id || value.id === 0) && value.label) ?? [],
             fromBuilder: fromBuilder ?? false
         }
     }

package/src/util/storage.ts

@@ -1,22 +1,39 @@
 import {
+    ArrayProperty,
     EntityValues,
+    PropertyOrBuilder,
     ResolvedArrayProperty,
     ResolvedStringProperty,
     StorageConfig,
+    StringProperty,
     UploadedFileContext
 } from "../types";
 import { randomString } from "./strings";
 
-export async function resolveFilenameString<M extends object>(
-    input: string | ((context: UploadedFileContext) => Promise<string> | string),
-    storage: StorageConfig,
-    values: EntityValues<M>,
-    entityId: string,
-    path: string,
+interface ResolveFilenameStringParams<M extends object> {
+    input: string | ((context: UploadedFileContext) => (Promise<string> | string));
+    storage: StorageConfig;
+    values: EntityValues<M>;
+    entityId: string;
+    path?: string;
     property: ResolvedStringProperty | ResolvedArrayProperty<string[]>,
-    file: File,
-    propertyKey: string): Promise<string> {
+    file: File;
+    propertyKey: string;
+}
+
+export async function resolveStorageFilenameString<M extends object>(
+    {
+        input,
+        storage,
+        values,
+        entityId,
+        path,
+        property,
+        file,
+        propertyKey
+    }: ResolveFilenameStringParams<M>): Promise<string> {
     let result;
+
     if (typeof input === "function") {
         result = await input({
             path,
@@ -30,7 +47,13 @@ export async function resolveFilenameString<M extends object>(
         if (!result)
             console.warn("Storage callback returned empty result. Using default name value")
     } else {
-        result = replacePlaceholders(file, input, entityId, propertyKey, path);
+        result = replacePlaceholders({
+            file,
+            input,
+            entityId,
+            propertyKey,
+            path
+        });
     }
 
     if (!result)
@@ -39,15 +62,28 @@ export async function resolveFilenameString<M extends object>(
     return result;
 }
 
+interface ResolveStoragePathStringParams<M extends object> {
+    input: string | ((context: UploadedFileContext) => string);
+    storage: StorageConfig;
+    values: EntityValues<M>;
+    entityId: string;
+    path?: string;
+    property: ResolvedStringProperty | ResolvedArrayProperty<string[]>;
+    file: File;
+    propertyKey: string;
+}
+
 export function resolveStoragePathString<M extends object>(
-    input: string | ((context: UploadedFileContext) => string),
-    storage: StorageConfig,
-    values: EntityValues<M>,
-    entityId: string,
-    path: string,
-    property: ResolvedStringProperty | ResolvedArrayProperty<string[]>,
-    file: File,
-    propertyKey: string): string {
+    {
+        input,
+        storage,
+        values,
+        entityId,
+        path,
+        property,
+        file,
+        propertyKey
+    }: ResolveStoragePathStringParams<M>): string {
     let result;
     if (typeof input === "function") {
         result = input({
@@ -62,7 +98,13 @@ export function resolveStoragePathString<M extends object>(
         if (!result)
             console.warn("Storage callback returned empty result. Using default name value")
     } else {
-        result = replacePlaceholders(file, input, entityId, propertyKey, path);
+        result = replacePlaceholders({
+            file,
+            input,
+            entityId,
+            propertyKey,
+            path
+        });
     }
 
     if (!result)
@@ -71,14 +113,30 @@ export function resolveStoragePathString<M extends object>(
     return result;
 }
 
-function replacePlaceholders(file: File, input: string, entityId: string, propertyKey: string, path: string) {
+interface Placeholders {
+    file: File;
+    input: string;
+    entityId: string;
+    propertyKey: string;
+    path?: string;
+}
+
+function replacePlaceholders({
+                                 file,
+                                 input,
+                                 entityId,
+                                 propertyKey,
+                                 path
+                             }: Placeholders) {
     const ext = file.name.split(".").pop();
     let result = input.replace("{entityId}", entityId)
         .replace("{propertyKey}", propertyKey)
         .replace("{rand}", randomString())
         .replace("{file}", file.name)
-        .replace("{file.type}", file.type)
-        .replace("{path}", path);
+        .replace("{file.type}", file.type);
+    if (path) {
+        result = result.replace("{path}", path);
+    }
     if (ext) {
         result = result.replace("{file.ext}", ext);
         const name = file.name.replace(`.${ext}`, "");

package/src/util/strings.ts

@@ -56,8 +56,8 @@ export function unslugify(slug?: string): string {
         const result = slug.replace(/[-_]/g, " ");
         return result.replace(/\w\S*/g, function (txt) {
             return txt.charAt(0).toUpperCase() + txt.substr(1);
-        });
+        }).trim();
     } else {
-        return slug;
+        return slug.trim();
     }
 }

package/src/util/useStorageUploadController.tsx

@@ -2,9 +2,11 @@ import Resizer from "react-image-file-resizer";
 import equal from "react-fast-compare";
 
 import {
+    ArrayProperty,
     EntityValues,
     ImageCompression,
     Property,
+    PropertyOrBuilder,
     ResolvedArrayProperty,
     ResolvedStringProperty,
     StorageConfig,
@@ -14,7 +16,8 @@ import {
 import { useCallback, useEffect, useState } from "react";
 import { PreviewSize } from "../preview";
 import { randomString } from "./strings";
-import { resolveFilenameString, resolveStoragePathString } from "./storage";
+import { resolveStorageFilenameString, resolveStoragePathString } from "./storage";
+import { resolveProperty } from "./resolutions";
 
 /**
  * Internal representation of an item in the storage
@@ -46,9 +49,9 @@ export function useStorageUploadController<M extends object>({
                                                                      entityId: string,
                                                                      entityValues: EntityValues<M>,
                                                                      value: string | string[] | null;
-                                                                     path: string,
+                                                                     path?: string,
                                                                      propertyKey: string,
-                                                                     property: ResolvedStringProperty | ResolvedArrayProperty<string[]>,
+                                                                     property: StringProperty | ArrayProperty<string[]> | ResolvedStringProperty | ResolvedArrayProperty<string[]>,
                                                                      storageSource: StorageSource,
                                                                      disabled: boolean,
                                                                      onChange: (value: string | string[] | null) => void
@@ -67,7 +70,7 @@ export function useStorageUploadController<M extends object>({
         throw Error("Storage meta must be specified");
 
     const metadata: Record<string, any> | undefined = storage?.metadata;
-    const size = multipleFilesSupported ? "small" : "medium";
+    const size = multipleFilesSupported ? "medium" : "large";
 
     const compression: ImageCompression | undefined = storage?.imageCompression;
 
@@ -93,20 +96,43 @@ export function useStorageUploadController<M extends object>({
         }
     }, [internalInitialValue, value, initialValue]);
 
+    const resolvedProperty = resolveProperty({
+        propertyOrBuilder: property as PropertyOrBuilder,
+        values: entityValues
+    }) as ResolvedStringProperty | ResolvedArrayProperty<string[]>;
+
     const fileNameBuilder = useCallback(async (file: File) => {
         if (storage.fileName) {
-            const fileName = await resolveFilenameString(storage.fileName, storage, entityValues, entityId, path, property, file, propertyKey);
+            const fileName = await resolveStorageFilenameString({
+                input: storage.fileName,
+                storage,
+                values: entityValues,
+                entityId,
+                path,
+                property: resolvedProperty,
+                file,
+                propertyKey
+            });
             if (!fileName || fileName.length === 0) {
                 throw Error("You need to return a valid filename");
             }
             return fileName;
         }
         return randomString() + "_" + file.name;
-    }, [entityId, entityValues, path, property, propertyKey, storage]);
+    }, [entityId, entityValues, path, resolvedProperty, propertyKey, storage]);
 
     const storagePathBuilder = useCallback((file: File) => {
-        return resolveStoragePathString(storage.storagePath, storage, entityValues, entityId, path, property, file, propertyKey) ?? "/";
-    }, [entityId, entityValues, path, property, propertyKey, storage]);
+        return resolveStoragePathString({
+            input: storage.storagePath,
+            storage,
+            values: entityValues,
+            entityId,
+            path,
+            property: resolvedProperty,
+            file,
+            propertyKey
+        }) ?? "/";
+    }, [entityId, entityValues, path, resolvedProperty, propertyKey, storage]);
 
     const onFileUploadComplete = useCallback(async (uploadedPath: string,
                                                     entry: StorageFieldItem,

package/dist/components/PropertyIdCopyTooltipContent.d.ts

@@ -1,3 +0,0 @@
-export declare function PropertyIdCopyTooltipContent({ propertyId }: {
-    propertyId: string;
-}): import("react/jsx-runtime").JSX.Element;

package/dist/components/VirtualTable/common.d.ts

@@ -1,2 +0,0 @@
-import { VirtualTableSize } from "./VirtualTableProps";
-export declare function getRowHeight(size: VirtualTableSize): number;

package/dist/core/Drawer.d.ts

@@ -1,23 +0,0 @@
-import React from "react";
-/**
- * Props used in case you need to override the default drawer
- * @group Core
- */
-export type DrawerProps<T = {}> = T & {
-    hovered: boolean;
-    drawerOpen: boolean;
-    closeDrawer: () => any;
-};
-/**
- * Default drawer used in the CMS
- * @group Core
- */
-export declare function Drawer({ hovered, drawerOpen, closeDrawer }: DrawerProps): import("react/jsx-runtime").JSX.Element;
-export declare function DrawerNavigationItem({ name, icon, drawerOpen, tooltipsOpen, url, onClick }: {
-    icon: React.ReactElement;
-    name: string;
-    tooltipsOpen: boolean;
-    drawerOpen: boolean;
-    url: string;
-    onClick?: () => void;
-}): import("react/jsx-runtime").JSX.Element;

package/dist/core/Scaffold.d.ts

@@ -1,55 +0,0 @@
-import React from "react";
-import { DrawerProps } from "./Drawer";
-import { FireCMSAppBarProps } from "../components";
-export declare const DRAWER_WIDTH = 280;
-/**
- * @group Core
- */
-export interface ScaffoldProps<ExtraDrawerProps = object, ExtraAppbarProps = object> {
-    /**
-     * Name of the app, displayed as the main title and in the tab title
-     */
-    name: string;
-    /**
-     * Logo to be displayed in the drawer of the CMS
-     */
-    logo?: string;
-    /**
-     * Whether to include the drawer in the scaffold
-     */
-    includeDrawer?: boolean;
-    /**
-     * In case you need to override the view that gets rendered as a drawer
-     * @see DefaultDrawer
-     */
-    Drawer?: React.ComponentType<DrawerProps<ExtraDrawerProps>>;
-    /**
-     * Additional props passed to the custom Drawer
-     */
-    drawerProps?: Partial<DrawerProps> & ExtraDrawerProps;
-    /**
-     * Open the drawer on hover
-     */
-    autoOpenDrawer?: boolean;
-    /**
-     * A component that gets rendered on the upper side of the main toolbar.
-     * `toolbarExtraWidget` has no effect if this is set.
-     */
-    FireCMSAppBar?: React.ComponentType<FireCMSAppBarProps<ExtraAppbarProps>>;
-    /**
-     * Additional props passed to the custom AppBar
-     */
-    fireCMSAppBarProps?: Partial<FireCMSAppBarProps> & ExtraAppbarProps;
-}
-/**
- * This view acts as a scaffold for FireCMS.
- *
- * It is in charge of displaying the navigation drawer, top bar and main
- * collection views.
- * This component needs a parent {@link FireCMS}
- *
- * @param props
- * @constructor
- * @group Core
- */
-export declare const Scaffold: React.NamedExoticComponent<React.PropsWithChildren<ScaffoldProps<object, object>>>;

package/dist/core/SideEntityView.d.ts

@@ -1,7 +0,0 @@
-import { User } from "../types";
-import { EntityEditViewProps } from "./EntityEditView";
-export type SideEntityViewProps<M extends Record<string, any>> = EntityEditViewProps<M> & {
-    formWidth?: number | string;
-    onClose?: () => void;
-};
-export declare function SideEntityView<M extends Record<string, any>, UserType extends User>({ path, entityId, selectedSubPath, copy, collection, parentCollectionIds, onValuesAreModified, formWidth, onUpdate, onClose }: SideEntityViewProps<M>): import("react/jsx-runtime").JSX.Element;