Pull request: 3313 statistics settings UI

Closes #3313

Squashed commit of the following:

commit 6f2ff98a8282789e2dbb16694ca87a1f4cc8c076
Merge: 1221f02f f4dde3f2
Author: Ainar Garipov <A.Garipov@AdGuard.COM>
Date:   Wed Jul 14 15:53:18 2021 +0300

    Merge branch 'master' into 3313-statistics

commit 1221f02f40628964febd22967d85d5185f87b08d
Author: Ildar Kamalov <ik@adguard.com>
Date:   Wed Jul 14 15:23:09 2021 +0300

    client: make client names clickable

commit 99770ec065e14ce2522a59820f9851d79001923c
Author: Ildar Kamalov <ik@adguard.com>
Date:   Wed Jul 14 15:06:30 2021 +0300

    client: decreasing interval confirm, disabled stats message
This commit is contained in:
Ildar Kamalov
2021-07-14 16:01:12 +03:00
parent f4dde3f2c1
commit ebade2b6ce
6 changed files with 59 additions and 12 deletions

View File

@@ -1,12 +1,15 @@
import React, { useEffect } from 'react';
import PropTypes from 'prop-types';
import { HashLink as Link } from 'react-router-hash-link';
import { Trans, useTranslation } from 'react-i18next';
import classNames from 'classnames';
import Statistics from './Statistics';
import Counters from './Counters';
import Clients from './Clients';
import QueriedDomains from './QueriedDomains';
import BlockedDomains from './BlockedDomains';
import { SETTINGS_URLS } from '../../helpers/constants';
import PageTitle from '../ui/PageTitle';
import Loading from '../ui/Loading';
@@ -34,6 +37,16 @@ const Dashboard = ({
getAllStats();
}, []);
const getSubtitle = () => {
if (stats.interval === 0) {
return t('stats_disabled_short');
}
return stats.interval === 1
? t('for_last_24_hours')
: t('for_last_days', { count: stats.interval });
};
const buttonText = protectionEnabled ? 'disable_protection' : 'enable_protection';
const buttonClass = classNames('btn btn-sm dashboard-title__button', {
@@ -52,14 +65,12 @@ const Dashboard = ({
</svg>
</button>;
const subtitle = stats.interval === 1
? t('for_last_24_hours')
: t('for_last_days', { count: stats.interval });
const statsProcessing = stats.processingStats
|| stats.processingGetConfig
|| access.processing;
const subtitle = getSubtitle();
return <>
<PageTitle title={t('dashboard')} containerClass="page-title--dashboard">
<button
@@ -81,6 +92,20 @@ const Dashboard = ({
{statsProcessing && <Loading />}
{!statsProcessing && <div className="row row-cards dashboard">
<div className="col-lg-12">
{stats.interval === 0 && (
<div className="alert alert-warning" role="alert">
<Trans components={[
<Link
to={`${SETTINGS_URLS.settings}#stats-config`}
key="0"
>
link
</Link>,
]}>
stats_disabled
</Trans>
</div>
)}
<Statistics
interval={stats.interval}
dnsQueries={stats.dnsQueries}