fix: update Account.tsx

jwplayer · Jun 7, 2023 · 3b81892 · 3b81892
1 parent 3e7ed31
commit 3b81892
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 39 deletions.
diff --git a/src/components/Account/Account.tsx b/src/components/Account/Account.tsx
@@ -8,7 +8,8 @@ import { useMutation } from 'react-query';
 import styles from './Account.module.scss';
 
 import type { FormSectionContentArgs, FormSectionProps } from '#components/Form/FormSection';
-import type { ConsentFieldVariants } from '#src/services/inplayer.account.service';
+import type { Consent } from '#types/account';
+import { ConsentFieldVariants } from '#src/services/inplayer.account.service';
 import Alert from '#components/Alert/Alert';
 import Visibility from '#src/icons/Visibility';
 import VisibilityOff from '#src/icons/VisibilityOff';
@@ -67,8 +68,16 @@ const Account = ({ panelClassName, panelHeaderClassName, canUpdateEmail = true }
   );
 
   const [termsConsents, nonTermsConsents] = useMemo(() => {
-    const terms = (publisherConsents || []).filter((consent) => consent.name === 'terms');
-    const nonTerms = publisherConsents?.filter((consent) => consent.name !== 'terms');
+    const terms: Consent[] = [];
+    const nonTerms: Consent[] = [];
+
+    publisherConsents?.forEach((consent) => {
+      if (!Object.hasOwn(consent, 'type') || consent.type === ConsentFieldVariants.CHECKBOX) {
+        terms.push(consent);
+      } else {
+        nonTerms.push(consent);
+      }
+    });
 
     return [terms, nonTerms];
   }, [publisherConsents]);
@@ -267,7 +276,7 @@ const Account = ({ panelClassName, panelHeaderClassName, canUpdateEmail = true }
                     key={index}
                     name={`consents.${consent.name}`}
                     value={consent.value || ''}
-                    checked={(section.values.consents?.[consent.name] as boolean) || false}
+                    checked={`${section.values.consents?.[consent.name]}` === 'true'}
                     onChange={section.onChange}
                     label={formatConsentLabel(consent.label)}
                     disabled={consent.required || section.isBusy}
@@ -276,7 +285,7 @@ const Account = ({ panelClassName, panelHeaderClassName, canUpdateEmail = true }
               </>
             ),
           }),
-          ...(nonTermsConsents
+          ...(nonTermsConsents?.length
             ? [
                 formSection({
                   label: t('account.other_registration_details'),

diff --git a/src/components/Account/__snapshots__/Account.test.tsx.snap b/src/components/Account/__snapshots__/Account.test.tsx.snap
@@ -138,48 +138,27 @@ exports[`<Account> > renders and matches snapshot 1`] = `
         account.terms_and_tracking
       </h3>
     </div>
-    <div
-      class="_flexBox_1c1c63"
-    />
-    <div
-      class="_controls_1c1c63"
-    />
-  </div>
-  <div
-    class="panel-class"
-  >
-    <div
-      class="header-class"
-    >
-      <h3>
-        account.other_registration_details
-      </h3>
-    </div>
     <div
       class="_flexBox_1c1c63"
     >
       <div
-        class="_customFields_c968f7"
+        class="_checkbox_531f07"
       >
         <div
-          class="_checkbox_531f07"
+          class="_row_531f07"
         >
-          <div
-            class="_row_531f07"
+          <input
+            id="check-box_1235_consents.marketing"
+            name="consents.marketing"
+            type="checkbox"
+            value=""
+          />
+          <label
+            for="check-box_1235_consents.marketing"
           >
-            <input
-              id="check-box_1235_consentsValues.marketing"
-              name="consentsValues.marketing"
-              type="checkbox"
-              value=""
-            />
-            <label
-              for="check-box_1235_consentsValues.marketing"
-            >
-              
-              Receive Marketing Emails
-            </label>
-          </div>
+            
+            Receive Marketing Emails
+          </label>
         </div>
       </div>
     </div>