Merge pull request #689 from UKHSA-Internal/COVP-169_add_headline_dat…

…a_region_dependent COVP-169 Add ability to show/hide headline numers for different areas.
UKHSA-Internal · Oct 3, 2023 · 81e7d64 · 81e7d64
2 parents 38cf553 + 2cf0c23
commit 81e7d64
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 44 deletions.
diff --git a/src/common/utils/utils.js b/src/common/utils/utils.js
@@ -5,6 +5,7 @@ import type { ParsedParams } from "./utils.types";
 import type { RGB } from "components/MapTable/MapTable.types";
 import { generateUrl } from "hooks/useApi";
 import Path from "assets/paths.json";
+import type IsIncludedTypeProps from 'components/Card/Card.types';
 
 
 export const sort = (a, b) => {
@@ -192,6 +193,40 @@ export const getParamValueFor = (params: Array<ParsedParams>, keyName: string, d
 }; // getParamValueFor
 
 
+export const isAreaIncluded = ({ params, locationAware={} }: IsIncludedTypeProps): boolean => {
+ if ( !Object.keys(locationAware).length )
+ return true;
+
+ const
+ areaType = getParamValueFor(
+ params,
+ "areaType",
+ "overview"
+ ).toLowerCase(),
+ areaName = getParamValueFor(
+ params,
+ "areaName",
+ "United Kingdom"
+ ).toLowerCase(),
+ includedAreaType = locationAware?.included?.areaType ?? [],
+ includedAreaName = locationAware?.included?.areaName ?? [],
+ excludedAreaType = locationAware?.excluded?.areaType ?? [],
+ excludedAreaName = locationAware?.excluded?.areaName ?? [],
+ hasExclusion = excludedAreaType.length > 0 && !(excludedAreaName.length > 0),
+ isExcluded = (
+ excludedAreaType.map(value => value.toLowerCase()).indexOf(areaType) > -1 ||
+ excludedAreaName.map(value => value.toLowerCase()).indexOf(areaName) > -1
+ ),
+ isIncluded = (
+ includedAreaType.map(value => value.toLowerCase()).indexOf(areaType) > -1 ||
+ includedAreaName.map(value => value.toLowerCase()).indexOf(areaName) > -1
+ );
+
+ return !hasExclusion ? isIncluded : !isExcluded
+
+}; // isAreaIncluded
+
+
 export const firstObjWithMax = ( arr: Array<{[string|number]: [string|number|null]}>, key: ([string|number]) => [string|number|null] ) => {
 
  const maxValue = max(arr, key);

diff --git a/src/components/Card/Card.js b/src/components/Card/Card.js
@@ -3,7 +3,7 @@
 import React, { useState, useEffect, lazy, Suspense } from 'react';
 import { Link } from "react-router-dom";
 
-import { fieldToStructure, getParamValueFor, heading2id } from "common/utils";
+import { fieldToStructure, heading2id, isAreaIncluded } from "common/utils";
 import usePrevious from "hooks/usePrevious";
 import TabLinkContainer from "components/TabLink";
 import { Radio } from "components/GovUk";
@@ -27,7 +27,6 @@ import {
  ShareRow
 } from './Card.styles';
 
-import type { IsIncludedTypeProps, Props } from './Card.types';
 import type { ComponentType } from 'react';
 
 import DownloadIcon from "assets/icon-download.svg";
@@ -152,41 +151,6 @@ const NoTabCard: ComponentType<*> = ({ cardType, ...props }) => {
 }; // NoTabCards
 
 
-const isIncluded = ({ params, locationAware={} }: IsIncludedTypeProps): boolean => {
-
- if ( !Object.keys(locationAware).length )
- return true;
-
- const
- areaType = getParamValueFor(
- params,
- "areaType",
- "overview"
- ).toLowerCase(),
- areaName = getParamValueFor(
- params,
- "areaName",
- "United Kingdom"
- ).toLowerCase(),
- includedAreaType = locationAware?.included?.areaType ?? [],
- includedAreaName = locationAware?.included?.areaName ?? [],
- excludedAreaType = locationAware?.excluded?.areaType ?? [],
- excludedAreaName = locationAware?.excluded?.areaName ?? [],
- hasExclusion = excludedAreaType.length > 0 && !(excludedAreaName.length > 0),
- isExcluded = (
- excludedAreaType.map(value => value.toLowerCase()).indexOf(areaType) > -1 ||
- excludedAreaName.map(value => value.toLowerCase()).indexOf(areaName) > -1
- ),
- isIncluded = (
- includedAreaType.map(value => value.toLowerCase()).indexOf(areaType) > -1 ||
- includedAreaName.map(value => value.toLowerCase()).indexOf(areaName) > -1
- );
-
- return !hasExclusion ? isIncluded : !isExcluded
-
-}; // isIncluded
-
-
 const CardContent = ({ tabs: singleOptionTabs=null, cardType, download=[], params, options=null,
  heading, fullWidth, abstract=null, ...props }) => {
 
@@ -284,7 +248,7 @@ const CardContent = ({ tabs: singleOptionTabs=null, cardType, download=[], param
  ...customProps?.[cardType] ?? {}
  };
 
- if ( !isIncluded(cardProps) )
+ if ( !isAreaIncluded(cardProps) )
  return null;
 
  return <BrowserHistory>

diff --git a/src/components/HeadlineNumbers/HeadlineNumbers.js b/src/components/HeadlineNumbers/HeadlineNumbers.js
@@ -2,6 +2,8 @@
 
 import React from "react";
 
+import { getParamValueFor, isAreaIncluded } from "common/utils";
+
 import type { Props } from "./HeadlineNumbers.types";
 import ValueBox from "components/ValueBox";
 
@@ -12,18 +14,28 @@ import type { ComponentType } from "react";
 
 const HeadlineNumbers: ComponentType<Props> = ({ params, headlineNumbers=[] }) => {
 
+ const getValueBox = (item, index) => {
+ return <>
+ {
+ isAreaIncluded({params, ...item})
+ ? <ValueBox params={ params }
+ key={ `headline-number-${ index }` }
+ heading={ item.caption }
+ { ...item }/>
+ : null
+ }
+ </>
+ }
+
+ console.log("headline numbers:", headlineNumbers)
+
  return <Container aria-label={ "Headline numbers" }
  aria-describedby={ 'headline-nums-desc' }>
  <span id={ 'headline-nums-desc' } className={ "govuk-visually-hidden" }>
  Latest available data
  </span>
  {
- headlineNumbers?.map((item, index) =>
- <ValueBox params={ params }
- key={ `headline-number-${ index }` }
- heading={ item.caption }
- { ...item }/>
- ) ?? null
+ headlineNumbers?.map((item, index) => getValueBox(item, index)) ?? null
  }
  </Container>