Skip to content

Commit

Permalink
Fix #3174 by not rendering empty help and extra information for fields (
Browse files Browse the repository at this point in the history 
#3187)

Fixed #3174
- Updated `FieldTemplate` to ensure that `help` and `extra` information is only rendered when the `rawDescription` and `rawErrors` are not provided
  - Before, even though `description` and `errors` would render empty components, it would still cause unnecessary whitespace in which they were rendered
  - Now, those props are passed undefined unless the raw information indicates there is data to render
- Updated the test snapshots
- Updated the `CHANGELOG.md` accordingly
  • Loading branch information
@heath-freenome
heath-freenome authored Oct 7, 2022
1 parent 848056e commit 6666b18
Show file tree
Hide file tree
Showing 5 changed files with 17 additions and 46 deletions.
3 changes: 3 additions & 0 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,9 @@ should change the heading of the (upcoming) version to include a major version b
-->
# 5.0.0-beta.11

## @rjsf/antd
- Updated `FieldTemplate` to no longer render additional, unnecessary white space for fields that have empty `help` and `extra` information, fixing [#3147](https://github.com/rjsf-team/react-jsonschema-form/issues/3174)

## @rjsf/bootstrap-4
- Make label generation consistent with other themes by refactoring the code into the `FieldTemplate` instead of having the widgets implementing the label, fixing [#2007](https://github.com/rjsf-team/react-jsonschema-form/issues/2007)

Expand Down
5 changes: 3 additions & 2 deletions packages/antd/src/templates/FieldTemplate/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ const FieldTemplate = ({
onDropPropertyClick,
onKeyChange,
rawErrors,
rawDescription,
rawHelp,
readonly,
registry,
Expand Down Expand Up @@ -66,9 +67,9 @@ const FieldTemplate = ({
) : (
<Form.Item
colon={colon}
extra={description}
extra={rawDescription && description}
hasFeedback={schema.type !== "array" && schema.type !== "object"}
help={(!!rawHelp && help) || errors}
help={(!!rawHelp && help) || (rawErrors?.length && errors)}
htmlFor={id}
label={displayLabel && label}
labelCol={labelCol}
Expand Down
31 changes: 5 additions & 26 deletions packages/antd/test/__snapshots__/Array.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -164,7 +164,7 @@ exports[`array fields array icons 1`] = `
className="form-group field field-string"
>
<div
className="ant-form-item ant-form-item-with-help"
className="ant-form-item"
>
<div
className="ant-row ant-form-item-row"
Expand Down Expand Up @@ -209,9 +209,6 @@ exports[`array fields array icons 1`] = `
</span>
</div>
</div>
<div
className="ant-form-item-extra"
/>
</div>
</div>
</div>
Expand Down Expand Up @@ -357,7 +354,7 @@ exports[`array fields array icons 1`] = `
className="form-group field field-string"
>
<div
className="ant-form-item ant-form-item-with-help"
className="ant-form-item"
>
<div
className="ant-row ant-form-item-row"
Expand Down Expand Up @@ -402,9 +399,6 @@ exports[`array fields array icons 1`] = `
</span>
</div>
</div>
<div
className="ant-form-item-extra"
/>
</div>
</div>
</div>
Expand Down Expand Up @@ -808,9 +802,6 @@ exports[`array fields empty errors array 1`] = `
</span>
</div>
</div>
<div
className="ant-form-item-extra"
/>
</div>
</div>
</div>
Expand Down Expand Up @@ -887,7 +878,7 @@ exports[`array fields fixed array 1`] = `
className="form-group field field-string"
>
<div
className="ant-form-item ant-form-item-with-help"
className="ant-form-item"
>
<div
className="ant-row ant-form-item-row"
Expand Down Expand Up @@ -932,9 +923,6 @@ exports[`array fields fixed array 1`] = `
</span>
</div>
</div>
<div
className="ant-form-item-extra"
/>
</div>
</div>
</div>
Expand Down Expand Up @@ -964,7 +952,7 @@ exports[`array fields fixed array 1`] = `
className="form-group field field-number"
>
<div
className="ant-form-item ant-form-item-with-help"
className="ant-form-item"
>
<div
className="ant-row ant-form-item-row"
Expand Down Expand Up @@ -1090,9 +1078,6 @@ exports[`array fields fixed array 1`] = `
</div>
</div>
</div>
<div
className="ant-form-item-extra"
/>
</div>
</div>
</div>
Expand Down Expand Up @@ -1310,9 +1295,6 @@ exports[`array fields has errors 1`] = `
</span>
</div>
</div>
<div
className="ant-form-item-extra"
/>
</div>
</div>
</div>
Expand Down Expand Up @@ -1369,7 +1351,7 @@ exports[`array fields no errors 1`] = `
className="form-group field field-string"
>
<div
className="ant-form-item ant-form-item-with-help"
className="ant-form-item"
>
<div
className="ant-row ant-form-item-row"
Expand Down Expand Up @@ -1426,9 +1408,6 @@ exports[`array fields no errors 1`] = `
</span>
</div>
</div>
<div
className="ant-form-item-extra"
/>
</div>
</div>
</div>
Expand Down
9 changes: 3 additions & 6 deletions packages/antd/test/__snapshots__/Form.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -308,7 +308,7 @@ exports[`single fields field with description 1`] = `
className="form-group field field-string"
>
<div
className="ant-form-item ant-form-item-with-help"
className="ant-form-item"
>
<div
className="ant-row ant-form-item-row"
Expand Down Expand Up @@ -430,7 +430,7 @@ exports[`single fields field with description in uiSchema 1`] = `
className="form-group field field-string"
>
<div
className="ant-form-item ant-form-item-with-help"
className="ant-form-item"
>
<div
className="ant-row ant-form-item-row"
Expand Down Expand Up @@ -1868,7 +1868,7 @@ exports[`single fields title field 1`] = `
className="form-group field field-string"
>
<div
className="ant-form-item ant-form-item-with-help"
className="ant-form-item"
>
<div
className="ant-row ant-form-item-row"
Expand Down Expand Up @@ -1925,9 +1925,6 @@ exports[`single fields title field 1`] = `
</span>
</div>
</div>
<div
className="ant-form-item-extra"
/>
</div>
</div>
</div>
Expand Down
15 changes: 3 additions & 12 deletions packages/antd/test/__snapshots__/Object.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -129,7 +129,7 @@ exports[`object fields additionalProperties 1`] = `
}
>
<div
className="ant-form-item ant-form-item-with-help"
className="ant-form-item"
>
<div
className="ant-row ant-form-item-row"
Expand Down Expand Up @@ -186,9 +186,6 @@ exports[`object fields additionalProperties 1`] = `
</span>
</div>
</div>
<div
className="ant-form-item-extra"
/>
</div>
</div>
</div>
Expand Down Expand Up @@ -341,7 +338,7 @@ exports[`object fields object 1`] = `
className="form-group field field-string"
>
<div
className="ant-form-item ant-form-item-with-help"
className="ant-form-item"
>
<div
className="ant-row ant-form-item-row"
Expand Down Expand Up @@ -398,9 +395,6 @@ exports[`object fields object 1`] = `
</span>
</div>
</div>
<div
className="ant-form-item-extra"
/>
</div>
</div>
</div>
Expand All @@ -419,7 +413,7 @@ exports[`object fields object 1`] = `
className="form-group field field-number"
>
<div
className="ant-form-item ant-form-item-with-help"
className="ant-form-item"
>
<div
className="ant-row ant-form-item-row"
Expand Down Expand Up @@ -557,9 +551,6 @@ exports[`object fields object 1`] = `
</div>
</div>
</div>
<div
className="ant-form-item-extra"
/>
</div>
</div>
</div>
Expand Down

0 comments on commit 6666b18

Please sign in to comment.