Fixes #10234. Some fields, such as focal point fields for upload enabled collections, were rendering in the condition selector despite being hidden from the column selector. This was because the logic for the column selector was filtering fields without labels, but the same was not being done for the filter conditions. This, however, is not a good way to filter these fields as it requires this specific logic to be written in multiple places. Instead, they need to explicitly check for `hidden` and `disabled` in addition to `disableListFilter` and `disableListColumn`. The actual filtering logic has been improved across the two instances as well, removing multiple duplicative loops. This change has also exposed a underlying issue with the way columns were handled within the table columns provider. When row selections were enabled, the selector columns were present in column state. This caused problems when interacting with column indices, such as when reordering columns. Instead of needing to manually filter these out every time we need to work with column state, they no longer appear there in the first place. Instead, we inject the row selectors directly into the table itself, completely isolating these row selectors from the column state.
232 lines
5.2 KiB
TypeScript
232 lines
5.2 KiB
TypeScript
import type { CollectionConfig } from 'payload'
|
|
|
|
import { slateEditor } from '@payloadcms/richtext-slate'
|
|
|
|
import { slugPluralLabel, slugSingularLabel } from '../shared.js'
|
|
import { postsCollectionSlug } from '../slugs.js'
|
|
|
|
export const Posts: CollectionConfig = {
|
|
slug: postsCollectionSlug,
|
|
admin: {
|
|
defaultColumns: ['id', 'number', 'title', 'description', 'demoUIField'],
|
|
description: 'This is a custom collection description.',
|
|
group: 'One',
|
|
listSearchableFields: ['id', 'title', 'description', 'number'],
|
|
components: {
|
|
beforeListTable: [
|
|
'/components/ResetColumns/index.js#ResetDefaultColumnsButton',
|
|
{
|
|
path: '/components/Banner/index.js#Banner',
|
|
clientProps: {
|
|
message: 'BeforeListTable custom component',
|
|
},
|
|
},
|
|
],
|
|
Description: {
|
|
path: '/components/ViewDescription/index.js#ViewDescription',
|
|
},
|
|
afterListTable: [
|
|
{
|
|
path: '/components/Banner/index.js#Banner',
|
|
clientProps: {
|
|
message: 'AfterListTable custom component',
|
|
},
|
|
},
|
|
],
|
|
afterList: [
|
|
{
|
|
path: '/components/Banner/index.js#Banner',
|
|
clientProps: {
|
|
message: 'AfterList custom component',
|
|
},
|
|
},
|
|
],
|
|
beforeList: [
|
|
{
|
|
path: '/components/Banner/index.js#Banner',
|
|
clientProps: {
|
|
message: 'BeforeList custom component',
|
|
},
|
|
},
|
|
],
|
|
},
|
|
pagination: {
|
|
defaultLimit: 5,
|
|
limits: [5, 10, 15],
|
|
},
|
|
meta: {
|
|
description: 'This is a custom meta description for posts',
|
|
openGraph: {
|
|
description: 'This is a custom OG description for posts',
|
|
title: 'This is a custom OG title for posts',
|
|
},
|
|
},
|
|
preview: () => 'https://payloadcms.com',
|
|
useAsTitle: 'title',
|
|
},
|
|
fields: [
|
|
{
|
|
type: 'tabs',
|
|
tabs: [
|
|
{
|
|
fields: [
|
|
{
|
|
name: 'title',
|
|
type: 'text',
|
|
},
|
|
{
|
|
name: 'description',
|
|
type: 'text',
|
|
},
|
|
{
|
|
name: 'number',
|
|
type: 'number',
|
|
},
|
|
{
|
|
name: 'richText',
|
|
type: 'richText',
|
|
editor: slateEditor({
|
|
admin: {
|
|
elements: ['relationship'],
|
|
},
|
|
}),
|
|
},
|
|
{
|
|
name: 'demoUIField',
|
|
type: 'ui',
|
|
admin: {
|
|
components: {
|
|
Cell: '/components/DemoUIField/Cell.js#DemoUIFieldCell',
|
|
Field: '/components/DemoUIField/Field.js#DemoUIField',
|
|
},
|
|
},
|
|
label: 'Demo UI Field',
|
|
},
|
|
],
|
|
label: 'Tab 1',
|
|
},
|
|
],
|
|
},
|
|
{
|
|
name: 'arrayOfFields',
|
|
type: 'array',
|
|
admin: {
|
|
initCollapsed: true,
|
|
},
|
|
fields: [
|
|
{
|
|
name: 'optional',
|
|
type: 'text',
|
|
},
|
|
{
|
|
name: 'innerArrayOfFields',
|
|
type: 'array',
|
|
fields: [
|
|
{
|
|
name: 'innerOptional',
|
|
type: 'text',
|
|
},
|
|
],
|
|
},
|
|
],
|
|
},
|
|
{
|
|
name: 'group',
|
|
type: 'group',
|
|
fields: [
|
|
{
|
|
name: 'defaultValueField',
|
|
type: 'text',
|
|
defaultValue: 'testing',
|
|
},
|
|
{
|
|
name: 'title',
|
|
type: 'text',
|
|
},
|
|
],
|
|
},
|
|
{
|
|
name: 'someBlock',
|
|
type: 'blocks',
|
|
blocks: [
|
|
{
|
|
slug: 'textBlock',
|
|
fields: [
|
|
{
|
|
name: 'textFieldForBlock',
|
|
type: 'text',
|
|
},
|
|
],
|
|
},
|
|
],
|
|
},
|
|
{
|
|
name: 'defaultValueField',
|
|
type: 'text',
|
|
defaultValue: 'testing',
|
|
},
|
|
{
|
|
name: 'relationship',
|
|
type: 'relationship',
|
|
admin: {
|
|
position: 'sidebar',
|
|
},
|
|
relationTo: 'posts',
|
|
},
|
|
{
|
|
name: 'customCell',
|
|
type: 'text',
|
|
admin: {
|
|
components: {
|
|
Cell: '/components/CustomCell/index.js#CustomCell',
|
|
},
|
|
},
|
|
},
|
|
{
|
|
name: 'hiddenField',
|
|
type: 'text',
|
|
hidden: true,
|
|
},
|
|
{
|
|
name: 'adminHiddenField',
|
|
type: 'text',
|
|
admin: {
|
|
hidden: true,
|
|
},
|
|
},
|
|
{
|
|
name: 'disableListColumnText',
|
|
type: 'text',
|
|
admin: {
|
|
disableListColumn: true,
|
|
},
|
|
},
|
|
{
|
|
name: 'disableListFilterText',
|
|
type: 'text',
|
|
admin: {
|
|
disableListFilter: true,
|
|
},
|
|
},
|
|
{
|
|
name: 'sidebarField',
|
|
type: 'text',
|
|
access: {
|
|
update: () => false,
|
|
},
|
|
admin: {
|
|
description:
|
|
'This is a very long description that takes many characters to complete and hopefully will wrap instead of push the sidebar open, lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam, voluptatum voluptates. Quisquam, voluptatum voluptates.',
|
|
position: 'sidebar',
|
|
},
|
|
},
|
|
],
|
|
labels: {
|
|
plural: slugPluralLabel,
|
|
singular: slugSingularLabel,
|
|
},
|
|
versions: {
|
|
drafts: true,
|
|
},
|
|
}
|