fix(next): passes doc through edit view handler (#9302)

The Edit and Live Preview views were duplicately making the same Local
API requests for document data. This is because while the top-level
document view handler makes these requests _before_ rendering the Live
Preview view, it wasn't passing it's data through as props. This has
also led to inconsistencies in the options being passed through the
requests themselves, such as `locale`, `user`, and `overrideAccess:
false`. Everything is now standardized as expected through the existing
`getDocumentData` utility.

Author: jacobsfletch

docs/admin/views.mdx

@@ -350,6 +350,8 @@ export const MyCollectionConfig: SanitizedCollectionConfig = {
 }
 ```
 
+### Default Props
+
 Your Custom Views will be provided with the following props:
 
 | Prop                      | Description                                                                                                                            |
@@ -359,6 +361,7 @@ Your Custom Views will be provided with the following props:
 | **`importMap`**           | The import map object.                                                        |
 | **`params`**              | An object containing the [Dynamic Route Parameters](https://nextjs.org/docs/app/building-your-application/routing/dynamic-routes).     |
 | **`searchParams`**        | An object containing the [Search Parameters](https://developer.mozilla.org/docs/Learn/Common_questions/What_is_a_URL#parameters).      |
+| **`doc`**                 | The document being edited. Only available in Document Views. [More details](#document-views).                                           |
 
 <Banner type="success">
   <strong>Reminder:</strong>

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

@@ -159,7 +159,8 @@ export const renderDocument = async ({
     }),
   ])
 
-  const serverProps: ServerProps = {
+  const serverProps: ServerSideEditViewProps = {
+    doc,
     i18n,
     initPageResult,
     locale,

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

@@ -1,61 +1,16 @@
-import type {
-  EditViewComponent,
-  LivePreviewConfig,
-  PayloadServerReactComponent,
-  TypeWithID,
-} from 'payload'
+import type { EditViewComponent, LivePreviewConfig, PayloadServerReactComponent } from 'payload'
 
-import { notFound } from 'next/navigation.js'
 import React from 'react'
 
-import { LivePreviewClient } from './index.client.js'
 import './index.scss'
+import { LivePreviewClient } from './index.client.js'
 
 export const LivePreviewView: PayloadServerReactComponent<EditViewComponent> = async (props) => {
-  const { initPageResult } = props
-
-  const {
-    collectionConfig,
-    docID,
-    globalConfig,
-    locale,
-    req: {
-      payload: {
-        config: {
-          admin: { livePreview: topLevelLivePreviewConfig },
-        },
-      } = {},
-    } = {},
-  } = initPageResult
-
-  let data: Record<string, unknown> | TypeWithID
+  const { doc, initPageResult } = props
 
-  try {
-    if (collectionConfig) {
-      data = await initPageResult.req.payload.findByID({
-        id: docID,
-        collection: collectionConfig.slug,
-        depth: 0,
-        draft: true,
-        fallbackLocale: false,
-        locale: locale?.code,
-      })
-    }
-
-    if (globalConfig) {
-      data = await initPageResult.req.payload.findGlobal({
-        slug: globalConfig.slug,
-        depth: 0,
-        draft: true,
-        fallbackLocale: false,
-        locale: locale?.code,
-      })
-    }
-  } catch (error) {
-    notFound()
-  }
+  const { collectionConfig, globalConfig, locale, req } = initPageResult
 
-  let livePreviewConfig: LivePreviewConfig = topLevelLivePreviewConfig
+  let livePreviewConfig: LivePreviewConfig = req.payload.config?.admin?.livePreview
 
   if (collectionConfig) {
     livePreviewConfig = {
@@ -85,12 +40,12 @@ export const LivePreviewView: PayloadServerReactComponent<EditViewComponent> = a
     typeof livePreviewConfig?.url === 'function'
       ? await livePreviewConfig.url({
           collectionConfig,
-          data,
+          data: doc,
           globalConfig,
           locale,
           payload: initPageResult.req.payload,
         })
       : livePreviewConfig?.url
 
-  return <LivePreviewClient breakpoints={breakpoints} initialData={data} url={url} />
+  return <LivePreviewClient breakpoints={breakpoints} initialData={doc} url={url} />
 }

packages/payload/src/admin/views/types.ts

@@ -4,7 +4,7 @@ import type { SanitizedPermissions } from '../../auth/index.js'
 import type { ImportMap } from '../../bin/generateImportMap/index.js'
 import type { SanitizedCollectionConfig } from '../../collections/config/types.js'
 import type { ClientConfig } from '../../config/client.js'
-import type { Locale, MetaConfig, PayloadComponent } from '../../config/types.js'
+import type { Locale, MetaConfig, PayloadComponent, ServerProps } from '../../config/types.js'
 import type { SanitizedGlobalConfig } from '../../globals/config/types.js'
 import type { PayloadRequest } from '../../types/index.js'
 import type { LanguageOptions } from '../LanguageOptions.js'
@@ -60,11 +60,10 @@ export type InitPageResult = {
 }
 
 export type ServerSideEditViewProps = {
+  readonly doc: Data
   readonly initPageResult: InitPageResult
-  readonly params: { [key: string]: string | string[] | undefined }
-  readonly payloadServerAction: PayloadServerAction
   readonly routeSegments: string[]
-  readonly searchParams: { [key: string]: string | string[] | undefined }
-} & ClientSideEditViewProps
+} & ClientSideEditViewProps &
+  ServerProps
 
 export type ClientSideEditViewProps = {} & DocumentSlots