Files
payload/test/fields/collections/Array/AddRowButton.tsx
Jacob Fletcher 0f3f6e73da fix(ui): addFieldRow set modified (#9324)
Fixes #9264. When externally updating array or block rows through the
`addFieldRow` or `replaceFieldRow` methods, nested rich text fields
along with any custom components within them are never rendered. This is
because unless the form is explicitly set to modified, as the default
array and blocks fields currently do, the newly generated form-state
will skip the rendering step. Now, the underlying callbacks themselves
automatically set the form to modified to trigger rendering.
2024-11-19 08:52:50 -05:00

30 lines
571 B
TypeScript

'use client'
import { useForm } from '@payloadcms/ui'
const AddRowButton = () => {
const { addFieldRow } = useForm()
const handleClick = () => {
addFieldRow({
path: 'externallyUpdatedArray',
schemaPath: 'externallyUpdatedArray',
subFieldState: {
text: {
initialValue: 'Hello, world!',
valid: true,
value: 'Hello, world!',
},
},
})
}
return (
<button id="updateArrayExternally" onClick={handleClick} type="button">
Add Row
</button>
)
}
export default AddRowButton