feat(COR-1954): Substitute clock on pageinfoblock with metadataitem

minvws · Mar 18, 2024 · 25f1f70 · 25f1f70
1 parent df554e8
commit 25f1f70
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 18 deletions.
diff --git a/packages/app/src/components/metadata/components/page-information-block-metadata.tsx b/packages/app/src/components/metadata/components/page-information-block-metadata.tsx
@@ -1,16 +1,14 @@
 import { Box } from '~/components/base';
 import { Clock, Database, MeerInformatie } from '@corona-dashboard/icons';
 import { colors } from '@corona-dashboard/common';
-import { Text } from '~/components/typography';
 import React from 'react';
-import { MetadataIcon } from '~/components/metadata/components/items/metadata-icon';
 import { MetadataItem } from '~/components/metadata/components/items/metadata-item';
 import { MetadataProps } from '~/components';
 import { useIntl } from '~/intl';
 import { MetadataReference } from '~/components/metadata/components/items/metadata-reference';
 
 interface PageInformationBlockMetadataProps extends MetadataProps {
-  dateText: string | 0 | undefined;
+  dateText: string | undefined;
 }
 
 /**
@@ -43,12 +41,7 @@ export function PageInformationBlockMetadata({
 
   return (
     <Box spacing={2}>
-      <Box display="flex" alignItems="flex-start" color="gray7">
-        <MetadataIcon>
-          <Clock aria-hidden color={colors.gray7} />
-        </MetadataIcon>
-        <Text variant="label1">{dateText}</Text>
-      </Box>
+      {dateText && <MetadataItem icon={<Clock aria-hidden color={colors.gray7} />} items={[{ text: dateText }]} />}
 
       {dataSources.length > 0 && (
         <MetadataItem

diff --git a/packages/app/src/components/metadata/components/tile-footer-metadata.tsx b/packages/app/src/components/metadata/components/tile-footer-metadata.tsx
@@ -13,6 +13,7 @@ import { MetadataIcon } from '~/components/metadata/components/items/metadata-ic
 
 interface TileFooterMetadataProps extends MetadataProps {
   dateString: string | null;
+  intervalString: string | undefined;
 }
 
 /**
@@ -50,17 +51,11 @@ export function TileFooterMetadata({
   referenceLink,
   disclaimer,
   obtainedAt,
-  intervalCount,
+  intervalString,
 }: TileFooterMetadataProps) {
   const { commonTexts, formatDateFromSeconds } = useIntl();
   const metadataText = commonTexts.common.metadata;
 
-  const intervalString =
-    intervalCount &&
-    replaceVariablesInText(commonTexts.common.metadata.interval, {
-      count: intervalCount,
-    });
-
   return (
     <Box as="footer" marginTop={space[3]} marginBottom={marginBottom || { _: '0', sm: `-${space[3]}` }} gridArea="metadata">
       <Text color="gray7" variant="label1">

diff --git a/packages/app/src/components/metadata/metadata.tsx b/packages/app/src/components/metadata/metadata.tsx
@@ -56,7 +56,13 @@ export function Metadata({
         })
       : null;
 
-  const dateText = datumsText && dateOfInsertionUnix && dateOrRange && insertDateIntoString(formatDateFromSeconds, datumsText, dateOfInsertionUnix, dateOrRange);
+  const dateText = datumsText && dateOfInsertionUnix && dateOrRange ? insertDateIntoString(formatDateFromSeconds, datumsText, dateOfInsertionUnix, dateOrRange) : undefined;
+
+  const intervalString =
+    intervalCount &&
+    replaceVariablesInText(commonTexts.common.metadata.interval, {
+      count: intervalCount,
+    });
 
   return (
     <>
@@ -96,7 +102,7 @@ export function Metadata({
           referenceLink={referenceLink}
           disclaimer={disclaimer}
           obtainedAt={obtainedAt}
-          intervalCount={intervalCount}
+          intervalString={intervalString}
         />
       )}
     </>