fix

Author: AlessioGr

packages/plugin-multi-tenant/src/components/TenantField/index.client.tsx

@@ -34,7 +34,9 @@ export const TenantField = ({ debug, unique, ...fieldArgs }: Props) => {
   const { isValid: isFormValid, setModified } = useForm()
   const { id: docID, collectionSlug } = useDocumentInfo()
   const { isModalOpen, openModal } = useModal()
-  const isEditManyModalOpen = collectionSlug ? isModalOpen(`edit-${collectionSlug}`) : false
+  const isEditManyModalOpen = collectionSlug
+    ? isModalOpen(`edit-${collectionSlug}`) || isModalOpen(`edit-${collectionSlug}-bulk-uploads`)
+    : false
   const isConfirmingRef = React.useRef<boolean>(false)
   const prevModified = React.useRef(modified)
   const prevValue = React.useRef<typeof value>(value)

test/plugin-multi-tenant/collections/Media.ts

@@ -0,0 +1,17 @@
+import type { CollectionConfig } from 'payload'
+
+import { mediaSlug } from '../shared.js'
+
+export const Media: CollectionConfig = {
+  slug: mediaSlug,
+  admin: {
+    useAsTitle: 'filename',
+  },
+  fields: [
+    {
+      name: 'alt',
+      type: 'text',
+    },
+  ],
+  upload: true,
+}

test/plugin-multi-tenant/config.base.ts

@@ -10,6 +10,7 @@ const dirname = path.dirname(filename)
 import type { Config as ConfigType } from './payload-types.js'
 
 import { AutosaveGlobal } from './collections/AutosaveGlobal.js'
+import { Media } from './collections/Media.js'
 import { Menu } from './collections/Menu.js'
 import { MenuItems } from './collections/MenuItems.js'
 import { MultiTenantPosts } from './collections/MultiTenantPosts.js'
@@ -19,6 +20,7 @@ import { Users } from './collections/Users/index.js'
 import { seed } from './seed/index.js'
 import {
   autosaveGlobalSlug,
+  mediaSlug,
   menuItemsSlug,
   menuSlug,
   multiTenantPostsSlug,
@@ -34,6 +36,7 @@ export const baseConfig: Partial<Config> = {
     AutosaveGlobal,
     Relationships,
     MultiTenantPosts,
+    Media,
     {
       slug: notTenantedSlug,
       admin: {
@@ -110,6 +113,7 @@ export const baseConfig: Partial<Config> = {
             hasMany: true,
           },
         },
+        [mediaSlug]: {},
       },
       i18n: {
         translations: {

test/plugin-multi-tenant/e2e.spec.ts

@@ -30,7 +30,14 @@ import { reInitializeDB } from '../__helpers/shared/clearAndSeed/reInitializeDB.
 import { initPayloadE2ENoConfig } from '../__helpers/shared/initPayloadE2ENoConfig.js'
 import { TEST_TIMEOUT_LONG } from '../playwright.config.js'
 import { credentials } from './credentials.js'
-import { autosaveGlobalSlug, menuItemsSlug, menuSlug, tenantsSlug, usersSlug } from './shared.js'
+import {
+  autosaveGlobalSlug,
+  mediaSlug,
+  menuItemsSlug,
+  menuSlug,
+  tenantsSlug,
+  usersSlug,
+} from './shared.js'
 
 const filename = fileURLToPath(import.meta.url)
 const dirname = path.dirname(filename)
@@ -40,6 +47,7 @@ test.describe('Multi Tenant', () => {
   let serverURL: string
   let globalMenuURL: AdminUrlUtil
   let autosaveGlobalURL: AdminUrlUtil
+  let mediaURL: AdminUrlUtil
   let menuItemsURL: AdminUrlUtil
   let usersURL: AdminUrlUtil
   let tenantsURL: AdminUrlUtil
@@ -53,6 +61,7 @@ test.describe('Multi Tenant', () => {
       await initPayloadE2ENoConfig<Config>({ dirname })
     serverURL = serverFromInit
     globalMenuURL = new AdminUrlUtil(serverURL, menuSlug)
+    mediaURL = new AdminUrlUtil(serverURL, mediaSlug)
     menuItemsURL = new AdminUrlUtil(serverURL, menuItemsSlug)
     usersURL = new AdminUrlUtil(serverURL, usersSlug)
     tenantsURL = new AdminUrlUtil(serverURL, tenantsSlug)
@@ -461,6 +470,64 @@ test.describe('Multi Tenant', () => {
     })
   })
 
+  test.describe('Bulk Upload', () => {
+    test('should render the tenant field inline in the Edit all drawer for bulk uploads', async () => {
+      await loginClientSide({
+        data: credentials.admin,
+        page,
+        serverURL,
+      })
+
+      await page.goto(mediaURL.list)
+      await clearTenantFilter({ page })
+
+      await page.locator('.list-header__title-actions button', { hasText: 'Bulk Upload' }).click()
+
+      await page
+        .locator('.dropzone input[type="file"]')
+        .setInputFiles([
+          path.resolve(dirname, '../uploads/image.png'),
+          path.resolve(dirname, '../uploads/test-image.png'),
+        ])
+
+      // The per-file form opens an AssignTenantFieldModal automatically; cancel it
+      // so we can drive the bulk-edit flow ourselves.
+      const perFileAssignModal = page
+        .locator('dialog#assign-tenant-field-modal')
+        .filter({ hasText: 'Assign' })
+      await expect(perFileAssignModal).toBeVisible()
+      await perFileAssignModal.locator('button', { hasText: 'Cancel' }).click()
+      await expect(perFileAssignModal).toBeHidden()
+
+      // Open the bulk-upload "Edit all" drawer and pick the Site (tenant) field.
+      await page.locator('.edit-many-bulk-uploads__toggle').click()
+      const editManyDrawer = page.locator('dialog#edit-media-bulk-uploads')
+      await expect(editManyDrawer).toBeVisible()
+
+      await selectInput({
+        multiSelect: true,
+        options: ['Site'],
+        selectLocator: editManyDrawer.locator('.edit-many-bulk-uploads__form .react-select'),
+      })
+
+      // The Site field should render inline inside the bulk-edit drawer (like Alt does).
+      // The bug: TenantField doesn't recognize 'edit-${slug}-bulk-uploads' as an
+      // edit-many context, so it wraps itself in a non-interactive AssignTenantFieldModal.
+      const inlineTenantField = editManyDrawer.locator('.tenantField .field-type.relationship')
+      await expect(inlineTenantField).toBeVisible()
+
+      await selectInput({
+        multiSelect: false,
+        option: 'Blue Dog',
+        selectLocator: inlineTenantField,
+        selectType: 'relationship',
+      })
+      await expect(
+        inlineTenantField.locator('.relationship--single-value__text', { hasText: 'Blue Dog' }),
+      ).toBeVisible()
+    })
+  })
+
   test.describe('Globals', () => {
     test('should redirect list view to edit view', async () => {
       await loginClientSide({

test/plugin-multi-tenant/shared.ts

@@ -13,3 +13,5 @@ export const relationshipsSlug = 'relationships'
 export const notTenantedSlug = 'notTenanted'
 
 export const multiTenantPostsSlug = 'multi-tenant-posts'
+
+export const mediaSlug = 'media'