From ee448736e72cbbe937197684099ea01926d2b73d Mon Sep 17 00:00:00 2001 From: CynthiaKamau Date: Wed, 8 Jan 2025 22:11:28 +0300 Subject: [PATCH] (feat) Add ability to track deleted fields in repeat component (#455) --- src/adapters/obs-adapter.test.ts | 2 ++ src/adapters/program-state-adapter.test.ts | 2 ++ src/components/renderer/form/form-renderer.component.tsx | 7 +++++-- src/components/renderer/form/state.ts | 7 ++++++- src/components/repeat/repeat.component.tsx | 3 +++ src/hooks/useFormStateHelpers.ts | 5 +++++ src/processors/encounter/encounter-processor-helper.ts | 7 ++++--- src/provider/form-provider.tsx | 2 ++ 8 files changed, 29 insertions(+), 6 deletions(-) diff --git a/src/adapters/obs-adapter.test.ts b/src/adapters/obs-adapter.test.ts index 401271baf..edcfcfe4c 100644 --- a/src/adapters/obs-adapter.test.ts +++ b/src/adapters/obs-adapter.test.ts @@ -28,6 +28,7 @@ const formContext = { formFieldAdapters: null, formFieldValidators: null, customDependencies: null, + deletedFields: [], getFormField: jest.fn(), addFormField: jest.fn(), updateFormField: jest.fn(), @@ -36,6 +37,7 @@ const formContext = { removeInvalidField: jest.fn(), setInvalidFields: jest.fn(), setForm: jest.fn(), + setDeletedFields: jest.fn(), } as FormContextProps; describe('ObsAdapter - transformFieldValue', () => { diff --git a/src/adapters/program-state-adapter.test.ts b/src/adapters/program-state-adapter.test.ts index c2b742509..58009f187 100644 --- a/src/adapters/program-state-adapter.test.ts +++ b/src/adapters/program-state-adapter.test.ts @@ -30,6 +30,7 @@ const formContext = { customDependencies: { patientPrograms: [], }, + deletedFields: [], getFormField: jest.fn(), addFormField: jest.fn(), updateFormField: jest.fn(), @@ -38,6 +39,7 @@ const formContext = { removeInvalidField: jest.fn(), setInvalidFields: jest.fn(), setForm: jest.fn(), + setDeletedFields: jest.fn(), } as FormContextProps; const field = { diff --git a/src/components/renderer/form/form-renderer.component.tsx b/src/components/renderer/form/form-renderer.component.tsx index 0fd01d772..eb981c101 100644 --- a/src/components/renderer/form/form-renderer.component.tsx +++ b/src/components/renderer/form/form-renderer.component.tsx @@ -37,7 +37,7 @@ export const FormRenderer = ({ formState: { isDirty }, } = methods; - const [{ formFields, invalidFields, formJson }, dispatch] = useReducer(formStateReducer, { + const [{ formFields, invalidFields, formJson, deletedFields }, dispatch] = useReducer(formStateReducer, { ...initialState, formFields: evaluatedFields, formJson: evaluatedFormJson, @@ -52,6 +52,7 @@ export const FormRenderer = ({ addInvalidField, removeInvalidField, setForm, + setDeletedFields, } = useFormStateHelpers(dispatch, formFields); useEffect(() => { @@ -75,6 +76,7 @@ export const FormRenderer = ({ formFields, formJson, invalidFields, + deletedFields, addFormField, updateFormField, getFormField, @@ -83,8 +85,9 @@ export const FormRenderer = ({ addInvalidField, removeInvalidField, setForm, + setDeletedFields, }; - }, [processorContext, workspaceLayout, methods, formFields, formJson, invalidFields]); + }, [processorContext, workspaceLayout, methods, formFields, formJson, invalidFields, deletedFields]); useEffect(() => { registerForm(formJson.name, isSubForm, context); diff --git a/src/components/renderer/form/state.ts b/src/components/renderer/form/state.ts index 4547338a5..02d4ddd0a 100644 --- a/src/components/renderer/form/state.ts +++ b/src/components/renderer/form/state.ts @@ -4,6 +4,7 @@ type FormState = { formFields: FormField[]; invalidFields: FormField[]; formJson: FormSchema; + deletedFields: FormField[]; }; type Action = @@ -15,12 +16,14 @@ type Action = | { type: 'ADD_INVALID_FIELD'; value: FormField } | { type: 'REMOVE_INVALID_FIELD'; value: string } | { type: 'CLEAR_INVALID_FIELDS' } - | { type: 'SET_FORM_JSON'; value: any }; + | { type: 'SET_FORM_JSON'; value: any } + | { type: 'SET_DELETED_FIELDS'; value: FormField[] }; const initialState: FormState = { formFields: [], invalidFields: [], formJson: null, + deletedFields: [], }; const formStateReducer = (state: FormState, action: Action): FormState => { @@ -46,6 +49,8 @@ const formStateReducer = (state: FormState, action: Action): FormState => { return { ...state, invalidFields: [] }; case 'SET_FORM_JSON': return { ...state, formJson: action.value }; + case 'SET_DELETED_FIELDS': + return { ...state, deletedFields: action.value }; default: return state; } diff --git a/src/components/repeat/repeat.component.tsx b/src/components/repeat/repeat.component.tsx index 26552f505..139e82ec6 100644 --- a/src/components/repeat/repeat.component.tsx +++ b/src/components/repeat/repeat.component.tsx @@ -32,6 +32,8 @@ const Repeat: React.FC = ({ field }) => { methods: { getValues, setValue }, addFormField, removeFormField, + deletedFields, + setDeletedFields, } = context; useEffect(() => { @@ -113,6 +115,7 @@ const Repeat: React.FC = ({ field }) => { clearSubmission(field); } setRows(rows.filter((q) => q.id !== field.id)); + setDeletedFields([...deletedFields, field]); removeFormField(field.id); }; diff --git a/src/hooks/useFormStateHelpers.ts b/src/hooks/useFormStateHelpers.ts index 4bdc25515..c124f34df 100644 --- a/src/hooks/useFormStateHelpers.ts +++ b/src/hooks/useFormStateHelpers.ts @@ -54,6 +54,10 @@ export function useFormStateHelpers(dispatch: Dispatch, formFields: Form dispatch({ type: 'SET_FORM_JSON', value: updateFormSectionReferences(formJson) }); }, []); + const setDeletedFields = useCallback((fields: FormField[]) => { + dispatch({ type: 'SET_DELETED_FIELDS', value: fields }); + }, []); + return { addFormField, updateFormField, @@ -63,5 +67,6 @@ export function useFormStateHelpers(dispatch: Dispatch, formFields: Form addInvalidField, removeInvalidField, setForm, + setDeletedFields, }; } diff --git a/src/processors/encounter/encounter-processor-helper.ts b/src/processors/encounter/encounter-processor-helper.ts index e7dd7e9b7..4c5be1055 100644 --- a/src/processors/encounter/encounter-processor-helper.ts +++ b/src/processors/encounter/encounter-processor-helper.ts @@ -25,10 +25,11 @@ export function prepareEncounter( encounterProvider: string, location: string, ) { - const { patient, formJson, domainObjectValue: encounter, formFields, visit } = context; + const { patient, formJson, domainObjectValue: encounter, formFields, visit, deletedFields } = context; + const allFormFields = [...formFields, ...deletedFields]; const obsForSubmission = []; - prepareObs(obsForSubmission, formFields); - const ordersForSubmission = prepareOrders(formFields); + prepareObs(obsForSubmission, allFormFields); + const ordersForSubmission = prepareOrders(allFormFields); let encounterForSubmission: OpenmrsEncounter = {}; if (encounter) { diff --git a/src/provider/form-provider.tsx b/src/provider/form-provider.tsx index 7afba936b..6a00b939c 100644 --- a/src/provider/form-provider.tsx +++ b/src/provider/form-provider.tsx @@ -7,6 +7,7 @@ export interface FormContextProps extends FormProcessorContextProps { methods: UseFormReturn; workspaceLayout: 'minimized' | 'maximized'; isSubmitting?: boolean; + deletedFields: FormField[]; getFormField?: (field: string) => FormField; addFormField?: (field: FormField) => void; updateFormField?: (field: FormField) => void; @@ -15,6 +16,7 @@ export interface FormContextProps extends FormProcessorContextProps { removeInvalidField?: (fieldId: string) => void; setInvalidFields?: (fields: FormField[]) => void; setForm?: (formJson: FormSchema) => void; + setDeletedFields?: (fields: FormField[]) => void; } export interface FormProviderProps extends FormContextProps {