feat(CTB): add conditional fields form to custom fields advanced settings (#24175)

This commit is contained in:
Bassel Kanso 2025-08-14 18:08:25 +03:00 committed by GitHub
parent e52f529abf
commit 06f5279fc9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 84 additions and 5 deletions

View File

@ -84,7 +84,26 @@ export const forms = {
},
advanced({ customField, data, step, extensions, ...rest }: any) {
// Default section with no fields
const sections: FormTypeOptions = [{ sectionTitle: null, items: [] }];
const sections: FormTypeOptions = [
{ sectionTitle: null, items: [] },
{
sectionTitle: { id: 'form.attribute.condition.section', defaultMessage: 'Conditions' },
items: [
{
name: 'conditions',
type: 'condition-form',
intlLabel: {
id: 'form.attribute.condition.label',
defaultMessage: 'Visibility condition',
},
description: {
id: 'form.attribute.condition.desc',
defaultMessage: 'Show this field only when a boolean/enum condition matches.',
},
},
],
},
];
const injectedInputs = extensions.getAdvancedForm(['attribute', customField.type], {
data,
type: customField.type,

View File

@ -228,9 +228,29 @@ describe('customField forms', () => {
},
],
},
{
sectionTitle: {
id: 'form.attribute.condition.section',
defaultMessage: 'Conditions',
},
items: [
{
name: 'conditions',
type: 'condition-form',
intlLabel: {
id: 'form.attribute.condition.label',
defaultMessage: 'Visibility condition',
},
description: {
id: 'form.attribute.condition.desc',
defaultMessage: 'Show this field only when a boolean/enum condition matches.',
},
},
],
},
];
expect(result.sections.length).toBe(1);
expect(result.sections.length).toBe(2);
expect(result).toStrictEqual({ sections: expected });
});
it('adds a new advanced form section', () => {
@ -251,6 +271,26 @@ describe('customField forms', () => {
sectionTitle: null,
items: [],
},
{
sectionTitle: {
id: 'form.attribute.condition.section',
defaultMessage: 'Conditions',
},
items: [
{
name: 'conditions',
type: 'condition-form',
intlLabel: {
id: 'form.attribute.condition.label',
defaultMessage: 'Visibility condition',
},
description: {
id: 'form.attribute.condition.desc',
defaultMessage: 'Show this field only when a boolean/enum condition matches.',
},
},
],
},
{
sectionTitle: {
id: 'test',
@ -273,7 +313,7 @@ describe('customField forms', () => {
},
];
expect(result.sections.length).toBe(2);
expect(result.sections.length).toBe(3);
expect(result).toStrictEqual({ sections: expected });
});
@ -310,6 +350,26 @@ describe('customField forms', () => {
sectionTitle: null,
items: [],
},
{
sectionTitle: {
id: 'form.attribute.condition.section',
defaultMessage: 'Conditions',
},
items: [
{
name: 'conditions',
type: 'condition-form',
intlLabel: {
id: 'form.attribute.condition.label',
defaultMessage: 'Visibility condition',
},
description: {
id: 'form.attribute.condition.desc',
defaultMessage: 'Show this field only when a boolean/enum condition matches.',
},
},
],
},
{
sectionTitle: {
id: 'content-type-builder.modalForm.custom-fields.advanced.settings.extended',
@ -332,7 +392,7 @@ describe('customField forms', () => {
},
];
expect(result.sections.length).toBe(2);
expect(result.sections.length).toBe(3);
expect(result).toStrictEqual({ sections: expected });
});
});

View File

@ -139,7 +139,7 @@ export const TabForm = ({
)}
</Typography>
)}
<Tooltip description={noFieldsMessage}>
<Tooltip label={noFieldsMessage}>
<Button
marginTop={
currentCondition && Object.keys(currentCondition).length > 0 ? 0 : 4