Hide comparisons when all-time filter is selected

pull/882/head
Chris Walsh 2021-12-04 13:59:07 -08:00
parent 253f4518a2
commit cbe41b0e24
No known key found for this signature in database
GPG Key ID: 28EE0CCA6032019E
1 changed files with 5 additions and 1 deletions

View File

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