Refactor listAllTruthyValues in Confirmation to acct for new current …

…benefits data structure
Gary-Community-Ventures · Aug 28, 2024 · 2bed1bb · 2bed1bb
1 parent 982da60
commit 2bed1bb
Showing 1 changed file with 29 additions and 11 deletions.
diff --git a/src/Components/Confirmation/Confirmation.js b/src/Components/Confirmation/Confirmation.js
@@ -564,17 +564,33 @@ const Confirmation = () => {
     return mappedListItems;
   };
 
-  const listAllTruthyValues = (selectedOptions, relatedOptionsList) => {
-    const mappedListItems = selectedOptions.map((option) => {
-      return (
-        <p key={option} className="bottom-margin">
-          {' '}
-          {relatedOptionsList[option]}{' '}
-        </p>
-      );
-    });
+  const listAllTruthyValues = (selectedOptions, relatedOptionsList, stateVariableName) => {
+    if (stateVariableName === 'benefits') {
+      const mappedListItems = selectedOptions.map((option) => {
+        const { id: nameId, defaultMessage: nameDefaultMsg } = relatedOptionsList[option].name.props;
+        const { id: descId, defaultMessage: descDefaultMsg } = relatedOptionsList[option].description.props;
+
+        return (
+          <p key={nameId} className="bottom-margin">
+            <strong>{<FormattedMessage id={nameId} defaultMessage={nameDefaultMsg} />}: </strong>
+            <span>{<FormattedMessage id={descId} defaultMessage={descDefaultMsg} />}</span>
+          </p>
+        );
+      });
 
-    return mappedListItems;
+      return mappedListItems;
+    } else {
+      const mappedListItems = selectedOptions.map((option) => {
+        return (
+          <p key={option} className="bottom-margin">
+            {' '}
+            {relatedOptionsList[option]}{' '}
+          </p>
+        );
+      });
+
+      return mappedListItems;
+    }
   };
 
   const displayHHCheckboxSection = (
@@ -601,7 +617,9 @@ const Confirmation = () => {
             <FormattedMessage id={fMessageId} defaultMessage={fMessageDefaultMsg} />
           </p>
           {hasAnyTruthyOptions ? (
-            <article className="section-p">{listAllTruthyValues(truthyOptions, optionsList)}</article>
+            <article className="section-p">
+              {listAllTruthyValues(truthyOptions, optionsList, stateVariableName)}
+            </article>
           ) : (
             <p className="section-p">
               <FormattedMessage id="confirmation.noIncome" defaultMessage=" None" />