@evoke-platform/ui-components 1.11.0-dev.1 → 1.11.0-dev.3

package/dist/published/components/custom/FormField/DatePickerSelect/DatePickerSelect.js

@@ -25,7 +25,8 @@ function asCalendarDate(value) {
 const asMonthDayYearFormat = (date) => {
     if (date) {
         const formatter = DateTimeFormatter.ofPattern('MM/dd/yyyy');
-        return LocalDate.parse(date).format(formatter);
+        const localDate = date instanceof LocalDate ? date : LocalDate.parse(date);
+        return localDate.format(formatter);
     }
 };
 const DatePickerSelect = (props) => {

package/dist/published/components/custom/FormField/FormField.js

@@ -1,3 +1,4 @@
+import { isNil } from 'lodash';
 import React, { useEffect, useState } from 'react';
 import PropertyProtection from '../FormV2/components/PropertyProtection';
 import AddressFieldComponent from './AddressFieldComponent/addressFieldComponent';
@@ -18,7 +19,7 @@ const FormField = (props) => {
             setCurrentDisplayValue(defaultValue);
         }
     }, [defaultValue]);
-    const protectionComponent = isProtectedProperty && !!defaultValue ? (React.createElement(PropertyProtection, { parameter: property, protection: protection, mask: mask, canEdit: !readOnly, value: defaultValue, handleChange: (value) => onChange?.(property.id, value, property), setCurrentDisplayValue: setCurrentDisplayValue, mode: protectionMode, setMode: setProtectionMode, instance: props.instance, apiServices: props.apiServices })) : null;
+    const protectionComponent = isProtectedProperty && !isNil(defaultValue) ? (React.createElement(PropertyProtection, { parameter: property, protection: protection, mask: mask ?? (readOnly ? property.mask : undefined), canEdit: !readOnly, value: defaultValue, handleChange: (value) => onChange?.(property.id, value, property), setCurrentDisplayValue: setCurrentDisplayValue, mode: protectionMode, setMode: setProtectionMode, instance: props.instance, apiServices: props.apiServices })) : null;
     const commonProps = {
         id: id ?? property.id,
         property,

package/dist/published/components/custom/FormV2/FormRendererContainer.js

@@ -357,6 +357,22 @@ function FormRendererContainer(props) {
         }
         return result;
     };
+    const removeUneditedProtectedValues = (data) => {
+        const protectedProperties = sanitizedObject?.properties?.filter((prop) => prop.protection?.maskChar);
+        if (!protectedProperties || protectedProperties.length === 0) {
+            return data;
+        }
+        const filteredData = { ...data };
+        protectedProperties.forEach((property) => {
+            const fieldId = property.id;
+            const originalValue = instance?.[fieldId];
+            const currentValue = filteredData[fieldId];
+            if (currentValue === originalValue) {
+                delete filteredData[fieldId];
+            }
+        });
+        return filteredData;
+    };
     const handleAutosave = async (fieldId) => {
         if (!form?.autosaveActionId || !formDataRef.current) {
             return;
@@ -368,7 +384,8 @@ function FormRendererContainer(props) {
         }
         try {
             setIsSaving(true);
-            const submission = await formatSubmission(formDataRef.current, apiServices, objectId, instanceId, form, setSnackbarError);
+            const cleanedData = removeUneditedProtectedValues(formDataRef.current);
+            const submission = await formatSubmission(cleanedData, apiServices, objectId, instanceId, form, setSnackbarError);
             // Handle document autosave
             if (dataType === 'documents' && document) {
                 await apiServices.patch(getPrefixedUrl(`/objects/${objectId}/instances/${instanceId}/documents/${documentId}`), pick(submission, ['metadata']).metadata ?? submission);

package/dist/published/components/custom/FormV2/components/FormFieldTypes/relatedObjectFiles/ObjectPropertyInput.js

@@ -11,7 +11,7 @@ import { getDefaultPages, getPrefixedUrl, transformToWhere } from '../../utils';
 import RelatedObjectInstance from './RelatedObjectInstance';
 const ObjectPropertyInput = (props) => {
     const { id, fieldDefinition, readOnly, error, mode, displayOption, filter, defaultValueCriteria, sortBy, orderBy, isModal, initialValue, viewLayout, hasDescription, createActionId, formId, relatedObjectId, } = props;
-    const { fetchedOptions, setFetchedOptions, parameters, fieldHeight, handleChange: handleChangeObjectField, onAutosave: onAutosave, instance, } = useFormContext();
+    const { fetchedOptions, setFetchedOptions, fieldHeight, handleChange: handleChangeObjectField, onAutosave: onAutosave, instance, } = useFormContext();
     const { defaultPages, findDefaultPageSlugFor } = useApp();
     const [selectedInstance, setSelectedInstance] = useState(initialValue || undefined);
     const [openCreateDialog, setOpenCreateDialog] = useState(false);
@@ -205,8 +205,8 @@ const ObjectPropertyInput = (props) => {
     }, [relatedObjectId, fetchedOptions, id]);
     useEffect(() => {
         (async () => {
-            if (parameters && fetchedOptions[`${id}NavigationSlug`] === undefined) {
-                const pages = await getDefaultPages(parameters, defaultPages, findDefaultPageSlugFor);
+            if (fetchedOptions[`${id}NavigationSlug`] === undefined) {
+                const pages = await getDefaultPages([{ ...fieldDefinition, objectId: relatedObjectId }], defaultPages, findDefaultPageSlugFor);
                 if (relatedObjectId && pages[relatedObjectId]) {
                     setNavigationSlug(pages[relatedObjectId]);
                     setFetchedOptions({
@@ -221,7 +221,7 @@ const ObjectPropertyInput = (props) => {
                 }
             }
         })();
-    }, [parameters, defaultPages, findDefaultPageSlugFor, relatedObjectId, fetchedOptions]);
+    }, [id, fieldDefinition, defaultPages, findDefaultPageSlugFor, relatedObjectId, fetchedOptions]);
     const handleClose = () => {
         setOpenCreateDialog(false);
     };

package/dist/published/components/custom/FormV2/components/PropertyProtection.js

@@ -36,7 +36,7 @@ const PropertyProtection = (props) => {
     const [isLoading, setIsLoading] = useState(hasViewPermission === undefined);
     const [error, setError] = useState(null);
     useEffect(() => {
-        if (hasViewPermission === undefined && (instance || instanceFormV1)) {
+        if (hasViewPermission === undefined && (instance?.id || instanceFormV1?.id)) {
             apiServices
                 .get(getPrefixedUrl(`/objects/${object?.id ?? instanceFormV1?.objectId}/instances/${instance?.id ?? instanceFormV1?.id}/checkAccess?action=readProtected&fieldId=${parameter.id}`))
                 .then((viewPermissionCheck) => {

package/dist/published/components/custom/ViewDetailsV2/InstanceEntryRenderer.js

@@ -1,7 +1,7 @@
 import { useApiServices, useApp, } from '@evoke-platform/context';
 import { CancelRounded, CheckCircleRounded } from '@mui/icons-material';
 import DOMPurify from 'dompurify';
-import { isEmpty } from 'lodash';
+import { isEmpty, isNil } from 'lodash';
 import { DateTime } from 'luxon';
 import React, { useEffect, useMemo, useState } from 'react';
 import { useFormContext } from '../../../theme/hooks';
@@ -44,7 +44,7 @@ function ViewOnlyEntryRenderer(props) {
         return def;
     }, [entry, object]);
     const isProtectedProperty = fieldDefinition?.protection?.maskChar;
-    const protectionComponent = isProtectedProperty ? (React.createElement(PropertyProtection, { parameter: fieldDefinition, protection: fieldDefinition?.protection, mask: fieldDefinition?.mask, value: currentDisplayValue, canEdit: false, setCurrentDisplayValue: setCurrentDisplayValue, mode: protectionMode, setMode: setProtectionMode })) : null;
+    const protectionComponent = isProtectedProperty && !isNil(currentDisplayValue) ? (React.createElement(PropertyProtection, { parameter: fieldDefinition, protection: fieldDefinition?.protection, mask: fieldDefinition?.mask, value: currentDisplayValue, canEdit: false, setCurrentDisplayValue: setCurrentDisplayValue, mode: protectionMode, setMode: setProtectionMode })) : null;
     useEffect(() => {
         if (fieldDefinition?.type === 'collection' && fieldDefinition?.manyToManyPropertyId && instance) {
             fetchCollectionData(apiServices, fieldDefinition, setFetchedOptions, instance.id, fetchedOptions, initialMiddleObjectInstances);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@evoke-platform/ui-components",
-    "version": "1.11.0-dev.1",
+    "version": "1.11.0-dev.3",
     "description": "",
     "main": "dist/published/index.js",
     "module": "dist/published/index.js",