fix: cannot pass function to client error when defining server-only props in custom field components (#9898)

Fixes #9895

We were still including field custom components in the ClientConfig,
which will throw an error if actual server-only properties were passed
to `PayloadComponent.serverProps`. This PR removes them from the
ClientConfig

Author: AlessioGr

packages/payload/src/fields/config/client.ts

@@ -37,7 +37,10 @@ export type ServerOnlyFieldProperties =
   | 'validate'
   | keyof Pick<FieldBase, 'access' | 'custom' | 'defaultValue' | 'hooks'>
 
-export type ServerOnlyFieldAdminProperties = keyof Pick<FieldBase['admin'], 'condition'>
+export type ServerOnlyFieldAdminProperties = keyof Pick<
+  FieldBase['admin'],
+  'components' | 'condition'
+>
 
 const serverOnlyFieldProperties: Partial<ServerOnlyFieldProperties>[] = [
   'hooks',
@@ -57,7 +60,10 @@ const serverOnlyFieldProperties: Partial<ServerOnlyFieldProperties>[] = [
   // `tabs`
   // `admin`
 ]
-const serverOnlyFieldAdminProperties: Partial<ServerOnlyFieldAdminProperties>[] = ['condition']
+const serverOnlyFieldAdminProperties: Partial<ServerOnlyFieldAdminProperties>[] = [
+  'condition',
+  'components',
+]
 type FieldWithDescription = {
   admin: AdminClient
 } & ClientField

test/fields/collections/Array/index.ts

@@ -32,7 +32,13 @@ const ArrayFields: CollectionConfig = {
           type: 'ui',
           admin: {
             components: {
-              Field: './collections/Array/LabelComponent.js#ArrayRowLabel',
+              Field: {
+                path: './collections/Array/LabelComponent.js#ArrayRowLabel',
+                serverProps: {
+                  // While this doesn't do anything, this will reproduce a bug where having server-only props in here will throw a "Functions cannot be passed directly to Client Components" error
+                  someFn: () => 'Hello',
+                },
+              },
             },
           },
         },