@evoke-platform/ui-components 1.0.0-dev.226 → 1.0.0-dev.228

package/dist/published/components/custom/Form/FormComponents/ObjectComponent/ObjectPropertyInput.js

@@ -1,6 +1,6 @@
 import cleanDeep from 'clean-deep';
 import Handlebars from 'handlebars';
-import { cloneDeep, debounce, isEmpty, isNil, pick } from 'lodash';
+import { cloneDeep, debounce, isEmpty, isNil } from 'lodash';
 import React, { useCallback, useEffect, useState } from 'react';
 import { Close } from '../../../../../icons';
 import { Autocomplete, Button, Dialog, IconButton, Link, Paper, TextField, Tooltip, Typography, } from '../../../../core';
@@ -8,7 +8,6 @@ import { Box } from '../../../../layout';
 import { getPrefixedUrl, normalizeDates, transformToWhere } from '../../utils';
 import { RelatedObjectInstance } from './RelatedObjectInstance';
 export const ObjectPropertyInput = (props) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
     const { id, instance, property, apiServices, defaultPages, handleChangeObjectProperty, nestedFieldsView, canUpdateProperty, error, navigateTo, mode, displayOption, filter, defaultValueCriteria, sortBy, orderBy, setSnackbarError, isModal, user, viewLayout, } = props;
     const [relatedObject, setRelatedObject] = useState();
     const [openCreateDialog, setOpenCreateDialog] = useState(false);
@@ -20,14 +19,23 @@ export const ObjectPropertyInput = (props) => {
     const [layout, setLayout] = useState();
     const DEFAULT_CREATE_ACTION = '_create';
     useEffect(() => {
-        var _a, _b;
         if (relatedObject) {
             let defaultViewLayout;
-            if (((_a = relatedObject === null || relatedObject === void 0 ? void 0 : relatedObject.viewLayout) === null || _a === void 0 ? void 0 : _a.dropdown) && displayOption === 'dropdown') {
-                defaultViewLayout = Object.assign({ id: 'default', name: 'Default', objectId: relatedObject.id }, relatedObject.viewLayout.dropdown);
+            if (relatedObject?.viewLayout?.dropdown && displayOption === 'dropdown') {
+                defaultViewLayout = {
+                    id: 'default',
+                    name: 'Default',
+                    objectId: relatedObject.id,
+                    ...relatedObject.viewLayout.dropdown,
+                };
             }
-            else if (((_b = relatedObject === null || relatedObject === void 0 ? void 0 : relatedObject.viewLayout) === null || _b === void 0 ? void 0 : _b.table) && displayOption === 'dialogBox') {
-                defaultViewLayout = Object.assign({ id: 'default', name: 'Default', objectId: relatedObject.id }, relatedObject.viewLayout.table);
+            else if (relatedObject?.viewLayout?.table && displayOption === 'dialogBox') {
+                defaultViewLayout = {
+                    id: 'default',
+                    name: 'Default',
+                    objectId: relatedObject.id,
+                    ...relatedObject.viewLayout.table,
+                };
             }
             if (viewLayout) {
                 apiServices
@@ -41,10 +49,9 @@ export const ObjectPropertyInput = (props) => {
         }
     }, [displayOption, relatedObject, viewLayout]);
     useEffect(() => {
-        var _a;
         if (!isEmpty(defaultValueCriteria) && !selectedInstance && !instance[property.id]) {
             const updatedFilter = cleanDeep({
-                where: transformToWhere({ $and: [defaultValueCriteria, (_a = filter === null || filter === void 0 ? void 0 : filter.where) !== null && _a !== void 0 ? _a : {}] }),
+                where: transformToWhere({ $and: [defaultValueCriteria, filter?.where ?? {}] }),
                 order: orderBy && sortBy ? encodeURIComponent(sortBy + ' ' + orderBy) : undefined,
                 limit: 1,
             });
@@ -57,7 +64,7 @@ export const ObjectPropertyInput = (props) => {
                     }
                     if (instances) {
                         setSelectedInstance(instances[0]);
-                        handleChangeObjectProperty(property.id, { id: instances[0].id, name: instances[0].name });
+                        handleChangeObjectProperty(property.id, instances[0]);
                     }
                     setLoadingOptions(false);
                 });
@@ -141,7 +148,6 @@ export const ObjectPropertyInput = (props) => {
                         ],
                     },
                 }, PaperComponent: ({ children }) => {
-                    var _a;
                     return (React.createElement(Paper, { sx: {
                             borderRadius: '12px',
                             boxShadow: '0px 24px 48px 0px rgba(145, 158, 171, 0.2)',
@@ -163,7 +169,7 @@ export const ObjectPropertyInput = (props) => {
                         } },
                         children,
                         mode !== 'existingOnly' &&
-                            ((_a = relatedObject === null || relatedObject === void 0 ? void 0 : relatedObject.actions) === null || _a === void 0 ? void 0 : _a.some((a) => a.id === DEFAULT_CREATE_ACTION)) && (React.createElement(Button, { fullWidth: true, sx: {
+                            relatedObject?.actions?.some((a) => a.id === DEFAULT_CREATE_ACTION) && (React.createElement(Button, { fullWidth: true, sx: {
                                 justifyContent: 'flex-start',
                                 pl: 2,
                                 minHeight: '48px',
@@ -175,43 +181,46 @@ export const ObjectPropertyInput = (props) => {
                                 setOpenCreateDialog(true);
                             }, color: 'inherit' }, "+ Add New"))));
                 }, sx: {
-                    '& button.MuiButtonBase-root': Object.assign({}, (!loadingOptions &&
-                        (((_a = instance === null || instance === void 0 ? void 0 : instance[property.id]) === null || _a === void 0 ? void 0 : _a.id) || (selectedInstance === null || selectedInstance === void 0 ? void 0 : selectedInstance.id))
-                        ? {
-                            visibility: 'visible',
-                        }
-                        : {})),
+                    '& button.MuiButtonBase-root': {
+                        ...(!loadingOptions &&
+                            (instance?.[property.id]?.id || selectedInstance?.id)
+                            ? {
+                                visibility: 'visible',
+                            }
+                            : {}),
+                    },
                 }, noOptionsText: 'No options available', renderOption: (props, option) => {
-                    return (React.createElement("li", Object.assign({}, props, { key: option.id }),
+                    return (React.createElement("li", { ...props, key: option.id },
                         React.createElement(Box, null,
                             React.createElement(Typography, { sx: { marginLeft: '8px', fontSize: '14px' } }, option.label),
-                            (layout === null || layout === void 0 ? void 0 : layout.secondaryTextExpression) ? (React.createElement(Typography, { sx: { marginLeft: '8px', fontSize: '14px', color: '#637381' } }, compileExpression(layout === null || layout === void 0 ? void 0 : layout.secondaryTextExpression, options.find((o) => o.id === option.value)))) : null)));
+                            layout?.secondaryTextExpression ? (React.createElement(Typography, { sx: { marginLeft: '8px', fontSize: '14px', color: '#637381' } }, compileExpression(layout?.secondaryTextExpression, options.find((o) => o.id === option.value)))) : null)));
                 }, onOpen: () => {
-                    var _a;
-                    if (((_a = instance === null || instance === void 0 ? void 0 : instance[property.id]) === null || _a === void 0 ? void 0 : _a.id) || (selectedInstance === null || selectedInstance === void 0 ? void 0 : selectedInstance.id)) {
+                    if (instance?.[property.id]?.id || selectedInstance?.id) {
                         setOpenOptions(false);
                     }
                     else {
                         setOpenOptions(true);
                     }
-                }, onClose: () => setOpenOptions(false), value: ((_b = instance === null || instance === void 0 ? void 0 : instance[property.id]) === null || _b === void 0 ? void 0 : _b.id) || (selectedInstance === null || selectedInstance === void 0 ? void 0 : selectedInstance.id)
+                }, onClose: () => setOpenOptions(false), value: instance?.[property.id]?.id || selectedInstance?.id
                     ? {
-                        value: (_e = (_d = (_c = instance === null || instance === void 0 ? void 0 : instance[property.id]) === null || _c === void 0 ? void 0 : _c.id) !== null && _d !== void 0 ? _d : selectedInstance === null || selectedInstance === void 0 ? void 0 : selectedInstance.id) !== null && _e !== void 0 ? _e : '',
-                        label: (_h = (_g = (_f = instance === null || instance === void 0 ? void 0 : instance[property.id]) === null || _f === void 0 ? void 0 : _f.name) !== null && _g !== void 0 ? _g : selectedInstance === null || selectedInstance === void 0 ? void 0 : selectedInstance.name) !== null && _h !== void 0 ? _h : '',
+                        value: instance?.[property.id]?.id ??
+                            selectedInstance?.id ??
+                            '',
+                        label: instance?.[property.id]?.name ??
+                            selectedInstance?.name ??
+                            '',
                     }
                     : null, isOptionEqualToValue: (option, value) => {
                     if (typeof value === 'string') {
                         return option.value === value;
                     }
-                    return option.value === (value === null || value === void 0 ? void 0 : value.value);
+                    return option.value === value?.value;
                 }, options: options.map((o) => ({ label: o.name, value: o.id })), getOptionLabel: (option) => {
-                    var _a, _b;
                     return typeof option === 'string'
-                        ? (_b = (_a = options.find((o) => o.id === option)) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : ''
+                        ? options.find((o) => o.id === option)?.name ?? ''
                         : option.label;
                 }, onKeyDownCapture: (e) => {
-                    var _a;
-                    if (((_a = instance === null || instance === void 0 ? void 0 : instance[property.id]) === null || _a === void 0 ? void 0 : _a.id) || (selectedInstance === null || selectedInstance === void 0 ? void 0 : selectedInstance.id)) {
+                    if (instance?.[property.id]?.id || selectedInstance?.id) {
                         e.preventDefault();
                     }
                 }, loading: loadingOptions, onChange: (event, value) => {
@@ -221,46 +230,48 @@ export const ObjectPropertyInput = (props) => {
                         handleChangeObjectProperty(property.id, null);
                     }
                     else {
-                        const selectedInstance = options.find((o) => o.id === (value === null || value === void 0 ? void 0 : value.value));
+                        const selectedInstance = options.find((o) => o.id === value?.value);
                         setSelectedInstance(selectedInstance);
-                        handleChangeObjectProperty(property.id, pick(selectedInstance, 'id', 'name'));
+                        handleChangeObjectProperty(property.id, selectedInstance);
                     }
-                }, selectOnFocus: false, onBlur: () => setDropdownInput(undefined), renderInput: (params) => {
-                    var _a, _b;
-                    return (React.createElement(TextField, Object.assign({}, params, { placeholder: 'Select', readOnly: !loadingOptions &&
-                            !!(((_a = instance === null || instance === void 0 ? void 0 : instance[property.id]) === null || _a === void 0 ? void 0 : _a.id) ||
-                                (selectedInstance === null || selectedInstance === void 0 ? void 0 : selectedInstance.id)), onChange: (event) => setDropdownInput(event.target.value), onClick: (e) => {
-                            var _a, _b, _c, _d, _e, _f, _g;
-                            if (navigationSlug &&
-                                ['DIV', 'INPUT'].includes((_a = e.target) === null || _a === void 0 ? void 0 : _a.nodeName) &&
-                                (((_b = instance === null || instance === void 0 ? void 0 : instance[property.id]) === null || _b === void 0 ? void 0 : _b.id) ||
-                                    (selectedInstance === null || selectedInstance === void 0 ? void 0 : selectedInstance.id))) {
-                                navigateTo &&
-                                    navigateTo(navigationSlug.replace(':instanceId', (_e = (_d = (_c = instance === null || instance === void 0 ? void 0 : instance[property.id]) === null || _c === void 0 ? void 0 : _c.id) !== null && _d !== void 0 ? _d : selectedInstance === null || selectedInstance === void 0 ? void 0 : selectedInstance.id) !== null && _e !== void 0 ? _e : ''));
-                            }
-                            if (openOptions &&
-                                ((_f = e.target) === null || _f === void 0 ? void 0 : _f.nodeName) === 'svg') {
-                                setOpenOptions(false);
-                            }
-                            else if (!['DIV', 'INPUT'].includes((_g = e.target) === null || _g === void 0 ? void 0 : _g.nodeName) &&
-                                !selectedInstance) {
-                                setOptions(options);
-                                setOpenOptions(true);
-                            }
-                        }, sx: Object.assign({}, (!loadingOptions &&
-                            (((_b = instance === null || instance === void 0 ? void 0 : instance[property.id]) === null || _b === void 0 ? void 0 : _b.id) ||
-                                (selectedInstance === null || selectedInstance === void 0 ? void 0 : selectedInstance.id))
+                }, selectOnFocus: false, onBlur: () => setDropdownInput(undefined), renderInput: (params) => (React.createElement(TextField, { ...params, placeholder: 'Select', readOnly: !loadingOptions &&
+                        !!(instance?.[property.id]?.id ||
+                            selectedInstance?.id), onChange: (event) => setDropdownInput(event.target.value), onClick: (e) => {
+                        if (navigationSlug &&
+                            ['DIV', 'INPUT'].includes(e.target?.nodeName) &&
+                            (instance?.[property.id]?.id ||
+                                selectedInstance?.id)) {
+                            navigateTo &&
+                                navigateTo(navigationSlug.replace(':instanceId', instance?.[property.id]?.id ??
+                                    selectedInstance?.id ??
+                                    ''));
+                        }
+                        if (openOptions &&
+                            e.target?.nodeName === 'svg') {
+                            setOpenOptions(false);
+                        }
+                        else if (!['DIV', 'INPUT'].includes(e.target?.nodeName) &&
+                            !selectedInstance) {
+                            setOptions(options);
+                            setOpenOptions(true);
+                        }
+                    }, sx: {
+                        ...(!loadingOptions &&
+                            (instance?.[property.id]?.id ||
+                                selectedInstance?.id)
                             ? {
                                 '.MuiOutlinedInput-root': {
                                     background: 'white',
                                     border: 'auto',
-                                    '.MuiOutlinedInput-input': Object.assign({}, (navigationSlug
-                                        ? {
-                                            color: 'rgb(1, 78, 123)',
-                                            textDecoration: 'underline',
-                                            cursor: 'pointer',
-                                        }
-                                        : {})),
+                                    '.MuiOutlinedInput-input': {
+                                        ...(navigationSlug
+                                            ? {
+                                                color: 'rgb(1, 78, 123)',
+                                                textDecoration: 'underline',
+                                                cursor: 'pointer',
+                                            }
+                                            : {}),
+                                    },
                                 },
                                 '& fieldset': { borderColor: 'auto' },
                                 '&:hover .MuiOutlinedInput-notchedOutline': {
@@ -268,27 +279,34 @@ export const ObjectPropertyInput = (props) => {
                                 },
                                 caretColor: 'white',
                             }
-                            : {})) })));
-                }, readOnly: !loadingOptions && !canUpdateProperty, error: error }))) : (React.createElement(Box, { sx: {
-                padding: ((_k = (_j = instance === null || instance === void 0 ? void 0 : instance[property.id]) === null || _j === void 0 ? void 0 : _j.name) !== null && _k !== void 0 ? _k : selectedInstance === null || selectedInstance === void 0 ? void 0 : selectedInstance.name)
+                            : {}),
+                    } })), readOnly: !loadingOptions && !canUpdateProperty, error: error }))) : (React.createElement(Box, { sx: {
+                padding: (instance?.[property.id]?.name ?? selectedInstance?.name)
                     ? '16.5px 14px'
                     : '10.5px 0',
             } },
-            ((_o = (_m = (_l = instance === null || instance === void 0 ? void 0 : instance[property.id]) === null || _l === void 0 ? void 0 : _l.name) !== null && _m !== void 0 ? _m : selectedInstance === null || selectedInstance === void 0 ? void 0 : selectedInstance.name) !== null && _o !== void 0 ? _o : '') && (React.createElement(Link, { sx: {
+            (instance?.[property.id]?.name ??
+                selectedInstance?.name ??
+                '') && (React.createElement(Link, { sx: {
                     textDecoration: 'none',
                     marginRight: 1,
-                    textDecorationLine: navigationSlug && (instance === null || instance === void 0 ? void 0 : instance[property.id]) && !isModal ? 'underline' : 'none',
-                    cursor: navigationSlug && (instance === null || instance === void 0 ? void 0 : instance[property.id]) && !isModal ? 'pointer' : 'auto',
+                    textDecorationLine: navigationSlug && instance?.[property.id] && !isModal ? 'underline' : 'none',
+                    cursor: navigationSlug && instance?.[property.id] && !isModal ? 'pointer' : 'auto',
                     fontSize: '16px',
                     fontWeight: 400,
                     lineHeight: '24px',
                     textAlign: 'left',
-                    color: navigationSlug && (instance === null || instance === void 0 ? void 0 : instance[property.id]) && !isModal ? '#0075A7' : '#212B36',
-                }, variant: "body2", href: navigationSlug && (instance === null || instance === void 0 ? void 0 : instance[property.id]) && !isModal
-                    ? `${process.env.REACT_APP_API_ROOT ? '' : '/app'}${navigationSlug.replace(':instanceId', (_r = (_q = (_p = instance === null || instance === void 0 ? void 0 : instance[property.id]) === null || _p === void 0 ? void 0 : _p.id) !== null && _q !== void 0 ? _q : selectedInstance === null || selectedInstance === void 0 ? void 0 : selectedInstance.id) !== null && _r !== void 0 ? _r : '')}`
-                    : undefined, "aria-label": (_t = (_s = instance === null || instance === void 0 ? void 0 : instance[property.id]) === null || _s === void 0 ? void 0 : _s.name) !== null && _t !== void 0 ? _t : selectedInstance === null || selectedInstance === void 0 ? void 0 : selectedInstance.name }, (_w = (_v = (_u = instance === null || instance === void 0 ? void 0 : instance[property.id]) === null || _u === void 0 ? void 0 : _u.name) !== null && _v !== void 0 ? _v : selectedInstance === null || selectedInstance === void 0 ? void 0 : selectedInstance.name) !== null && _w !== void 0 ? _w : '')),
+                    color: navigationSlug && instance?.[property.id] && !isModal ? '#0075A7' : '#212B36',
+                }, variant: "body2", href: navigationSlug && instance?.[property.id] && !isModal
+                    ? `${process.env.REACT_APP_API_ROOT ? '' : '/app'}${navigationSlug.replace(':instanceId', instance?.[property.id]?.id ??
+                        selectedInstance?.id ??
+                        '')}`
+                    : undefined, "aria-label": instance?.[property.id]?.name ??
+                    selectedInstance?.name }, instance?.[property.id]?.name ??
+                selectedInstance?.name ??
+                '')),
             canUpdateProperty &&
-                ((instance === null || instance === void 0 ? void 0 : instance[property.id]) || selectedInstance || (nestedFieldsView && (instance === null || instance === void 0 ? void 0 : instance.id))) ? (React.createElement(Tooltip, { title: `Unlink` },
+                (instance?.[property.id] || selectedInstance || (nestedFieldsView && instance?.id)) ? (React.createElement(Tooltip, { title: `Unlink` },
                 React.createElement("span", null,
                     React.createElement(IconButton, { onClick: (event) => {
                             event.stopPropagation();

package/dist/published/components/custom/Form/FormComponents/ObjectComponent/RelatedObjectInstance.d.ts

@@ -1,11 +1,11 @@
 /// <reference types="react" />
-import { ApiServices, Obj, ObjectInstance, Property, Reference, TableViewLayout, UserAccount } from '@evoke-platform/context';
+import { ApiServices, Obj, ObjectInstance, Property, TableViewLayout, UserAccount } from '@evoke-platform/context';
 export declare type RelatedObjectInstanceProps = {
     relatedObject?: Obj;
     property: Property;
     apiServices: ApiServices;
     setSelectedInstance: (selectedInstance: ObjectInstance) => void;
-    handleChangeObjectProperty: (propertyId: string, instance?: Reference | null) => void;
+    handleChangeObjectProperty: (propertyId: string, instance?: ObjectInstance | null) => void;
     instance: ObjectInstance;
     handleClose: () => void;
     mode: 'default' | 'existingOnly';

package/dist/published/components/custom/Form/FormComponents/ObjectComponent/RelatedObjectInstance.js

@@ -1,15 +1,6 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
 import { useAuthenticationContext, } from '@evoke-platform/context';
 import { LocalDateTime } from '@js-joda/core';
-import { isObject, pick } from 'lodash';
+import { isObject } from 'lodash';
 import React, { useState } from 'react';
 import { InfoRounded } from '../../../../../icons';
 import { Alert, Button, FormControlLabel, Radio, RadioGroup } from '../../../../core';
@@ -29,30 +20,28 @@ const styles = {
 };
 const DEFAULT_CREATE_ACTION = '_create';
 export const RelatedObjectInstance = (props) => {
-    var _a;
     const { relatedObject, property, setSelectedInstance, handleChangeObjectProperty, handleClose, apiServices, setSnackbarError, nestedFieldsView, mode, displayOption, setOptions, options, filter, user, layout, } = props;
     const [relationType, setRelationType] = useState(displayOption === 'dropdown' ? 'new' : 'existing');
     const [selectedRow, setSelectedRow] = useState();
     const [errors, setErrors] = useState([]);
-    const userAccount = user !== null && user !== void 0 ? user : (_a = useAuthenticationContext()) === null || _a === void 0 ? void 0 : _a.account;
-    const linkExistingInstance = () => __awaiter(void 0, void 0, void 0, function* () {
+    const userAccount = user ?? useAuthenticationContext()?.account;
+    const linkExistingInstance = async () => {
         if (selectedRow) {
             setSelectedInstance(selectedRow);
-            handleChangeObjectProperty(property.id, pick(selectedRow, 'id', 'name'));
+            handleChangeObjectProperty(property.id, selectedRow);
         }
         onClose();
-    });
-    const queryAddresses = (query) => __awaiter(void 0, void 0, void 0, function* () {
-        return yield apiServices.get(getPrefixedUrl(`/locations/search`), {
+    };
+    const queryAddresses = async (query) => {
+        return await apiServices.get(getPrefixedUrl(`/locations/search`), {
             params: { query: query },
         });
-    });
+    };
     const onClose = () => {
         handleClose();
         setErrors([]);
     };
-    const createNewInstance = (submission) => __awaiter(void 0, void 0, void 0, function* () {
-        var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+    const createNewInstance = async (submission) => {
         if (!relatedObject) {
             // Handle the case where relatedObject is undefined
             return { isSuccessful: false };
@@ -67,11 +56,11 @@ export const RelatedObjectInstance = (props) => {
             }), {});
         }
         try {
-            const instance = yield apiServices.post(getPrefixedUrl(`/objects/${relatedObject.id}/instances/actions`), {
+            const instance = await apiServices.post(getPrefixedUrl(`/objects/${relatedObject.id}/instances/actions`), {
                 actionId: DEFAULT_CREATE_ACTION,
                 input: submission,
             });
-            handleChangeObjectProperty(property.id, pick(instance, 'id', 'name'));
+            handleChangeObjectProperty(property.id, instance);
             setSelectedInstance(instance);
             setSnackbarError && setSnackbarError({ showAlert: true, message: 'New instance created', isError: false });
             normalizeDates([instance]);
@@ -84,14 +73,16 @@ export const RelatedObjectInstance = (props) => {
             setSnackbarError &&
                 setSnackbarError({
                     showAlert: true,
-                    message: (_k = (_g = (_f = (_e = (_d = (_c = (_b = err.response) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.error) === null || _d === void 0 ? void 0 : _d.details) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.message) !== null && _g !== void 0 ? _g : (_j = (_h = err.data) === null || _h === void 0 ? void 0 : _h.error) === null || _j === void 0 ? void 0 : _j.message) !== null && _k !== void 0 ? _k : `An error occurred. The new instance was not created.`,
+                    message: err.response?.data?.error?.details?.[0]?.message ??
+                        err.data?.error?.message ??
+                        `An error occurred. The new instance was not created.`,
                     isError: true,
                 });
-            error = (_m = (_l = err.response) === null || _l === void 0 ? void 0 : _l.data) === null || _m === void 0 ? void 0 : _m.error;
+            error = err.response?.data?.error;
             onClose();
         }
         return { isSuccessful, error };
-    });
+    };
     return (React.createElement(Box, { sx: { background: nestedFieldsView ? '#F4F6F8' : 'none', borderRadius: '8px' } },
         React.createElement(Box, { sx: { padding: '8px 24px 20px', '.MuiInputBase-root': { background: '#FFFF', borderRadius: '8px' } } },
             !nestedFieldsView && displayOption !== 'dropdown' && mode !== 'existingOnly' && (React.createElement(Grid, { container: true },
@@ -102,7 +93,7 @@ export const RelatedObjectInstance = (props) => {
                         }, value: relationType },
                         React.createElement(FormControlLabel, { value: "existing", control: React.createElement(Radio, null), label: "Existing" }),
                         React.createElement(FormControlLabel, { value: "new", control: React.createElement(Radio, null), label: "New" }))))),
-            (errors === null || errors === void 0 ? void 0 : errors.length) ? (React.createElement(Alert, { severity: "error", sx: { margin: '10px 0', borderRadius: '8px' }, icon: React.createElement(InfoRounded, { sx: { color: '#A22723' } }) }, errors.length === 1 ? (React.createElement(React.Fragment, null,
+            errors?.length ? (React.createElement(Alert, { severity: "error", sx: { margin: '10px 0', borderRadius: '8px' }, icon: React.createElement(InfoRounded, { sx: { color: '#A22723' } }) }, errors.length === 1 ? (React.createElement(React.Fragment, null,
                 "There is ",
                 React.createElement("strong", null, "1"),
                 " error")) : (React.createElement(React.Fragment, null,

package/dist/published/components/custom/Form/FormComponents/RepeatableFieldComponent/ActionDialog.js

@@ -1,12 +1,3 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
 import { concat } from 'lodash';
 import React, { useEffect, useState } from 'react';
 import { Close } from '../../../../../icons';
@@ -56,8 +47,7 @@ export const ActionDialog = (props) => {
             apiServices.get(getPrefixedUrl(`/objects/${object.id}/instances/${instanceId}/checkAccess`), {
                 params: { action: 'execute', field: action.id },
             }, (error, result) => {
-                var _a;
-                setHasAccess((_a = result === null || result === void 0 ? void 0 : result.result) !== null && _a !== void 0 ? _a : false);
+                setHasAccess(result?.result ?? false);
                 setLoading(false);
             });
         }
@@ -67,29 +57,35 @@ export const ActionDialog = (props) => {
         }
     }, [object, instanceId]);
     useEffect(() => {
-        var _a, _b, _c, _d, _e, _f;
-        const input = (((_a = action === null || action === void 0 ? void 0 : action.form) === null || _a === void 0 ? void 0 : _a.entries) && action.parameters) || (action === null || action === void 0 ? void 0 : action.inputProperties)
-            ? (_c = (((_b = action.form) === null || _b === void 0 ? void 0 : _b.entries) && action.parameters
+        const input = (action?.form?.entries && action.parameters) || action?.inputProperties
+            ? (action.form?.entries && action.parameters
                 ? convertFormToComponents(action.form.entries, action.parameters, object)
-                : action === null || action === void 0 ? void 0 : action.inputProperties)) === null || _c === void 0 ? void 0 : _c.filter((inputProperty) => (inputProperty === null || inputProperty === void 0 ? void 0 : inputProperty.key) !== (relatedProperty === null || relatedProperty === void 0 ? void 0 : relatedProperty.relatedPropertyId))
+                : action?.inputProperties)?.filter((inputProperty) => inputProperty?.key !== relatedProperty?.relatedPropertyId)
             : undefined;
-        const updatedAction = Object.assign(Object.assign({}, action), { form: input ? { entries: convertComponentsToForm(input) } : undefined });
-        const properties = (_d = object === null || object === void 0 ? void 0 : object.properties) === null || _d === void 0 ? void 0 : _d.filter((prop) => (prop === null || prop === void 0 ? void 0 : prop.id) !== (relatedProperty === null || relatedProperty === void 0 ? void 0 : relatedProperty.relatedPropertyId));
-        setUpdatedObject(Object.assign(Object.assign({}, object), { properties, actions: concat((_f = (_e = object === null || object === void 0 ? void 0 : object.actions) === null || _e === void 0 ? void 0 : _e.filter((a) => (a === null || a === void 0 ? void 0 : a.id) !== action.id)) !== null && _f !== void 0 ? _f : [], [updatedAction]) }));
+        const updatedAction = {
+            ...action,
+            form: input ? { entries: convertComponentsToForm(input) } : undefined,
+        };
+        const properties = object?.properties?.filter((prop) => prop?.id !== relatedProperty?.relatedPropertyId);
+        setUpdatedObject({
+            ...object,
+            properties,
+            actions: concat(object?.actions?.filter((a) => a?.id !== action.id) ?? [], [updatedAction]),
+        });
     }, [object]);
     return (React.createElement(Dialog, { maxWidth: 'md', fullWidth: true, open: open, onClose: (e, reason) => reason !== 'backdropClick' && onClose },
         React.createElement(DialogTitle, { sx: styles.dialogTitle },
             React.createElement(IconButton, { sx: styles.closeIcon, onClick: onClose },
                 React.createElement(Close, { fontSize: "small" })),
-            action && hasAccess && !loading ? action === null || action === void 0 ? void 0 : action.name : ''),
-        React.createElement(DialogContent, null, hasAccess ? (React.createElement(Box, { sx: { width: '100%', marginTop: '10px' } }, (action === null || action === void 0 ? void 0 : action.type) === 'delete' ? (React.createElement(React.Fragment, null,
+            action && hasAccess && !loading ? action?.name : ''),
+        React.createElement(DialogContent, null, hasAccess ? (React.createElement(Box, { sx: { width: '100%', marginTop: '10px' } }, action?.type === 'delete' ? (React.createElement(React.Fragment, null,
             React.createElement(Typography, null,
-                "Are you sure you want to delete this ", object === null || object === void 0 ? void 0 :
-                object.name,
+                "Are you sure you want to delete this ",
+                object?.name,
                 "?"),
             React.createElement(Box, { sx: { padding: '25ox 0 10px 0', display: 'flex', justifyContent: 'flex-end' } },
-                React.createElement(Button, { sx: Object.assign(Object.assign({}, styles.button), styles.cancelBtn), onClick: onClose }, "Cancel"),
-                React.createElement(LoadingButton, { sx: Object.assign(Object.assign({}, styles.button), styles.deleteBtn), onClick: () => handleSubmit('delete', undefined, instanceId, setSubmitting), loading: submitting }, "Delete")))) : (updatedObject && (React.createElement(Form, { actionId: action.id, actionType: action.type, apiServices: objectInputCommonProps.apiServices, object: updatedObject, instance: instanceInput, onSave: (data, setSubmitting) => __awaiter(void 0, void 0, void 0, function* () { return handleSubmit(action.type, data, instanceId, setSubmitting); }), objectInputCommonProps: objectInputCommonProps, closeModal: onClose, queryAddresses: queryAddresses, user: user }))))) : (React.createElement(React.Fragment, null, loading ? (React.createElement(React.Fragment, null,
+                React.createElement(Button, { sx: { ...styles.button, ...styles.cancelBtn }, onClick: onClose }, "Cancel"),
+                React.createElement(LoadingButton, { sx: { ...styles.button, ...styles.deleteBtn }, onClick: () => handleSubmit('delete', undefined, instanceId, setSubmitting), loading: submitting }, "Delete")))) : (updatedObject && (React.createElement(Form, { actionId: action.id, actionType: action.type, apiServices: objectInputCommonProps.apiServices, object: updatedObject, instance: instanceInput, onSave: async (data, setSubmitting) => handleSubmit(action.type, data, instanceId, setSubmitting), objectInputCommonProps: objectInputCommonProps, closeModal: onClose, queryAddresses: queryAddresses, user: user }))))) : (React.createElement(React.Fragment, null, loading ? (React.createElement(React.Fragment, null,
             React.createElement(Skeleton, { height: '30px', animation: 'wave' }),
             React.createElement(Skeleton, { height: '30px', animation: 'wave' }),
             React.createElement(Skeleton, { height: '30px', animation: 'wave' }))) : (React.createElement(ErrorComponent, { code: 'AccessDenied', message: 'You do not have permission to perform this action.', styles: { boxShadow: 'none' } })))))));

package/dist/published/components/custom/Form/FormComponents/RepeatableFieldComponent/ManyToMany/DropdownRepeatableField.js

@@ -1,12 +1,3 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
 import { useNotification, } from '@evoke-platform/context';
 import { debounce, isEmpty, isObject } from 'lodash';
 import React, { useCallback, useEffect, useState } from 'react';
@@ -14,7 +5,6 @@ import { Skeleton } from '../../../../../core';
 import { getMiddleObject, getPrefixedUrl, transformToWhere } from '../../../utils';
 import { DropdownRepeatableFieldInput } from './DropdownRepeatableFieldInput';
 export const DropdownRepeatableField = (props) => {
-    var _a;
     const { id, property, criteria, instance, readOnly, apiServices, initialMiddleObjectInstances, middleObject, getMiddleObjectInstances, fieldHeight, viewLayout, } = props;
     const [middleObjectInstances, setMiddleObjectInstances] = useState(initialMiddleObjectInstances);
     const [endObject, setEndObject] = useState();
@@ -29,29 +19,24 @@ export const DropdownRepeatableField = (props) => {
     });
     const [searchValue, setSearchValue] = useState('');
     const { instanceChanges } = useNotification();
-    const fetchMiddleObjectInstances = () => __awaiter(void 0, void 0, void 0, function* () {
-        const newInstances = yield getMiddleObjectInstances();
+    const fetchMiddleObjectInstances = async () => {
+        const newInstances = await getMiddleObjectInstances();
         setMiddleObjectInstances(newInstances);
-    });
+    };
     const setDropDownSelections = (instances) => {
         setSelectedOptions(instances
             .filter((currInstance) => property.manyToManyPropertyId in currInstance)
-            .map((currInstance) => {
-            var _a;
-            return ({
-                label: (_a = currInstance[property.manyToManyPropertyId]) === null || _a === void 0 ? void 0 : _a.name,
-                endObjectId: currInstance[property.manyToManyPropertyId].id,
-                middleObjectId: currInstance.id,
-            });
-        })
+            .map((currInstance) => ({
+            label: currInstance[property.manyToManyPropertyId]?.name,
+            endObjectId: currInstance[property.manyToManyPropertyId].id,
+            middleObjectId: currInstance.id,
+        }))
             .sort((instanceA, instanceB) => instanceA.label.localeCompare(instanceB.label)));
     };
     useEffect(() => {
-        var _a;
-        const endObjectProperty = (_a = middleObject === null || middleObject === void 0 ? void 0 : middleObject.properties) === null || _a === void 0 ? void 0 : _a.find((currProperty) => property.manyToManyPropertyId === currProperty.id);
+        const endObjectProperty = middleObject?.properties?.find((currProperty) => property.manyToManyPropertyId === currProperty.id);
         if (endObjectProperty && endObjectProperty.objectId) {
             apiServices.get(getPrefixedUrl(`/objects/${endObjectProperty.objectId}/effective`), { params: { filter: { fields: ['id', 'name', 'properties', 'viewLayout'] } } }, (error, effectiveObject) => {
-                var _a;
                 if (error) {
                     console.error(error);
                 }
@@ -61,8 +46,13 @@ export const DropdownRepeatableField = (props) => {
                     const endObject = effectiveObject;
                     setEndObject(endObject);
                     let defaultLayout;
-                    if ((_a = endObject.viewLayout) === null || _a === void 0 ? void 0 : _a.dropdown) {
-                        defaultLayout = Object.assign({ id: 'default', name: 'Default', objectId: endObject.id }, endObject.viewLayout.dropdown);
+                    if (endObject.viewLayout?.dropdown) {
+                        defaultLayout = {
+                            id: 'default',
+                            name: 'Default',
+                            objectId: endObject.id,
+                            ...endObject.viewLayout.dropdown,
+                        };
                     }
                     if (viewLayout) {
                         apiServices
@@ -78,23 +68,22 @@ export const DropdownRepeatableField = (props) => {
         }
     }, [middleObject, apiServices, viewLayout, property]);
     useEffect(() => {
-        instanceChanges === null || instanceChanges === void 0 ? void 0 : instanceChanges.subscribe(middleObject.rootObjectId, () => {
+        instanceChanges?.subscribe(middleObject.rootObjectId, () => {
             fetchMiddleObjectInstances();
         });
-        return () => instanceChanges === null || instanceChanges === void 0 ? void 0 : instanceChanges.unsubscribe(middleObject.rootObjectId);
+        return () => instanceChanges?.unsubscribe(middleObject.rootObjectId);
     }, [instanceChanges, fetchMiddleObjectInstances]);
     const fetchEndObjectInstances = useCallback((searchedName) => {
-        var _a;
         if (property.objectId && property.manyToManyPropertyId) {
             setLoading(true);
-            const endObjectProperty = (_a = middleObject.properties) === null || _a === void 0 ? void 0 : _a.find((currProperty) => property.manyToManyPropertyId === currProperty.id);
-            if (endObjectProperty === null || endObjectProperty === void 0 ? void 0 : endObjectProperty.objectId) {
+            const endObjectProperty = middleObject.properties?.find((currProperty) => property.manyToManyPropertyId === currProperty.id);
+            if (endObjectProperty?.objectId) {
                 const filter = {
                     limit: 100,
                     order: 'name ASC',
                 };
                 let searchCriteria = criteria && !isEmpty(criteria) ? transformToWhere(criteria) : {};
-                if (searchedName === null || searchedName === void 0 ? void 0 : searchedName.length) {
+                if (searchedName?.length) {
                     const nameCriteria = transformToWhere({
                         name: {
                             like: searchedName,
@@ -164,5 +153,5 @@ export const DropdownRepeatableField = (props) => {
             }
         });
     };
-    return initialLoading ? (React.createElement(Skeleton, null)) : (React.createElement(React.Fragment, null, middleObjectInstances && endObject && (React.createElement(DropdownRepeatableFieldInput, { id: id, property: property, readOnly: readOnly || !((_a = middleObject.actions) === null || _a === void 0 ? void 0 : _a.some((action) => action.id === '_create')), layout: layout, middleObjectInstances: middleObjectInstances, endObjectInstances: endObjectInstances !== null && endObjectInstances !== void 0 ? endObjectInstances : [], endObject: endObject, searchValue: searchValue, loading: loading, handleSaveMiddleInstance: saveMiddleInstance, handleRemoveMiddleInstance: removeMiddleInstance, setSearchValue: setSearchValue, setSnackbarError: setSnackbarError, snackbarError: snackbarError, selectedOptions: selectedOptions, setSelectedOptions: setSelectedOptions, setDropdownSelections: setDropDownSelections, fieldHeight: fieldHeight }))));
+    return initialLoading ? (React.createElement(Skeleton, null)) : (React.createElement(React.Fragment, null, middleObjectInstances && endObject && (React.createElement(DropdownRepeatableFieldInput, { id: id, property: property, readOnly: readOnly || !middleObject.actions?.some((action) => action.id === '_create'), layout: layout, middleObjectInstances: middleObjectInstances, endObjectInstances: endObjectInstances ?? [], endObject: endObject, searchValue: searchValue, loading: loading, handleSaveMiddleInstance: saveMiddleInstance, handleRemoveMiddleInstance: removeMiddleInstance, setSearchValue: setSearchValue, setSnackbarError: setSnackbarError, snackbarError: snackbarError, selectedOptions: selectedOptions, setSelectedOptions: setSelectedOptions, setDropdownSelections: setDropDownSelections, fieldHeight: fieldHeight }))));
 };