feat!: add missing server-only props to custom RSCs, improve req.user type, clean-up ui imports (#6355)

Author: AlessioGr

.eslintignore

@@ -11,3 +11,4 @@
 playwright.config.ts
 jest.config.js
 test/live-preview/next-app
+tsconfig.tsbuildinfo

.idea/payload.iml

@@ -13,3 +13,4 @@ tsconfig.json
 packages/payload/*.js
 packages/payload/*.d.ts
 payload-types.ts
+tsconfig.tsbuildinfo

.prettierignore

@@ -89,7 +89,6 @@ export const RootLayout = async ({
     DefaultEditView,
     DefaultListView,
     children,
-    config,
     i18n,
     payload,
   })

packages/next/src/layouts/Root/index.tsx

@@ -77,7 +77,15 @@ export const Account: React.FC<AdminViewProps> = ({ initPageResult, params, sear
             }
             DefaultComponent={EditView}
             componentProps={viewComponentProps}
-            payload={payload}
+            serverOnlyProps={{
+              i18n,
+              locale,
+              params,
+              payload,
+              permissions,
+              searchParams,
+              user,
+            }}
           />
         </FormQueryParamsProvider>
       </DocumentInfoProvider>

packages/next/src/views/Account/index.tsx

@@ -1,5 +1,6 @@
 import type { Permissions } from 'payload/auth'
-import type { Payload, SanitizedConfig, VisibleEntities } from 'payload/types'
+import type { ServerProps } from 'payload/config'
+import type { VisibleEntities } from 'payload/types'
 
 import { Gutter } from '@payloadcms/ui/elements/Gutter'
 import { SetStepNav } from '@payloadcms/ui/elements/StepNav'
@@ -12,36 +13,66 @@ import './index.scss'
 
 const baseClass = 'dashboard'
 
-export type DashboardProps = {
+export type DashboardProps = ServerProps & {
   Link: React.ComponentType<any>
-  config: SanitizedConfig
-  payload: Payload
+
   permissions: Permissions
   visibleEntities: VisibleEntities
 }
 
 export const DefaultDashboard: React.FC<DashboardProps> = (props) => {
   const {
     Link,
-    config: {
-      admin: {
-        components: { afterDashboard, beforeDashboard },
+    i18n,
+    locale,
+    params,
+    payload: {
+      config: {
+        admin: {
+          components: { afterDashboard, beforeDashboard },
+        },
       },
     },
     payload,
     permissions,
+    searchParams,
+    user,
     visibleEntities,
   } = props
 
   const BeforeDashboards = Array.isArray(beforeDashboard)
     ? beforeDashboard.map((Component, i) => (
-        <WithServerSideProps Component={Component} key={i} payload={payload} />
+        <WithServerSideProps
+          Component={Component}
+          key={i}
+          serverOnlyProps={{
+            i18n,
+            locale,
+            params,
+            payload,
+            permissions,
+            searchParams,
+            user,
+          }}
+        />
       ))
     : null
 
   const AfterDashboards = Array.isArray(afterDashboard)
     ? afterDashboard.map((Component, i) => (
-        <WithServerSideProps Component={Component} key={i} payload={payload} />
+        <WithServerSideProps
+          Component={Component}
+          key={i}
+          serverOnlyProps={{
+            i18n,
+            locale,
+            params,
+            payload,
+            permissions,
+            searchParams,
+            user,
+          }}
+        />
       ))
     : null
 

packages/next/src/views/Dashboard/Default/index.tsx

@@ -13,10 +13,12 @@ export { generateDashboardMetadata } from './meta.js'
 
 const Link = (LinkImport.default || LinkImport) as unknown as typeof LinkImport.default
 
-export const Dashboard: React.FC<AdminViewProps> = ({ initPageResult }) => {
+export const Dashboard: React.FC<AdminViewProps> = ({ initPageResult, params, searchParams }) => {
   const {
+    locale,
     permissions,
     req: {
+      i18n,
       payload: { config },
       payload,
       user,
@@ -26,10 +28,15 @@ export const Dashboard: React.FC<AdminViewProps> = ({ initPageResult }) => {
 
   const CustomDashboardComponent = config.admin.components?.views?.Dashboard
 
-  const viewComponentProps: Omit<DashboardProps, 'payload'> = {
+  const viewComponentProps: DashboardProps = {
     Link,
-    config,
+    i18n,
+    locale,
+    params,
+    payload,
     permissions,
+    searchParams,
+    user,
     visibleEntities,
   }
 
@@ -42,7 +49,15 @@ export const Dashboard: React.FC<AdminViewProps> = ({ initPageResult }) => {
         }
         DefaultComponent={DefaultDashboard}
         componentProps={viewComponentProps}
-        payload={payload}
+        serverOnlyProps={{
+          i18n,
+          locale,
+          params,
+          payload,
+          permissions,
+          searchParams,
+          user,
+        }}
       />
     </Fragment>
   )

packages/next/src/views/Dashboard/index.tsx

@@ -220,7 +220,15 @@ export const Document: React.FC<AdminViewProps> = async ({
               CustomComponent={ViewOverride || CustomView}
               DefaultComponent={DefaultView}
               componentProps={viewComponentProps}
-              payload={payload}
+              serverOnlyProps={{
+                i18n,
+                locale,
+                params,
+                payload,
+                permissions,
+                searchParams,
+                user,
+              }}
             />
           )}
         </FormQueryParamsProvider>

packages/next/src/views/Document/index.tsx

@@ -18,11 +18,17 @@ import { DefaultListView } from './Default/index.js'
 
 export { generateListMetadata } from './meta.js'
 
-export const ListView: React.FC<AdminViewProps> = async ({ initPageResult, searchParams }) => {
+export const ListView: React.FC<AdminViewProps> = async ({
+  initPageResult,
+  params,
+  searchParams,
+}) => {
   const {
     collectionConfig,
+    locale: fullLocale,
     permissions,
     req: {
+      i18n,
       locale,
       payload,
       payload: { config },
@@ -142,7 +148,15 @@ export const ListView: React.FC<AdminViewProps> = async ({ initPageResult, searc
                 CustomComponent={CustomListView}
                 DefaultComponent={DefaultListView}
                 componentProps={viewComponentProps}
-                payload={payload}
+                serverOnlyProps={{
+                  i18n,
+                  locale: fullLocale,
+                  params,
+                  payload,
+                  permissions,
+                  searchParams,
+                  user,
+                }}
               />
             </TableColumnsProvider>
           </ListQueryProvider>

packages/next/src/views/List/index.tsx

@@ -12,10 +12,11 @@ export { generateLoginMetadata } from './meta.js'
 
 export const loginBaseClass = 'login'
 
-export const LoginView: React.FC<AdminViewProps> = ({ initPageResult, searchParams }) => {
-  const { req } = initPageResult
+export const LoginView: React.FC<AdminViewProps> = ({ initPageResult, params, searchParams }) => {
+  const { locale, permissions, req } = initPageResult
 
   const {
+    i18n,
     payload: { config },
     payload,
     user,
@@ -29,13 +30,37 @@ export const LoginView: React.FC<AdminViewProps> = ({ initPageResult, searchPara
 
   const BeforeLogins = Array.isArray(beforeLogin)
     ? beforeLogin.map((Component, i) => (
-        <WithServerSideProps Component={Component} key={i} payload={payload} />
+        <WithServerSideProps
+          Component={Component}
+          key={i}
+          serverOnlyProps={{
+            i18n,
+            locale,
+            params,
+            payload,
+            permissions,
+            searchParams,
+            user,
+          }}
+        />
       ))
     : null
 
   const AfterLogins = Array.isArray(afterLogin)
     ? afterLogin.map((Component, i) => (
-        <WithServerSideProps Component={Component} key={i} payload={payload} />
+        <WithServerSideProps
+          Component={Component}
+          key={i}
+          serverOnlyProps={{
+            i18n,
+            locale,
+            params,
+            payload,
+            permissions,
+            searchParams,
+            user,
+          }}
+        />
       ))
     : null
 
@@ -48,7 +73,15 @@ export const LoginView: React.FC<AdminViewProps> = ({ initPageResult, searchPara
   return (
     <Fragment>
       <div className={`${loginBaseClass}__brand`}>
-        <Logo payload={payload} />
+        <Logo
+          i18n={i18n}
+          locale={locale}
+          params={params}
+          payload={payload}
+          permissions={permissions}
+          searchParams={searchParams}
+          user={user}
+        />
       </div>
       {Array.isArray(BeforeLogins) && BeforeLogins.map((Component) => Component)}
       {!collectionConfig?.auth?.disableLocalStrategy && <LoginForm searchParams={searchParams} />}