10ac9893ad
When rendering custom fields nested within arrays or blocks, such as the Lexical rich text editor which is treated as a custom field, these fields will sometimes disappear when form state requests are invoked sequentially. This is especially reproducible on slow networks. This is because form state invocations are placed into a [task queue](https://github.com/payloadcms/payload/pull/11579) which aborts the currently running tasks when a new one arrives. By doing this, local form state is never dispatched, and the second task in the queue becomes stale. The fix is to _not_ abort the currently running task. This will trigger a complete rendering cycle, and when the second task is invoked, local state will be up to date. Fixes #11340, #11425, and #11824.
82 lines
1.6 KiB
TypeScript
82 lines
1.6 KiB
TypeScript
import type { CollectionConfig } from 'payload'
|
|
|
|
import { lexicalEditor } from '@payloadcms/richtext-lexical'
|
|
|
|
export const postsSlug = 'posts'
|
|
|
|
export const PostsCollection: CollectionConfig = {
|
|
slug: postsSlug,
|
|
admin: {
|
|
useAsTitle: 'title',
|
|
},
|
|
fields: [
|
|
{
|
|
name: 'title',
|
|
type: 'text',
|
|
},
|
|
{
|
|
name: 'renderTracker',
|
|
type: 'text',
|
|
admin: {
|
|
components: {
|
|
Field: './collections/Posts/RenderTracker.js#RenderTracker',
|
|
},
|
|
},
|
|
},
|
|
{
|
|
name: 'validateUsingEvent',
|
|
type: 'text',
|
|
admin: {
|
|
description:
|
|
'This field should only validate on submit. Try typing "Not allowed" and submitting the form.',
|
|
},
|
|
validate: (value, { event }) => {
|
|
if (event === 'onChange') {
|
|
return true
|
|
}
|
|
|
|
if (value === 'Not allowed') {
|
|
return 'This field has been validated only on submit'
|
|
}
|
|
|
|
return true
|
|
},
|
|
},
|
|
{
|
|
name: 'blocks',
|
|
type: 'blocks',
|
|
blocks: [
|
|
{
|
|
slug: 'text',
|
|
fields: [
|
|
{
|
|
name: 'text',
|
|
type: 'text',
|
|
},
|
|
],
|
|
},
|
|
{
|
|
slug: 'number',
|
|
fields: [
|
|
{
|
|
name: 'number',
|
|
type: 'number',
|
|
},
|
|
],
|
|
},
|
|
],
|
|
},
|
|
{
|
|
name: 'array',
|
|
type: 'array',
|
|
fields: [
|
|
{
|
|
name: 'richText',
|
|
type: 'richText',
|
|
editor: lexicalEditor(),
|
|
},
|
|
],
|
|
},
|
|
],
|
|
}
|