feat: added support for conditional tabs (#8720)
Adds support for conditional tabs.
You can now add a `condition` function like other fields to each
individual tab's admin config like so:
```ts
{
name: 'contentTab',
admin: {
condition: (data) => Boolean(data?.enableTab)
}
}
```
This will toggle the individual tab's visibility in the document listing
### Example
https://github.com/user-attachments/assets/45cf9cfd-eaed-4dfe-8a32-1992385fd05c
This is an updated PR from
https://github.com/payloadcms/payload/pull/8406 thanks to @willviles
---------
Co-authored-by: Will Viles <will@willviles.com>
Co-authored-by: Jarrod Flesch <jarrodmflesch@gmail.com>
This commit is contained in:
@@ -1831,6 +1831,19 @@ export interface TabsField {
|
||||
* This should not collapse despite there being many tabs pushing the main fields open.
|
||||
*/
|
||||
sidebarField?: string | null;
|
||||
/**
|
||||
* When active, the conditional tab should be visible. When inactive, it should be hidden.
|
||||
*/
|
||||
conditionalTabVisible?: boolean | null;
|
||||
conditionalTab?: {
|
||||
conditionalTabField?: string | null;
|
||||
/**
|
||||
* When active, the nested conditional tab should be visible. When inactive, it should be hidden.
|
||||
*/
|
||||
nestedConditionalTabVisible?: boolean | null;
|
||||
nestedUnconditionalTabInput?: string | null;
|
||||
nestedConditionalTabInput?: string | null;
|
||||
};
|
||||
array: {
|
||||
text: string;
|
||||
id?: string | null;
|
||||
@@ -3452,6 +3465,15 @@ export interface TabsFields2Select<T extends boolean = true> {
|
||||
*/
|
||||
export interface TabsFieldsSelect<T extends boolean = true> {
|
||||
sidebarField?: T;
|
||||
conditionalTabVisible?: T;
|
||||
conditionalTab?:
|
||||
| T
|
||||
| {
|
||||
conditionalTabField?: T;
|
||||
nestedConditionalTabVisible?: T;
|
||||
nestedUnconditionalTabInput?: T;
|
||||
nestedConditionalTabInput?: T;
|
||||
};
|
||||
array?:
|
||||
| T
|
||||
| {
|
||||
|
||||
Reference in New Issue
Block a user