From 81099cbb0447021c3db980bd5cb14ed510c78ef6 Mon Sep 17 00:00:00 2001
From: Jarrod Flesch <30633324+JarrodMFlesch@users.noreply.github.com>
Date: Wed, 13 Nov 2024 17:03:03 -0500
Subject: [PATCH] chore: improve custom server cell types (#9188)

### What?
Exposes DefaultServerCellComponentProps type for custom server cell
components.

### Why?
So users can type their custom server cell components properly.
---
 packages/payload/src/admin/elements/Cell.ts   | 13 ++++++++++
 packages/payload/src/admin/types.ts           |  2 +-
 .../TableColumns/buildColumnState.tsx         | 25 ++++++++++---------
 3 files changed, 27 insertions(+), 13 deletions(-)

diff --git a/packages/payload/src/admin/elements/Cell.ts b/packages/payload/src/admin/elements/Cell.ts
index 9e611fd77..3c6936413 100644
--- a/packages/payload/src/admin/elements/Cell.ts
+++ b/packages/payload/src/admin/elements/Cell.ts
@@ -1,6 +1,10 @@
+import type { I18nClient } from '@payloadcms/translations'
+
 import type { ClientCollectionConfig } from '../../collections/config/client.js'
 import type { SanitizedCollectionConfig } from '../../collections/config/types.js'
 import type { ClientField } from '../../fields/config/client.js'
+import type { Field } from '../../fields/config/types.js'
+import type { Payload } from '../../types/index.js'
 
 export type RowData = Record<string, any>
 
@@ -19,3 +23,12 @@ export type DefaultCellComponentProps<TCellData = any, TField extends ClientFiel
   }) => void
   readonly rowData: RowData
 }
+
+export type DefaultServerCellComponentProps<
+  TCellData = any,
+  TField extends ClientField = ClientField,
+> = {
+  field: Field
+  i18n: I18nClient
+  payload: Payload
+} & Omit<DefaultCellComponentProps<TCellData, TField>, 'field'>
diff --git a/packages/payload/src/admin/types.ts b/packages/payload/src/admin/types.ts
index 46627a352..f6bb54878 100644
--- a/packages/payload/src/admin/types.ts
+++ b/packages/payload/src/admin/types.ts
@@ -16,7 +16,7 @@ import type {
   Row,
 } from './forms/Form.js'
 
-export type { DefaultCellComponentProps } from './elements/Cell.js'
+export type { DefaultCellComponentProps, DefaultServerCellComponentProps } from './elements/Cell.js'
 export type { ConditionalDateProps } from './elements/DatePicker.js'
 export type { DayPickerProps, SharedProps, TimePickerProps } from './elements/DatePicker.js'
 export type { NavGroupPreferences, NavPreferences } from './elements/Nav.js'
diff --git a/packages/ui/src/elements/TableColumns/buildColumnState.tsx b/packages/ui/src/elements/TableColumns/buildColumnState.tsx
index 6d8a60947..a8459e93b 100644
--- a/packages/ui/src/elements/TableColumns/buildColumnState.tsx
+++ b/packages/ui/src/elements/TableColumns/buildColumnState.tsx
@@ -1,16 +1,17 @@
 import type { I18nClient } from '@payloadcms/translations'
-
-import {
-  type ClientCollectionConfig,
-  type DefaultCellComponentProps,
-  type Field,
-  MissingEditorProp,
-  type PaginatedDocs,
-  type Payload,
-  type PayloadComponent,
-  type SanitizedCollectionConfig,
-  type StaticLabel,
+import type {
+  ClientCollectionConfig,
+  DefaultCellComponentProps,
+  DefaultServerCellComponentProps,
+  Field,
+  PaginatedDocs,
+  Payload,
+  PayloadComponent,
+  SanitizedCollectionConfig,
+  StaticLabel,
 } from 'payload'
+
+import { MissingEditorProp } from 'payload'
 import { deepCopyObjectSimple, fieldIsPresentationalOnly } from 'payload/shared'
 import React from 'react'
 
@@ -177,7 +178,7 @@ export const buildColumnState = (args: Args): Column[] => {
       rowData: undefined,
     }
 
-    const serverProps = {
+    const serverProps: Pick<DefaultServerCellComponentProps, 'field' | 'i18n' | 'payload'> = {
       field: _field,
       i18n,
       payload,