Merge pull request #5355 from masslight/bholyshevskyi/host-409-ehr-extra-language-options-displayed-in-preferred-language

EHR. Filter language options by presence in the questionnaire

Author: VladMstv

apps/ehr/src/features/visits/shared/components/patient/PatientDetailsContainer.tsx

@@ -1,5 +1,5 @@
 import { Box, Divider, MenuItem, Select, Stack, Typography, useTheme } from '@mui/material';
-import { HumanName, Patient } from 'fhir/r4b';
+import { HumanName, Patient, QuestionnaireItem } from 'fhir/r4b';
 import { FC, useState } from 'react';
 import { Controller, useFormContext } from 'react-hook-form';
 import { FormSelect, FormTextField } from 'src/components/form';
@@ -14,6 +14,7 @@ import {
 } from 'src/constants';
 import { dataTestIds } from 'src/constants/data-test-ids';
 import { LANGUAGE_OPTIONS, REQUIRED_FIELD_ERROR_MESSAGE } from 'utils';
+import inPersonIntakeQuestionnaire from '../../../../../../../../config/oystehr/in-person-intake-questionnaire.json';
 import ShowMoreButton from './ShowMoreButton';
 
 const FormFields = AllFormFields.patientDetails;
@@ -35,6 +36,13 @@ export const PatientDetailsContainer: FC<PatientDetailsContainerProps> = ({ pati
   const isNonBinaryGender = genderIdentityCurrentValue === 'Non-binary gender identity';
   const languageValue = watch(FormFields.language.key);
 
+  const questionnaireLanguageOptions =
+    (
+      Object.values(inPersonIntakeQuestionnaire.fhirResources)[0]
+        .resource.item.find((item) => item.linkId === 'patient-details-page')
+        ?.item.find((item) => item.linkId === 'preferred-language') as QuestionnaireItem | undefined
+    )?.answerOption?.map((option) => option.valueString) ?? [];
+
   return (
     <Section title="Patient details">
       <Row label="Previous name">
@@ -199,11 +207,13 @@ export const PatientDetailsContainer: FC<PatientDetailsContainerProps> = ({ pati
                   sx={{ width: '100%' }}
                   data-testid={dataTestIds.patientDetailsContainer.preferredLanguage}
                 >
-                  {Object.entries(LANGUAGE_OPTIONS).map(([key, value]) => (
-                    <MenuItem key={value} value={value}>
-                      {key}
-                    </MenuItem>
-                  ))}
+                  {Object.entries(LANGUAGE_OPTIONS)
+                    .filter(([_key, value]) => questionnaireLanguageOptions.includes(value))
+                    .map(([key, value]) => (
+                      <MenuItem key={value} value={value}>
+                        {key}
+                      </MenuItem>
+                    ))}
                 </Select>
               )}
             />