Skip to content

Commit 6cc56a5

Browse files
heath-freenomeheath-freenome
committed
Fix 3624 by removing duplicate description render in templates
Fixes #3624 by removing the duplicate render of the `description` in the `ObjectFieldTemplate` and `ArrayFieldTemplate` - In `@rjsf/antd` - Removed render of `description` in the object and array field templates because it is already done in `FieldTemplate` in this theme - Updated the snapshot accordingly - Updated `OptionsDrawer` in the playground to allow users to change the `idPrefix` and `idSeparator` - Updated the `CHANGELOG.md` accordingly
1 parent 3965c5a commit 6cc56a5

File tree

6 files changed

+23
-345
lines changed

6 files changed

+23
-345
lines changed

‎CHANGELOG.md‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,16 @@ it according to semantic versioning. For example, if your PR adds a breaking cha
1515
should change the heading of the (upcoming) version to include a major version bump.
1616
1717
-->
18+
# 6.0.2
19+
20+
## @rjsf/antd
21+
22+
- Updated `ArrayFieldTemplate` and `ObjectFieldTemplate` to remove the rendering of a duplicate description (since the `FieldTemplate` already does it), fixing [#3624](https://github.com/rjsf-team/react-jsonschema-form/issues/3624)
23+
24+
## Dev / docs / playground
25+
26+
- Updated the `OptionsDrawer` of the playground to add `idPrefix` and `idSeparator` fields
27+
1828
# 6.0.1
1929

2030
## Dev / docs / playground

‎packages/antd/src/templates/ArrayFieldTemplate/index.tsx‎

Lines changed: 0 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -12,10 +12,6 @@ import classNames from 'classnames';
1212
import { Col, Row, ConfigProvider } from 'antd';
1313
import { useContext } from 'react';
1414

15-
const DESCRIPTION_COL_STYLE = {
16-
paddingBottom: '8px',
17-
};
18-
1915
/** The `ArrayFieldTemplate` component is the template used to render all items in an array.
2016
*
2117
* @param props - The `ArrayFieldTemplateProps` props for the component
@@ -41,11 +37,6 @@ export default function ArrayFieldTemplate<
4137
uiSchema,
4238
} = props;
4339
const uiOptions = getUiOptions<T, S, F>(uiSchema);
44-
const ArrayFieldDescriptionTemplate = getTemplate<'ArrayFieldDescriptionTemplate', T, S, F>(
45-
'ArrayFieldDescriptionTemplate',
46-
registry,
47-
uiOptions,
48-
);
4940
const ArrayFieldTitleTemplate = getTemplate<'ArrayFieldTitleTemplate', T, S, F>(
5041
'ArrayFieldTitleTemplate',
5142
registry,
@@ -84,17 +75,6 @@ export default function ArrayFieldTemplate<
8475
/>
8576
</Col>
8677
)}
87-
{(uiOptions.description || schema.description) && (
88-
<Col span={24} style={DESCRIPTION_COL_STYLE}>
89-
<ArrayFieldDescriptionTemplate
90-
description={uiOptions.description || schema.description}
91-
fieldPathId={fieldPathId}
92-
schema={schema}
93-
uiSchema={uiSchema}
94-
registry={registry}
95-
/>
96-
</Col>
97-
)}
9878
<Col className='row array-item-list' span={24}>
9979
{!showOptionalDataControlInTitle ? optionalDataControl : undefined}
10080
{items}

‎packages/antd/src/templates/ObjectFieldTemplate/index.tsx‎

Lines changed: 0 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ import {
1111
StrictRJSFSchema,
1212
UiSchema,
1313
canExpand,
14-
descriptionId,
1514
getTemplate,
1615
getUiOptions,
1716
titleId,
@@ -20,10 +19,6 @@ import {
2019
import { Col, Row, ConfigProvider } from 'antd';
2120
import { useContext } from 'react';
2221

23-
const DESCRIPTION_COL_STYLE = {
24-
paddingBottom: '8px',
25-
};
26-
2722
/** The `ObjectFieldTemplate` is the template to use to render all the inner properties of an object along with the
2823
* title and description if available. If the object is expandable, then an `AddButton` is also rendered after all
2924
* the properties.
@@ -36,7 +31,6 @@ export default function ObjectFieldTemplate<
3631
F extends FormContextType = any,
3732
>(props: ObjectFieldTemplateProps<T, S, F>) {
3833
const {
39-
description,
4034
disabled,
4135
formData,
4236
fieldPathId,
@@ -52,11 +46,6 @@ export default function ObjectFieldTemplate<
5246
} = props;
5347
const uiOptions = getUiOptions<T, S, F>(uiSchema);
5448
const TitleFieldTemplate = getTemplate<'TitleFieldTemplate', T, S, F>('TitleFieldTemplate', registry, uiOptions);
55-
const DescriptionFieldTemplate = getTemplate<'DescriptionFieldTemplate', T, S, F>(
56-
'DescriptionFieldTemplate',
57-
registry,
58-
uiOptions,
59-
);
6049
const { formContext } = registry;
6150
const showOptionalDataControlInTitle = !readonly && !disabled;
6251
// Button templates are not overridden in the uiSchema
@@ -132,17 +121,6 @@ export default function ObjectFieldTemplate<
132121
/>
133122
</Col>
134123
)}
135-
{description && (
136-
<Col span={24} style={DESCRIPTION_COL_STYLE}>
137-
<DescriptionFieldTemplate
138-
id={descriptionId(fieldPathId)}
139-
description={description}
140-
schema={schema}
141-
uiSchema={uiSchema}
142-
registry={registry}
143-
/>
144-
</Col>
145-
)}
146124
{!showOptionalDataControlInTitle ? <Col span={24}>{optionalDataControl}</Col> : undefined}
147125
{properties
148126
.filter((e) => !e.hidden)

‎packages/antd/test/__snapshots__/Array.test.tsx.snap‎

Lines changed: 0 additions & 174 deletions
Original file line numberDiff line numberDiff line change
@@ -7306,22 +7306,6 @@ exports[`with title and description array 1`] = `
73067306
}
73077307
/>
73087308
</div>
7309-
<div
7310-
className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
7311-
style={
7312-
{
7313-
"paddingBottom": "8px",
7314-
"paddingLeft": 12,
7315-
"paddingRight": 12,
7316-
}
7317-
}
7318-
>
7319-
<span
7320-
id="root__description"
7321-
>
7322-
a test description
7323-
</span>
7324-
</div>
73257309
<div
73267310
className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-ac2jek"
73277311
style={
@@ -7511,22 +7495,6 @@ exports[`with title and description array icons 1`] = `
75117495
}
75127496
/>
75137497
</div>
7514-
<div
7515-
className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
7516-
style={
7517-
{
7518-
"paddingBottom": "8px",
7519-
"paddingLeft": 12,
7520-
"paddingRight": 12,
7521-
}
7522-
}
7523-
>
7524-
<span
7525-
id="root__description"
7526-
>
7527-
a test description
7528-
</span>
7529-
</div>
75307498
<div
75317499
className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-ac2jek"
75327500
style={
@@ -8479,22 +8447,6 @@ exports[`with title and description fixed array 1`] = `
84798447
}
84808448
/>
84818449
</div>
8482-
<div
8483-
className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
8484-
style={
8485-
{
8486-
"paddingBottom": "8px",
8487-
"paddingLeft": 12,
8488-
"paddingRight": 12,
8489-
}
8490-
}
8491-
>
8492-
<span
8493-
id="root__description"
8494-
>
8495-
a test description
8496-
</span>
8497-
</div>
84988450
<div
84998451
className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-ac2jek"
85008452
style={
@@ -8907,22 +8859,6 @@ exports[`with title and description from both array 1`] = `
89078859
}
89088860
/>
89098861
</div>
8910-
<div
8911-
className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
8912-
style={
8913-
{
8914-
"paddingBottom": "8px",
8915-
"paddingLeft": 12,
8916-
"paddingRight": 12,
8917-
}
8918-
}
8919-
>
8920-
<span
8921-
id="root__description"
8922-
>
8923-
a fancier description
8924-
</span>
8925-
</div>
89268862
<div
89278863
className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-ac2jek"
89288864
style={
@@ -9112,22 +9048,6 @@ exports[`with title and description from both array icons 1`] = `
91129048
}
91139049
/>
91149050
</div>
9115-
<div
9116-
className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
9117-
style={
9118-
{
9119-
"paddingBottom": "8px",
9120-
"paddingLeft": 12,
9121-
"paddingRight": 12,
9122-
}
9123-
}
9124-
>
9125-
<span
9126-
id="root__description"
9127-
>
9128-
a fancier description
9129-
</span>
9130-
</div>
91319051
<div
91329052
className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-ac2jek"
91339053
style={
@@ -10080,22 +10000,6 @@ exports[`with title and description from both fixed array 1`] = `
1008010000
}
1008110001
/>
1008210002
</div>
10083-
<div
10084-
className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
10085-
style={
10086-
{
10087-
"paddingBottom": "8px",
10088-
"paddingLeft": 12,
10089-
"paddingRight": 12,
10090-
}
10091-
}
10092-
>
10093-
<span
10094-
id="root__description"
10095-
>
10096-
a fancier description
10097-
</span>
10098-
</div>
1009910003
<div
1010010004
className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-ac2jek"
1010110005
style={
@@ -10508,22 +10412,6 @@ exports[`with title and description from uiSchema array 1`] = `
1050810412
}
1050910413
/>
1051010414
</div>
10511-
<div
10512-
className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
10513-
style={
10514-
{
10515-
"paddingBottom": "8px",
10516-
"paddingLeft": 12,
10517-
"paddingRight": 12,
10518-
}
10519-
}
10520-
>
10521-
<span
10522-
id="root__description"
10523-
>
10524-
a fancier description
10525-
</span>
10526-
</div>
1052710415
<div
1052810416
className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-ac2jek"
1052910417
style={
@@ -10713,22 +10601,6 @@ exports[`with title and description from uiSchema array icons 1`] = `
1071310601
}
1071410602
/>
1071510603
</div>
10716-
<div
10717-
className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
10718-
style={
10719-
{
10720-
"paddingBottom": "8px",
10721-
"paddingLeft": 12,
10722-
"paddingRight": 12,
10723-
}
10724-
}
10725-
>
10726-
<span
10727-
id="root__description"
10728-
>
10729-
a fancier description
10730-
</span>
10731-
</div>
1073210604
<div
1073310605
className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-ac2jek"
1073410606
style={
@@ -11681,22 +11553,6 @@ exports[`with title and description from uiSchema fixed array 1`] = `
1168111553
}
1168211554
/>
1168311555
</div>
11684-
<div
11685-
className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
11686-
style={
11687-
{
11688-
"paddingBottom": "8px",
11689-
"paddingLeft": 12,
11690-
"paddingRight": 12,
11691-
}
11692-
}
11693-
>
11694-
<span
11695-
id="root__description"
11696-
>
11697-
a fancier description
11698-
</span>
11699-
</div>
1170011556
<div
1170111557
className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-ac2jek"
1170211558
style={
@@ -12091,16 +11947,6 @@ exports[`with title and description with global label off array 1`] = `
1209111947
}
1209211948
}
1209311949
/>
12094-
<div
12095-
className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
12096-
style={
12097-
{
12098-
"paddingBottom": "8px",
12099-
"paddingLeft": 12,
12100-
"paddingRight": 12,
12101-
}
12102-
}
12103-
/>
1210411950
<div
1210511951
className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-ac2jek"
1210611952
style={
@@ -12272,16 +12118,6 @@ exports[`with title and description with global label off array icons 1`] = `
1227212118
}
1227312119
}
1227412120
/>
12275-
<div
12276-
className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
12277-
style={
12278-
{
12279-
"paddingBottom": "8px",
12280-
"paddingLeft": 12,
12281-
"paddingRight": 12,
12282-
}
12283-
}
12284-
/>
1228512121
<div
1228612122
className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-ac2jek"
1228712123
style={
@@ -13192,16 +13028,6 @@ exports[`with title and description with global label off fixed array 1`] = `
1319213028
}
1319313029
}
1319413030
/>
13195-
<div
13196-
className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
13197-
style={
13198-
{
13199-
"paddingBottom": "8px",
13200-
"paddingLeft": 12,
13201-
"paddingRight": 12,
13202-
}
13203-
}
13204-
/>
1320513031
<div
1320613032
className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-ac2jek"
1320713033
style={

0 commit comments

Comments
 (0)