feat(ui): adds admin.components.listMenuItems option (#11230)

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

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

#### Testing

Use `pnpm dev admin` to see example component and see test added to
`test/admin/e2e/list-view`.


## Update since feature was reverted
The custom list controls and now rendered with no surrounding padding or
border radius.

<img width="596" alt="Screenshot 2025-02-17 at 5 06 44 PM"
src="https://github.com/user-attachments/assets/57209367-5433-4a4c-8797-0f9671da15c8"
/>

---------

Co-authored-by: Dan Ribbens <dan.ribbens@gmail.com>
This commit is contained in:
Jessica Chowdhury
2025-02-18 14:35:27 +00:00
committed by GitHub
parent 117949b8d9
commit 8a2b712287
49 changed files with 161 additions and 10 deletions

View File

@@ -33,6 +33,26 @@ export const Posts: CollectionConfig = {
},
},
],
listMenuItems: [
{
path: '/components/Banner/index.js#Banner',
clientProps: {
message: 'listMenuItems',
},
},
{
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 listMenuItems 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').locator('div', {
hasText: 'listMenuItems',
}),
).toBeVisible()
})
test('should render custom afterListTable component', async () => {
await page.goto(postsUrl.list)
await expect(