-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: [CGC-65] Automatic time interval selection (#83)
- Loading branch information
1 parent
d9472ca
commit ee37c00
Showing
5 changed files
with
140 additions
and
31 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| import React from 'react'; | ||
| import i18n from '@dhis2/d2-i18n'; | ||
| import { GenericError } from '../GenericError'; | ||
|
|
||
| export const TrackedEntityError = () => ( | ||
| <GenericError | ||
| /* eslint-disable-next-line max-len */ | ||
| errorMessage={i18n.t('There was an error fetching the tracked entity for the growth chart. Please check the configuration in Datastore Management and try again.')} | ||
| /> | ||
| ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,83 @@ | ||
| import { useEffect, useRef, useState } from 'react'; | ||
| import { CategoryCodes, ChartData, MeasurementTypeCodesLabel, TimeUnitCodes } from '../../../types/chartDataTypes'; | ||
|
|
||
| export const useAppropriateChartData = ( | ||
| chartDataForGender: ChartData, | ||
| defaultIndicator: string, | ||
| gender: string, | ||
| setDefaultIndicatorError: (value: boolean) => void, | ||
| childAgeInWeeks: number, | ||
| childAgeInMonths: number, | ||
| ) => { | ||
| const [selectedCategory, setSelectedCategory] = useState<keyof typeof CategoryCodes>(); | ||
| const [selectedDataset, setSelectedDataset] = useState<string>(); | ||
|
|
||
| const selectDatasetForCategoryRef = useRef<(category: keyof typeof CategoryCodes) => void>(); | ||
| selectDatasetForCategoryRef.current = (category: keyof typeof CategoryCodes) => { | ||
| const { datasets } = chartDataForGender[category]; | ||
|
|
||
| const isMeasurementType = (xAxis: string) => | ||
| Object.values(MeasurementTypeCodesLabel) | ||
| .includes(xAxis); | ||
|
|
||
| const isWeeksInRange = (xAxis: string) => | ||
| xAxis === TimeUnitCodes.weeks && childAgeInWeeks < 13; | ||
|
|
||
| const isMonthsInRange = (xAxis: string, range: { start: number, end: number }) => | ||
| xAxis === TimeUnitCodes.months && childAgeInMonths >= range.start && childAgeInMonths < range.end; | ||
|
|
||
| const getMaxRangeDataset = (datasets: ChartData[0]['datasets']) => | ||
| Object.entries(datasets) | ||
| .reduce((max, [key, value]) => | ||
| ((!max || value.metadata.range.end > max[1].metadata.range.end) ? [key, value] : max)); | ||
|
|
||
| const isAboveRange = (xAxis: string, range: { start: number, end: number }) => | ||
| xAxis === TimeUnitCodes.months && childAgeInMonths >= range.end; | ||
| Object.entries(datasets) | ||
| .some(([key, value]) => { | ||
| const { range } = value.metadata; | ||
| const xAxis = value.metadata.xAxisLabel; | ||
|
|
||
| if (isMeasurementType(xAxis) || isWeeksInRange(xAxis) || isMonthsInRange(xAxis, range)) { | ||
| setSelectedDataset((prevDataset) => (prevDataset !== key ? key : prevDataset)); | ||
| return true; | ||
| } | ||
|
|
||
| if (isAboveRange(xAxis, range)) { | ||
| const [newDatasetKey] = getMaxRangeDataset(datasets); | ||
| setSelectedDataset(newDatasetKey); | ||
| return true; | ||
| } | ||
| return false; | ||
| }); | ||
| }; | ||
|
|
||
| useEffect(() => { | ||
| if (selectedCategory && chartDataForGender[selectedCategory]) { | ||
| selectDatasetForCategoryRef.current?.(selectedCategory); | ||
| } | ||
| }, [selectedCategory, chartDataForGender]); | ||
|
|
||
| const isKeyOfCategoryCodes = (key: string): key is keyof typeof CategoryCodes => key in CategoryCodes; | ||
|
|
||
| useEffect(() => { | ||
| const key = `${defaultIndicator}_${gender.charAt(0) | ||
| .toLowerCase()}`; | ||
| if (!isKeyOfCategoryCodes(key)) { | ||
| setDefaultIndicatorError(true); | ||
| } | ||
| if (isKeyOfCategoryCodes(key) && chartDataForGender[key]) { | ||
| const newCategory = CategoryCodes[key]; | ||
| setSelectedCategory(newCategory); | ||
| const newDataset = Object.keys(chartDataForGender[newCategory].datasets)[0]; | ||
| setSelectedDataset(newDataset); | ||
| } | ||
| }, [chartDataForGender, defaultIndicator, gender, setDefaultIndicatorError]); | ||
|
|
||
| return { | ||
| selectedCategory, | ||
| selectedDataset, | ||
| setSelectedCategory, | ||
| setSelectedDataset, | ||
| }; | ||
| }; |