diff --git a/app/components/CustomTooltip/index.tsx b/app/components/CustomTooltip/index.tsx index c955df45..885eb000 100644 --- a/app/components/CustomTooltip/index.tsx +++ b/app/components/CustomTooltip/index.tsx @@ -50,7 +50,7 @@ function CustomTooltip(props: Props) {
{isDefined(valueLabel) && `${valueLabel} : `} {(isDefined(value) && value !== null) && formatNumber( - format ?? 'raw', + format === 'million' ? 'raw' : format, value, )} {(isDefined(minValue) && isDefined(maxValue)) diff --git a/app/components/UncertaintyChart/index.tsx b/app/components/UncertaintyChart/index.tsx index f36102ba..8a20ace2 100644 --- a/app/components/UncertaintyChart/index.tsx +++ b/app/components/UncertaintyChart/index.tsx @@ -77,7 +77,7 @@ function UncertaintyChart(props: Props) { heading={data[0].payload?.indicatorName ?? ''} subHeadingLabel={data[0].payload?.region} subHeading={`(${data[0].payload?.date})`} - value={data[0].payload?.tooltipValue ?? 0} + value={data[0].payload?.tooltipValue} minValue={data[0].payload?.minimumValue} maxValue={data[0].payload?.maximumValue} /> diff --git a/app/views/Dashboard/Overview/PercentageCardGroup/index.tsx b/app/views/Dashboard/Overview/PercentageCardGroup/index.tsx index 04bffbcf..4ee01dfc 100644 --- a/app/views/Dashboard/Overview/PercentageCardGroup/index.tsx +++ b/app/views/Dashboard/Overview/PercentageCardGroup/index.tsx @@ -117,6 +117,28 @@ const OVERVIEW_STATS = gql` format emergency } + outbreakRegion: regionLevel ( + filters: { + category: "Global", + emergency: $emergency, + isTwelveMonth: true, + indicatorId: $indicatorId, + region: $region, + } + order: { + indicatorMonth: DESC + } + pagination: { + limit: 12 + } + ) { + id + indicatorId + indicatorMonth + indicatorValueRegional + format + emergency + } regionalBreakdownRegion: regionLevel ( filters: { emergency: $emergency, @@ -428,16 +450,33 @@ function PercentageCardGroup(props: Props) { }).sort((a, b) => compareDate(a.date, b.date)) ), [overviewStatsResponse?.uncertaintyRegion]); - const outbreakLineChart = useMemo(() => ( - overviewStatsResponse?.outbreak.map((outbreak) => ( + const outbreakLineChart = useMemo(() => { + const outbreakGlobal = overviewStatsResponse?.outbreak.map((outbreak) => ( { id: outbreak.id, emergency: outbreak.emergency, contextDate: outbreak.indicatorMonth, [outbreak.emergency]: outbreak.indicatorValueGlobal, } - )) - ), [overviewStatsResponse?.outbreak]); + )); + + const outbreakRegion = overviewStatsResponse?.outbreakRegion.map((region) => ( + { + id: region.id, + emergency: region.emergency, + contextDate: region.indicatorMonth, + [region.emergency]: region.indicatorValueRegional, + } + )); + if (filterValues?.region) { + return outbreakRegion; + } + return outbreakGlobal; + }, [ + overviewStatsResponse?.outbreak, + overviewStatsResponse?.outbreakRegion, + filterValues?.region, + ]); const renderLegend = useCallback((legendProps: LegendProps) => { const { payload } = legendProps;