diff --git a/packages/app/src/domain/vaccine/data-selection/select-vaccine-coverage-data.ts b/packages/app/src/domain/vaccine/data-selection/select-vaccine-coverage-data.ts index 3f85a05929..9d2c7a6559 100644 --- a/packages/app/src/domain/vaccine/data-selection/select-vaccine-coverage-data.ts +++ b/packages/app/src/domain/vaccine/data-selection/select-vaccine-coverage-data.ts @@ -1,4 +1,4 @@ -import { GmCollectionVaccineCoveragePerAgeGroup, VrCollectionVaccineCoveragePerAgeGroup, VrVaccineCoveragePerAgeGroupValue } from '@corona-dashboard/common'; +import { createFormatting, GmCollectionVaccineCoveragePerAgeGroup, VrCollectionVaccineCoveragePerAgeGroup, VrVaccineCoveragePerAgeGroupValue } from '@corona-dashboard/common'; import { isPresent } from 'ts-is-present'; import { replaceVariablesInText } from '~/utils'; import { useIntl } from '~/intl'; @@ -7,12 +7,18 @@ import { parseVaccinatedPercentageLabel } from '../logic/parse-vaccinated-percen type VaccineCoveragePerAgeGroups = GmCollectionVaccineCoveragePerAgeGroup | VrCollectionVaccineCoveragePerAgeGroup | VrVaccineCoveragePerAgeGroupValue; -export function SelectVaccineCoverageData(data: T[]) { - // const { commonTexts, formatPercentage } = useIntl(); +export function useSelectVaccineCoverageData(data: T[]) { + const { commonTexts, formatPercentage } = useIntl(); - // const meerDan = commonTexts.common.meer_dan; - // const minderDan = commonTexts.common.minder_dan; + return SelectVaccineCoverageData(data, commonTexts.common.meer_dan, commonTexts.common.minder_dan, formatPercentage); +} +export function SelectVaccineCoverageData( + data: T[], + meerDan: string, + minderDan: string, + formatPercentage: ReturnType['formatPercentage'] +) { return data.map((vaccineCoveragePerAgeGroup) => { const parsedLabels: { vaccinated_percentage_12_plus_label?: string | null; @@ -29,9 +35,9 @@ export function SelectVaccineCoverageData const result = parseVaccinatedPercentageLabel(coveragePercentage); if (isPresent(result)) { - const content = result.sign === '>' ? 'dit is meer dan {{value}}' : 'dit is minder dan {{value}}'; //meerDan : minderDan; + const content = result.sign === '>' ? meerDan : minderDan; //meerDan : minderDan; parsedLabels[ageGroupLabel] = replaceVariablesInText(content, { - value: 12, //formatPercentage(vaccineCoveragePerAgeGroup[ageGroupKey] as number) + '%', + value: formatPercentage(vaccineCoveragePerAgeGroup[ageGroupKey] as number) + '%', }); } } diff --git a/packages/app/src/domain/vaccine/index.ts b/packages/app/src/domain/vaccine/index.ts index 11026a7533..8b1c8945e9 100644 --- a/packages/app/src/domain/vaccine/index.ts +++ b/packages/app/src/domain/vaccine/index.ts @@ -1,5 +1,5 @@ export { selectAdministrationData } from './data-selection/select-administration-data'; -export { SelectVaccineCoverageData } from './data-selection/select-vaccine-coverage-data'; +export { useSelectVaccineCoverageData } from './data-selection/select-vaccine-coverage-data'; export { BoosterShotCoveragePerAgeGroup } from './booster-shot-coverage-per-age-group/booster-shot-coverage-per-age-group'; export { Autumn2022ShotCoveragePerAgeGroup } from './autumn-2022-shot-coverage-per-age-group/autumn-2022-shot-coverage-per-age-group'; export { VaccinationsOverTimeTile } from './vaccinations-over-time-tile'; diff --git a/packages/app/src/pages/landelijk/vaccinaties.tsx b/packages/app/src/pages/landelijk/vaccinaties.tsx index a46dd0ac04..2323c13d1c 100644 --- a/packages/app/src/pages/landelijk/vaccinaties.tsx +++ b/packages/app/src/pages/landelijk/vaccinaties.tsx @@ -8,7 +8,7 @@ import { ChartTile, PageInformationBlock, TileList, TimeSeriesChart, WarningTile import { Layout, NlLayout } from '~/domain/layout'; import { selectAdministrationData, - SelectVaccineCoverageData, + useSelectVaccineCoverageData, VaccinationsOverTimeTile, VaccineBoosterAdministrationsKpiSection, VaccinationsShotKpiSection, @@ -118,13 +118,13 @@ export const getStaticProps = createGetStaticProps( createGetChoroplethData({ gm: ({ vaccine_coverage_per_age_group }) => { if (isDefined(vaccine_coverage_per_age_group)) { - return SelectVaccineCoverageData(vaccine_coverage_per_age_group); + return useSelectVaccineCoverageData(vaccine_coverage_per_age_group); } return vaccine_coverage_per_age_group ?? null; }, vr: ({ vaccine_coverage_per_age_group }) => { if (isDefined(vaccine_coverage_per_age_group)) { - return SelectVaccineCoverageData(vaccine_coverage_per_age_group); + return useSelectVaccineCoverageData(vaccine_coverage_per_age_group); } return vaccine_coverage_per_age_group ?? null; },