Last render of custom component in beforeList doesn't end up in DOM

[franciscolourenco]

Describe the Bug

Custom server components rendered in the beforeList, seem to be rendered multiple times without the normal server props being passed, until they are rendered one last time with all the props.

The initial renders seem to have the serverProps specified in the custom component config, but not the ones specified in Payload's getCreateMappedComponent().

In this reproduction the component only gets rendered once, but in our project it gets rendered 19 times, I guess it could be once for every collection.

The weird thing is that the last render that receives all the props doesn't seem to end up in the DOM.

Link to the code that reproduces this issue

beta...franciscolourenco:beta-reproduce-custom-component-rendering

Reproduction Steps

See reproduction code.

Screen.Recording.2024-10-16.at.20.21.50.mp4

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

Not sure

Environment Info

Payload: 3.0.0-beta.114
Node: v21.6.2
Next: 15.0.0-canary.173

[jacobsfletch]

Hey @franciscolourenco as of v3.0.0-beta.128 we completely changed the way we render custom components. Before, we were rendering all custom compiles on initial compile of the admin panel. This was in order to compose server/client components within the dynamic areas of the UI such as array rows and document drawers. This explains why you'd see one render for every instance of that component throughout your entire config (in your case, one for every collection). We don't do this anymore. Instead of pre-rendering everything up front, we render only the custom components that are needed at that exact moment, i.e. "on-demand". So your beforeList component, for example, is only rendered once, and only when navigated to. This was a huugge improvement to the way we handle custom components.

[franciscolourenco]

@jacobsfletch I'll test on the new version and let you know if there are still any issues, otherwise consider this issue solved. Thank you for the update!

[github-actions]

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