From 6666b181ab548319042ef29a3df098e6da71b66a Mon Sep 17 00:00:00 2001
From: Heath C <51679588+heath-freenome@users.noreply.github.com>
Date: Fri, 7 Oct 2022 09:12:13 -0700
Subject: [PATCH] Fix #3174 by not rendering empty help and extra information
 for fields (#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
---
 CHANGELOG.md                                  |  3 ++
 .../src/templates/FieldTemplate/index.tsx     |  5 +--
 .../test/__snapshots__/Array.test.tsx.snap    | 31 +++----------------
 .../test/__snapshots__/Form.test.tsx.snap     |  9 ++----
 .../test/__snapshots__/Object.test.tsx.snap   | 15 ++-------
 5 files changed, 17 insertions(+), 46 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index e99f4e39ce..045d73da29 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -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)
 
diff --git a/packages/antd/src/templates/FieldTemplate/index.tsx b/packages/antd/src/templates/FieldTemplate/index.tsx
index 371d6edd7c..87d8800619 100644
--- a/packages/antd/src/templates/FieldTemplate/index.tsx
+++ b/packages/antd/src/templates/FieldTemplate/index.tsx
@@ -22,6 +22,7 @@ const FieldTemplate = ({
   onDropPropertyClick,
   onKeyChange,
   rawErrors,
+  rawDescription,
   rawHelp,
   readonly,
   registry,
@@ -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}
diff --git a/packages/antd/test/__snapshots__/Array.test.tsx.snap b/packages/antd/test/__snapshots__/Array.test.tsx.snap
index 9f5e8fb7b2..45c021c68f 100644
--- a/packages/antd/test/__snapshots__/Array.test.tsx.snap
+++ b/packages/antd/test/__snapshots__/Array.test.tsx.snap
@@ -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"
@@ -209,9 +209,6 @@ exports[`array fields array icons 1`] = `
                           </span>
                         </div>
                       </div>
-                      <div
-                        className="ant-form-item-extra"
-                      />
                     </div>
                   </div>
                 </div>
@@ -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"
@@ -402,9 +399,6 @@ exports[`array fields array icons 1`] = `
                           </span>
                         </div>
                       </div>
-                      <div
-                        className="ant-form-item-extra"
-                      />
                     </div>
                   </div>
                 </div>
@@ -808,9 +802,6 @@ exports[`array fields empty errors array 1`] = `
                       </span>
                     </div>
                   </div>
-                  <div
-                    className="ant-form-item-extra"
-                  />
                 </div>
               </div>
             </div>
@@ -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"
@@ -932,9 +923,6 @@ exports[`array fields fixed array 1`] = `
                           </span>
                         </div>
                       </div>
-                      <div
-                        className="ant-form-item-extra"
-                      />
                     </div>
                   </div>
                 </div>
@@ -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"
@@ -1090,9 +1078,6 @@ exports[`array fields fixed array 1`] = `
                           </div>
                         </div>
                       </div>
-                      <div
-                        className="ant-form-item-extra"
-                      />
                     </div>
                   </div>
                 </div>
@@ -1310,9 +1295,6 @@ exports[`array fields has errors 1`] = `
                       </span>
                     </div>
                   </div>
-                  <div
-                    className="ant-form-item-extra"
-                  />
                 </div>
               </div>
             </div>
@@ -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"
@@ -1426,9 +1408,6 @@ exports[`array fields no errors 1`] = `
                       </span>
                     </div>
                   </div>
-                  <div
-                    className="ant-form-item-extra"
-                  />
                 </div>
               </div>
             </div>
diff --git a/packages/antd/test/__snapshots__/Form.test.tsx.snap b/packages/antd/test/__snapshots__/Form.test.tsx.snap
index 00ea9fd5b1..ab54a7346f 100644
--- a/packages/antd/test/__snapshots__/Form.test.tsx.snap
+++ b/packages/antd/test/__snapshots__/Form.test.tsx.snap
@@ -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"
@@ -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"
@@ -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"
@@ -1925,9 +1925,6 @@ exports[`single fields title field 1`] = `
                       </span>
                     </div>
                   </div>
-                  <div
-                    className="ant-form-item-extra"
-                  />
                 </div>
               </div>
             </div>
diff --git a/packages/antd/test/__snapshots__/Object.test.tsx.snap b/packages/antd/test/__snapshots__/Object.test.tsx.snap
index 017db866cd..c7e5c2930a 100644
--- a/packages/antd/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/antd/test/__snapshots__/Object.test.tsx.snap
@@ -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"
@@ -186,9 +186,6 @@ exports[`object fields additionalProperties 1`] = `
                           </span>
                         </div>
                       </div>
-                      <div
-                        className="ant-form-item-extra"
-                      />
                     </div>
                   </div>
                 </div>
@@ -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"
@@ -398,9 +395,6 @@ exports[`object fields object 1`] = `
                       </span>
                     </div>
                   </div>
-                  <div
-                    className="ant-form-item-extra"
-                  />
                 </div>
               </div>
             </div>
@@ -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"
@@ -557,9 +551,6 @@ exports[`object fields object 1`] = `
                       </div>
                     </div>
                   </div>
-                  <div
-                    className="ant-form-item-extra"
-                  />
                 </div>
               </div>
             </div>