From a35a177bd1ebbe009bcfd826cda77f79f6bdcc3e Mon Sep 17 00:00:00 2001
From: burnettk <burnettk@users.noreply.github.com>
Date: Mon, 30 Jan 2023 11:53:35 -0500
Subject: [PATCH] new mechanism to handle help more in line with how carbon
 works

---
 .../carbon/BaseInputTemplate/BaseInputTemplate.tsx     |  6 ++++++
 .../carbon/FieldHelpTemplate/FieldHelpTemplate.tsx     | 10 ++++------
 .../src/themes/carbon/SelectWidget/SelectWidget.tsx    |  9 ++++++++-
 3 files changed, 18 insertions(+), 7 deletions(-)

diff --git a/spiffworkflow-frontend/src/themes/carbon/BaseInputTemplate/BaseInputTemplate.tsx b/spiffworkflow-frontend/src/themes/carbon/BaseInputTemplate/BaseInputTemplate.tsx
index 7954a0ac..c6f677d2 100644
--- a/spiffworkflow-frontend/src/themes/carbon/BaseInputTemplate/BaseInputTemplate.tsx
+++ b/spiffworkflow-frontend/src/themes/carbon/BaseInputTemplate/BaseInputTemplate.tsx
@@ -85,6 +85,11 @@ export default function BaseInputTemplate<
     labelToUse = `${labelToUse}*`;
   }
 
+  let helperText = null;
+  if (uiSchema && uiSchema['ui:help']) {
+    helperText = uiSchema['ui:help'];
+  }
+
   let invalid = false;
   let errorMessageForField = null;
   if (rawErrors && rawErrors.length > 0) {
@@ -103,6 +108,7 @@ export default function BaseInputTemplate<
         name={id}
         className="input"
         labelText={labelToUse}
+        helperText={helperText}
         invalid={invalid}
         invalidText={errorMessageForField}
         autoFocus={autofocus}
diff --git a/spiffworkflow-frontend/src/themes/carbon/FieldHelpTemplate/FieldHelpTemplate.tsx b/spiffworkflow-frontend/src/themes/carbon/FieldHelpTemplate/FieldHelpTemplate.tsx
index 08a61aeb..da4543f2 100644
--- a/spiffworkflow-frontend/src/themes/carbon/FieldHelpTemplate/FieldHelpTemplate.tsx
+++ b/spiffworkflow-frontend/src/themes/carbon/FieldHelpTemplate/FieldHelpTemplate.tsx
@@ -7,10 +7,8 @@ import FormHelperText from '@mui/material/FormHelperText';
  * @param props - The `FieldHelpProps` to be rendered
  */
 export default function FieldHelpTemplate(props: FieldHelpProps) {
-  const { idSchema, help } = props;
-  if (!help) {
-    return null;
-  }
-  const id = `${idSchema.$id}__help`;
-  return <FormHelperText id={id}>{help}</FormHelperText>;
+  // ui:help is handled by helperText in all carbon widgets.
+  // see BaseInputTemplate/BaseInputTemplate.tsx and
+  // SelectWidget/SelectWidget.tsx
+  return null;
 }
diff --git a/spiffworkflow-frontend/src/themes/carbon/SelectWidget/SelectWidget.tsx b/spiffworkflow-frontend/src/themes/carbon/SelectWidget/SelectWidget.tsx
index 616b11a7..d74b9b7b 100644
--- a/spiffworkflow-frontend/src/themes/carbon/SelectWidget/SelectWidget.tsx
+++ b/spiffworkflow-frontend/src/themes/carbon/SelectWidget/SelectWidget.tsx
@@ -41,6 +41,10 @@ function SelectWidget({
   } else if (schema && schema.title) {
     labelToUse = schema.title;
   }
+  let helperText = null;
+  if (uiSchema && uiSchema['ui:help']) {
+    helperText = uiSchema['ui:help'];
+  }
   if (required) {
     labelToUse = `${labelToUse}*`;
   }
@@ -52,13 +56,16 @@ function SelectWidget({
     errorMessageForField = `${labelToUse.replace(/\*$/, '')} ${rawErrors[0]}`;
   }
 
+  // maybe use placeholder somehow. it was previously jammed into the helperText field,
+  // but allowing ui:help to grab that spot seems much more appropriate.
+
   return (
     <Select
       id={id}
       name={id}
       labelText={labelToUse}
       select
-      helperText={placeholder}
+      helperText={helperText}
       value={typeof value === 'undefined' ? emptyValue : value}
       disabled={disabled || readonly}
       autoFocus={autofocus}