If you have a beforeChange hook that manipulates arrays or blocks by
_adding rows_, the result of that hook will not be reflected in the UI
after save or autosave as you might expect.
For example, this hook that ensures at least one array row is populated:
```ts
{
type: 'array',
hooks: {
beforeChange: [
({ value }) =>
!value?.length
? [
// this is an added/computed row if attempt to save with no rows
]
: value,
],
},
// ...
}
```
When you save without any rows, this hook will have automatically
computed a row for you and saved it to the database. Form state will not
reflect this fact, however, until you refresh or navigate back.
This is for two reasons:
1. When merging server form state, we receive the new fields, but do not
receive the new rows. This is because the `acceptValues` flag only
applies to the `value` property of fields, but should also apply to the
`rows` property on `array` and `blocks` fields too.
2. When creating new form state on the server, the newly added rows are
not being flagged with `addedByServer`, and so never make it into form
state when it is merged in on the client. To do this we need to send the
previous form state to the server and set `renderAllFields` to false in
order receive this property as expected. Fixed by #13524.
Before:
https://github.com/user-attachments/assets/3ab07ef5-3afd-456f-a9a8-737909b75016
After:
https://github.com/user-attachments/assets/27ad1d83-9313-45a9-b44a-db1e64452a99
---
- To see the specific tasks where the Asana app for GitHub is being
used, see below:
- https://app.asana.com/0/0/1211094073049042
155 lines
4.6 KiB
JSON
155 lines
4.6 KiB
JSON
{
|
|
"compilerOptions": {
|
|
/* Strictness */
|
|
"strict": true,
|
|
"noUncheckedIndexedAccess": true,
|
|
"noImplicitOverride": true,
|
|
"composite": true,
|
|
"declaration": true,
|
|
"declarationMap": true,
|
|
"target": "ES2022",
|
|
"rootDir": "${configDir}/src",
|
|
"module": "NodeNext",
|
|
"moduleResolution": "NodeNext",
|
|
"allowJs": true,
|
|
"checkJs": false,
|
|
"esModuleInterop": true,
|
|
"forceConsistentCasingInFileNames": true,
|
|
"jsx": "preserve",
|
|
"outDir": "${configDir}/dist",
|
|
"resolveJsonModule": true,
|
|
"skipLibCheck": true,
|
|
"emitDeclarationOnly": true,
|
|
"sourceMap": true,
|
|
"lib": [
|
|
"DOM",
|
|
"DOM.Iterable",
|
|
"ES2022"
|
|
],
|
|
"types": [
|
|
"node",
|
|
"jest"
|
|
],
|
|
"incremental": true,
|
|
"isolatedModules": true,
|
|
"plugins": [
|
|
{
|
|
"name": "next"
|
|
}
|
|
],
|
|
"paths": {
|
|
"@payload-config": [
|
|
"./test/form-state/config.ts"
|
|
],
|
|
"@payloadcms/admin-bar": [
|
|
"./packages/admin-bar/src"
|
|
],
|
|
"@payloadcms/live-preview": [
|
|
"./packages/live-preview/src"
|
|
],
|
|
"@payloadcms/live-preview-react": [
|
|
"./packages/live-preview-react/src/index.ts"
|
|
],
|
|
"@payloadcms/live-preview-vue": [
|
|
"./packages/live-preview-vue/src/index.ts"
|
|
],
|
|
"@payloadcms/ui": [
|
|
"./packages/ui/src/exports/client/index.ts"
|
|
],
|
|
"@payloadcms/ui/shared": [
|
|
"./packages/ui/src/exports/shared/index.ts"
|
|
],
|
|
"@payloadcms/ui/rsc": [
|
|
"./packages/ui/src/exports/rsc/index.ts"
|
|
],
|
|
"@payloadcms/ui/scss": [
|
|
"./packages/ui/src/scss.scss"
|
|
],
|
|
"@payloadcms/ui/scss/app.scss": [
|
|
"./packages/ui/src/scss/app.scss"
|
|
],
|
|
"@payloadcms/next/*": [
|
|
"./packages/next/src/exports/*.ts"
|
|
],
|
|
"@payloadcms/richtext-lexical/client": [
|
|
"./packages/richtext-lexical/src/exports/client/index.ts"
|
|
],
|
|
"@payloadcms/richtext-lexical/rsc": [
|
|
"./packages/richtext-lexical/src/exports/server/rsc.ts"
|
|
],
|
|
"@payloadcms/richtext-slate/rsc": [
|
|
"./packages/richtext-slate/src/exports/server/rsc.ts"
|
|
],
|
|
"@payloadcms/richtext-slate/client": [
|
|
"./packages/richtext-slate/src/exports/client/index.ts"
|
|
],
|
|
"@payloadcms/plugin-seo/client": [
|
|
"./packages/plugin-seo/src/exports/client.ts"
|
|
],
|
|
"@payloadcms/plugin-sentry/client": [
|
|
"./packages/plugin-sentry/src/exports/client.ts"
|
|
],
|
|
"@payloadcms/plugin-stripe/client": [
|
|
"./packages/plugin-stripe/src/exports/client.ts"
|
|
],
|
|
"@payloadcms/plugin-search/client": [
|
|
"./packages/plugin-search/src/exports/client.ts"
|
|
],
|
|
"@payloadcms/plugin-form-builder/client": [
|
|
"./packages/plugin-form-builder/src/exports/client.ts"
|
|
],
|
|
"@payloadcms/plugin-import-export/rsc": [
|
|
"./packages/plugin-import-export/src/exports/rsc.ts"
|
|
],
|
|
"@payloadcms/plugin-multi-tenant/rsc": [
|
|
"./packages/plugin-multi-tenant/src/exports/rsc.ts"
|
|
],
|
|
"@payloadcms/plugin-multi-tenant/utilities": [
|
|
"./packages/plugin-multi-tenant/src/exports/utilities.ts"
|
|
],
|
|
"@payloadcms/plugin-multi-tenant/fields": [
|
|
"./packages/plugin-multi-tenant/src/exports/fields.ts"
|
|
],
|
|
"@payloadcms/plugin-multi-tenant/client": [
|
|
"./packages/plugin-multi-tenant/src/exports/client.ts"
|
|
],
|
|
"@payloadcms/plugin-multi-tenant": [
|
|
"./packages/plugin-multi-tenant/src/index.ts"
|
|
],
|
|
"@payloadcms/plugin-multi-tenant/translations/languages/all": [
|
|
"./packages/plugin-multi-tenant/src/translations/index.ts"
|
|
],
|
|
"@payloadcms/plugin-multi-tenant/translations/languages/*": [
|
|
"./packages/plugin-multi-tenant/src/translations/languages/*.ts"
|
|
],
|
|
"@payloadcms/next": [
|
|
"./packages/next/src/exports/*"
|
|
],
|
|
"@payloadcms/storage-azure/client": [
|
|
"./packages/storage-azure/src/exports/client.ts"
|
|
],
|
|
"@payloadcms/storage-s3/client": [
|
|
"./packages/storage-s3/src/exports/client.ts"
|
|
],
|
|
"@payloadcms/storage-vercel-blob/client": [
|
|
"./packages/storage-vercel-blob/src/exports/client.ts"
|
|
],
|
|
"@payloadcms/storage-gcs/client": [
|
|
"./packages/storage-gcs/src/exports/client.ts"
|
|
],
|
|
"@payloadcms/storage-uploadthing/client": [
|
|
"./packages/storage-uploadthing/src/exports/client.ts"
|
|
]
|
|
}
|
|
},
|
|
"include": [
|
|
"${configDir}/src"
|
|
],
|
|
"exclude": [
|
|
"${configDir}/dist",
|
|
"${configDir}/build",
|
|
"${configDir}/temp",
|
|
"**/*.spec.ts"
|
|
]
|
|
}
|