diff --git a/src/admin/components/forms/field-types/HiddenInput/index.tsx b/src/admin/components/forms/field-types/HiddenInput/index.tsx index b195b9614f..13fd08a2fe 100644 --- a/src/admin/components/forms/field-types/HiddenInput/index.tsx +++ b/src/admin/components/forms/field-types/HiddenInput/index.tsx @@ -18,16 +18,17 @@ const HiddenInput: React.FC = (props) => { }); useEffect(() => { - if (valueFromProps !== undefined && value !== valueFromProps) { + if (valueFromProps !== undefined) { setValue(valueFromProps, disableModifyingForm); } - }, [valueFromProps, setValue, value, disableModifyingForm]); + }, [valueFromProps, setValue, disableModifyingForm]); return ( ); diff --git a/src/admin/components/forms/useField/index.tsx b/src/admin/components/forms/useField/index.tsx index f2821bb686..de13b1f6c1 100644 --- a/src/admin/components/forms/useField/index.tsx +++ b/src/admin/components/forms/useField/index.tsx @@ -1,7 +1,7 @@ import { useCallback, useMemo } from 'react'; import { useTranslation } from 'react-i18next'; import { useAuth } from '../../utilities/Auth'; -import { useFormProcessing, useFormSubmitted, useFormModified, useForm, useFormFields } from '../Form/context'; +import { useFormProcessing, useFormSubmitted, useFormModified, useForm, useFormFields, useWatchForm } from '../Form/context'; import { Options, FieldType } from './types'; import { useDocumentInfo } from '../../utilities/DocumentInfo'; import { useOperation } from '../../utilities/OperationProvider'; @@ -13,7 +13,7 @@ import { UPDATE } from '../Form/types'; * * @see https://payloadcms.com/docs/admin/hooks#usefield */ -const useField = (options: Options): FieldType => { +const useField = (options: Options): FieldType => { const { path, validate, @@ -24,13 +24,13 @@ const useField = (options: Options): FieldType => { const submitted = useFormSubmitted(); const processing = useFormProcessing(); - const modified = useFormModified(); const { user } = useAuth(); const { id } = useDocumentInfo(); const operation = useOperation(); const field = useFormFields(([fields]) => fields[path]); const { t } = useTranslation(); const dispatchField = useFormFields(([_, dispatch]) => dispatch); + const { fields } = useWatchForm(); const { getData, getSiblingData, setModified } = useForm(); @@ -44,7 +44,7 @@ const useField = (options: Options): FieldType => { const setValue = useCallback((e, disableModifyingForm = false) => { const val = (e && e.target) ? e.target.value : e; - if (!modified && !disableModifyingForm) { + if (!disableModifyingForm) { if (typeof setModified === 'function') { // Update modified state after field value comes back // to avoid cursor jump caused by state value / DOM mismatch @@ -62,7 +62,6 @@ const useField = (options: Options): FieldType => { }); }, [ setModified, - modified, path, dispatchField, disableFormData, @@ -148,6 +147,10 @@ const useField = (options: Options): FieldType => { field?.rows, ]); + if (path === 'items') { + console.log({ fieldRows: field.rows, fieldRowsFromState: fields.items.rows }); + } + return result; };