diff --git a/src/Assets/citizenshipFilterFormControlLabels.tsx b/src/Assets/citizenshipFilterFormControlLabels.tsx index 429cf3dec..56f0ab4c1 100644 --- a/src/Assets/citizenshipFilterFormControlLabels.tsx +++ b/src/Assets/citizenshipFilterFormControlLabels.tsx @@ -1,4 +1,5 @@ import { FormattedMessage } from 'react-intl'; +import { FormattedMessageType } from '../Types/Questions'; export type CitizenLabels = | 'non_citizen' @@ -7,9 +8,19 @@ export type CitizenLabels = | 'gc_5plus' | 'gc_18plus_no5' | 'gc_under18_no5' - | 'gc_under19_pregnant_no5'; + | 'other' + | 'otherWithWorkPermission' + | 'otherHealthCareUnder19' + | 'otherHealthCarePregnant'; -const citizenshipFilterFormControlLabels = { +export const filterNestedMap = new Map([ + ['non_citizen', []], + ['green_card', ['gc_5plus', 'gc_18plus_no5', 'gc_under18_no5']], + ['refugee', []], + ['other', ['otherWithWorkPermission', 'otherHealthCareUnder19', 'otherHealthCarePregnant']], +]); + +const citizenshipFilterFormControlLabels: Record = { non_citizen: ( ), - gc_under19_pregnant_no5: ( - - ), refugee: ( ), + other: , + otherWithWorkPermission: ( + + ), + otherHealthCareUnder19: ( + + ), + otherHealthCarePregnant: ( + + ), }; export default citizenshipFilterFormControlLabels; diff --git a/src/Assets/updateScreen.ts b/src/Assets/updateScreen.ts index 91b97b2f6..6b3a7ec85 100644 --- a/src/Assets/updateScreen.ts +++ b/src/Assets/updateScreen.ts @@ -15,6 +15,7 @@ const getScreensBody = (formData: FormData, languageCode: Language) => { const expenses = getExpensesBodies(formData); const finalReferralSource = formData.otherSource !== '' ? formData.otherSource : formData.referralSource; + const screenBody: ApiFormData = { is_test: formData.isTest ?? false, external_id: formData.externalID ?? null, @@ -26,7 +27,7 @@ const getScreensBody = (formData: FormData, languageCode: Language) => { household_size: formData.householdSize === '' ? null : Number(formData.householdSize), household_members: householdMembers, expenses: expenses, - household_assets: formData.householdAssets, + household_assets: formData.householdAssets || 0, request_language_code: languageCode, has_benefits: formData.hasBenefits ?? 'preferNotToAnswer', has_acp: formData.benefits.acp, diff --git a/src/Components/FilterSection/CitizenshipPopover.css b/src/Components/FilterSection/CitizenshipPopover.css index abc06d425..bb706f52b 100644 --- a/src/Components/FilterSection/CitizenshipPopover.css +++ b/src/Components/FilterSection/CitizenshipPopover.css @@ -1,3 +1,7 @@ .MuiFormControlLabel-root.gc-subcitizen-indentation { margin-left: 1.25rem; } + +.MuiFormControlLabel-label { + padding: 0.5rem 0; +} diff --git a/src/Components/FilterSection/CitizenshipPopover.tsx b/src/Components/FilterSection/CitizenshipPopover.tsx index a66e09268..6bf1d8aff 100644 --- a/src/Components/FilterSection/CitizenshipPopover.tsx +++ b/src/Components/FilterSection/CitizenshipPopover.tsx @@ -5,7 +5,7 @@ import IconButton from '@mui/material/IconButton'; import { Checkbox, Stack } from '@mui/material'; import { GridFilterItem, GridFilterOperator } from '@mui/x-data-grid'; import { UpdateFilterArg } from '../Results/Results'; -import citizenshipFilterFormControlLabels from '../../Assets/citizenshipFilterFormControlLabels'; +import citizenshipFilterFormControlLabels, { filterNestedMap } from '../../Assets/citizenshipFilterFormControlLabels'; import type { CitizenLabels } from '../../Assets/citizenshipFilterFormControlLabels'; import './CitizenshipPopover.css'; @@ -56,22 +56,16 @@ const CitizenshipPopover = ({ const handleFilterSelect = (citizenshipType: CitizenLabels) => { const isChecked = citizenshipFilterIsChecked[citizenshipType]; - let updatedCitizenshipFilterIsChecked: Record = { + const updatedCitizenshipFilterIsChecked: Record = { ...citizenshipFilterIsChecked, [citizenshipType]: !isChecked, }; - if (citizenshipType === 'green_card') { - // if the citizenshipType is `green_card`, then set green_card and all the gc_options to true or false - // i.e. green_card and all the gc_options should be the same when citizenshipType is `green_card` - updatedCitizenshipFilterIsChecked = { - ...updatedCitizenshipFilterIsChecked, - gc_5plus: !isChecked, - gc_18plus_no5: !isChecked, - gc_under18_no5: !isChecked, - gc_under19_pregnant_no5: !isChecked, - }; + for (const nestedFilter of filterNestedMap.get(citizenshipType) ?? []) { + // if a parent is not checked, then set its children to false, and if a parent becomes checked, then set its children to true + updatedCitizenshipFilterIsChecked[nestedFilter] = !isChecked; } + const typedUpdatedCitizenshipFilterIsChecked = Object.keys(updatedCitizenshipFilterIsChecked) as CitizenLabels[]; const selectedCitizenshipFilters = typedUpdatedCitizenshipFilterIsChecked.filter((citizenshipType) => { return updatedCitizenshipFilterIsChecked[citizenshipType]; @@ -105,56 +99,34 @@ const CitizenshipPopover = ({ setCitizenshipFilterIsChecked(updatedCitizenshipFilterIsChecked); }; - const typedCitizenshipFilterIsChecked = Object.keys(citizenshipFilterIsChecked) as CitizenLabels[]; - - const renderMainAndSubFilters = (citizenshipFilters: Record) => { - return typedCitizenshipFilterIsChecked.map((citizenshipType) => { - //here we need to add an sx prop to indent them if they're the gc_filters - const isGreenCardSubCitizenshipType = [ - 'gc_5plus', - 'gc_18plus_no5', - 'gc_under18_no5', - 'gc_under19_pregnant_no5', - ].includes(citizenshipType); - - return ( + const renderCitizenshipFilters = (citizenshipFilters: Record) => { + const filters: JSX.Element[] = []; + filterNestedMap.forEach((children, parentLabel) => { + filters.push( handleFilterSelect(citizenshipType)} - /> + handleFilterSelect(parentLabel)} /> } - /> + />, ); - }); - }; - const renderMainFilters = (citizenshipFilters: Record) => { - //green_card is false - const initialThreeFilters: CitizenLabels[] = ['non_citizen', 'green_card', 'refugee']; - return initialThreeFilters.map((initialFilter) => { - return ( - handleFilterSelect(initialFilter)} /> - } - /> - ); + if (citizenshipFilters[parentLabel]) { + children.forEach((label) => { + filters.push( + handleFilterSelect(label)} />} + />, + ); + }); + } }); - }; - const renderCitizenshipFilters = (citizenshipFilters: Record) => { - if (citizenshipFilters.green_card) { - return renderMainAndSubFilters(citizenshipFilters); - } else { - return renderMainFilters(citizenshipFilters); - } + return filters; }; return ( diff --git a/src/Components/Results/Results.tsx b/src/Components/Results/Results.tsx index 7aa7ead35..7800e590a 100644 --- a/src/Components/Results/Results.tsx +++ b/src/Components/Results/Results.tsx @@ -81,8 +81,11 @@ const Results = ({ handleTextFieldChange }: ResultsProps) => { gc_5plus: false, gc_18plus_no5: false, gc_under18_no5: false, - gc_under19_pregnant_no5: false, refugee: false, + other: false, + otherWithWorkPermission: false, + otherHealthCareUnder19: false, + otherHealthCarePregnant: false, }); const categoryState = useState('All Categories'); const eligibilityState = useState('eligibleBenefits'); diff --git a/src/Components/TwoOneOneComponents/TwoOneOneHeader/TwoOneOneHeader.js b/src/Components/TwoOneOneComponents/TwoOneOneHeader/TwoOneOneHeader.js index 2f68268e2..fb4244bca 100644 --- a/src/Components/TwoOneOneComponents/TwoOneOneHeader/TwoOneOneHeader.js +++ b/src/Components/TwoOneOneComponents/TwoOneOneHeader/TwoOneOneHeader.js @@ -70,16 +70,7 @@ const TwoOneOneHeader = ({ handleTextfieldChange }) => { const setRenderValue = () => { const currentLocale = locale; - switch (currentLocale) { - case 'en-US': - return 'EN'; - case 'es': - return 'ES'; - case 'vi': - return 'VI'; - default: - return 'EN'; - } + return currentLocale.slice(0, 2).toLocaleUpperCase(); }; const create211Links = () => {