From cbe41b0e242eac6f87f40a741fbea3c1ec4ac4e4 Mon Sep 17 00:00:00 2001
From: Chris Walsh <christianywalsh@gmail.com>
Date: Sat, 4 Dec 2021 13:59:07 -0800
Subject: [PATCH] Hide comparisons when all-time filter is selected

---
 components/metrics/MetricsBar.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/components/metrics/MetricsBar.js b/components/metrics/MetricsBar.js
index 7852b96c..2a80da7e 100644
--- a/components/metrics/MetricsBar.js
+++ b/components/metrics/MetricsBar.js
@@ -15,7 +15,7 @@ import styles from './MetricsBar.module.css';
 export default function MetricsBar({ websiteId, className }) {
   const shareToken = useShareToken();
   const [dateRange] = useDateRange(websiteId);
-  const { startDate, endDate, modified } = dateRange;
+  const { startDate, endDate, modified, value } = dateRange;
   const [format, setFormat] = useState(true);
   const {
     query: { url, ref },
@@ -63,12 +63,14 @@ export default function MetricsBar({ websiteId, className }) {
             value={pageviews.value}
             change={pageviews.change}
             format={formatFunc}
+            hideComparison={value === 'all'}
           />
           <MetricCard
             label={<FormattedMessage id="metrics.visitors" defaultMessage="Visitors" />}
             value={uniques.value}
             change={uniques.change}
             format={formatFunc}
+            hideComparison={value === 'all'}
           />
           <MetricCard
             label={<FormattedMessage id="metrics.bounce-rate" defaultMessage="Bounce rate" />}
@@ -80,6 +82,7 @@ export default function MetricsBar({ websiteId, className }) {
                 : 0
             }
             format={n => Number(n).toFixed(0) + '%'}
+            hideComparison={value === 'all'}
             reverseColors
           />
           <MetricCard
@@ -102,6 +105,7 @@ export default function MetricsBar({ websiteId, className }) {
                 : 0
             }
             format={n => `${n < 0 ? '-' : ''}${formatShortTime(Math.abs(~~n), ['m', 's'], ' ')}`}
+            hideComparison={value === 'all'}
           />
         </>
       )}