COR-1487-remove-toggle-on-positive-tested-page (#4716)

* chore: Remove toggle on 'positive tested' page * chore: update lokalize keys * fix: PR feedback about spacing
minvws · Mar 30, 2023 · 1da8f72 · 1da8f72
1 parent 7d5673d
commit 1da8f72
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 62 deletions.
diff --git a/packages/app/src/components/choropleth/logic/thresholds.ts b/packages/app/src/components/choropleth/logic/thresholds.ts
@@ -385,7 +385,6 @@ export const thresholds: Thresholds = {
     vaccinated_percentage_60_plus: vaccineCoveragePercentageThresholds,
   },
   vr: {
-    infected_per_100k: positiveTestedThresholds,
     admissions_on_date_of_admission: vrHospitalAdmissionsThresholds,
     infected_locations_percentage: infectedLocationsPercentageThresholds,
     positive_tested_daily_per_100k: elderlyAtHomeThresholds,

diff --git a/packages/app/src/pages/landelijk/positief-geteste-mensen.tsx b/packages/app/src/pages/landelijk/positief-geteste-mensen.tsx
@@ -2,7 +2,7 @@ import { colors, NlTestedOverallValue, TimeframeOption, TimeframeOptionsList } f
 import { GgdTesten } from '@corona-dashboard/icons';
 import { GetStaticPropsContext } from 'next';
 import { useState } from 'react';
-import { RegionControlOption } from '~/components/chart-region-controls';
+import { Box } from '~/components/base';
 import { ChartTile } from '~/components/chart-tile';
 import { ChartTileToggleItem } from '~/components/chart-tile-toggle';
 import { DynamicChoropleth } from '~/components/choropleth';
@@ -25,6 +25,7 @@ import { ElementsQueryResult, getElementsQuery, getTimelineEvents } from '~/quer
 import { getArticleParts, getPagePartsQuery } from '~/queries/get-page-parts-query';
 import { createGetStaticProps, StaticProps } from '~/static-props/create-get-static-props';
 import { createGetChoroplethData, createGetContent, getLastGeneratedDate, getLokalizeTexts, selectNlData } from '~/static-props/get-data';
+import { space } from '~/style/theme';
 import { ArticleParts, PagePartQueryResult } from '~/types/cms';
 import { useDynamicLokalizeTexts } from '~/utils/cms/use-dynamic-lokalize-texts';
 import { getLastInsertionDateOfPage } from '~/utils/get-last-insertion-date-of-page';
@@ -58,7 +59,6 @@ export const getStaticProps = createGetStaticProps(
   ),
   createGetChoroplethData({
     gm: ({ tested_overall }) => ({ tested_overall }),
-    vr: ({ tested_overall }) => ({ tested_overall }),
   }),
   async (context: GetStaticPropsContext) => {
     const { content } = await createGetContent<{
@@ -100,7 +100,6 @@ function PositivelyTestedPeople(props: StaticProps<typeof getStaticProps>) {
 
   const { metadataTexts, textNl, textShared } = useDynamicLokalizeTexts<LokalizeTexts>(pageText, selectLokalizeTexts);
 
-  const [selectedMap, setSelectedMap] = useState<RegionControlOption>('gm');
   const [selectedGgdGraph, setSelectedGgdGraph] = useState<string>('GGD_infected_percentage_over_time_chart');
 
   const ggdGraphToggleItems: ChartTileToggleItem[] = [
@@ -345,70 +344,37 @@ function PositivelyTestedPeople(props: StaticProps<typeof getStaticProps>) {
               description={
                 <>
                   <Markdown content={textNl.map_toelichting} />
-                  {replaceComponentsInText(textNl.map_last_value_text, {
-                    infected_per_100k: <BoldText>{`${formatNumber(dataOverallLastValue.infected_per_100k)}`}</BoldText>,
-                    dateTo: formatDateFromSeconds(dataOverallLastValue.date_unix, 'weekday-long'),
-                  })}
+                  <Box marginBottom={space[3]}>
+                    {replaceComponentsInText(textNl.map_last_value_text, {
+                      infected_per_100k: <BoldText>{`${formatNumber(dataOverallLastValue.infected_per_100k)}`}</BoldText>,
+                      dateTo: formatDateFromSeconds(dataOverallLastValue.date_unix, 'weekday-long'),
+                    })}
+                  </Box>
                 </>
               }
-              onChartRegionChange={setSelectedMap}
-              chartRegion={selectedMap}
               legend={{
                 title: textShared.chloropleth_legenda.titel,
-                thresholds: thresholds.vr.infected_per_100k,
+                thresholds: thresholds.gm.infected_per_100k,
               }}
             >
-              {/**
-               * It's probably a good idea to abstract this even further, so that
-               * the switching of charts, and the state involved, are all handled by
-               * the component. The page does not have to be bothered with this.
-               *
-               * Ideally the ChoroplethTile would receive some props with the data
-               * it needs to render either Choropleth without it caring about
-               * MunicipalityChloropleth or VrChloropleth, that data would
-               * make the chart and define the tooltip layout for each, but maybe for
-               * now that is a bridge too far. Let's take it one step at a time.
-               */}
-              {selectedMap === 'gm' && (
-                <DynamicChoropleth
-                  map="gm"
-                  accessibility={{
-                    key: 'confirmed_cases_municipal_choropleth',
-                  }}
-                  data={choropleth.gm.tested_overall}
-                  dataConfig={{
-                    metricName: 'tested_overall',
-                    metricProperty: 'infected_per_100k',
-                    dataFormatters: {
-                      infected: formatNumber,
-                      infected_per_100k: formatNumber,
-                    },
-                  }}
-                  dataOptions={{
-                    getLink: reverseRouter.gm.positiefGetesteMensen,
-                  }}
-                />
-              )}
-              {selectedMap === 'vr' && (
-                <DynamicChoropleth
-                  map="vr"
-                  accessibility={{
-                    key: 'confirmed_cases_region_choropleth',
-                  }}
-                  data={choropleth.vr.tested_overall}
-                  dataConfig={{
-                    metricName: 'tested_overall',
-                    metricProperty: 'infected_per_100k',
-                    dataFormatters: {
-                      infected: formatNumber,
-                      infected_per_100k: formatNumber,
-                    },
-                  }}
-                  dataOptions={{
-                    getLink: reverseRouter.vr.positiefGetesteMensen,
-                  }}
-                />
-              )}
+              <DynamicChoropleth
+                map="gm"
+                accessibility={{
+                  key: 'confirmed_cases_municipal_choropleth',
+                }}
+                data={choropleth.gm.tested_overall}
+                dataConfig={{
+                  metricName: 'tested_overall',
+                  metricProperty: 'infected_per_100k',
+                  dataFormatters: {
+                    infected: formatNumber,
+                    infected_per_100k: formatNumber,
+                  },
+                }}
+                dataOptions={{
+                  getLink: reverseRouter.gm.positiefGetesteMensen,
+                }}
+              />
             </ChoroplethTile>
           </InView>
 

diff --git a/packages/cms/src/lokalize/key-mutations.csv b/packages/cms/src/lokalize/key-mutations.csv
@@ -417,6 +417,8 @@ timestamp,action,key,document_id,move_to
 2023-03-24T07:45:03.890Z,delete,pages.topical_page.shared.secties.search.title.nl,PGwiP4IwXrA0GfLCLD9Tth,__
 2023-03-24T07:45:03.890Z,delete,pages.topical_page.shared.secties.search.title.vr,7nClfXqPlyZyEU7PO2TAAw,__
 2023-03-23T08:50:33.174Z,delete,common.nav.links.veiligheidsregio,jF33EuwumlGuwav2FD3VW8,__
+2023-03-28T12:50:47.492Z,delete,common.accessibility.charts.confirmed_cases_region_choropleth.description,Z3v1SKYekK4CLDpzUPbJIJ,__
+2023-03-28T12:50:47.493Z,delete,common.accessibility.charts.confirmed_cases_region_choropleth.label,G1DXw0RdifOml06twMjEhw,__
 2023-03-28T12:52:25.750Z,delete,common.accessibility.charts.hospital_admissions_region_choropleth.description,YzrXb3vQYHnZxtu61Xgzap,__
 2023-03-28T12:52:25.751Z,delete,common.accessibility.charts.hospital_admissions_region_choropleth.label,Z3v1SKYekK4CLDpzUPbgJt,__
 2023-03-27T13:01:45.444Z,delete,common.accessibility.charts.elderly_at_home_deceased_over_time_chart.description,G1DXw0RdifOml06twMjSTZ,__