@evoke-platform/ui-components 1.13.0-dev.7 → 1.14.0

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

@@ -1,11 +1,9 @@
 import { useApiServices, useAuthenticationContext, } from '@evoke-platform/context';
 import { WarningRounded } from '@mui/icons-material';
-import { useQuery } from '@tanstack/react-query';
-import DOMPurify from 'dompurify';
 import { isEmpty } from 'lodash';
-import React, { useMemo } from 'react';
+import React, { useEffect, useMemo } from 'react';
 import useWidgetSize, { useFormContext } from '../../../../theme/hooks';
-import { Skeleton, TextField, Typography } from '../../../core';
+import { TextField, Typography } from '../../../core';
 import { Box } from '../../../layout';
 import FormField from '../../FormField';
 import AccordionSections from './AccordionSections';
@@ -19,7 +17,8 @@ import { Image } from './FormFieldTypes/Image';
 import ObjectPropertyInput from './FormFieldTypes/relatedObjectFiles/ObjectPropertyInput';
 import UserProperty from './FormFieldTypes/UserProperty';
 import FormSections from './FormSections';
-import { entryIsVisible, fetchInitialMiddleObjectInstances, fetchMiddleObject, filterEmptySections, getEntryId, getFieldDefinition, isAddressProperty, isOptionEqualToValue, updateCriteriaInputs, } from './utils';
+import { entryIsVisible, fetchCollectionData, filterEmptySections, getEntryId, getFieldDefinition, isAddressProperty, isOptionEqualToValue, updateCriteriaInputs, } from './utils';
+import HtmlView from './HtmlView';
 function getFieldWrapperProps(fieldDefinition, entry, entryId, fieldValue, display, errors, validation) {
     return {
         inputId: entryId,
@@ -39,7 +38,7 @@ function getFieldWrapperProps(fieldDefinition, entry, entryId, fieldValue, displ
 }
 export function RecursiveEntryRenderer(props) {
     const { entry } = props;
-    const { object, getValues, errors, instance, richTextEditor: RichTextEditor, parameters, handleChange, onAutosave, fieldHeight, triggerFieldReset, associatedObject, width, } = useFormContext();
+    const { fetchedOptions, setFetchedOptions, object, getValues, errors, instance, richTextEditor: RichTextEditor, parameters, handleChange, onAutosave, fieldHeight, triggerFieldReset, associatedObject, width, } = useFormContext();
     const { isBelow, breakpoints } = useWidgetSize({
         scroll: false,
         defaultWidth: width,
@@ -51,41 +50,19 @@ export function RecursiveEntryRenderer(props) {
     const entryId = getEntryId(entry) || 'defaultId';
     const display = 'display' in entry ? entry.display : undefined;
     const fieldValue = entry.type === 'readonlyField' ? instance?.[entryId] : getValues ? getValues(entryId) : undefined;
+    const initialMiddleObjectInstances = fetchedOptions[`${entryId}InitialMiddleObjectInstances`];
+    const middleObject = fetchedOptions[`${entryId}MiddleObject`];
     const fieldDefinition = useMemo(() => {
         if (!object)
             return undefined;
         return getFieldDefinition(entry, object, parameters);
     }, [entry, parameters, object]);
     const validation = fieldDefinition?.validation || {};
-    const { data: middleObject } = useQuery({
-        queryKey: [fieldDefinition?.objectId, 'MiddleObject'],
-        queryFn: () => fetchMiddleObject(fieldDefinition, apiServices),
-        staleTime: Infinity,
-        enabled: !!(fieldDefinition?.objectId &&
-            fieldDefinition?.type === 'collection' &&
-            fieldDefinition?.manyToManyPropertyId),
-        meta: {
-            errorMessage: 'Failed to fetch middle object: ',
-        },
-    });
-    const { data: initialMiddleObjectInstances = [], isLoading: isLoadingInstances } = useQuery({
-        queryKey: [
-            fieldDefinition?.objectId,
-            instance?.id,
-            fieldDefinition?.relatedPropertyId,
-            'InitialMiddleObjectInstances',
-        ],
-        queryFn: () => fetchInitialMiddleObjectInstances(apiServices, fieldDefinition, instance?.id),
-        staleTime: Infinity,
-        enabled: !!(fieldDefinition?.objectId &&
-            instance?.id &&
-            fieldDefinition?.type === 'collection' &&
-            fieldDefinition?.manyToManyPropertyId &&
-            fieldDefinition?.relatedPropertyId),
-        meta: {
-            errorMessage: 'Failed to fetch middle object instances: ',
-        },
-    });
+    useEffect(() => {
+        if (fieldDefinition?.type === 'collection' && fieldDefinition?.manyToManyPropertyId && instance) {
+            fetchCollectionData(apiServices, fieldDefinition, setFetchedOptions, instance.id, fetchedOptions, initialMiddleObjectInstances);
+        }
+    }, [fieldDefinition, instance]);
     if (associatedObject?.propertyId === entryId)
         return null;
     // If the entry is hidden, clear its value and any nested values, and skip rendering
@@ -93,9 +70,7 @@ export function RecursiveEntryRenderer(props) {
         return null;
     }
     if (entry.type === 'content') {
-        return (React.createElement(Box, { dangerouslySetInnerHTML: { __html: DOMPurify.sanitize(entry.html) }, sx: {
-                fontFamily: 'Roboto, Helvetica, Arial, sans-serif',
-            } }));
+        return React.createElement(HtmlView, { value: entry.html });
     }
     else if ((entry.type === 'input' || entry.type === 'readonlyField' || entry.type === 'inputField') &&
         fieldDefinition) {
@@ -110,9 +85,7 @@ export function RecursiveEntryRenderer(props) {
             return (React.createElement(FieldWrapper, { ...getFieldWrapperProps(fieldDefinition, entry, entryId, fieldValue, display, errors) },
                 React.createElement(ObjectPropertyInput, { relatedObjectId: !fieldDefinition.objectId ? display?.relatedObjectId : fieldDefinition.objectId, fieldDefinition: fieldDefinition, id: entryId, mode: display?.mode || 'default', error: !!errors?.[entryId], displayOption: display?.relatedObjectDisplay || 'dialogBox', initialValue: fieldValue, readOnly: entry.type === 'readonlyField', filter: 'criteria' in validation && validation.criteria
                         ? updateCriteriaInputs(validation.criteria, getValues(), userAccount, instance)
-                        : entry.display?.criteria
-                            ? updateCriteriaInputs(entry.display?.criteria, getValues(), userAccount, instance)
-                            : undefined, sortBy: typeof display?.defaultValue === 'object' && 'sortBy' in display.defaultValue
+                        : undefined, sortBy: typeof display?.defaultValue === 'object' && 'sortBy' in display.defaultValue
                         ? display?.defaultValue.sortBy
                         : undefined, orderBy: typeof display?.defaultValue === 'object' && 'orderBy' in display.defaultValue
                         ? display?.defaultValue.orderBy
@@ -126,11 +99,12 @@ export function RecursiveEntryRenderer(props) {
         }
         else if (fieldDefinition.type === 'collection') {
             if (fieldDefinition?.manyToManyPropertyId) {
-                if (!isEmpty(middleObject)) {
-                    return isLoadingInstances ? (React.createElement(Skeleton, null)) : (React.createElement(FieldWrapper, { ...getFieldWrapperProps(fieldDefinition, entry, entryId, fieldValue, display, errors) },
-                        React.createElement(DropdownRepeatableField, { initialMiddleObjectInstances: initialMiddleObjectInstances, fieldDefinition: fieldDefinition, id: entryId, middleObject: middleObject, readOnly: entry.type === 'readonlyField', criteria: 'criteria' in validation && validation.criteria
+                if (middleObject && !isEmpty(middleObject)) {
+                    return (initialMiddleObjectInstances && (React.createElement(FieldWrapper, { ...getFieldWrapperProps(fieldDefinition, entry, entryId, fieldValue, display, errors) },
+                        React.createElement(DropdownRepeatableField, { initialMiddleObjectInstances: fetchedOptions[`${entryId}MiddleObjectInstances`] ||
+                                initialMiddleObjectInstances, fieldDefinition: fieldDefinition, id: entryId, middleObject: middleObject, readOnly: entry.type === 'readonlyField', criteria: 'criteria' in validation && validation.criteria
                                 ? updateCriteriaInputs(validation.criteria, getValues(), userAccount, instance)
-                                : undefined, hasDescription: !!display?.description })));
+                                : undefined, hasDescription: !!display?.description }))));
                 }
                 else {
                     // when in the builder preview, the middle object won't be fetched so instead show an empty field
@@ -160,7 +134,7 @@ export function RecursiveEntryRenderer(props) {
         }
         else if (fieldDefinition.type === 'document' || fieldDefinition.type === 'file') {
             return (React.createElement(FieldWrapper, { ...getFieldWrapperProps(fieldDefinition, entry, entryId, fieldValue, display, errors) },
-                React.createElement(Document, { id: entryId, fieldType: fieldDefinition.type, error: !!errors?.[entryId], value: fieldValue, canUpdateProperty: !(entry.type === 'readonlyField'), hasDescription: !!display?.description, validate: validation })));
+                React.createElement(Document, { id: entryId, error: !!errors?.[entryId], value: fieldValue, canUpdateProperty: !(entry.type === 'readonlyField'), hasDescription: !!display?.description, validate: validation })));
         }
         else if (fieldDefinition.type === 'criteria') {
             return (React.createElement(FieldWrapper, { ...getFieldWrapperProps(fieldDefinition, entry, entryId, fieldValue, display, errors) },

package/dist/published/components/custom/FormV2/components/types.d.ts

@@ -12,10 +12,9 @@ export type FieldAddress = {
 export type AccessCheck = {
     result: boolean;
 };
-export type DocumentReference = {
+export type SavedDocumentReference = {
     id: string;
     name: string;
-    unsaved?: boolean;
 };
 export type Document = {
     id: string;
@@ -113,7 +112,3 @@ export type InstanceLink = {
     id: string;
     objectId: string;
 };
-export type FileUploadBatchResult = {
-    errorMessage?: string;
-    successfulUploads: DocumentReference[];
-};

package/dist/published/components/custom/FormV2/components/utils.d.ts

@@ -1,10 +1,10 @@
 /// <reference types="react" />
-import { Action, ApiServices, Column, Columns, EvokeForm, FormEntry, InputField, InputParameter, InputParameterReference, Obj, ObjectInstance, ObjWithRoot, PanelViewEntry, Property, Section, Sections, UserAccount } from '@evoke-platform/context';
+import { Action, ApiServices, Column, Columns, EvokeForm, FormEntry, InputField, InputParameter, InputParameterReference, Obj, ObjectInstance, Property, Section, Sections, UserAccount } from '@evoke-platform/context';
 import { LocalDateTime } from '@js-joda/core';
 import { FieldErrors, FieldValues } from 'react-hook-form';
 import { ObjectProperty } from '../../../../types';
 import { AutocompleteOption } from '../../../core';
-import { DocumentReference, FileUploadBatchResult, InstanceLink } from './types';
+import { InstanceLink, SavedDocumentReference } from './types';
 export declare const scrollIntoViewWithOffset: (el: HTMLElement, offset: number, container?: HTMLElement) => void;
 export declare const normalizeDateTime: (dateTime: LocalDateTime) => string;
 export declare function isAddressProperty(key: string): boolean;
@@ -41,8 +41,7 @@ export declare function getDefaultPages(parameters: InputParameter[], defaultPag
     [x: string]: string;
 }>;
 export declare function updateCriteriaInputs(criteria: Record<string, unknown>, data: Record<string, unknown>, user?: UserAccount, instance?: Record<string, unknown>): Record<string, unknown>;
-export declare const fetchMiddleObject: (fieldDefinition: InputParameter | Property, apiServices: ApiServices) => Promise<ObjWithRoot | undefined>;
-export declare const fetchInitialMiddleObjectInstances: (apiServices: ApiServices, fieldDefinition: InputParameter | Property, instanceId: string) => Promise<ObjectInstance[]>;
+export declare function fetchCollectionData(apiServices: ApiServices, fieldDefinition: InputParameter | Property, setFetchedOptions: (newData: FieldValues) => void, instanceId?: string, fetchedOptions?: Record<string, unknown>, initialMiddleObjectInstances?: ObjectInstance[]): Promise<void>;
 export declare const getErrorCountForSection: (section: Section | Column, errors?: FieldErrors) => number;
 export declare const propertyToParameter: (property: Property) => InputParameter;
 export declare const propertyValidationToParameterValidation: (property: Property) => InputParameter['validation'];
@@ -50,13 +49,16 @@ export declare const convertPropertiesToParams: (object: Obj) => InputParameter[
 export declare function getUnnestedEntries(entries: FormEntry[]): FormEntry[];
 export declare const isEmptyWithDefault: (fieldValue: unknown, entry: InputParameterReference | InputField, instance: Record<string, unknown> | object) => boolean | "" | 0 | undefined;
 export declare const docProperties: Property[];
-export declare const uploadFiles: (files: (File | DocumentReference)[], apiServices: ApiServices, actionId?: string, linkTo?: InstanceLink, shortCircuit?: boolean) => Promise<FileUploadBatchResult>;
+/**
+ * Upload files using the POST /files endpoint for sys__file objects
+ */
+export declare const uploadFiles: (files: (File | SavedDocumentReference)[], apiServices: ApiServices, actionId?: string, metadata?: Record<string, string>, linkTo?: InstanceLink) => Promise<SavedDocumentReference[]>;
 /**
  * Creates file links for uploaded files by calling the objects endpoint with sys__fileLink
  * This is used after instance creation when the instance ID becomes available
  */
-export declare const createFileLinks: (fileReferences: DocumentReference[], linkedInstance: InstanceLink, apiServices: ApiServices) => Promise<void>;
-export declare const uploadDocuments: (files: (File | DocumentReference)[], metadata: Record<string, string>, apiServices: ApiServices, instanceId: string, objectId: string) => Promise<DocumentReference[]>;
+export declare const createFileLinks: (files: SavedDocumentReference[], linkedInstance: InstanceLink, apiServices: ApiServices) => Promise<void>;
+export declare const uploadDocuments: (files: (File | SavedDocumentReference)[], metadata: Record<string, string>, apiServices: ApiServices, instanceId: string, objectId: string) => Promise<SavedDocumentReference[]>;
 export declare const deleteDocuments: (submittedFields: FieldValues, requestSuccess: boolean, apiServices: ApiServices, object: Obj, instance: FieldValues, action?: Action, setSnackbarError?: React.Dispatch<React.SetStateAction<{
     showAlert: boolean;
     message?: string;
@@ -82,10 +84,9 @@ export declare function formatSubmission(submission: FieldValues, apiServices?:
 }>>, associatedObject?: {
     instanceId: string;
     propertyId: string;
-    objectId?: string;
 }, parameters?: InputParameter[]): Promise<FieldValues>;
 export declare function filterEmptySections(entry: Sections | Columns, instance?: FieldValues, formData?: FieldValues): Sections | Columns | null;
-export declare function assignIdsToSectionsAndRichText(entries: FormEntry[] | PanelViewEntry[], object: Obj, parameters?: InputParameter[]): FormEntry[] | PanelViewEntry[];
+export declare function assignIdsToSectionsAndRichText(entries: FormEntry[], object: Obj, parameters?: InputParameter[]): FormEntry[];
 /**
  * Converts a plain text string to RTF format suitable for a RichTextEditor.
  *
@@ -99,6 +100,5 @@ export declare function assignIdsToSectionsAndRichText(entries: FormEntry[] | Pa
  * This ensures that any plain text input will be safely represented in RTF without losing formatting or characters.
  */
 export declare function plainTextToRtf(plainText: string): string;
-export declare function getFieldDefinition(entry: FormEntry | PanelViewEntry, object: Obj, parameters?: InputParameter[]): InputParameter | Property | undefined;
+export declare function getFieldDefinition(entry: FormEntry, object: Obj, parameters?: InputParameter[]): InputParameter | Property | undefined;
 export declare function obfuscateValue(value: unknown, property?: Partial<Property> | Partial<ObjectProperty>): unknown;
-export declare function useFormById(formId: string, apiServices: ApiServices, errorMessage?: string): import("@tanstack/react-query/build/legacy/types").UseQueryResult<EvokeForm, Error>;

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

@@ -1,5 +1,4 @@
 import { LocalDateTime } from '@js-joda/core';
-import { useQuery } from '@tanstack/react-query';
 import { jsonLogic } from 'json-logic-js-graphql';
 import { get, isArray, isEmpty, isObject, omit, pick, startCase, transform } from 'lodash';
 import { DateTime } from 'luxon';
@@ -116,27 +115,9 @@ export const getEntryId = (entry) => {
                 ? entry.input.id
                 : undefined;
 };
-const getEntryType = (entry, parameters) => {
-    if (entry?.type === 'inputField') {
-        return entry?.input?.type;
-    }
-    else if (entry?.type === 'input') {
-        // For 'input' type entries, look up the parameter by parameterId
-        const parameter = parameters?.find((param) => param.id === entry.parameterId);
-        return parameter?.type;
-    }
-};
 export function getPrefixedUrl(url) {
     const wcsMatchers = ['/apps', '/pages', '/widgets'];
-    const dataMatchers = [
-        '/objects',
-        '/correspondenceTemplates',
-        '/documents',
-        '/payments',
-        '/forms',
-        '/locations',
-        '/files',
-    ];
+    const dataMatchers = ['/objects', '/correspondenceTemplates', '/documents', '/payments', '/forms', '/locations'];
     const signalrMatchers = ['/hubs'];
     const accessManagementMatchers = ['/users'];
     const workflowMatchers = ['/workflows'];
@@ -351,19 +332,31 @@ export function updateCriteriaInputs(criteria, data, user, instance) {
             },
         }));
 }
-export const fetchMiddleObject = async (fieldDefinition, apiServices) => {
-    return await apiServices.get(getPrefixedUrl(`/objects/${fieldDefinition.objectId}/effective?sanitizedVersion=true`), {
-        params: {
-            filter: { fields: ['properties', 'actions', 'rootObjectId'] },
-        },
-    });
-};
-export const fetchInitialMiddleObjectInstances = async (apiServices, fieldDefinition, instanceId) => {
-    const filter = getMiddleObjectFilter(fieldDefinition, instanceId);
-    return await apiServices.get(getPrefixedUrl(`/objects/${fieldDefinition.objectId}/instances`), {
-        params: { filter: JSON.stringify(filter) },
-    });
-};
+export async function fetchCollectionData(apiServices, fieldDefinition, setFetchedOptions, instanceId, fetchedOptions, initialMiddleObjectInstances) {
+    try {
+        if ((fetchedOptions && !fetchedOptions[`${fieldDefinition.id}MiddleObject`]) || !fetchedOptions) {
+            const fetchedMiddleObject = await apiServices.get(getPrefixedUrl(`/objects/${fieldDefinition.objectId}/effective?sanitizedVersion=true`), {
+                params: {
+                    filter: { fields: ['properties', 'actions', 'rootObjectId'] },
+                },
+            });
+            setFetchedOptions({ [`${fieldDefinition.id}MiddleObject`]: fetchedMiddleObject });
+        }
+        // Fetch the initial middle object instances
+        const filter = instanceId ? getMiddleObjectFilter(fieldDefinition, instanceId) : {};
+        if (!isArray(initialMiddleObjectInstances)) {
+            const fetchedInitialMiddleObjectInstances = await apiServices.get(getPrefixedUrl(`/objects/${fieldDefinition.objectId}/instances`), {
+                params: { filter: JSON.stringify(filter) },
+            });
+            setFetchedOptions({
+                [`${fieldDefinition.id}InitialMiddleObjectInstances`]: fetchedInitialMiddleObjectInstances,
+            });
+        }
+    }
+    catch (error) {
+        console.error('Error fetching collection data:', error);
+    }
+}
 export const getErrorCountForSection = (section, errors) => {
     const entries = section.entries || [];
     return isArray(section.entries)
@@ -476,90 +469,53 @@ export const docProperties = [
         type: 'string',
     },
 ];
-export const uploadFiles = async (files, apiServices, actionId = '_create', linkTo, shortCircuit = true) => {
+/**
+ * Upload files using the POST /files endpoint for sys__file objects
+ */
+export const uploadFiles = async (files, apiServices, actionId = '_create', metadata, linkTo) => {
     // Separate already uploaded files from files that need uploading
     const alreadyUploaded = files.filter((file) => !('size' in file));
     const filesToUpload = files.filter((file) => 'size' in file);
-    let failedUpload = false;
-    // Upload all files in parallel, handling each result individually
-    const uploadPromises = [];
-    for (const file of filesToUpload) {
+    // Upload all files in parallel
+    const uploadPromises = filesToUpload.map(async (file) => {
         const formData = new FormData();
         formData.append('file', file);
         formData.append('actionId', actionId);
         formData.append('objectId', 'sys__file');
-        formData.append('input', JSON.stringify({ name: file.name, contentType: file.type }));
+        if (metadata) {
+            for (const [key, value] of Object.entries(metadata)) {
+                formData.append(key, value);
+            }
+        }
         if (linkTo) {
             formData.append('linkTo', JSON.stringify(linkTo));
         }
-        const uploadPromise = (async () => {
-            try {
-                const fileInstance = await apiServices.post(getPrefixedUrl(`/files`), formData);
-                return {
-                    id: fileInstance.id,
-                    name: fileInstance.name,
-                    unsaved: true,
-                };
-            }
-            catch (error) {
-                console.error(`Failed to upload file ${file.name}:`, error);
-                failedUpload = true;
-            }
-        })();
-        uploadPromises.push(uploadPromise);
-    }
-    if (!shortCircuit) {
-        // Wait for all upload attempts to complete (successes and failures)
-        const uploadResults = await Promise.allSettled(uploadPromises);
-        const uploadedFiles = uploadResults
-            .filter((result) => result.status === 'fulfilled' && !!result.value)
-            .map((result) => result.value);
-        const failedCount = filesToUpload.length - uploadedFiles.length;
+        const fileInstance = await apiServices.post(getPrefixedUrl(`/files`), formData);
         return {
-            successfulUploads: [...alreadyUploaded, ...uploadedFiles],
-            errorMessage: failedCount > 0 ? `Failed to upload ${failedCount} file(s)` : undefined,
+            id: fileInstance.id,
+            name: fileInstance.name,
         };
-    }
+    });
     const uploadedFiles = await Promise.all(uploadPromises);
-    if (failedUpload) {
-        return {
-            successfulUploads: [],
-            errorMessage: 'An error occurred when uploading files',
-        };
-    }
-    return {
-        successfulUploads: [...alreadyUploaded, ...uploadedFiles],
-    };
+    return [...alreadyUploaded, ...uploadedFiles];
 };
 /**
  * Creates file links for uploaded files by calling the objects endpoint with sys__fileLink
  * This is used after instance creation when the instance ID becomes available
  */
-export const createFileLinks = async (fileReferences, linkedInstance, apiServices) => {
-    // Link files in parallel, handling each result individually
-    const linkPromises = [];
-    for (const file of fileReferences) {
-        const linkPromise = (async () => {
-            try {
-                await apiServices.post(getPrefixedUrl(`/objects/sys__fileLink/instances`), {
-                    name: 'File Link',
-                    file: { id: file.id, name: file.name },
-                    linkedInstance,
-                }, {
-                    params: {
-                        actionId: '_create',
-                    },
-                });
-            }
-            catch (error) {
-                console.error(`Failed to create file link for ${file.name}:`, error);
-                // The file remains unlinked and can be retried later
-            }
-        })();
-        linkPromises.push(linkPromise);
-    }
-    // Wait for all linking attempts to complete (successes and failures)
-    await Promise.allSettled(linkPromises);
+export const createFileLinks = async (files, linkedInstance, apiServices) => {
+    const linkPromises = files.map(async (file) => {
+        await apiServices.post(getPrefixedUrl(`/objects/sys__fileLink/instances`), {
+            name: 'File Link',
+            file: { id: file.id, name: file.name },
+            linkedInstance,
+        }, {
+            params: {
+                actionId: '_create',
+            },
+        });
+    });
+    await Promise.all(linkPromises);
 };
 export const uploadDocuments = async (files, metadata, apiServices, instanceId, objectId) => {
     const allDocuments = [];
@@ -587,29 +543,20 @@ export const uploadDocuments = async (files, metadata, apiServices, instanceId,
 export const deleteDocuments = async (submittedFields, requestSuccess, apiServices, object, instance, action, setSnackbarError) => {
     const documentProperties = action?.parameters
         ? action.parameters.filter((param) => ['document', 'file'].includes(param.type))
-        : object.properties?.filter((prop) => ['document', 'file'].includes(prop.type));
+        : object?.properties?.filter((prop) => ['document', 'file'].includes(prop.type));
     for (const docProperty of documentProperties ?? []) {
         const savedValue = submittedFields[docProperty.id];
-        const originalValue = instance[docProperty.id];
+        const originalValue = instance?.[docProperty.id];
         const documentsToRemove = requestSuccess
             ? (originalValue?.filter((file) => !savedValue?.some((f) => f.id === file.id)) ?? [])
             : (savedValue?.filter((file) => !originalValue?.some((f) => f.id === file.id)) ?? []);
         for (const doc of documentsToRemove) {
             try {
-                // Build context for state model
-                const fieldType = docProperty.type === 'file' ? 'file' : 'document';
-                if (fieldType === 'file') {
-                    // For file properties, unlink the file. Don't delete the actual file
-                    // since other instances may be using it.
-                    await apiServices.post(getPrefixedUrl(`/files/${doc.id}/unlinkInstance`), {
-                        linkedInstanceId: instance.id,
-                        linkedObjectId: object.id,
-                    });
-                }
-                else {
-                    // For document properties, delete the document
-                    await apiServices.delete(getPrefixedUrl(`/objects/${object.id}/instances/${instance.id}/documents/${doc.id}`));
-                }
+                // Use different endpoints based on property type
+                const deleteEndpoint = docProperty.type === 'file'
+                    ? getPrefixedUrl(`/files/${doc.id}`)
+                    : getPrefixedUrl(`/objects/${object.id}/instances/${instance.id}/documents/${doc.id}`);
+                await apiServices?.delete(deleteEndpoint);
             }
             catch (error) {
                 if (error) {
@@ -624,28 +571,16 @@ export const deleteDocuments = async (submittedFields, requestSuccess, apiServic
         }
     }
 };
-async function handleUploads(files, propertyType, entry, apiServices, objectId, instanceId) {
-    if (propertyType === 'file') {
-        // Get the createActionId from display options, default to '_create'
-        const createActionId = entry?.display?.createActionId ?? '_create';
-        return await uploadFiles(files, apiServices, createActionId, instanceId ? { id: instanceId, objectId } : undefined);
-    }
-    else if (propertyType === 'document' && instanceId) {
-        try {
-            const docs = await uploadDocuments(files, {
-                type: '',
-                view_permission: '',
-                ...entry?.documentMetadata,
-            }, apiServices, instanceId, objectId);
-            return { successfulUploads: docs };
-        }
-        catch (error) {
-            console.error('Error uploading documents:', error);
-            return { successfulUploads: [], errorMessage: 'Error uploading documents' };
-        }
-    }
-    return { successfulUploads: [] };
-}
+const getEntryType = (entry, parameters) => {
+    if (entry?.type === 'inputField') {
+        return entry.input.type;
+    }
+    else if (entry?.type === 'input') {
+        // For 'input' type entries, look up the parameter by parameterId
+        const parameter = parameters?.find((param) => param.id === entry.parameterId);
+        return parameter?.type;
+    }
+};
 /**
  * Transforms a form submission into a format safe for API submission.
  *
@@ -663,45 +598,45 @@ export async function formatSubmission(submission, apiServices, objectId, instan
     if (associatedObject) {
         delete submission[associatedObject.propertyId];
     }
-    const allEntries = getUnnestedEntries(form?.entries ?? []);
+    const allEntries = getUnnestedEntries(form?.entries ?? []) ?? [];
     for (const [key, value] of Object.entries(submission)) {
         const entry = allEntries?.find((entry) => getEntryId(entry) === key);
         if (isArray(value)) {
-            const propertyType = getEntryType(entry, parameters);
-            // The only array types we need to handle specially are 'file' and 'document'.
-            if (propertyType !== 'file' && propertyType !== 'document') {
-                continue;
-            }
-            // Only upload if array contains File instances (not SavedDocumentReference).
+            // Only upload if array contains File instances (not SavedDocumentReference)
             const fileInArray = value.some((item) => item instanceof File);
             if (fileInArray && apiServices && objectId) {
-                const result = await handleUploads(value, propertyType ?? '', entry, apiServices, objectId, instanceId);
-                if (result.errorMessage) {
-                    setSnackbarError?.({
-                        showAlert: true,
-                        // Provide generic message since we're ignoring a partial upload.
-                        message: `An error occurred while uploading associated ${propertyType === 'file' ? 'files' : 'documents'}`,
-                        isError: true,
-                    });
-                    return submission;
+                // Determine property type from the entry
+                const parameterType = getEntryType(entry, parameters);
+                try {
+                    let uploadedDocuments = [];
+                    if (parameterType === 'file') {
+                        uploadedDocuments = await uploadFiles(value, apiServices, '_create', {
+                            ...entry?.documentMetadata,
+                        }, 
+                        // Only pass linkTo if instanceId exists (update action)
+                        instanceId ? { id: instanceId, objectId } : undefined);
+                    }
+                    else if (parameterType === 'document' && instanceId) {
+                        uploadedDocuments = await uploadDocuments(value, {
+                            type: '',
+                            view_permission: '',
+                            ...entry?.documentMetadata,
+                        }, apiServices, instanceId, objectId);
+                    }
+                    submission[key] = uploadedDocuments;
                 }
-                else {
-                    // Filter out 'unsaved' flag before submission since the api doesn't know about it.
-                    submission[key] = result.successfulUploads.map((file) => ({ id: file.id, name: file.name }));
+                catch (err) {
+                    if (err) {
+                        setSnackbarError &&
+                            setSnackbarError({
+                                showAlert: true,
+                                message: `An error occurred while uploading associated ${parameterType === 'file' ? 'files' : 'documents'}`,
+                                isError: true,
+                            });
+                    }
+                    return submission;
                 }
             }
-            else {
-                // Filter out 'unsaved' flag before submission since the api doesn't know about it.
-                submission[key] = value
-                    // This should never happen but it's possible that the else branch
-                    // is reached because either 'apiServices' or 'objectId' is undefined.
-                    // If that's the case the submission will fail if we submit File blobs.
-                    .filter((file) => !(file instanceof File))
-                    .map((file) => ({
-                    id: file.id,
-                    name: file.name,
-                }));
-            }
             // if there are address fields with no value address needs to be set to undefined to be able to submit
         }
         else if (typeof value === 'object' && value !== null) {
@@ -714,8 +649,7 @@ export async function formatSubmission(submission, apiServices, objectId, instan
                 submission[key] =
                     entry &&
                         ['input', 'inputField'].includes(entry.type) &&
-                        (entry.display?.relatedObjectId ||
-                            associatedObject?.objectId)
+                        entry.display?.relatedObjectId
                         ? pick(value, 'id', 'name', 'objectId')
                         : pick(value, 'id', 'name');
             }
@@ -947,14 +881,3 @@ function applyMaskToObfuscatedValue(value, mask) {
     }
     return maskedValue;
 }
-export function useFormById(formId, apiServices, errorMessage) {
-    return useQuery({
-        queryKey: ['form', formId],
-        enabled: formId !== '_auto_' && !!formId,
-        staleTime: Infinity,
-        queryFn: () => apiServices.get(getPrefixedUrl(`/forms/${formId}`)),
-        meta: {
-            errorMessage,
-        },
-    });
-}