[Payload 3.0.1] Custom Server Components Not Receiving Any Properties

[danhstevens]

Describe the Bug

According to the documentation (https://payloadcms.com/docs/admin/components#default-props), custom server components are provided with properties such as the payload class. However, no properties are passed into server components.

Example component:

import React from 'react'

export const TeamSelector = async ({ payload }) => {
  console.log('SHOULD HAVE A PAYLOAD OBJECT HERE', payload) // undefined
  return <div>123</div>
}

Expected Result: SHOULD HAVE A PAYLOAD OBJECT HERE [payload class data] Actual Result: SHOULD HAVE A PAYLOAD OBJECT HERE undefined

Link to the code that reproduces this issue

https://github.com/danhstevens/payload-issue

Reproduction Steps

1. Create a new Payload project (v3)
2. Add a custom server component that accepts any properties and apply to payload.config.ts
3. Note how no properties are passed into the component

Which area(s) are affected? (Select all that apply)

area: core

Environment Info

Payload: 3.0.1
Node: 20

[JarrodMFlesch]

Just noting that this has to do with the actions property specifically.

[SelfhostedPro]

Also affects client components. Using the basic template from the docs here This is all I have for config:

    components: {
      views: {
        dashboard: {
          Component: '@/components/payload/views/Root'
        }
      }
    }

[mattiaz9]

Still an issue in 3.2.2. Can't believe they keep shipping new versions without fixing a so evident problem.

[JarrodMFlesch]

Also affects client components. Using the basic template from the docs here This is all I have for config:

    components: {
      views: {
        dashboard: {
          Component: '@/components/payload/views/Root'
        }
      }
    }

You are trying to access server props in a client component. The props are different for client and server components. Remove use client from that file and you will be able to access the server properties.

If you need to use a client component in this case (which I doubt since I don't see any state), then you could compose it better and thread client safe props down to your client component.

[SelfhostedPro]

I tried a client component after it wasn’t working without ‘use client’ good to know that’s normal behavior though.

[JarrodMFlesch]

I believe @akhrarovsaid fixed this in this PR!

[github-actions[bot]]

This issue has been automatically locked. Please open a new issue if this issue persists with any additional detail.