(fix) Display only filtered answers for multi-select and content-switcher form components (#695)

* Filter answers to be displayed for multiple form components

* Revert the filter in dropdown

Author: vasharma05

src/components/inputs/content-switcher/content-switcher.component.tsx

@@ -59,14 +59,16 @@ const ContentSwitcher: React.FC<FormFieldInputProps> = ({ field, value, errors,
           selectedIndex={selectedIndex}
           className={styles.selectedOption}
           size="md">
-          {field.questionOptions.answers.map((option, index) => (
-            <Switch
-              name={option.concept || option.value}
-              text={t(option.label)}
-              key={index}
-              disabled={field.isDisabled}
-            />
-          ))}
+          {field.questionOptions.answers
+            .filter((answer) => !answer.isHidden)
+            .map((option, index) => (
+              <Switch
+                name={option.concept || option.value}
+                text={t(option.label)}
+                key={index}
+                disabled={field.isDisabled}
+              />
+            ))}
         </CdsContentSwitcher>
       </FormGroup>
     )

src/components/inputs/multi-select/multi-select.component.tsx

@@ -110,12 +110,12 @@ const MultiSelect: React.FC<FormFieldInputProps> = ({ field, value, errors, warn
               />
             ) : (
               <CheckboxGroup legendText={<FieldLabel field={field} />} readOnly={isTrue(field.readonly)}>
-                {field.questionOptions.answers?.map((value, index) => {
+                {selectOptions?.map((value, index) => {
                   return (
                     <Checkbox
                       className={styles.checkbox}
                       checked={initiallyCheckedQuestionItems.some((item) => item === value.concept)}
-                      disabled={value.disable?.isDisabled}
+                      disabled={value.disabled}
                       id={`${field.id}-${value.concept}`}
                       key={`${field.id}-${value.concept}-${index}`}
                       labelText={t(value.label)}