From b80dd88ea1be2faec073c6ef9e29b70938d84804 Mon Sep 17 00:00:00 2001 From: Vitaly Vasin Date: Fri, 28 Jun 2024 18:12:55 +0200 Subject: [PATCH 1/2] feat: add destroyOnUnregister property --- docs/lib.md | 1 + src/lib/core/components/Form/DynamicField.tsx | 6 ++++-- .../core/components/Form/hooks/useIntegrationFF.tsx | 10 +++++++--- 3 files changed, 12 insertions(+), 5 deletions(-) diff --git a/docs/lib.md b/docs/lib.md index aba9f099..76797dc1 100644 --- a/docs/lib.md +++ b/docs/lib.md @@ -18,6 +18,7 @@ This component serves as the primary entry point for drawing dynamic forms. | Monaco | `React.ComponentType` | | [MonacoEditor](https://github.com/react-monaco-editor/react-monaco-editor) component for Monaco [Input](./config.md#inputs) | | search | `string \| function` | | A string or function for performing a form search | | withoutInsertFFDebounce | `boolean` | | Flag that disables the delay before inserting data into the final-form store | +| destroyOnUnregister | `boolean` | | If true, the value of a field will be destroyed when that field is unregistered. Defaults to true | | generateRandomValue | `function` | | Function that is necessary to generate a random value | ### Controller diff --git a/src/lib/core/components/Form/DynamicField.tsx b/src/lib/core/components/Form/DynamicField.tsx index 4616d10b..4bdc0feb 100644 --- a/src/lib/core/components/Form/DynamicField.tsx +++ b/src/lib/core/components/Form/DynamicField.tsx @@ -1,8 +1,8 @@ import React from 'react'; +import get from 'lodash/get'; import isFunction from 'lodash/isFunction'; import isString from 'lodash/isString'; -import get from 'lodash/get'; import {isValidElementType} from 'react-is'; import type {MonacoEditorProps} from 'react-monaco-editor/lib/types'; @@ -30,6 +30,7 @@ export interface DynamicFieldProps { search?: string | ((spec: Spec, input: FieldValue, name: string) => boolean); generateRandomValue?: (spec: StringSpec) => string; withoutInsertFFDebounce?: boolean; + destroyOnUnregister?: boolean; mutators?: DynamicFormMutators; __mirror?: WonderMirror; } @@ -42,13 +43,14 @@ export const DynamicField: React.FC = ({ generateRandomValue, search, withoutInsertFFDebounce, + destroyOnUnregister = true, mutators: externalMutators, __mirror, }) => { const DynamicFormsCtx = useCreateContext(); const SearchContext = useCreateSearchContext(); const {tools, store} = useStore(name); - const watcher = useIntegrationFF(store, withoutInsertFFDebounce); + const watcher = useIntegrationFF(store, withoutInsertFFDebounce, destroyOnUnregister); const {mutatorsStore, mutateDFState} = useMutators(externalMutators); const {store: searchStore, setField, removeField, isHiddenField} = useSearchStore(); diff --git a/src/lib/core/components/Form/hooks/useIntegrationFF.tsx b/src/lib/core/components/Form/hooks/useIntegrationFF.tsx index 6b5938ef..086d0872 100644 --- a/src/lib/core/components/Form/hooks/useIntegrationFF.tsx +++ b/src/lib/core/components/Form/hooks/useIntegrationFF.tsx @@ -10,7 +10,11 @@ import {Field as FinalFormField, useForm} from 'react-final-form'; import {AsyncValidateError, BaseValidateError, DynamicFieldStore, FieldValue} from '../types'; import {transformArrOut} from '../utils'; -export const useIntegrationFF = (store: DynamicFieldStore, withoutDebounce?: boolean) => { +export const useIntegrationFF = ( + store: DynamicFieldStore, + withoutDebounce?: boolean, + destroyOnUnregister?: boolean, +) => { const form = useForm(); const watcher = React.useMemo(() => { @@ -64,11 +68,11 @@ export const useIntegrationFF = (store: DynamicFieldStore, withoutDebounce?: boo React.useEffect(() => { return () => { - if (store.name) { + if (store.name && destroyOnUnregister) { form.change(store.name, undefined); } }; - }, []); + }, [destroyOnUnregister]); return watcher; }; From 9bf28b83915ee596fae34c7a76096b157fa0457b Mon Sep 17 00:00:00 2001 From: Vitaly Vasin Date: Mon, 1 Jul 2024 10:35:31 +0200 Subject: [PATCH 2/2] fixup! feat: add destroyOnUnregister property --- src/lib/core/components/Form/hooks/useIntegrationFF.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/lib/core/components/Form/hooks/useIntegrationFF.tsx b/src/lib/core/components/Form/hooks/useIntegrationFF.tsx index 086d0872..f544e506 100644 --- a/src/lib/core/components/Form/hooks/useIntegrationFF.tsx +++ b/src/lib/core/components/Form/hooks/useIntegrationFF.tsx @@ -72,7 +72,7 @@ export const useIntegrationFF = ( form.change(store.name, undefined); } }; - }, [destroyOnUnregister]); + }, []); return watcher; };