fix(ui): monomorphic joins tables not fetching draft documents (#13139)

Monomorphic join fields were not using the `draft` argument when
fetching documents to display in the table. This change makes the join
field treatment of drafts consistent with the `relationship` type
fields.

Added e2e test to cover.

Author: JarrodMFlesch

packages/ui/src/utilities/buildTableState.ts

@@ -214,6 +214,7 @@ const buildTableState = async (
       data = await payload.find({
         collection: collectionSlug,
         depth: 0,
+        draft: true,
         limit: query?.limit ? parseInt(query.limit, 10) : undefined,
         locale: req.locale,
         overrideAccess: false,

test/joins/collections/CategoriesVersions.ts

@@ -1,12 +1,14 @@
 import type { CollectionConfig } from 'payload'
 
-import { versionsSlug } from './Versions.js'
-
-export const categoriesVersionsSlug = 'categories-versions'
+import { categoriesVersionsSlug, versionsSlug } from '../shared.js'
 
 export const CategoriesVersions: CollectionConfig = {
   slug: categoriesVersionsSlug,
   fields: [
+    {
+      name: 'title',
+      type: 'text',
+    },
     {
       name: 'relatedVersions',
       type: 'join',

test/joins/collections/Versions.ts

@@ -1,6 +1,6 @@
 import type { CollectionConfig } from 'payload'
 
-export const versionsSlug = 'versions'
+import { versionsSlug } from '../shared.js'
 
 export const Versions: CollectionConfig = {
   slug: versionsSlug,

test/joins/e2e.spec.ts

@@ -22,7 +22,14 @@ import { initPayloadE2ENoConfig } from '../helpers/initPayloadE2ENoConfig.js'
 import { reInitializeDB } from '../helpers/reInitializeDB.js'
 import { RESTClient } from '../helpers/rest.js'
 import { EXPECT_TIMEOUT, TEST_TIMEOUT_LONG } from '../playwright.config.js'
-import { categoriesJoinRestrictedSlug, categoriesSlug, postsSlug, uploadsSlug } from './shared.js'
+import {
+  categoriesJoinRestrictedSlug,
+  categoriesSlug,
+  categoriesVersionsSlug,
+  postsSlug,
+  uploadsSlug,
+  versionsSlug,
+} from './shared.js'
 
 const filename = fileURLToPath(import.meta.url)
 const dirname = path.dirname(filename)
@@ -39,6 +46,8 @@ describe('Join Field', () => {
   let foldersURL: AdminUrlUtil
   let uploadsURL: AdminUrlUtil
   let categoriesJoinRestrictedURL: AdminUrlUtil
+  let categoriesVersionsURL: AdminUrlUtil
+  let versionsURL: AdminUrlUtil
   let categoryID: number | string
   let rootFolderID: number | string
 
@@ -53,6 +62,8 @@ describe('Join Field', () => {
     uploadsURL = new AdminUrlUtil(serverURL, uploadsSlug)
     categoriesJoinRestrictedURL = new AdminUrlUtil(serverURL, categoriesJoinRestrictedSlug)
     foldersURL = new AdminUrlUtil(serverURL, 'folders')
+    categoriesVersionsURL = new AdminUrlUtil(serverURL, categoriesVersionsSlug)
+    versionsURL = new AdminUrlUtil(serverURL, versionsSlug)
 
     const context = await browser.newContext()
     page = await context.newPage()
@@ -543,4 +554,42 @@ describe('Join Field', () => {
     await changeLocale(page, 'es')
     await expect(localizedTextCell).toHaveText('Text in es')
   })
+
+  test('should fetch draft documents in joins', async () => {
+    // create category-versions document
+    const categoryVersionsDoc = await payload.create({
+      collection: categoriesVersionsSlug,
+      data: {
+        title: 'Category Versions',
+      },
+    })
+
+    // create versions document
+    const versionDoc = await payload.create({
+      collection: versionsSlug,
+      data: {
+        title: 'Version 1',
+        categoryVersion: categoryVersionsDoc.id,
+      },
+    })
+
+    // update versions document with draft data
+    await payload.update({
+      id: versionDoc.id,
+      collection: versionsSlug,
+      data: {
+        title: 'Version 1 - Draft',
+      },
+      draft: true,
+    })
+
+    await page.goto(categoriesVersionsURL.edit(categoryVersionsDoc.id))
+    const joinField = page.locator('#field-relatedVersions.field-type.join')
+    await expect(joinField).toBeVisible()
+    await expect(joinField.locator('.relationship-table table')).toBeVisible()
+    const row = joinField.locator('.relationship-table tbody tr.row-1')
+    await expect(row).toBeVisible()
+    const versionsRowTitle = row.locator('.cell-title span')
+    await expect(versionsRowTitle).toHaveText('Version 1 - Draft')
+  })
 })

test/joins/payload-types.ts

@@ -519,6 +519,7 @@ export interface Version {
  */
 export interface CategoriesVersion {
   id: string;
+  title?: string | null;
   relatedVersions?: {
     docs?: (string | Version)[];
     hasNextPage?: boolean;
@@ -1142,6 +1143,7 @@ export interface VersionsSelect<T extends boolean = true> {
  * via the `definition` "categories-versions_select".
  */
 export interface CategoriesVersionsSelect<T extends boolean = true> {
+  title?: T;
   relatedVersions?: T;
   relatedVersionsMany?: T;
   updatedAt?: T;

test/joins/shared.ts

@@ -19,6 +19,8 @@ export const categoriesJoinRestrictedSlug = 'categories-join-restricted'
 export const collectionRestrictedSlug = 'collection-restricted'
 
 export const restrictedCategoriesSlug = 'restricted-categories'
+export const categoriesVersionsSlug = 'categories-versions'
+export const versionsSlug = 'versions'
 
 export const collectionSlugs = [
   categoriesSlug,