feat(ui): adds admin.components.listControlsMenu option (#10981)

### What?
Adds new option `admin.components.listControlsMenu` to allow custom
components to be injected after the existing list controls in the
collection list view.

### Why?
Needed to facilitate import/export plugin.

#### Preview & Testing

Use `pnpm dev admin` to see example component and see test added to
`test/admin/e2e/list-view`.
<img width="1443" alt="Screenshot 2025-02-04 at 4 59 33 PM"
src="https://github.com/user-attachments/assets/dffe3a4b-5370-4004-86e6-23dabccdac52"
/>

---------

Co-authored-by: Dan Ribbens <DanRibbens@users.noreply.github.com>
This commit is contained in:
Jessica Chowdhury
2025-02-06 23:24:04 +00:00
committed by GitHub
parent 7a73265bd6
commit 7277f17f14
47 changed files with 149 additions and 1 deletions

View File

@@ -33,6 +33,26 @@ export const Posts: CollectionConfig = {
},
},
],
listControlsMenu: [
{
path: '/components/Banner/index.js#Banner',
clientProps: {
message: 'ListControlsMenu',
},
},
{
path: '/components/Banner/index.js#Banner',
clientProps: {
message: 'Many of them',
},
},
{
path: '/components/Banner/index.js#Banner',
clientProps: {
message: 'Ok last one',
},
},
],
afterList: [
{
path: '/components/Banner/index.js#Banner',

View File

@@ -198,6 +198,19 @@ describe('List View', () => {
).toBeVisible()
})
test('should render custom listControlsMenu component', async () => {
await page.goto(postsUrl.list)
const kebabMenu = page.locator('.list-controls__popup')
await expect(kebabMenu).toBeVisible()
await kebabMenu.click()
await expect(
page.locator('.popup-button-list__button').locator('div', {
hasText: 'ListControlsMenu',
}),
).toBeVisible()
})
test('should render custom afterListTable component', async () => {
await page.goto(postsUrl.list)
await expect(