fix(ui): join field "add new" calculate initial drawer data with relationship inside blocks (#10057)

We merged https://github.com/payloadcms/payload/pull/9773 that adds
support for join field with relationships inside arrays, it just happens
that now it's also true for relationships inside blocks, added a test
case with blocks.
This just corrects initial data drawer calculation with the "add new"
button if we encounter a blocks field in join's `on`.

packages/ui/src/fields/Join/index.tsx

@@ -43,6 +43,10 @@ const getInitialDrawerData = ({
 
   const field = flattenedFields.find((field) => field.name === path)
 
+  if (!field) {
+    return null
+  }
+
   if (field.type === 'relationship' || field.type === 'upload') {
     return {
       // TODO: Handle polymorphic https://github.com/payloadcms/payload/pull/9990
@@ -71,6 +75,25 @@ const getInitialDrawerData = ({
       [field.name]: [initialData],
     }
   }
+
+  if (field.type === 'blocks') {
+    for (const block of field.blocks) {
+      const blockInitialData = getInitialDrawerData({
+        docID,
+        fields: block.fields,
+        segments: nextSegments,
+      })
+
+      if (blockInitialData) {
+        blockInitialData.id = ObjectId().toHexString()
+        blockInitialData.blockType = block.slug
+
+        return {
+          [field.name]: [blockInitialData],
+        }
+      }
+    }
+  }
 }
 
 const JoinFieldComponent: JoinFieldClientComponent = (props) => {

test/joins/collections/Categories.ts

@@ -109,6 +109,12 @@ export const Categories: CollectionConfig = {
       collection: 'posts',
       on: 'array.category',
     },
+    {
+      name: 'blocksPosts',
+      type: 'join',
+      collection: 'posts',
+      on: 'blocks.category',
+    },
     {
       name: 'singulars',
       type: 'join',

test/joins/collections/Posts.ts

@@ -80,5 +80,21 @@ export const Posts: CollectionConfig = {
         },
       ],
     },
+    {
+      name: 'blocks',
+      type: 'blocks',
+      blocks: [
+        {
+          slug: 'block',
+          fields: [
+            {
+              name: 'category',
+              type: 'relationship',
+              relationTo: categoriesSlug,
+            },
+          ],
+        },
+      ],
+    },
   ],
 }

test/joins/int.spec.ts

@@ -95,6 +95,7 @@ describe('Joins Field', () => {
           camelCaseCategory: category.id,
         },
         array: [{ category: category.id }],
+        blocks: [{ blockType: 'block', category: category.id }],
       })
     }
   })
@@ -193,6 +194,15 @@ describe('Joins Field', () => {
     expect(categoryWithPosts.arrayPosts.docs).toBeDefined()
   })
 
+  it('should populate joins with blocks relationships', async () => {
+    const categoryWithPosts = await payload.findByID({
+      id: category.id,
+      collection: categoriesSlug,
+    })
+
+    expect(categoryWithPosts.blocksPosts.docs).toBeDefined()
+  })
+
   it('should populate uploads in joins', async () => {
     const { docs } = await payload.find({
       limit: 1,

test/joins/payload-types.ts

@@ -36,6 +36,8 @@ export interface Config {
       hasManyPostsLocalized: 'posts';
       'group.relatedPosts': 'posts';
       'group.camelCasePosts': 'posts';
+      arrayPosts: 'posts';
+      blocksPosts: 'posts';
       filtered: 'posts';
       hiddenPosts: 'hidden-posts';
       singulars: 'singular';
@@ -125,6 +127,20 @@ export interface Post {
     category?: (string | null) | Category;
     camelCaseCategory?: (string | null) | Category;
   };
+  array?:
+    | {
+        category?: (string | null) | Category;
+        id?: string | null;
+      }[]
+    | null;
+  blocks?:
+    | {
+        category?: (string | null) | Category;
+        id?: string | null;
+        blockName?: string | null;
+        blockType: 'block';
+      }[]
+    | null;
   updatedAt: string;
   createdAt: string;
 }
@@ -183,6 +199,14 @@ export interface Category {
       hasNextPage?: boolean | null;
     } | null;
   };
+  arrayPosts?: {
+    docs?: (string | Post)[] | null;
+    hasNextPage?: boolean | null;
+  } | null;
+  blocksPosts?: {
+    docs?: (string | Post)[] | null;
+    hasNextPage?: boolean | null;
+  } | null;
   singulars?: {
     docs?: (string | Singular)[] | null;
     hasNextPage?: boolean | null;
@@ -463,6 +487,23 @@ export interface PostsSelect<T extends boolean = true> {
         category?: T;
         camelCaseCategory?: T;
       };
+  array?:
+    | T
+    | {
+        category?: T;
+        id?: T;
+      };
+  blocks?:
+    | T
+    | {
+        block?:
+          | T
+          | {
+              category?: T;
+              id?: T;
+              blockName?: T;
+            };
+      };
   updatedAt?: T;
   createdAt?: T;
 }
@@ -482,6 +523,8 @@ export interface CategoriesSelect<T extends boolean = true> {
         relatedPosts?: T;
         camelCasePosts?: T;
       };
+  arrayPosts?: T;
+  blocksPosts?: T;
   singulars?: T;
   filtered?: T;
   updatedAt?: T;