tabshift/payload
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: collection list view custom components: BeforeList, BeforeListTable, AfterListTable, AfterList (#2792)

Browse Source
This commit is contained in:
Alessio Gravili
2023-06-08 15:33:16 +02:00
committed by GitHub
parent 91dba7be88
commit 38e962f2cb
6 changed files with 94 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/admin/components/Routes.tsx
View File

@@ -198,9 +198,9 @@ const Routes: React.FC = () => {
>
<Edit collection={collection} />
</DocumentInfoProvider>
) : (
<Unauthorized />
)}
) : (
<Unauthorized />
)}
</Route>,
<Route
key={`${collection.slug}-edit`}
@@ -217,7 +217,7 @@ const Routes: React.FC = () => {
collection={collection}
/>
</DocumentInfoProvider>
) : <Unauthorized />}
) : <Unauthorized />}
</Route>,
];
@@ -230,7 +230,7 @@ const Routes: React.FC = () => {
>
{permissions?.collections?.[collection.slug]?.readVersions?.permission ? (
<Versions collection={collection} />
) : <Unauthorized />}
) : <Unauthorized />}
</Route>,
);
@@ -247,7 +247,7 @@ const Routes: React.FC = () => {
>
<Version collection={collection} />
</DocumentInfoProvider>
) : <Unauthorized />}
) : <Unauthorized />}
</Route>,
);
}
@@ -272,7 +272,7 @@ const Routes: React.FC = () => {
>
<EditGlobal global={global} />
</DocumentInfoProvider>
) : <Unauthorized />}
) : <Unauthorized />}
</Route>,
];
@@ -297,7 +297,7 @@ const Routes: React.FC = () => {
>
{permissions?.globals?.[global.slug]?.readVersions?.permission ? (
<Version global={global} />
) : <Unauthorized />}
) : <Unauthorized />}
</Route>,
);
}

32
src/admin/components/views/collections/List/Default.tsx
View File

@@ -37,6 +37,12 @@ const DefaultList: React.FC<Props> = (props) => {
},
admin: {
description,
components: {
BeforeList,
BeforeListTable,
AfterListTable,
AfterList,
} = {},
} = {},
},
data,
@@ -68,6 +74,13 @@ const DefaultList: React.FC<Props> = (props) => {
return (
<div className={baseClass}>
{Array.isArray(BeforeList) && BeforeList.map((Component, i) => (
<Component
key={i}
{...props}
/>
))}
<Meta
title={getTranslation(collection.labels.plural, i18n)}
/>
@@ -111,6 +124,12 @@ const DefaultList: React.FC<Props> = (props) => {
handleWhereChange={handleWhereChange}
resetParams={resetParams}
/>
{Array.isArray(BeforeListTable) && BeforeListTable.map((Component, i) => (
<Component
key={i}
{...props}
/>
))}
{!data.docs && (
<StaggeredShimmers
className={[`${baseClass}__shimmer`, `${baseClass}__shimmer--rows`].join(' ')}
@@ -137,6 +156,13 @@ const DefaultList: React.FC<Props> = (props) => {
)}
</div>
)}
{Array.isArray(AfterListTable) && AfterListTable.map((Component, i) => (
<Component
key={i}
{...props}
/>
))}
<div className={`${baseClass}__page-controls`}>
<Paginator
limit={data.limit}
@@ -200,6 +226,12 @@ const DefaultList: React.FC<Props> = (props) => {
</div>
</Gutter>
</SelectionProvider>
{Array.isArray(AfterList) && AfterList.map((Component, i) => (
<Component
key={i}
{...props}
/>
))}
</div>
);
};

4
src/collections/config/schema.ts
View File

@@ -69,6 +69,10 @@ const collectionSchema = joi.object().keys({
SaveDraftButton: componentSchema,
PreviewButton: componentSchema,
}),
BeforeList: joi.array().items(componentSchema),
BeforeListTable: joi.array().items(componentSchema),
AfterListTable: joi.array().items(componentSchema),
AfterList: joi.array().items(componentSchema),
}),
pagination: joi.object({
defaultLimit: joi.number(),

12
src/collections/config/types.ts
View File

@@ -12,6 +12,8 @@ import { IncomingUploadType, Upload } from '../../uploads/types';
import { IncomingCollectionVersions, SanitizedCollectionVersions } from '../../versions/types';
import { BuildQueryArgs } from '../../mongoose/buildQuery';
import { CustomPreviewButtonProps, CustomPublishButtonProps, CustomSaveButtonProps, CustomSaveDraftButtonProps } from '../../admin/components/elements/types';
import type { Props as ListProps } from '../../admin/components/views/collections/List/types';
import type { Props as EditProps } from '../../admin/components/views/collections/Edit/types';
type Register<T = any> = (doc: T, password: string) => T;
@@ -220,9 +222,13 @@ export type CollectionAdminOptions = {
PreviewButton?: CustomPreviewButtonProps
},
views?: {
Edit?: React.ComponentType<any>
List?: React.ComponentType<any>
}
Edit?: React.ComponentType<EditProps>
List?: React.ComponentType<ListProps>
},
BeforeList?: React.ComponentType<ListProps>[],
BeforeListTable?: React.ComponentType<ListProps>[],
AfterListTable?: React.ComponentType<ListProps>[],
AfterList?: React.ComponentType<ListProps>[],
};
pagination?: {
defaultLimit?: number