diff --git a/packages/next/src/views/List/index.tsx b/packages/next/src/views/List/index.tsx index abf32a773..7062df579 100644 --- a/packages/next/src/views/List/index.tsx +++ b/packages/next/src/views/List/index.tsx @@ -16,6 +16,7 @@ import { RenderServerComponent } from '@payloadcms/ui/elements/RenderServerCompo import { getColumns, renderFilters, renderTable, upsertPreferences } from '@payloadcms/ui/rsc' import { notFound } from 'next/navigation.js' import { + appendUploadSelectFields, combineWhereConstraints, formatAdminURL, isNumber, @@ -26,7 +27,6 @@ import { import React, { Fragment } from 'react' import { getDocumentPermissions } from '../Document/getDocumentPermissions.js' -import { appendUploadSelectFields } from './appendUploadSelectFields.js' import { handleGroupBy } from './handleGroupBy.js' import { renderListViewSlots } from './renderListViewSlots.js' import { resolveAllFilterOptions } from './resolveAllFilterOptions.js' diff --git a/packages/payload/src/exports/shared.ts b/packages/payload/src/exports/shared.ts index adaf8a2a3..d68a64bf1 100644 --- a/packages/payload/src/exports/shared.ts +++ b/packages/payload/src/exports/shared.ts @@ -58,6 +58,7 @@ 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 { combineWhereConstraints } from '../utilities/combineWhereConstraints.js' export { diff --git a/packages/next/src/views/List/appendUploadSelectFields.ts b/packages/payload/src/utilities/appendUploadSelectFields.ts similarity index 87% rename from packages/next/src/views/List/appendUploadSelectFields.ts rename to packages/payload/src/utilities/appendUploadSelectFields.ts index bac5d5c0a..f42c52c4b 100644 --- a/packages/next/src/views/List/appendUploadSelectFields.ts +++ b/packages/payload/src/utilities/appendUploadSelectFields.ts @@ -1,4 +1,4 @@ -import type { SanitizedCollectionConfig, SelectType } from 'payload' +import type { ClientCollectionConfig, SanitizedCollectionConfig, SelectType } from '../index.js' /** * Mutates the incoming select object to append fields required for upload thumbnails @@ -9,7 +9,7 @@ export const appendUploadSelectFields = ({ collectionConfig, select, }: { - collectionConfig: SanitizedCollectionConfig + collectionConfig: ClientCollectionConfig | SanitizedCollectionConfig select: SelectType }) => { if (!collectionConfig.upload || !select) { diff --git a/packages/ui/src/elements/Table/RelationshipProvider/index.tsx b/packages/ui/src/elements/Table/RelationshipProvider/index.tsx index 45d941ff5..b2ade8f46 100644 --- a/packages/ui/src/elements/Table/RelationshipProvider/index.tsx +++ b/packages/ui/src/elements/Table/RelationshipProvider/index.tsx @@ -1,6 +1,8 @@ 'use client' -import type { TypeWithID } from 'payload' +import type { SelectType, TypeWithID } from 'payload' +import { appendUploadSelectFields } from 'payload/shared' +import * as qs from 'qs-esm' import React, { createContext, use, useCallback, useEffect, useReducer, useRef } from 'react' import { useDebounce } from '../../../hooks/useDebounce.js' @@ -38,6 +40,7 @@ export const RelationshipProvider: React.FC<{ readonly children?: React.ReactNod const { config: { + collections, routes: { api }, serverURL, }, @@ -62,20 +65,29 @@ export const RelationshipProvider: React.FC<{ readonly children?: React.ReactNod const url = `${serverURL}${api}/${slug}` const params = new URLSearchParams() + const select: SelectType = {} params.append('depth', '0') params.append('limit', '250') + const collection = collections.find((c) => c.slug === slug) + if (collection.admin.enableListViewSelectAPI) { + const fieldToSelect = collection.admin.useAsTitle ?? 'id' + select[fieldToSelect] = true + + if (collection.upload) { + appendUploadSelectFields({ collectionConfig: collection, select }) + } + } + if (locale) { params.append('locale', locale) } - if (idsToLoad && idsToLoad.length > 0) { - const idsToString = idsToLoad.map((id) => String(id)) - params.append('where[id][in]', idsToString.join(',')) - } + const idsToString = idsToLoad.map((id) => String(id)) + params.append('where[id][in]', idsToString.join(',')) - const query = `?${params.toString()}` + const query = `?${params.toString()}&${qs.stringify({ select })}` const result = await fetch(`${url}${query}`, { credentials: 'include', @@ -100,7 +112,7 @@ export const RelationshipProvider: React.FC<{ readonly children?: React.ReactNod } }) }, - [debouncedDocuments, serverURL, api, i18n, locale], + [debouncedDocuments, serverURL, api, i18n, locale, collections], ) useEffect(() => {