fix(ui): handle undefined field admin components

packages/ui/src/providers/TableColumns/buildColumnState/index.spec.ts

@@ -0,0 +1,47 @@
+import type { I18nClient } from '@payloadcms/translations'
+import type { ClientField, Field, Payload } from 'payload'
+
+import { describe, expect, it, vi } from 'vitest'
+
+import { buildColumnState } from './index.js'
+
+vi.mock('../../../exports/client/index.js', () => ({
+  SortColumn: () => null,
+}))
+
+describe('buildColumnState', () => {
+  it('should handle fields with admin components explicitly set to undefined', () => {
+    const clientField: ClientField = {
+      name: 'title',
+      type: 'text',
+    }
+    const serverField: Field = {
+      name: 'title',
+      type: 'text',
+      admin: {
+        components: undefined,
+      },
+    }
+
+    const columns = buildColumnState({
+      clientFields: [clientField],
+      collectionSlug: 'posts',
+      customCellProps: {},
+      dataType: 'monomorphic',
+      docs: [],
+      enableRowSelections: false,
+      fieldPermissions: true,
+      i18n: {
+        t: vi.fn(),
+      } as unknown as I18nClient,
+      payload: {
+        importMap: {},
+      } as unknown as Payload,
+      serverFields: [serverField],
+      useAsTitle: 'title',
+    })
+
+    expect(columns).toHaveLength(1)
+    expect(columns[0].CustomLabel).toBeUndefined()
+  })
+})

packages/ui/src/providers/TableColumns/buildColumnState/index.tsx

@@ -188,6 +188,7 @@ export const buildColumnState = (args: BuildColumnStateArgs): Column[] => {
         serverField &&
         'admin' in serverField &&
         'components' in serverField.admin &&
+        serverField.admin.components &&
         'Label' in serverField.admin.components &&
         serverField.admin.components.Label !== undefined // let it return `null`
           ? serverField.admin.components.Label

test/admin/collections/CustomFields/index.ts

@@ -22,6 +22,13 @@ export const CustomFields: CollectionConfig = {
       },
       minLength: 3,
     },
+    {
+      name: 'fieldWithUndefinedComponents',
+      type: 'text',
+      admin: {
+        components: undefined,
+      },
+    },
     {
       name: 'customTextClientField',
       type: 'text',

test/admin/e2e/list-view/e2e.spec.ts

@@ -18,6 +18,7 @@ import { initPayloadE2ENoConfig } from '../../../__helpers/shared/initPayloadE2E
 import { BASE_PATH, customAdminRoutes } from '../../shared.js'
 import {
   arrayCollectionSlug,
+  customFieldsSlug,
   customViews1CollectionSlug,
   formatDocURLCollectionSlug,
   geoCollectionSlug,
@@ -85,6 +86,7 @@ describe('List View', () => {
   let user: any
   let virtualsUrl: AdminUrlUtil
   let noTimestampsUrl: AdminUrlUtil
+  let customFieldsUrl: AdminUrlUtil
 
   let serverURL: string
   let adminRoutes: ReturnType<typeof getRoutes>
@@ -112,6 +114,7 @@ describe('List View', () => {
     formatDocURLUrl = new AdminUrlUtil(serverURL, formatDocURLCollectionSlug)
     virtualsUrl = new AdminUrlUtil(serverURL, virtualsSlug)
     noTimestampsUrl = new AdminUrlUtil(serverURL, noTimestampsSlug)
+    customFieldsUrl = new AdminUrlUtil(serverURL, customFieldsSlug)
     const context = await browser.newContext()
     page = await context.newPage()
     initPageConsoleErrorCatch(page)
@@ -194,6 +197,11 @@ describe('List View', () => {
       )
     })
 
+    test('should render when a field has admin.components explicitly set to undefined', async () => {
+      await page.goto(customFieldsUrl.list)
+      await expect(page.locator('.collection-list--custom-fields')).toBeVisible()
+    })
+
     test('should hide create new button when allowCreate is false', async () => {
       await page.goto(withListViewUrl.list)
 

test/admin/payload-types.ts

@@ -522,6 +522,7 @@ export interface ReorderTab {
 export interface CustomField {
   id: string;
   customTextServerField?: string | null;
+  fieldWithUndefinedComponents?: string | null;
   customTextClientField?: string | null;
   /**
    * Static field description.
@@ -1302,6 +1303,7 @@ export interface ReorderTabsSelect<T extends boolean = true> {
  */
 export interface CustomFieldsSelect<T extends boolean = true> {
   customTextServerField?: T;
+  fieldWithUndefinedComponents?: T;
   customTextClientField?: T;
   descriptionAsString?: T;
   descriptionAsFunction?: T;