Enhance ObjectForm component with custom merge logic for array handling
- Introduced a custom mergeWith function to handle array replacements during state updates. - Updated initial form data setting to include computed values while maintaining editing state. - Refactored update event handler to utilize the new merge logic for improved data management.
This commit is contained in:
parent
4bd9acdc11
commit
aa6fe3c839
@ -14,10 +14,17 @@ import { useMessageContext } from '../context/MessageContext'
|
||||
import PropTypes from 'prop-types'
|
||||
import DeleteObjectModal from './DeleteObjectModal'
|
||||
import merge from 'lodash/merge'
|
||||
import mergeWith from 'lodash/mergeWith'
|
||||
import set from 'lodash/set'
|
||||
import { getModelByName } from '../../../database/ObjectModels'
|
||||
import { useNavigate } from 'react-router-dom'
|
||||
|
||||
const arrayReplaceCustomizer = (objValue, srcValue) => {
|
||||
if (Array.isArray(srcValue)) {
|
||||
return srcValue
|
||||
}
|
||||
}
|
||||
|
||||
const buildObjectFromEntries = (entries = []) => {
|
||||
return entries.reduce((acc, entry) => {
|
||||
const { namePath, value } = entry || {}
|
||||
@ -285,14 +292,14 @@ const ObjectForm = forwardRef(
|
||||
const lockEvent = await fetchObjectLock(id, type)
|
||||
setLock(lockEvent)
|
||||
onStateChangeRef.current({ lock: lockEvent })
|
||||
setObjectData({ ...data, _isEditing: isEditingRef.current })
|
||||
|
||||
serverObjectData.current = data
|
||||
|
||||
// Calculate and set computed values on initial load
|
||||
const computedEntries = calculateComputedValues(data, model)
|
||||
const computedValuesObject = buildObjectFromEntries(computedEntries)
|
||||
const initialFormData = merge({}, data, computedValuesObject)
|
||||
|
||||
setObjectData({ ...initialFormData, _isEditing: isEditingRef.current })
|
||||
form.setFieldsValue(initialFormData)
|
||||
setFetchLoading(false)
|
||||
onStateChangeRef.current({ loading: false })
|
||||
@ -318,7 +325,9 @@ const ObjectForm = forwardRef(
|
||||
|
||||
// Update event handler
|
||||
const updateObjectEventHandler = useCallback((value) => {
|
||||
setObjectData((prev) => merge({}, prev, value))
|
||||
setObjectData((prev) =>
|
||||
mergeWith({}, prev, value, arrayReplaceCustomizer)
|
||||
)
|
||||
}, [])
|
||||
|
||||
// Update event handler
|
||||
@ -540,15 +549,22 @@ const ObjectForm = forwardRef(
|
||||
}
|
||||
|
||||
const computedValuesObject = buildObjectFromEntries(computedEntries)
|
||||
const mergedFormValues = merge(
|
||||
const mergedFormValues = mergeWith(
|
||||
{},
|
||||
allFormValues,
|
||||
computedValuesObject
|
||||
arrayReplaceCustomizer
|
||||
)
|
||||
merge(mergedFormValues, computedValuesObject)
|
||||
|
||||
mergedFormValues._isEditing = isEditingRef.current
|
||||
|
||||
setObjectData((prev) => {
|
||||
return merge({}, prev, mergedFormValues)
|
||||
return mergeWith(
|
||||
{},
|
||||
prev,
|
||||
mergedFormValues,
|
||||
arrayReplaceCustomizer
|
||||
)
|
||||
})
|
||||
}}
|
||||
>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user