@firecms/core 3.0.0-canary.6 → 3.0.0-canary.60

package/src/util/references.ts

@@ -1,11 +1,12 @@
-import { EntityCollection, PropertyConfig } from "../types";
+import { EntityCollection, PropertyConfig, ResolvedEntityCollection } from "../types";
 import { isReferenceProperty } from "./property_utils";
 import { isPropertyBuilder } from "./entities";
+import { getFieldConfig } from "../core";
 
-export function getReferencePreviewKeys(targetCollection: EntityCollection<any>,
-                                        fields: Record<string, PropertyConfig>,
-                                        previewProperties?: string[],
-                                        limit = 3) {
+export function getEntityPreviewKeys(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 && listProperties.length > 0) {
@@ -18,3 +19,33 @@ export function getReferencePreviewKeys(targetCollection: EntityCollection<any>,
         }).slice(0, limit);
     }
 }
+
+export function getEntityTitlePropertyKey<M extends Record<string, any>>(collection: EntityCollection<M>, propertyConfigs: Record<string, PropertyConfig<any>>): string | undefined {
+    if (collection.titleProperty) {
+        return collection.titleProperty as string;
+    }
+    // find first text field property
+    for (const key in collection.properties) {
+        const property = collection.properties[key];
+        if (!isPropertyBuilder(property)) {
+            const field = getFieldConfig(property, propertyConfigs);
+            if (field?.key === "text_field") {
+                return key;
+            }
+        }
+    }
+    return undefined;
+}
+
+export function getEntityImagePreviewPropertyKey<M extends object>(collection: ResolvedEntityCollection<M>): string | undefined {
+
+    // find first text field property
+    for (const key in collection.properties) {
+        const property = collection.properties[key];
+        if (property.dataType === "string" && property.storage?.acceptedFiles?.includes("image/*")) {
+            return key;
+        }
+
+    }
+    return undefined;
+}

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
+     fields,
+     ignoreMissingFields = false
  }: {
     collection: EntityCollection<M> | ResolvedEntityCollection<M>;
     path: string,
@@ -47,6 +48,7 @@ export const resolveCollection = <M extends Record<string, any>, >
     previousValues?: Partial<EntityValues<M>>,
     userConfigPersistence?: UserConfigurationPersistence;
     fields?: 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
+                fields,
+                ignoreMissingFields
             });
             if (!childResolvedProperty) return {};
             return ({
@@ -95,17 +96,15 @@ 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,
@@ -113,6 +112,7 @@ export function resolveProperty<T extends CMSType = CMSType, M extends Record<st
     index?: number,
     fromBuilder?: boolean;
     fields?: 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) {
@@ -182,12 +183,12 @@ 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`);
+        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) {
@@ -219,12 +220,11 @@ export function resolveProperty<T extends CMSType = CMSType, M extends Record<st
 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,
@@ -232,7 +232,9 @@ export function resolveArrayProperty<T extends any[], M>({
     index?: number,
     fromBuilder?: boolean;
     fields?: Record<string, PropertyConfig>;
+    ignoreMissingFields?: boolean;
 }): ResolvedArrayProperty {
+    const propertyValue = propertyKey ? getIn(props.values, propertyKey) : undefined;
 
     if (property.of) {
         if (Array.isArray(property.of)) {
@@ -244,7 +246,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
                     });
@@ -256,7 +258,7 @@ export function resolveArrayProperty<T extends any[], M>({
                 ? propertyValue.map((v: any, index: number) => resolveProperty({
                     propertyKey: `${propertyKey}.${index}`,
                     propertyOrBuilder: of,
-                    propertyValue: v,
+                    ignoreMissingFields,
                     ...props,
                     index
                 })).filter(e => Boolean(e)) as ResolvedProperty[]
@@ -264,10 +266,10 @@ export function resolveArrayProperty<T extends any[], M>({
             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 +289,14 @@ 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>({
             properties: property.oneOf.properties,
-            propertyValue: undefined,
+            ignoreMissingFields,
             ...props
         });
         return {
@@ -326,11 +328,10 @@ export function resolveArrayProperty<T extends any[], M>({
  */
 export function resolveProperties<M extends Record<string, any>>({
                                                                      properties,
-                                                                     propertyValue,
+                                                                     ignoreMissingFields,
                                                                      ...props
                                                                  }: {
     properties: PropertiesOrBuilders<M>,
-    propertyValue: unknown,
     values?: Partial<M>,
     previousValues?: Partial<M>,
     path?: string,
@@ -338,14 +339,14 @@ export function resolveProperties<M extends Record<string, any>>({
     index?: number,
     fromBuilder?: boolean;
     fields?: 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,
                 propertyOrBuilder: property,
-                propertyValue: thisPropertyValue,
+                ignoreMissingFields,
                 ...props
             });
             if (!childResolvedProperty) return {};
@@ -367,7 +368,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/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/useTraceUpdate.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useRef } from "react";
 
-function printChanged(props: any, prev: any, path = "", depth = 0, maxDepth: number) {
+export function printChanged(props: any, prev: any, path: string | undefined = "", depth: number | undefined = 0, maxDepth: number | undefined = 10) {
     if (depth > maxDepth) {
         return;
     }
@@ -17,6 +17,7 @@ function printChanged(props: any, prev: any, path = "", depth = 0, maxDepth: num
 export function useTraceUpdate(props: any, maxDepth = 3) {
     const prev = useRef(props);
     useEffect(() => {
+        console.log("Changed props:");
         printChanged(props, prev.current, "", 0, maxDepth);
         prev.current = props;
     });

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/SideEntityView.d.ts

@@ -1,7 +0,0 @@
-import { EntityViewProps } from "./EntityView";
-import { User } from "../types";
-export type SideEntityViewProps<M extends Record<string, any>> = EntityViewProps<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;

package/dist/internal/useBuildCustomizationController.d.ts

@@ -1,2 +0,0 @@
-import { CustomizationController } from "../types/customization_controller";
-export declare function useBuildCustomizationController(controller: CustomizationController): CustomizationController;

package/dist/internal/useLocaleConfig.d.ts

@@ -1 +0,0 @@
-export declare function useLocaleConfig(locale?: string): void;

package/dist/types/appcheck.d.ts

@@ -1,26 +0,0 @@
-import { FirebaseApp } from "firebase/app";
-/**
- * @group Firebase
- */
-export interface AppCheck {
-    firebaseApp?: FirebaseApp;
-}
-/**
- * @group Firebase
- */
-export interface AppCheckOptions {
-    providerKey: string;
-    useEnterpriseRecaptcha: boolean;
-    isTokenAutoRefreshEnabled?: boolean;
-    debugToken?: string;
-    forceRefresh?: boolean;
-}
-/**
- * @group Firebase
- */
-export declare interface AppCheckTokenResult {
-    /**
-     * The token string in JWT format.
-     */
-    readonly token: string;
-}

package/src/components/HomePage/NavigationCollectionCard.tsx

@@ -1,146 +0,0 @@
-import { useNavigate } from "react-router-dom";
-
-import { useCustomizationController, useFireCMSContext } from "../../hooks";
-import { PluginHomePageActionsProps, TopNavigationEntry } from "../../types";
-import { IconForView } from "../../util";
-import { useUserConfigurationPersistence } from "../../hooks/useUserConfigurationPersistence";
-import { ArrowForwardIcon, Card, cn, IconButton, Markdown, StarBorderIcon, StarIcon, Typography } from "@firecms/ui";
-
-/**
- * This is the component used in the home page to render a card for each
- * collection.
- * @group Components
- * @param view
- * @param path
- * @param collection
- * @param url
- * @param name
- * @param description
- * @param onClick
- * @constructor
- */
-export function NavigationCollectionCard({
-                                             view,
-                                             path,
-                                             collection,
-                                             url,
-                                             name,
-                                             description,
-                                             onClick
-                                         }: TopNavigationEntry & {
-    onClick?: () => void
-}) {
-
-    const userConfigurationPersistence = useUserConfigurationPersistence();
-    const collectionIcon = <IconForView collectionOrView={collection ?? view}/>;
-
-    const navigate = useNavigate();
-    const context = useFireCMSContext();
-    const customizationController = useCustomizationController();
-
-    const favourite = (userConfigurationPersistence?.favouritePaths ?? []).includes(path);
-
-    let actions: React.ReactNode | undefined;
-    if (customizationController.plugins && collection) {
-        const actionProps: PluginHomePageActionsProps = {
-            path,
-            collection,
-            context
-        };
-        actions = <>
-            {customizationController.plugins.map((plugin, i) => (
-                plugin.homePage?.CollectionActions
-                    ? <plugin.homePage.CollectionActions
-                        key={`actions_${i}`}
-                        {...actionProps}
-                        extraProps={plugin.homePage.extraProps}
-                    />
-                    : null
-            ))}
-        </>
-        ;
-    }
-
-    return (
-        <Card
-            className={cn("h-full p-4 cursor-pointer min-h-[230px]")}
-            onClick={() => {
-                onClick?.();
-                navigate(url);
-                if (userConfigurationPersistence) {
-                    userConfigurationPersistence.setRecentlyVisitedPaths(
-                        [path, ...(userConfigurationPersistence.recentlyVisitedPaths ?? []).filter(p => p !== path)]
-                    );
-                }
-            }}>
-
-            <div className="flex flex-col items-start h-full">
-                <div
-                    className="flex-grow w-full">
-
-                    <div
-                        className="h-10 flex items-center w-full justify-between text-gray-300 dark:text-gray-600">
-
-                        {collectionIcon}
-
-                        <div
-                            className="flex items-center gap-1"
-                            onClick={(event: React.MouseEvent) => {
-                                event.preventDefault();
-                                event.stopPropagation();
-                            }}>
-
-                            {actions}
-
-                            {userConfigurationPersistence &&
-                                <IconButton
-                                    onClick={(e) => {
-                                        e.preventDefault();
-                                        e.stopPropagation();
-                                        if (favourite) {
-                                            userConfigurationPersistence.setFavouritePaths(
-                                                userConfigurationPersistence.favouritePaths.filter(p => p !== path)
-                                            );
-                                        } else {
-                                            userConfigurationPersistence.setFavouritePaths(
-                                                [...userConfigurationPersistence.favouritePaths, path]
-                                            );
-                                        }
-                                    }}>
-                                    {
-                                        favourite
-                                            ? <StarIcon
-                                                size={18}
-                                                className={"text-secondary"}/>
-                                            : <StarBorderIcon
-                                                size={18}
-                                                className={"text-gray-400 dark:text-gray-500"}/>}
-                                </IconButton>}
-
-                        </div>
-
-                    </div>
-
-                    <Typography gutterBottom variant="h5"
-                                component="h2">
-                        {name}
-                    </Typography>
-
-                    {description && <Typography variant="body2"
-                                                color="secondary"
-                                                component="div">
-                        <Markdown source={description}/>
-                    </Typography>}
-                </div>
-
-                <div style={{ alignSelf: "flex-end" }}>
-
-                    <div className={"p-4"}>
-                        <ArrowForwardIcon className="text-primary"/>
-                    </div>
-                </div>
-
-            </div>
-
-        </Card>);
-}

package/src/core/SideEntityView.tsx

@@ -1,38 +0,0 @@
-import { EntityViewProps } from "./EntityView";
-import { User } from "../types";
-import { useSideDialogContext } from "./SideDialogs";
-import { useSideEntityController } from "../hooks";
-import { FORM_CONTAINER_WIDTH } from "../internal/common";
-
-export type SideEntityViewProps<M extends Record<string, any>> = EntityViewProps<M> & {
-    formWidth?: number | string;
-    onClose?: () => void;
-}
-
-export function SideEntityView<M extends Record<string, any>, UserType extends User>({
-                                                                                         path,
-                                                                                         entityId,
-                                                                                         selectedSubPath,
-                                                                                         copy,
-                                                                                         collection,
-                                                                                         parentCollectionIds,
-                                                                                         onValuesAreModified,
-                                                                                         formWidth,
-                                                                                         onUpdate,
-                                                                                         onClose
-                                                                                     }: SideEntityViewProps<M>) {
-
-    const sideDialogContext = useSideDialogContext();
-    const sideEntityController = useSideEntityController();
-    const resolvedFormWidth: string = typeof formWidth === "number" ? `${formWidth}px` : formWidth ?? FORM_CONTAINER_WIDTH;
-
-    const onCloseHandler = () => {
-        if (onClose) {
-            onClose();
-        } else {
-            sideDialogContext.close();
-        }
-    }
-
-    return <></>;
-}

package/src/internal/useBuildCustomizationController.tsx

@@ -1,5 +0,0 @@
-import { CustomizationController } from "../types/customization_controller";
-
-export function useBuildCustomizationController(controller: CustomizationController): CustomizationController {
-    return controller;
-}

package/src/internal/useLocaleConfig.tsx

@@ -1,18 +0,0 @@
-import * as locales from "date-fns/locale";
-// @ts-ignore
-import { registerLocale, setDefaultLocale } from "react-datepicker";
-import { useEffect } from "react";
-
-export function useLocaleConfig(locale?: string) {
-    useEffect(() => {
-        if (!locale) {
-            return;
-        }
-        // @ts-ignore
-        const dateFnsLocale = locales[locale];
-        if (dateFnsLocale) {
-            registerLocale(locale, dateFnsLocale);
-            setDefaultLocale(locale);
-        }
-    }, [locale])
-}

package/src/types/appcheck.ts

@@ -1,29 +0,0 @@
-import { FirebaseApp } from "firebase/app";
-
-/**
- * @group Firebase
- */
-export interface AppCheck {
-    firebaseApp?: FirebaseApp;
-}
-
-/**
- * @group Firebase
- */
-export interface AppCheckOptions {
-    providerKey: string;
-    useEnterpriseRecaptcha: boolean;
-    isTokenAutoRefreshEnabled?: boolean;
-    debugToken?: string;
-    forceRefresh?: boolean;
-}
-
-/**
- * @group Firebase
- */
-export declare interface AppCheckTokenResult {
-    /**
-     * The token string in JWT format.
-     */
-    readonly token: string;
-}