fix: filteredLocales in the client config are stale (#14326)

JarrodMFlesch · web-flow · commit 5a379091344f · 2025-10-24T21:11:54.000Z
Fixes #14299 Using `filterAvailableLocales` means they could change when the req changes. When we get the client config from the cache, we need to re-apply `filterAvailableLocales` so the config has the correct values. This was manually being done in the Root layout, but every other place that called getClientConfig was not i.e. the Root view. So this PR moves that logic from the Root layout into the getClientConfig function.
diff --git a/packages/next/src/layouts/Root/index.tsx b/packages/next/src/layouts/Root/index.tsx
@@ -5,6 +5,7 @@ import { rtlLanguages } from '@payloadcms/translations'
 import { ProgressBar, RootProvider } from '@payloadcms/ui'
 import { getClientConfig } from '@payloadcms/ui/utilities/getClientConfig'
 import { cookies as nextCookies } from 'next/headers.js'
+import { applyLocaleFiltering } from 'payload/shared'
 import React from 'react'
 
 import { getNavPrefs } from '../../elements/Nav/getNavPrefs.js'
@@ -87,20 +88,7 @@ export const RootLayout = async ({
     importMap,
     user: req.user,
   })
-
-  if (
-    clientConfig.localization &&
-    config.localization &&
-    typeof config.localization.filterAvailableLocales === 'function'
-  ) {
-    clientConfig.localization.locales = (
-      await config.localization.filterAvailableLocales({
-        locales: config.localization.locales,
-        req,
-      })
-    ).map(({ toString, ...rest }) => rest)
-    clientConfig.localization.localeCodes = config.localization.locales.map(({ code }) => code)
-  }
+  await applyLocaleFiltering({ clientConfig, config, req })
 
   return (
     <html
diff --git a/packages/next/src/views/Document/handleServerFunction.tsx b/packages/next/src/views/Document/handleServerFunction.tsx
@@ -4,6 +4,7 @@ import type { DocumentPreferences, VisibleEntities } from 'payload'
 import { getClientConfig } from '@payloadcms/ui/utilities/getClientConfig'
 import { headers as getHeaders } from 'next/headers.js'
 import { canAccessAdmin, getAccessResults, isEntityHidden, parseCookies } from 'payload'
+import { applyLocaleFiltering } from 'payload/shared'
 
 import { renderDocument } from './index.js'
 
@@ -43,6 +44,7 @@ export const renderDocumentHandler: RenderDocumentServerFunction = async (args)
     importMap: req.payload.importMap,
     user,
   })
+  await applyLocaleFiltering({ clientConfig, config, req })
 
   let preferences: DocumentPreferences
 
diff --git a/packages/next/src/views/List/handleServerFunction.tsx b/packages/next/src/views/List/handleServerFunction.tsx
@@ -3,6 +3,7 @@ import type { CollectionPreferences, ListQuery, ServerFunction, VisibleEntities
 import { getClientConfig } from '@payloadcms/ui/utilities/getClientConfig'
 import { headers as getHeaders } from 'next/headers.js'
 import { canAccessAdmin, getAccessResults, isEntityHidden, parseCookies } from 'payload'
+import { applyLocaleFiltering } from 'payload/shared'
 
 import { renderListView } from './index.js'
 
@@ -61,6 +62,7 @@ export const renderListHandler: ServerFunction<
     importMap: payload.importMap,
     user,
   })
+  await applyLocaleFiltering({ clientConfig, config, req })
 
   const preferencesKey = `collection-${collectionSlug}`
 
diff --git a/packages/next/src/views/Root/index.tsx b/packages/next/src/views/Root/index.tsx
@@ -14,7 +14,7 @@ import { PageConfigProvider } from '@payloadcms/ui'
 import { RenderServerComponent } from '@payloadcms/ui/elements/RenderServerComponent'
 import { getClientConfig } from '@payloadcms/ui/utilities/getClientConfig'
 import { notFound, redirect } from 'next/navigation.js'
-import { formatAdminURL } from 'payload/shared'
+import { applyLocaleFiltering, formatAdminURL } from 'payload/shared'
 import * as qs from 'qs-esm'
 import React from 'react'
 
@@ -245,6 +245,7 @@ export const RootPage = async ({
     importMap,
     user: viewType === 'createFirstUser' ? true : req.user,
   })
+  await applyLocaleFiltering({ clientConfig, config, req })
 
   const visibleEntities = getVisibleEntities({ req })
 
diff --git a/packages/next/src/views/Version/index.tsx b/packages/next/src/views/Version/index.tsx
@@ -213,7 +213,12 @@ export async function VersionView(props: DocumentViewServerProps) {
 
   const clientSchemaMap = getClientSchemaMap({
     collectionSlug,
-    config: getClientConfig({ config: payload.config, i18n, importMap: payload.importMap, user }),
+    config: getClientConfig({
+      config: payload.config,
+      i18n,
+      importMap: payload.importMap,
+      user,
+    }),
     globalSlug,
     i18n,
     payload,
diff --git a/packages/payload/src/config/client.ts b/packages/payload/src/config/client.ts
@@ -4,6 +4,7 @@ import type { DeepPartial } from 'ts-essentials'
 import type { ImportMap } from '../bin/generateImportMap/index.js'
 import type { ClientBlock } from '../fields/config/types.js'
 import type { BlockSlug, TypedUser } from '../index.js'
+import type { PayloadRequest } from '../types/index.js'
 import type {
   RootLivePreviewConfig,
   SanitizedConfig,
diff --git a/packages/payload/src/exports/shared.ts b/packages/payload/src/exports/shared.ts
@@ -39,8 +39,8 @@ export {
 } from '../fields/config/types.js'
 
 export { getFieldPaths } from '../fields/getFieldPaths.js'
-export * from '../fields/validations.js'
 
+export * from '../fields/validations.js'
 export type {
   FolderBreadcrumb,
   FolderDocumentItemKey,
@@ -52,13 +52,15 @@ export type {
 } from '../folders/types.js'
 
 export { buildFolderWhereConstraints } from '../folders/utils/buildFolderWhereConstraints.js'
+
 export { formatFolderOrDocumentItem } from '../folders/utils/formatFolderOrDocumentItem.js'
 export { validOperators, validOperatorSet } from '../types/constants.js'
-
 export { formatFilesize } from '../uploads/formatFilesize.js'
 
 export { isImage } from '../uploads/isImage.js'
+
 export { appendUploadSelectFields } from '../utilities/appendUploadSelectFields.js'
+export { applyLocaleFiltering } from '../utilities/applyLocaleFiltering.js'
 export { combineWhereConstraints } from '../utilities/combineWhereConstraints.js'
 
 export {
diff --git a/packages/payload/src/utilities/applyLocaleFiltering.ts b/packages/payload/src/utilities/applyLocaleFiltering.ts
@@ -0,0 +1,31 @@
+import type { ClientConfig } from '../config/client.js'
+import type { SanitizedConfig } from '../config/types.js'
+import type { PayloadRequest } from '../types/index.js'
+
+export async function applyLocaleFiltering({
+  clientConfig,
+  config,
+  req,
+}: {
+  clientConfig: ClientConfig
+  config: SanitizedConfig
+  req: PayloadRequest
+}): Promise<void> {
+  if (
+    !clientConfig.localization ||
+    !config.localization ||
+    typeof config.localization.filterAvailableLocales !== 'function'
+  ) {
+    return
+  }
+
+  const filteredLocales = (
+    await config.localization.filterAvailableLocales({
+      locales: config.localization.locales,
+      req,
+    })
+  ).map(({ toString, ...rest }) => rest)
+
+  clientConfig.localization.localeCodes = filteredLocales.map(({ code }) => code)
+  clientConfig.localization.locales = filteredLocales
+}
diff --git a/packages/ui/src/utilities/buildTableState.ts b/packages/ui/src/utilities/buildTableState.ts
@@ -12,7 +12,7 @@ import type {
 } from 'payload'
 
 import { APIError, canAccessAdmin, formatErrors, getAccessResults } from 'payload'
-import { isNumber } from 'payload/shared'
+import { applyLocaleFiltering, isNumber } from 'payload/shared'
 
 import { getClientConfig } from './getClientConfig.js'
 import { getColumns } from './getColumns.js'
@@ -99,6 +99,7 @@ const buildTableState = async (
     importMap: payload.importMap,
     user,
   })
+  await applyLocaleFiltering({ clientConfig, config, req })
 
   const permissions = await getAccessResults({ req })
 
