@firecms/core 3.0.0-canary.67 → 3.0.0-canary.69

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@firecms/core",
     "type": "module",
-    "version": "3.0.0-canary.67",
+    "version": "3.0.0-canary.69",
     "description": "Awesome Firebase/Firestore-based headless open-source CMS",
     "funding": {
         "url": "https://github.com/sponsors/firecmsco"
@@ -46,8 +46,8 @@
         "./package.json": "./package.json"
     },
     "dependencies": {
-        "@firecms/formex": "^3.0.0-canary.67",
-        "@firecms/ui": "^3.0.0-canary.67",
+        "@firecms/formex": "^3.0.0-canary.69",
+        "@firecms/ui": "^3.0.0-canary.69",
         "@fontsource/jetbrains-mono": "^5.0.20",
         "@hello-pangea/dnd": "^16.6.0",
         "@radix-ui/react-portal": "^1.0.4",
@@ -111,7 +111,7 @@
         "dist",
         "src"
     ],
-    "gitHead": "1b00fdca862f86ddec3fbed0cefc1e6a95d076d6",
+    "gitHead": "2864af43a74e4b1ecfc8d382a5ecba3c70569fbe",
     "publishConfig": {
         "access": "public"
     },

package/src/core/EntityEditView.tsx

@@ -201,15 +201,15 @@ export function EntityEditViewInner<M extends Record<string, any>>({
 
     const [entityId, setEntityId] = React.useState<string | undefined>(initialEntityId);
 
-    const doOnValuesChanges = (values?: EntityValues<M>) => {
-        const initialValues = formex.initialValues;
-        setInternalValues(values);
-        if (onValuesChanged)
-            onValuesChanged(values);
-        if (autoSave && values && !equal(values, initialValues)) {
-            save(values);
-        }
-    };
+    // const doOnValuesChanges = (values?: EntityValues<M>) => {
+    //     const initialValues = formex.initialValues;
+    //     setInternalValues(values);
+    //     if (onValuesChanged)
+    //         onValuesChanged(values);
+    //     if (autoSave && values && !equal(values, initialValues)) {
+    //         save(values);
+    //     }
+    // };
 
     const [entityIdError, setEntityIdError] = React.useState<boolean>(false);
     const [savingError, setSavingError] = React.useState<Error | undefined>();
@@ -230,10 +230,10 @@ export function EntityEditViewInner<M extends Record<string, any>>({
     const mainViewVisible = selectedTabRef.current === MAIN_TAB_VALUE;
 
     // const initialValuesRef = useRef<EntityValues<M>>(entity?.values ?? baseDataSourceValues as EntityValues<M>);
-    const [internalValues, setInternalValues] = useState<EntityValues<M> | undefined>(entity?.values ?? baseDataSourceValuesRef.current as EntityValues<M>);
+    // const [internalValues, setInternalValues] = useState<EntityValues<M> | undefined>(entity?.values ?? baseDataSourceValuesRef.current as EntityValues<M>);
 
-    const modifiedValuesRef = useRef<EntityValues<M> | undefined>(undefined);
-    const modifiedValues = modifiedValuesRef.current;
+    // const modifiedValuesRef = useRef<EntityValues<M> | undefined>(undefined);
+    // const modifiedValues = modifiedValuesRef.current;
 
     const subcollections = (collection.subcollections ?? []).filter(c => !c.hideFromNavigation);
     const subcollectionsCount = subcollections?.length ?? 0;
@@ -443,12 +443,15 @@ export function EntityEditViewInner<M extends Record<string, any>>({
         collection: inputCollection,
         path,
         entityId,
-        values: internalValues,
+        values: formex.values,
         previousValues: formex.initialValues,
         fields: customizationController.propertyConfigs
     });
 
+    const lastSavedValues = useRef<EntityValues<M> | undefined>(entity?.values);
+
     const save = (values: EntityValues<M>): Promise<void> => {
+        lastSavedValues.current = values;
         return onSaveEntityRequest({
             collection: resolvedCollection,
             path,
@@ -510,7 +513,7 @@ export function EntityEditViewInner<M extends Record<string, any>>({
                         {formContext && <Builder
                             collection={collection}
                             entity={usedEntity}
-                            modifiedValues={modifiedValues ?? usedEntity?.values}
+                            modifiedValues={formex.values ?? usedEntity?.values}
                             formContext={formContext}
                         />}
                     </ErrorBoundary>
@@ -573,9 +576,9 @@ export function EntityEditViewInner<M extends Record<string, any>>({
         });
     };
 
-    const onValuesChanged = useCallback((values?: EntityValues<M>) => {
-        modifiedValuesRef.current = values;
-    }, []);
+    // const onValuesChanged = useCallback((values?: EntityValues<M>) => {
+    //     modifiedValuesRef.current = values;
+    // }, []);
 
     // eslint-disable-next-line n/handle-callback-err
     const onIdUpdateError = useCallback((error: any) => {
@@ -594,11 +597,6 @@ export function EntityEditViewInner<M extends Record<string, any>>({
             : undefined);
     }, []);
 
-    const onModified = (dirty: boolean) => {
-        if (!autoSave)
-            onValuesAreModified(dirty);
-    }
-
     // useEffect(() => {
     //     baseDataSourceValuesRef.current = getDataSourceEntityValues(initialResolvedCollection, status, entity);
     //     const initialValues = formex.initialValues;
@@ -646,19 +644,19 @@ export function EntityEditViewInner<M extends Record<string, any>>({
     }
 
     const titlePropertyKey = getEntityTitlePropertyKey(resolvedCollection, customizationController.propertyConfigs);
-    const title = internalValues && titlePropertyKey ? getValueInPath(internalValues, titlePropertyKey) : undefined;
+    const title = formex.values && titlePropertyKey ? getValueInPath(formex.values, titlePropertyKey) : undefined;
 
     const onIdUpdate = inputCollection.callbacks?.onIdUpdate;
 
     const doOnIdUpdate = useCallback(async () => {
-        if (onIdUpdate && internalValues && (status === "new" || status === "copy")) {
+        if (onIdUpdate && formex.values && (status === "new" || status === "copy")) {
             setCustomIdLoading(true);
             try {
                 const updatedId = await onIdUpdate({
                     collection: resolvedCollection,
                     path,
                     entityId,
-                    values: internalValues,
+                    values: formex.values,
                     context
                 });
                 setEntityId(updatedId);
@@ -668,7 +666,7 @@ export function EntityEditViewInner<M extends Record<string, any>>({
             }
             setCustomIdLoading(false);
         }
-    }, [entityId, internalValues, status]);
+    }, [entityId, formex.values, status]);
 
     useEffect(() => {
         doOnIdUpdate();
@@ -712,10 +710,13 @@ export function EntityEditViewInner<M extends Record<string, any>>({
 
     const modified = formex.dirty;
     useEffect(() => {
-        if (onModified)
-            onModified(modified);
-        if (onValuesChanged)
-            onValuesChanged(formex.values);
+        if (!autoSave) {
+            onValuesAreModified(modified);
+        } else {
+            if (formex.values && !equal(formex.values, lastSavedValues.current)) {
+                save(formex.values);
+            }
+        }
     }, [modified, formex.values]);
 
     useEffect(() => {
@@ -915,8 +916,6 @@ export function EntityEditViewInner<M extends Record<string, any>>({
                             path={path}
                             collection={collection}
                             onDiscard={onDiscard}
-                            onValuesChanged={onValuesChanged}
-                            onModified={onModified}
                             entity={usedEntity}
                             context={context}
                             formContext={formContext}

package/src/form/field_bindings/StorageUploadFieldBinding.tsx

@@ -1,13 +1,6 @@
 import React, { useCallback } from "react";
 
-import {
-    ArrayProperty,
-    Entity,
-    FieldProps,
-    ResolvedArrayProperty,
-    ResolvedStringProperty,
-    StorageConfig
-} from "../../types";
+import { ArrayProperty, FieldProps, ResolvedArrayProperty, ResolvedStringProperty, StorageConfig } from "../../types";
 import { useDropzone } from "react-dropzone";
 import { PreviewSize } from "../../preview";
 import { FieldHelperText, LabelWithIcon } from "../components";
@@ -30,7 +23,7 @@ import { useClearRestoreValue } from "../useClearRestoreValue";
 
 const dropZoneClasses = "box-border relative pt-[2px] items-center border border-transparent min-h-[254px] outline-none rounded-md duration-200 ease-[cubic-bezier(0.4,0,0.2,1)] focus:border-primary-solid";
 const disabledClasses = "border-dotted-gray"
-const nonActiveDropClasses = "hover:bg-field-hover dark:hover:bg-field-hover-dark"
+const nonActiveDropClasses = fieldBackgroundHoverMixin
 const activeDropClasses = "pt-0 border-2 border-solid"
 const acceptDropClasses = "transition-colors duration-200 ease-[cubic-bezier(0,0,0.2,1)] border-2 border-solid border-green-500"
 const rejectDropClasses = "transition-colors duration-200 ease-[cubic-bezier(0,0,0.2,1)] border-2 border-solid border-red-500"

package/src/util/entities.ts

@@ -152,6 +152,7 @@ export function traverseValuesProperties<M extends Record<string, any>>(
         .map(([key, property]) => {
             const inputValue = inputValues && (inputValues)[key];
             const updatedValue = traverseValueProperty(inputValue, property as Property, operation);
+            if (updatedValue === null) return null;
             if (updatedValue === undefined) return undefined;
             return ({ [key]: updatedValue });
         })