Compare commits

...

6 Commits

24 changed files with 3639 additions and 32 deletions

View File

@@ -25,24 +25,25 @@ export const MyCollection: CollectionConfig = {
The following options are available:
| Option | Description |
| -------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **`group`** | Text or localization object used to group Collection and Global links in the admin navigation. Set to `false` to hide the link from the navigation while keeping its routes accessible. |
| **`hidden`** | Set to true or a function, called with the current user, returning true to exclude this Collection from navigation and admin routing. |
| **`hooks`** | Admin-specific hooks for this Collection. [More details](../hooks/collections). |
| **`useAsTitle`** | Specify a top-level field to use for a document title throughout the Admin Panel. If no field is defined, the ID of the document is used as the title. A field with `virtual: true` cannot be used as the title. |
| **`description`** | Text to display below the Collection label in the List View to give editors more information. Alternatively, you can use the `admin.components.Description` to render a React component. [More details](#custom-components). |
| **`defaultColumns`** | Array of field names that correspond to which columns to show by default in this Collection's List View. |
| **`hideAPIURL`** | Hides the "API URL" meta field while editing documents within this Collection. |
| **`enableRichTextLink`** | The [Rich Text](../fields/rich-text) field features a `Link` element which allows for users to automatically reference related documents within their rich text. Set to `true` by default. |
| **`enableRichTextRelationship`** | The [Rich Text](../fields/rich-text) field features a `Relationship` element which allows for users to automatically reference related documents within their rich text. Set to `true` by default. |
| **`meta`** | Page metadata overrides to apply to this Collection within the Admin Panel. [More details](./metadata). |
| **`preview`** | Function to generate preview URLs within the Admin Panel that can point to your app. [More details](#preview). |
| **`livePreview`** | Enable real-time editing for instant visual feedback of your front-end application. [More details](../live-preview/overview). |
| **`components`** | Swap in your own React components to be used within this Collection. [More details](#custom-components). |
| **`listSearchableFields`** | Specify which fields should be searched in the List search view. [More details](#list-searchable-fields). |
| **`pagination`** | Set pagination-specific options for this Collection. [More details](#pagination). |
| **`baseListFilter`** | You can define a default base filter for this collection's List view, which will be merged into any filters that the user performs. |
| Option | Description |
| -------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **`group`** | Text or localization object used to group Collection and Global links in the admin navigation. Set to `false` to hide the link from the navigation while keeping its routes accessible. |
| **`hidden`** | Set to true or a function, called with the current user, returning true to exclude this Collection from navigation and admin routing. |
| **`hooks`** | Admin-specific hooks for this Collection. [More details](../hooks/collections). |
| **`useAsTitle`** | Specify a top-level field to use for a document title throughout the Admin Panel. If no field is defined, the ID of the document is used as the title. A field with `virtual: true` cannot be used as the title. |
| **`description`** | Text to display below the Collection label in the List View to give editors more information. Alternatively, you can use the `admin.components.Description` to render a React component. [More details](#custom-components). |
| **`defaultColumns`** | Array of field names that correspond to which columns to show by default in this Collection's List View. |
| **`forceRenderAllFields`** | Forces all fields in the Edit view to render immediately, regardless of scroll position. By default, this is set to `false` to improve performance, as fields are progressively rendered to balance load times. Enabling this option can make it easier to locate fields using browser search (e.g., `CMD+F`). |
| **`hideAPIURL`** | Hides the "API URL" meta field while editing documents within this Collection. |
| **`enableRichTextLink`** | The [Rich Text](../fields/rich-text) field features a `Link` element which allows for users to automatically reference related documents within their rich text. Set to `true` by default. |
| **`enableRichTextRelationship`** | The [Rich Text](../fields/rich-text) field features a `Relationship` element which allows for users to automatically reference related documents within their rich text. Set to `true` by default. |
| **`meta`** | Page metadata overrides to apply to this Collection within the Admin Panel. [More details](./metadata). |
| **`preview`** | Function to generate preview URLs within the Admin Panel that can point to your app. [More details](#preview). |
| **`livePreview`** | Enable real-time editing for instant visual feedback of your front-end application. [More details](../live-preview/overview). |
| **`components`** | Swap in your own React components to be used within this Collection. [More details](#custom-components). |
| **`listSearchableFields`** | Specify which fields should be searched in the List search view. [More details](#list-searchable-fields). |
| **`pagination`** | Set pagination-specific options for this Collection. [More details](#pagination). |
| **`baseListFilter`** | You can define a default base filter for this collection's List view, which will be merged into any filters that the user performs. |
### Custom Components

View File

@@ -25,15 +25,16 @@ export const MyGlobal: GlobalConfig = {
The following options are available:
| Option | Description |
| ----------------- | --------------------------------------------------------------------------------------------------------------------------------- |
| **`group`** | Text or localization object used to group Collection and Global links in the admin navigation. Set to `false` to hide the link from the navigation while keeping its routes accessible. |
| **`hidden`** | Set to true or a function, called with the current user, returning true to exclude this Global from navigation and admin routing. |
| **`components`** | Swap in your own React components to be used within this Global. [More details](#custom-components). |
| **`preview`** | Function to generate a preview URL within the Admin Panel for this Global that can point to your app. [More details](#preview). |
| **`livePreview`** | Enable real-time editing for instant visual feedback of your front-end application. [More details](../live-preview/overview). |
| **`hideAPIURL`** | Hides the "API URL" meta field while editing documents within this collection. |
| **`meta`** | Page metadata overrides to apply to this Global within the Admin Panel. [More details](./metadata). |
| Option | Description |
| -------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **`group`** | Text or localization object used to group Collection and Global links in the admin navigation. Set to `false` to hide the link from the navigation while keeping its routes accessible. |
| **`hidden`** | Set to true or a function, called with the current user, returning true to exclude this Global from navigation and admin routing. |
| **`components`** | Swap in your own React components to be used within this Global. [More details](#custom-components). |
| **`preview`** | Function to generate a preview URL within the Admin Panel for this Global that can point to your app. [More details](#preview). |
| **`livePreview`** | Enable real-time editing for instant visual feedback of your front-end application. [More details](../live-preview/overview). |
| **`hideAPIURL`** | Hides the "API URL" meta field while editing documents within this collection. |
| **`meta`** | Page metadata overrides to apply to this Global within the Admin Panel. [More details](./metadata). |
| **`forceRenderAllFields`** | Forces all fields in the Edit view to render immediately, regardless of scroll position. By default, this is set to `false` to improve performance, as fields are progressively rendered to balance load times. Enabling this option can make it easier to locate fields using browser search (e.g., `CMD+F`). |
### Custom Components

View File

@@ -530,6 +530,7 @@ const PreviewView: React.FC<Props> = ({
Description={Description}
docPermissions={docPermissions}
fields={fields}
forceRenderAllFields={docConfig?.admin?.forceRenderAllFields}
forceSidebarWrap
readOnly={isReadOnlyForIncomingUser || !hasSavePermission}
schemaPathSegments={[collectionSlug || globalSlug]}

View File

@@ -1,6 +1,6 @@
import type { MarkOptional } from 'ts-essentials'
import type { ArrayField, ArrayFieldClient, ClientField } from '../../fields/config/types.js'
import type { ArrayField, ArrayFieldClient } from '../../fields/config/types.js'
import type { ArrayFieldValidation } from '../../fields/validations.js'
import type { FieldErrorClientComponent, FieldErrorServerComponent } from '../forms/Error.js'
import type {

View File

@@ -334,6 +334,11 @@ export type CollectionAdminOptions = {
description?: EntityDescription
enableRichTextLink?: boolean
enableRichTextRelationship?: boolean
/**
* Forces all fields in the Edit view to render immediately, regardless of scroll position
* @default false
*/
forceRenderAllFields?: boolean
/**
* Specify a navigational group for collections in the admin sidebar.
* - Provide a string to place the entity in a custom group.

View File

@@ -116,6 +116,11 @@ export type GlobalAdminOptions = {
* Custom description for collection
*/
description?: EntityDescription
/**
* Forces all fields in the Edit view to render immediately, regardless of scroll position
* @default false
*/
forceRenderAllFields?: boolean
/**
* Specify a navigational group for globals in the admin sidebar.
* - Provide a string to place the entity in a custom group.

View File

@@ -168,6 +168,7 @@ export function EditForm({ submitted }: EditFormProps) {
}
docPermissions={docPermissions}
fields={collectionConfig.fields}
forceRenderAllFields={collectionConfig?.admin?.forceRenderAllFields}
schemaPathSegments={[collectionConfig.slug]}
/>
<ReportAllErrors />

View File

@@ -17,6 +17,7 @@ type Args = {
readonly Description?: React.ReactNode
readonly docPermissions: SanitizedDocumentPermissions
readonly fields: ClientField[]
readonly forceRenderAllFields?: boolean
readonly forceSidebarWrap?: boolean
readonly readOnly?: boolean
readonly schemaPathSegments: string[]
@@ -28,6 +29,7 @@ export const DocumentFields: React.FC<Args> = ({
Description,
docPermissions,
fields,
forceRenderAllFields,
forceSidebarWrap,
readOnly: readOnlyProp,
schemaPathSegments,
@@ -79,7 +81,7 @@ export const DocumentFields: React.FC<Args> = ({
<RenderFields
className={`${baseClass}__fields`}
fields={mainFields}
forceRender
forceRenderAllFields={forceRenderAllFields}
parentIndexPath=""
parentPath=""
parentSchemaPath={schemaPathSegments.join('.')}
@@ -95,7 +97,7 @@ export const DocumentFields: React.FC<Args> = ({
<div className={`${baseClass}__sidebar-fields`}>
<RenderFields
fields={sidebarFields}
forceRender
forceRenderAllFields={forceRenderAllFields}
parentIndexPath=""
parentPath=""
parentSchemaPath={schemaPathSegments.join('.')}

View File

@@ -50,7 +50,7 @@ export const ArrayRow: React.FC<ArrayRowProps> = ({
duplicateRow,
errorCount,
fields,
forceRender = false,
forceRender,
hasMaxRows,
isDragging,
isLoading: isLoadingFromProps,

View File

@@ -27,6 +27,7 @@ type BlocksFieldProps = {
duplicateRow: (rowIndex: number) => void
errorCount: number
fields: ClientField[]
forceRender?: boolean
hasMaxRows?: boolean
isLoading?: boolean
isSortable?: boolean
@@ -53,6 +54,7 @@ export const BlockRow: React.FC<BlocksFieldProps> = ({
duplicateRow,
errorCount,
fields,
forceRender,
hasMaxRows,
isLoading: isLoadingFromProps,
isSortable,
@@ -170,6 +172,7 @@ export const BlockRow: React.FC<BlocksFieldProps> = ({
<RenderFields
className={`${baseClass}__fields`}
fields={fields}
forceRender={forceRender}
margins="small"
parentIndexPath=""
parentPath={path}

View File

@@ -47,6 +47,7 @@ const BlocksFieldComponent: BlocksFieldClientComponent = (props) => {
minRows: minRowsProp,
required,
},
forceRender = false,
path,
permissions,
readOnly,
@@ -280,6 +281,7 @@ const BlocksFieldComponent: BlocksFieldClientComponent = (props) => {
duplicateRow={duplicateRow}
errorCount={rowErrorCount}
fields={blockConfig.fields}
forceRender={forceRender}
hasMaxRows={hasMaxRows}
isLoading={isLoading}
isSortable={isSortable}

View File

@@ -26,6 +26,7 @@ const CollapsibleFieldComponent: CollapsibleFieldClientComponent = (props) => {
const {
field,
field: { admin: { className, description, initCollapsed = false } = {}, fields, label } = {},
forceRender = false,
indexPath,
parentPath,
parentSchemaPath,
@@ -135,6 +136,7 @@ const CollapsibleFieldComponent: CollapsibleFieldClientComponent = (props) => {
>
<RenderFields
fields={fields}
forceRender={forceRender}
margins="small"
parentIndexPath={indexPath}
parentPath={parentPath}

View File

@@ -28,11 +28,13 @@ export const GroupFieldComponent: GroupFieldClientComponent = (props) => {
const {
field,
field: { name, admin: { className, description, hideGutter } = {}, fields, label },
forceRender = false,
path,
permissions,
readOnly,
schemaPath: schemaPathFromProps,
} = props
const schemaPath = schemaPathFromProps ?? name
const { i18n } = useTranslation()
@@ -101,6 +103,7 @@ export const GroupFieldComponent: GroupFieldClientComponent = (props) => {
{BeforeInput}
<RenderFields
fields={fields}
forceRender={forceRender}
margins="small"
parentIndexPath=""
parentPath={path}

View File

@@ -18,7 +18,8 @@ export const RenderFields: React.FC<RenderFieldsProps> = (props) => {
const {
className,
fields,
forceRender,
forceRender: forceRenderFromProps,
forceRenderAllFields,
margins,
parentIndexPath,
parentPath,
@@ -29,6 +30,8 @@ export const RenderFields: React.FC<RenderFieldsProps> = (props) => {
const operation = useOperation()
const forceRender = forceRenderAllFields || forceRenderFromProps
if (fields && fields.length > 0) {
return (
<RenderIfInViewport

View File

@@ -11,6 +11,7 @@ export type RenderFieldsProps = {
* If a number is provided, will immediately render fields _up to that index_.
*/
readonly forceRender?: boolean
readonly forceRenderAllFields?: boolean
readonly margins?: 'small' | false
readonly parentIndexPath: string
readonly parentPath: string

View File

@@ -582,6 +582,7 @@ export const DefaultEditView: React.FC<ClientSideEditViewProps> = ({
Description={Description}
docPermissions={docPermissions}
fields={docConfig.fields}
forceRenderAllFields={docConfig?.admin?.forceRenderAllFields}
readOnly={isReadOnlyForIncomingUser || !hasSavePermission}
schemaPathSegments={schemaPathSegments}
/>

View File

@@ -0,0 +1,532 @@
import type { CollectionConfig } from 'payload'
import { forceRenderCollectionSlug } from '../slugs.js'
export const CollectionForceRender: CollectionConfig = {
slug: forceRenderCollectionSlug,
admin: {
forceRenderAllFields: true,
},
fields: [
{
name: 'groupOne',
type: 'group',
fields: [
{
name: 'field1',
type: 'text',
},
{
name: 'field2',
type: 'text',
},
{
name: 'field3',
type: 'text',
},
{
name: 'field4',
type: 'text',
},
{
name: 'field5',
type: 'text',
},
],
},
{
name: 'groupTwo',
type: 'group',
fields: [
{
name: 'field6',
type: 'text',
},
{
name: 'field7',
type: 'text',
},
{
name: 'field8',
type: 'text',
},
{
name: 'field9',
type: 'text',
},
{
name: 'field10',
type: 'text',
},
],
},
{
name: 'groupThree',
type: 'group',
fields: [
{
name: 'field11',
type: 'text',
},
{
name: 'field12',
type: 'text',
},
{
name: 'field13',
type: 'text',
},
{
name: 'field14',
type: 'text',
},
{
name: 'field15',
type: 'text',
},
],
},
{
name: 'groupFour',
type: 'group',
fields: [
{
name: 'field16',
type: 'text',
},
{
name: 'field17',
type: 'text',
},
{
name: 'field18',
type: 'text',
},
{
name: 'field19',
type: 'text',
},
{
name: 'field20',
type: 'text',
},
],
},
{
name: 'groupFive',
type: 'group',
fields: [
{
name: 'field21',
type: 'text',
},
{
name: 'field22',
type: 'text',
},
{
name: 'field23',
type: 'text',
},
{
name: 'field24',
type: 'text',
},
{
name: 'field25',
type: 'text',
},
],
},
{
name: 'groupSix',
type: 'group',
fields: [
{
name: 'field26',
type: 'text',
},
{
name: 'field27',
type: 'text',
},
{
name: 'field28',
type: 'text',
},
{
name: 'field29',
type: 'text',
},
{
name: 'field30',
type: 'text',
},
],
},
{
name: 'groupSeven',
type: 'group',
fields: [
{
name: 'field31',
type: 'text',
},
{
name: 'field32',
type: 'text',
},
{
name: 'field33',
type: 'text',
},
{
name: 'field34',
type: 'text',
},
{
name: 'field35',
type: 'text',
},
],
},
{
name: 'groupEight',
type: 'group',
fields: [
{
name: 'field36',
type: 'text',
},
{
name: 'field37',
type: 'text',
},
{
name: 'field38',
type: 'text',
},
{
name: 'field39',
type: 'text',
},
{
name: 'field40',
type: 'text',
},
],
},
{
name: 'groupNine',
type: 'group',
fields: [
{
name: 'field41',
type: 'text',
},
{
name: 'field42',
type: 'text',
},
{
name: 'field43',
type: 'text',
},
{
name: 'field44',
type: 'text',
},
{
name: 'field45',
type: 'text',
},
],
},
{
name: 'groupTen',
type: 'group',
fields: [
{
name: 'field46',
type: 'text',
},
{
name: 'field47',
type: 'text',
},
{
name: 'field48',
type: 'text',
},
{
name: 'field49',
type: 'text',
},
{
name: 'field50',
type: 'text',
},
],
},
{
name: 'groupEleven',
type: 'group',
fields: [
{
name: 'field51',
type: 'text',
},
{
name: 'field52',
type: 'text',
},
{
name: 'field53',
type: 'text',
},
{
name: 'field54',
type: 'text',
},
{
name: 'field55',
type: 'text',
},
],
},
{
name: 'groupTwelve',
type: 'group',
fields: [
{
name: 'field56',
type: 'text',
},
{
name: 'field57',
type: 'text',
},
{
name: 'field58',
type: 'text',
},
{
name: 'field59',
type: 'text',
},
{
name: 'field60',
type: 'text',
},
],
},
{
name: 'groupThirteen',
type: 'group',
fields: [
{
name: 'field61',
type: 'text',
},
{
name: 'field62',
type: 'text',
},
{
name: 'field63',
type: 'text',
},
{
name: 'field64',
type: 'text',
},
{
name: 'field65',
type: 'text',
},
],
},
{
name: 'groupFourteen',
type: 'group',
fields: [
{
name: 'field66',
type: 'text',
},
{
name: 'field67',
type: 'text',
},
{
name: 'field68',
type: 'text',
},
{
name: 'field69',
type: 'text',
},
{
name: 'field70',
type: 'text',
},
],
},
{
name: 'groupFifteen',
type: 'group',
fields: [
{
name: 'field71',
type: 'text',
},
{
name: 'field72',
type: 'text',
},
{
name: 'field73',
type: 'text',
},
{
name: 'field74',
type: 'text',
},
{
name: 'field75',
type: 'text',
},
],
},
{
name: 'groupSixteen',
type: 'group',
fields: [
{
name: 'field76',
type: 'text',
},
{
name: 'field77',
type: 'text',
},
{
name: 'field78',
type: 'text',
},
{
name: 'field79',
type: 'text',
},
{
name: 'field80',
type: 'text',
},
],
},
{
name: 'groupSeventeen',
type: 'group',
fields: [
{
name: 'field81',
type: 'text',
},
{
name: 'field82',
type: 'text',
},
{
name: 'field83',
type: 'text',
},
{
name: 'field84',
type: 'text',
},
{
name: 'field85',
type: 'text',
},
],
},
{
name: 'groupEighteen',
type: 'group',
fields: [
{
name: 'field86',
type: 'text',
},
{
name: 'field87',
type: 'text',
},
{
name: 'field88',
type: 'text',
},
{
name: 'field89',
type: 'text',
},
{
name: 'field90',
type: 'text',
},
],
},
{
name: 'groupNineteen',
type: 'group',
fields: [
{
name: 'field91',
type: 'text',
},
{
name: 'field92',
type: 'text',
},
{
name: 'field93',
type: 'text',
},
{
name: 'field94',
type: 'text',
},
{
name: 'field95',
type: 'text',
},
],
},
{
name: 'groupTwenty',
type: 'group',
fields: [
{
name: 'field96',
type: 'text',
},
{
name: 'field97',
type: 'text',
},
{
name: 'field98',
type: 'text',
},
{
name: 'field99',
type: 'text',
},
{
name: 'field100',
type: 'text',
},
],
},
],
}

View File

@@ -0,0 +1,532 @@
import type { CollectionConfig } from 'payload'
import { noForceRenderCollectionSlug } from '../slugs.js'
export const CollectionNoForceRender: CollectionConfig = {
slug: noForceRenderCollectionSlug,
admin: {
forceRenderAllFields: false,
},
fields: [
{
name: 'groupOne',
type: 'group',
fields: [
{
name: 'field1',
type: 'text',
},
{
name: 'field2',
type: 'text',
},
{
name: 'field3',
type: 'text',
},
{
name: 'field4',
type: 'text',
},
{
name: 'field5',
type: 'text',
},
],
},
{
name: 'groupTwo',
type: 'group',
fields: [
{
name: 'field6',
type: 'text',
},
{
name: 'field7',
type: 'text',
},
{
name: 'field8',
type: 'text',
},
{
name: 'field9',
type: 'text',
},
{
name: 'field10',
type: 'text',
},
],
},
{
name: 'groupThree',
type: 'group',
fields: [
{
name: 'field11',
type: 'text',
},
{
name: 'field12',
type: 'text',
},
{
name: 'field13',
type: 'text',
},
{
name: 'field14',
type: 'text',
},
{
name: 'field15',
type: 'text',
},
],
},
{
name: 'groupFour',
type: 'group',
fields: [
{
name: 'field16',
type: 'text',
},
{
name: 'field17',
type: 'text',
},
{
name: 'field18',
type: 'text',
},
{
name: 'field19',
type: 'text',
},
{
name: 'field20',
type: 'text',
},
],
},
{
name: 'groupFive',
type: 'group',
fields: [
{
name: 'field21',
type: 'text',
},
{
name: 'field22',
type: 'text',
},
{
name: 'field23',
type: 'text',
},
{
name: 'field24',
type: 'text',
},
{
name: 'field25',
type: 'text',
},
],
},
{
name: 'groupSix',
type: 'group',
fields: [
{
name: 'field26',
type: 'text',
},
{
name: 'field27',
type: 'text',
},
{
name: 'field28',
type: 'text',
},
{
name: 'field29',
type: 'text',
},
{
name: 'field30',
type: 'text',
},
],
},
{
name: 'groupSeven',
type: 'group',
fields: [
{
name: 'field31',
type: 'text',
},
{
name: 'field32',
type: 'text',
},
{
name: 'field33',
type: 'text',
},
{
name: 'field34',
type: 'text',
},
{
name: 'field35',
type: 'text',
},
],
},
{
name: 'groupEight',
type: 'group',
fields: [
{
name: 'field36',
type: 'text',
},
{
name: 'field37',
type: 'text',
},
{
name: 'field38',
type: 'text',
},
{
name: 'field39',
type: 'text',
},
{
name: 'field40',
type: 'text',
},
],
},
{
name: 'groupNine',
type: 'group',
fields: [
{
name: 'field41',
type: 'text',
},
{
name: 'field42',
type: 'text',
},
{
name: 'field43',
type: 'text',
},
{
name: 'field44',
type: 'text',
},
{
name: 'field45',
type: 'text',
},
],
},
{
name: 'groupTen',
type: 'group',
fields: [
{
name: 'field46',
type: 'text',
},
{
name: 'field47',
type: 'text',
},
{
name: 'field48',
type: 'text',
},
{
name: 'field49',
type: 'text',
},
{
name: 'field50',
type: 'text',
},
],
},
{
name: 'groupEleven',
type: 'group',
fields: [
{
name: 'field51',
type: 'text',
},
{
name: 'field52',
type: 'text',
},
{
name: 'field53',
type: 'text',
},
{
name: 'field54',
type: 'text',
},
{
name: 'field55',
type: 'text',
},
],
},
{
name: 'groupTwelve',
type: 'group',
fields: [
{
name: 'field56',
type: 'text',
},
{
name: 'field57',
type: 'text',
},
{
name: 'field58',
type: 'text',
},
{
name: 'field59',
type: 'text',
},
{
name: 'field60',
type: 'text',
},
],
},
{
name: 'groupThirteen',
type: 'group',
fields: [
{
name: 'field61',
type: 'text',
},
{
name: 'field62',
type: 'text',
},
{
name: 'field63',
type: 'text',
},
{
name: 'field64',
type: 'text',
},
{
name: 'field65',
type: 'text',
},
],
},
{
name: 'groupFourteen',
type: 'group',
fields: [
{
name: 'field66',
type: 'text',
},
{
name: 'field67',
type: 'text',
},
{
name: 'field68',
type: 'text',
},
{
name: 'field69',
type: 'text',
},
{
name: 'field70',
type: 'text',
},
],
},
{
name: 'groupFifteen',
type: 'group',
fields: [
{
name: 'field71',
type: 'text',
},
{
name: 'field72',
type: 'text',
},
{
name: 'field73',
type: 'text',
},
{
name: 'field74',
type: 'text',
},
{
name: 'field75',
type: 'text',
},
],
},
{
name: 'groupSixteen',
type: 'group',
fields: [
{
name: 'field76',
type: 'text',
},
{
name: 'field77',
type: 'text',
},
{
name: 'field78',
type: 'text',
},
{
name: 'field79',
type: 'text',
},
{
name: 'field80',
type: 'text',
},
],
},
{
name: 'groupSeventeen',
type: 'group',
fields: [
{
name: 'field81',
type: 'text',
},
{
name: 'field82',
type: 'text',
},
{
name: 'field83',
type: 'text',
},
{
name: 'field84',
type: 'text',
},
{
name: 'field85',
type: 'text',
},
],
},
{
name: 'groupEighteen',
type: 'group',
fields: [
{
name: 'field86',
type: 'text',
},
{
name: 'field87',
type: 'text',
},
{
name: 'field88',
type: 'text',
},
{
name: 'field89',
type: 'text',
},
{
name: 'field90',
type: 'text',
},
],
},
{
name: 'groupNineteen',
type: 'group',
fields: [
{
name: 'field91',
type: 'text',
},
{
name: 'field92',
type: 'text',
},
{
name: 'field93',
type: 'text',
},
{
name: 'field94',
type: 'text',
},
{
name: 'field95',
type: 'text',
},
],
},
{
name: 'groupTwenty',
type: 'group',
fields: [
{
name: 'field96',
type: 'text',
},
{
name: 'field97',
type: 'text',
},
{
name: 'field98',
type: 'text',
},
{
name: 'field99',
type: 'text',
},
{
name: 'field100',
type: 'text',
},
],
},
],
}

View File

@@ -8,6 +8,7 @@ import { CustomFields } from './collections/CustomFields/index.js'
import { CustomViews1 } from './collections/CustomViews1.js'
import { CustomViews2 } from './collections/CustomViews2.js'
import { DisableDuplicate } from './collections/DisableDuplicate.js'
import { CollectionForceRender } from './collections/ForceRender.js'
import { Geo } from './collections/Geo.js'
import { CollectionGroup1A } from './collections/Group1A.js'
import { CollectionGroup1B } from './collections/Group1B.js'
@@ -15,6 +16,7 @@ import { CollectionGroup2A } from './collections/Group2A.js'
import { CollectionGroup2B } from './collections/Group2B.js'
import { CollectionHidden } from './collections/Hidden.js'
import { CollectionNoApiView } from './collections/NoApiView.js'
import { CollectionNoForceRender } from './collections/NoForceRender.js'
import { CollectionNotInView } from './collections/NotInView.js'
import { Posts } from './collections/Posts.js'
import { UploadCollection } from './collections/Upload.js'
@@ -22,11 +24,13 @@ import { Users } from './collections/Users.js'
import { with300Documents } from './collections/With300Documents.js'
import { CustomGlobalViews1 } from './globals/CustomViews1.js'
import { CustomGlobalViews2 } from './globals/CustomViews2.js'
import { GlobalForceRender } from './globals/ForceRender.js'
import { Global } from './globals/Global.js'
import { GlobalGroup1A } from './globals/Group1A.js'
import { GlobalGroup1B } from './globals/Group1B.js'
import { GlobalHidden } from './globals/Hidden.js'
import { GlobalNoApiView } from './globals/NoApiView.js'
import { GlobalNoForceRender } from './globals/NoForceRender.js'
import { GlobalNotInView } from './globals/NotInView.js'
import { Settings } from './globals/Settings.js'
import { seed } from './seed.js'
@@ -153,12 +157,16 @@ export default buildConfigWithDefaults({
CollectionGroup1B,
CollectionGroup2A,
CollectionGroup2B,
CollectionForceRender,
CollectionNoForceRender,
Geo,
DisableDuplicate,
BaseListFilter,
with300Documents,
],
globals: [
GlobalForceRender,
GlobalNoForceRender,
GlobalHidden,
GlobalNotInView,
GlobalNoApiView,

View File

@@ -34,6 +34,10 @@ import {
import {
customViews2CollectionSlug,
disableDuplicateSlug,
forceRenderCollectionSlug,
noForceRenderCollectionSlug,
forceRenderGlobalSlug,
noForceRenderGlobalSlug,
geoCollectionSlug,
globalSlug,
notInViewCollectionSlug,
@@ -69,6 +73,10 @@ describe('General', () => {
let globalURL: AdminUrlUtil
let customViewsURL: AdminUrlUtil
let disableDuplicateURL: AdminUrlUtil
let forceRenderCollectionURL: AdminUrlUtil
let forceRenderGlobalURL: AdminUrlUtil
let noForceRenderCollectionURL: AdminUrlUtil
let noForceRenderGlobalURL: AdminUrlUtil
let serverURL: string
let adminRoutes: ReturnType<typeof getRoutes>
@@ -88,6 +96,10 @@ describe('General', () => {
globalURL = new AdminUrlUtil(serverURL, globalSlug)
customViewsURL = new AdminUrlUtil(serverURL, customViews2CollectionSlug)
disableDuplicateURL = new AdminUrlUtil(serverURL, disableDuplicateSlug)
forceRenderCollectionURL = new AdminUrlUtil(serverURL, forceRenderCollectionSlug)
forceRenderGlobalURL = new AdminUrlUtil(serverURL, forceRenderGlobalSlug)
noForceRenderCollectionURL = new AdminUrlUtil(serverURL, noForceRenderCollectionSlug)
noForceRenderGlobalURL = new AdminUrlUtil(serverURL, noForceRenderGlobalSlug)
const context = await browser.newContext()
page = await context.newPage()
@@ -938,6 +950,64 @@ describe('General', () => {
await expect(toast).toBeVisible()
})
})
describe('browser search', () => {
test('should successfully find field in large collection edit view document', async () => {
await page.goto(forceRenderCollectionURL.create)
await page.waitForURL(forceRenderCollectionURL.create)
const isMac = process.platform === 'darwin'
const searchKey = isMac ? 'Meta+F' : 'Control+F'
await page.keyboard.press(searchKey)
await page.keyboard.type('Field100')
await expect(page.locator('label >> text=Field100')).toBeVisible()
})
test('should not find field in large collection edit view document', async () => {
await page.goto(noForceRenderCollectionURL.create)
await page.waitForURL(noForceRenderCollectionURL.create)
const isMac = process.platform === 'darwin'
const searchKey = isMac ? 'Meta+F' : 'Control+F'
await page.keyboard.press(searchKey)
await page.keyboard.type('Field100')
await expect(page.locator('label >> text=Field100')).toBeHidden()
})
test('should successfully find field in large global edit view document', async () => {
await page.goto(forceRenderGlobalURL.global(forceRenderGlobalSlug))
await page.waitForURL(forceRenderGlobalURL.global(forceRenderGlobalSlug))
const isMac = process.platform === 'darwin'
const searchKey = isMac ? 'Meta+F' : 'Control+F'
await page.keyboard.press(searchKey)
await page.keyboard.type('Field100')
await expect(page.locator('label >> text=Field100')).toBeVisible()
})
test('should not find field in large global edit view document', async () => {
await page.goto(noForceRenderGlobalURL.global(noForceRenderGlobalSlug))
await page.waitForURL(noForceRenderGlobalURL.global(noForceRenderGlobalSlug))
const isMac = process.platform === 'darwin'
const searchKey = isMac ? 'Meta+F' : 'Control+F'
await page.keyboard.press(searchKey)
await page.keyboard.type('Field100')
await expect(page.locator('label >> text=Field100')).toBeHidden()
})
})
})
async function deleteAllPosts() {

View File

@@ -0,0 +1,532 @@
import type { GlobalConfig } from 'payload'
import { forceRenderGlobalSlug } from '../slugs.js'
export const GlobalForceRender: GlobalConfig = {
slug: forceRenderGlobalSlug,
admin: {
forceRenderAllFields: true,
},
fields: [
{
name: 'groupOne',
type: 'group',
fields: [
{
name: 'field1',
type: 'text',
},
{
name: 'field2',
type: 'text',
},
{
name: 'field3',
type: 'text',
},
{
name: 'field4',
type: 'text',
},
{
name: 'field5',
type: 'text',
},
],
},
{
name: 'groupTwo',
type: 'group',
fields: [
{
name: 'field6',
type: 'text',
},
{
name: 'field7',
type: 'text',
},
{
name: 'field8',
type: 'text',
},
{
name: 'field9',
type: 'text',
},
{
name: 'field10',
type: 'text',
},
],
},
{
name: 'groupThree',
type: 'group',
fields: [
{
name: 'field11',
type: 'text',
},
{
name: 'field12',
type: 'text',
},
{
name: 'field13',
type: 'text',
},
{
name: 'field14',
type: 'text',
},
{
name: 'field15',
type: 'text',
},
],
},
{
name: 'groupFour',
type: 'group',
fields: [
{
name: 'field16',
type: 'text',
},
{
name: 'field17',
type: 'text',
},
{
name: 'field18',
type: 'text',
},
{
name: 'field19',
type: 'text',
},
{
name: 'field20',
type: 'text',
},
],
},
{
name: 'groupFive',
type: 'group',
fields: [
{
name: 'field21',
type: 'text',
},
{
name: 'field22',
type: 'text',
},
{
name: 'field23',
type: 'text',
},
{
name: 'field24',
type: 'text',
},
{
name: 'field25',
type: 'text',
},
],
},
{
name: 'groupSix',
type: 'group',
fields: [
{
name: 'field26',
type: 'text',
},
{
name: 'field27',
type: 'text',
},
{
name: 'field28',
type: 'text',
},
{
name: 'field29',
type: 'text',
},
{
name: 'field30',
type: 'text',
},
],
},
{
name: 'groupSeven',
type: 'group',
fields: [
{
name: 'field31',
type: 'text',
},
{
name: 'field32',
type: 'text',
},
{
name: 'field33',
type: 'text',
},
{
name: 'field34',
type: 'text',
},
{
name: 'field35',
type: 'text',
},
],
},
{
name: 'groupEight',
type: 'group',
fields: [
{
name: 'field36',
type: 'text',
},
{
name: 'field37',
type: 'text',
},
{
name: 'field38',
type: 'text',
},
{
name: 'field39',
type: 'text',
},
{
name: 'field40',
type: 'text',
},
],
},
{
name: 'groupNine',
type: 'group',
fields: [
{
name: 'field41',
type: 'text',
},
{
name: 'field42',
type: 'text',
},
{
name: 'field43',
type: 'text',
},
{
name: 'field44',
type: 'text',
},
{
name: 'field45',
type: 'text',
},
],
},
{
name: 'groupTen',
type: 'group',
fields: [
{
name: 'field46',
type: 'text',
},
{
name: 'field47',
type: 'text',
},
{
name: 'field48',
type: 'text',
},
{
name: 'field49',
type: 'text',
},
{
name: 'field50',
type: 'text',
},
],
},
{
name: 'groupEleven',
type: 'group',
fields: [
{
name: 'field51',
type: 'text',
},
{
name: 'field52',
type: 'text',
},
{
name: 'field53',
type: 'text',
},
{
name: 'field54',
type: 'text',
},
{
name: 'field55',
type: 'text',
},
],
},
{
name: 'groupTwelve',
type: 'group',
fields: [
{
name: 'field56',
type: 'text',
},
{
name: 'field57',
type: 'text',
},
{
name: 'field58',
type: 'text',
},
{
name: 'field59',
type: 'text',
},
{
name: 'field60',
type: 'text',
},
],
},
{
name: 'groupThirteen',
type: 'group',
fields: [
{
name: 'field61',
type: 'text',
},
{
name: 'field62',
type: 'text',
},
{
name: 'field63',
type: 'text',
},
{
name: 'field64',
type: 'text',
},
{
name: 'field65',
type: 'text',
},
],
},
{
name: 'groupFourteen',
type: 'group',
fields: [
{
name: 'field66',
type: 'text',
},
{
name: 'field67',
type: 'text',
},
{
name: 'field68',
type: 'text',
},
{
name: 'field69',
type: 'text',
},
{
name: 'field70',
type: 'text',
},
],
},
{
name: 'groupFifteen',
type: 'group',
fields: [
{
name: 'field71',
type: 'text',
},
{
name: 'field72',
type: 'text',
},
{
name: 'field73',
type: 'text',
},
{
name: 'field74',
type: 'text',
},
{
name: 'field75',
type: 'text',
},
],
},
{
name: 'groupSixteen',
type: 'group',
fields: [
{
name: 'field76',
type: 'text',
},
{
name: 'field77',
type: 'text',
},
{
name: 'field78',
type: 'text',
},
{
name: 'field79',
type: 'text',
},
{
name: 'field80',
type: 'text',
},
],
},
{
name: 'groupSeventeen',
type: 'group',
fields: [
{
name: 'field81',
type: 'text',
},
{
name: 'field82',
type: 'text',
},
{
name: 'field83',
type: 'text',
},
{
name: 'field84',
type: 'text',
},
{
name: 'field85',
type: 'text',
},
],
},
{
name: 'groupEighteen',
type: 'group',
fields: [
{
name: 'field86',
type: 'text',
},
{
name: 'field87',
type: 'text',
},
{
name: 'field88',
type: 'text',
},
{
name: 'field89',
type: 'text',
},
{
name: 'field90',
type: 'text',
},
],
},
{
name: 'groupNineteen',
type: 'group',
fields: [
{
name: 'field91',
type: 'text',
},
{
name: 'field92',
type: 'text',
},
{
name: 'field93',
type: 'text',
},
{
name: 'field94',
type: 'text',
},
{
name: 'field95',
type: 'text',
},
],
},
{
name: 'groupTwenty',
type: 'group',
fields: [
{
name: 'field96',
type: 'text',
},
{
name: 'field97',
type: 'text',
},
{
name: 'field98',
type: 'text',
},
{
name: 'field99',
type: 'text',
},
{
name: 'field100',
type: 'text',
},
],
},
],
}

View File

@@ -0,0 +1,532 @@
import type { GlobalConfig } from 'payload'
import { noForceRenderGlobalSlug } from '../slugs.js'
export const GlobalNoForceRender: GlobalConfig = {
slug: noForceRenderGlobalSlug,
admin: {
forceRenderAllFields: false,
},
fields: [
{
name: 'groupOne',
type: 'group',
fields: [
{
name: 'field1',
type: 'text',
},
{
name: 'field2',
type: 'text',
},
{
name: 'field3',
type: 'text',
},
{
name: 'field4',
type: 'text',
},
{
name: 'field5',
type: 'text',
},
],
},
{
name: 'groupTwo',
type: 'group',
fields: [
{
name: 'field6',
type: 'text',
},
{
name: 'field7',
type: 'text',
},
{
name: 'field8',
type: 'text',
},
{
name: 'field9',
type: 'text',
},
{
name: 'field10',
type: 'text',
},
],
},
{
name: 'groupThree',
type: 'group',
fields: [
{
name: 'field11',
type: 'text',
},
{
name: 'field12',
type: 'text',
},
{
name: 'field13',
type: 'text',
},
{
name: 'field14',
type: 'text',
},
{
name: 'field15',
type: 'text',
},
],
},
{
name: 'groupFour',
type: 'group',
fields: [
{
name: 'field16',
type: 'text',
},
{
name: 'field17',
type: 'text',
},
{
name: 'field18',
type: 'text',
},
{
name: 'field19',
type: 'text',
},
{
name: 'field20',
type: 'text',
},
],
},
{
name: 'groupFive',
type: 'group',
fields: [
{
name: 'field21',
type: 'text',
},
{
name: 'field22',
type: 'text',
},
{
name: 'field23',
type: 'text',
},
{
name: 'field24',
type: 'text',
},
{
name: 'field25',
type: 'text',
},
],
},
{
name: 'groupSix',
type: 'group',
fields: [
{
name: 'field26',
type: 'text',
},
{
name: 'field27',
type: 'text',
},
{
name: 'field28',
type: 'text',
},
{
name: 'field29',
type: 'text',
},
{
name: 'field30',
type: 'text',
},
],
},
{
name: 'groupSeven',
type: 'group',
fields: [
{
name: 'field31',
type: 'text',
},
{
name: 'field32',
type: 'text',
},
{
name: 'field33',
type: 'text',
},
{
name: 'field34',
type: 'text',
},
{
name: 'field35',
type: 'text',
},
],
},
{
name: 'groupEight',
type: 'group',
fields: [
{
name: 'field36',
type: 'text',
},
{
name: 'field37',
type: 'text',
},
{
name: 'field38',
type: 'text',
},
{
name: 'field39',
type: 'text',
},
{
name: 'field40',
type: 'text',
},
],
},
{
name: 'groupNine',
type: 'group',
fields: [
{
name: 'field41',
type: 'text',
},
{
name: 'field42',
type: 'text',
},
{
name: 'field43',
type: 'text',
},
{
name: 'field44',
type: 'text',
},
{
name: 'field45',
type: 'text',
},
],
},
{
name: 'groupTen',
type: 'group',
fields: [
{
name: 'field46',
type: 'text',
},
{
name: 'field47',
type: 'text',
},
{
name: 'field48',
type: 'text',
},
{
name: 'field49',
type: 'text',
},
{
name: 'field50',
type: 'text',
},
],
},
{
name: 'groupEleven',
type: 'group',
fields: [
{
name: 'field51',
type: 'text',
},
{
name: 'field52',
type: 'text',
},
{
name: 'field53',
type: 'text',
},
{
name: 'field54',
type: 'text',
},
{
name: 'field55',
type: 'text',
},
],
},
{
name: 'groupTwelve',
type: 'group',
fields: [
{
name: 'field56',
type: 'text',
},
{
name: 'field57',
type: 'text',
},
{
name: 'field58',
type: 'text',
},
{
name: 'field59',
type: 'text',
},
{
name: 'field60',
type: 'text',
},
],
},
{
name: 'groupThirteen',
type: 'group',
fields: [
{
name: 'field61',
type: 'text',
},
{
name: 'field62',
type: 'text',
},
{
name: 'field63',
type: 'text',
},
{
name: 'field64',
type: 'text',
},
{
name: 'field65',
type: 'text',
},
],
},
{
name: 'groupFourteen',
type: 'group',
fields: [
{
name: 'field66',
type: 'text',
},
{
name: 'field67',
type: 'text',
},
{
name: 'field68',
type: 'text',
},
{
name: 'field69',
type: 'text',
},
{
name: 'field70',
type: 'text',
},
],
},
{
name: 'groupFifteen',
type: 'group',
fields: [
{
name: 'field71',
type: 'text',
},
{
name: 'field72',
type: 'text',
},
{
name: 'field73',
type: 'text',
},
{
name: 'field74',
type: 'text',
},
{
name: 'field75',
type: 'text',
},
],
},
{
name: 'groupSixteen',
type: 'group',
fields: [
{
name: 'field76',
type: 'text',
},
{
name: 'field77',
type: 'text',
},
{
name: 'field78',
type: 'text',
},
{
name: 'field79',
type: 'text',
},
{
name: 'field80',
type: 'text',
},
],
},
{
name: 'groupSeventeen',
type: 'group',
fields: [
{
name: 'field81',
type: 'text',
},
{
name: 'field82',
type: 'text',
},
{
name: 'field83',
type: 'text',
},
{
name: 'field84',
type: 'text',
},
{
name: 'field85',
type: 'text',
},
],
},
{
name: 'groupEighteen',
type: 'group',
fields: [
{
name: 'field86',
type: 'text',
},
{
name: 'field87',
type: 'text',
},
{
name: 'field88',
type: 'text',
},
{
name: 'field89',
type: 'text',
},
{
name: 'field90',
type: 'text',
},
],
},
{
name: 'groupNineteen',
type: 'group',
fields: [
{
name: 'field91',
type: 'text',
},
{
name: 'field92',
type: 'text',
},
{
name: 'field93',
type: 'text',
},
{
name: 'field94',
type: 'text',
},
{
name: 'field95',
type: 'text',
},
],
},
{
name: 'groupTwenty',
type: 'group',
fields: [
{
name: 'field96',
type: 'text',
},
{
name: 'field97',
type: 'text',
},
{
name: 'field98',
type: 'text',
},
{
name: 'field99',
type: 'text',
},
{
name: 'field100',
type: 'text',
},
],
},
],
}

File diff suppressed because it is too large Load Diff

View File

@@ -10,6 +10,8 @@ export const group2Collection2Slug = 'group-two-collection-twos'
export const hiddenCollectionSlug = 'hidden-collection'
export const notInViewCollectionSlug = 'not-in-view-collection'
export const noApiViewCollectionSlug = 'collection-no-api-view'
export const forceRenderCollectionSlug = 'collection-force-render'
export const noForceRenderCollectionSlug = 'collection-no-force-render'
export const disableDuplicateSlug = 'disable-duplicate'
export const uploadCollectionSlug = 'uploads'
export const customFieldsSlug = 'custom-fields'
@@ -37,6 +39,8 @@ export const group2GlobalSlug = 'group-globals-two'
export const hiddenGlobalSlug = 'hidden-global'
export const notInViewGlobalSlug = 'not-in-view-global'
export const forceRenderGlobalSlug = 'global-force-render'
export const noForceRenderGlobalSlug = 'global-no-force-render'
export const settingsGlobalSlug = 'settings'
export const noApiViewGlobalSlug = 'global-no-api-view'
export const globalSlugs = [