chore: optimizes buildFormState by passing prefs from admin

packages/next/src/routes/rest/buildFormState.ts

@@ -1,5 +1,5 @@
 import type { BuildFormStateArgs, FieldSchemaMap } from '@payloadcms/ui'
-import type { DocumentPreferences, Field, PayloadRequest, SanitizedConfig } from 'payload/types'
+import type { Field, PayloadRequest, SanitizedConfig } from 'payload/types'
 
 import { buildFieldSchemaMap, buildStateFromSchema, reduceFieldsToValues } from '@payloadcms/ui'
 import httpStatus from 'http-status'
@@ -57,8 +57,8 @@ export const buildFormState = async ({ req }: { req: PayloadRequest }) => {
   const {
     collectionSlug,
     data: incomingData,
+    docPreferences,
     formState,
-    globalSlug,
     operation,
     schemaPath,
   } = reqData
@@ -90,26 +90,7 @@ export const buildFormState = async ({ req }: { req: PayloadRequest }) => {
 
   const data = incomingData || reduceFieldsToValues(formState || {}, true)
 
-  let id: number | string | undefined
-  let docPreferencesKey: string
-  if (collectionSlug) {
-    id = reqData.id
-    docPreferencesKey = `collection-${collectionSlug}${id ? `-${id}` : ''}`
-  } else {
-    docPreferencesKey = `global-${globalSlug}`
-  }
-
-  const { docs: [{ value: docPreferences } = { value: null }] = [] } = (await req.payload.find({
-    collection: 'payload-preferences',
-    depth: 0,
-    limit: 1,
-    where: {
-      key: {
-        equals: docPreferencesKey,
-      },
-    },
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  })) as any as { docs: { value: DocumentPreferences }[] }
+  const id = collectionSlug ? reqData.id : undefined
 
   const result = await buildStateFromSchema({
     id,

packages/next/src/routes/rest/index.ts

@@ -308,6 +308,7 @@ export const POST =
         endpoints: req.payload.config.endpoints,
         request,
       })
+
       if (disableEndpoints) return disableEndpoints
 
       if (collection) {

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

@@ -100,7 +100,6 @@ export const Account: React.FC<AdminViewProps> = async ({ initPageResult, search
         apiURL={`${serverURL}${api}/${userSlug}${data?.id ? `/${data.id}` : ''}`}
         collectionSlug={userSlug}
         docPermissions={collectionPermissions}
-        docPreferences={docPreferences}
         hasSavePermission={collectionPermissions?.update?.permission}
         id={user?.id}
         initialData={data}

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

@@ -221,7 +221,6 @@ export const Document: React.FC<AdminViewProps> = async ({
       collectionSlug={collectionConfig?.slug}
       disableActions={false}
       docPermissions={docPermissions}
-      docPreferences={docPreferences}
       globalSlug={globalConfig?.slug}
       hasSavePermission={hasSavePermission}
       id={id}

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

@@ -42,6 +42,7 @@ export const DefaultEditView: React.FC = () => {
     disableActions,
     disableLeaveWithoutSaving,
     docPermissions,
+    getDocPreferences,
     globalSlug,
     hasSavePermission,
     initialData: data,
@@ -119,20 +120,24 @@ export const DefaultEditView: React.FC = () => {
   )
 
   const onChange: FormProps['onChange'][0] = useCallback(
-    ({ formState: prevFormState }) =>
-      getFormState({
+    async ({ formState: prevFormState }) => {
+      const docPreferences = await getDocPreferences()
+
+      return getFormState({
         apiRoute,
         body: {
           id,
           collectionSlug,
+          docPreferences,
           formState: prevFormState,
           globalSlug,
           operation,
           schemaPath: entitySlug,
         },
         serverURL,
-      }),
-    [serverURL, apiRoute, id, operation, entitySlug, collectionSlug, globalSlug],
+      })
+    },
+    [serverURL, apiRoute, id, operation, entitySlug, collectionSlug, globalSlug, getDocPreferences],
   )
 
   const RegisterGetThumbnailFunction = componentMap?.[`${collectionSlug}.adminThumbnail`]

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

@@ -42,6 +42,7 @@ const PreviewView: React.FC = (props) => {
     disableActions,
     disableLeaveWithoutSaving,
     docPermissions,
+    getDocPreferences,
     globalSlug,
     hasSavePermission,
     initialData: data,
@@ -105,18 +106,22 @@ const PreviewView: React.FC = (props) => {
   )
 
   const onChange: FormProps['onChange'][0] = useCallback(
-    ({ formState: prevFormState }) =>
-      getFormState({
+    async ({ formState: prevFormState }) => {
+      const docPreferences = await getDocPreferences()
+
+      return getFormState({
         apiRoute,
         body: {
           id,
+          docPreferences,
           formState: prevFormState,
           operation,
           schemaPath,
         },
         serverURL,
-      }),
-    [serverURL, apiRoute, id, operation, schemaPath],
+      })
+    },
+    [serverURL, apiRoute, id, operation, schemaPath, getDocPreferences],
   )
 
   // Allow the `DocumentInfoProvider` to hydrate

packages/ui/src/elements/DocumentDrawer/DrawerContent.tsx

@@ -1,6 +1,6 @@
 'use client'
 
-import type { FormState, TypeWithID } from 'payload/types'
+import type { DocumentPreferences, FormState, TypeWithID } from 'payload/types'
 
 import * as facelessUIImport from '@faceless-ui/modal'
 import queryString from 'qs'
@@ -19,6 +19,7 @@ import { useConfig } from '../../providers/Config/index.js'
 import { DocumentInfoProvider } from '../../providers/DocumentInfo/index.js'
 import { useFormQueryParams } from '../../providers/FormQueryParams/index.js'
 import { useLocale } from '../../providers/Locale/index.js'
+import { usePreferences } from '../../providers/Preferences/index.js'
 import { useTranslation } from '../../providers/Translation/index.js'
 import { getFormState } from '../../utilities/getFormState.js'
 import { Gutter } from '../Gutter/index.js'
@@ -53,6 +54,7 @@ const Content: React.FC<DocumentDrawerProps> = ({
   const [collectionConfig] = useRelatedCollections(collectionSlug)
   const { formQueryParams } = useFormQueryParams()
   const formattedQueryParams = queryString.stringify(formQueryParams)
+  const { getPreference } = usePreferences()
 
   const { permissions } = useAuth()
 
@@ -96,12 +98,19 @@ const Content: React.FC<DocumentDrawerProps> = ({
   useEffect(() => {
     if (!hasInitializedState.current && (!initialID.current || (initialID.current && data))) {
       const getInitialState = async () => {
+        let docPreferences: DocumentPreferences = { fields: {} }
+
+        if (id) {
+          docPreferences = await getPreference(`collection-${collectionSlug}-${id}`)
+        }
+
         const result = await getFormState({
           apiRoute,
           body: {
             id,
             collectionSlug,
             data: data || {},
+            docPreferences,
             operation: isEditing ? 'update' : 'create',
             schemaPath,
           },
@@ -114,7 +123,7 @@ const Content: React.FC<DocumentDrawerProps> = ({
 
       void getInitialState()
     }
-  }, [apiRoute, data, isEditing, schemaPath, serverURL, collectionSlug, id])
+  }, [apiRoute, data, isEditing, schemaPath, serverURL, collectionSlug, id, getPreference])
 
   if (isError) return null
 

packages/ui/src/forms/buildStateFromSchema/index.ts

@@ -1,4 +1,10 @@
-import type { Data, Field as FieldSchema, FormState, PayloadRequest } from 'payload/types'
+import type {
+  Data,
+  DocumentPreferences,
+  Field as FieldSchema,
+  FormState,
+  PayloadRequest,
+} from 'payload/types'
 
 import { iterateFields } from './iterateFields.js'
 
@@ -17,6 +23,7 @@ type Args = {
 export type BuildFormStateArgs = {
   collectionSlug?: string
   data?: Data
+  docPreferences?: DocumentPreferences
   formState?: FormState
   globalSlug?: string
   id?: number | string

packages/ui/src/providers/DocumentInfo/types.ts

@@ -22,7 +22,6 @@ export type DocumentInfoProps = {
   disableActions?: boolean
   disableLeaveWithoutSaving?: boolean
   docPermissions?: DocumentPermissions
-  docPreferences?: DocumentPreferences
   globalSlug?: SanitizedGlobalConfig['slug']
   hasSavePermission?: boolean
   id: null | number | string
@@ -43,9 +42,9 @@ export type DocumentInfo = DocumentInfoProps & {
   versionsCount?: PaginatedDocs<TypeWithVersion<any>>
 }
 
-export type DocumentInfoContext = Omit<DocumentInfo, 'docPreferences'> & {
+export type DocumentInfoContext = DocumentInfo & {
   getDocPermissions: () => Promise<void>
-  getDocPreferences: () => Promise<{ [key: string]: unknown }>
+  getDocPreferences: () => Promise<DocumentPreferences>
   getVersions: () => Promise<void>
   setDocFieldPreferences: (field: string, fieldPreferences: { [key: string]: unknown }) => void
   setDocumentTitle: (title: string) => void