Pull request 1928: 1453-stats-tests

Updates #1453. Squashed commit of the following: commit f08f68ef5493dad03d3eb120d886f2df1af28be6 Merge: b70b088af 54aee2272 Author: Stanislav Chzhen <s.chzhen@adguard.com> Date: Tue Aug 8 19:04:06 2023 +0300 Merge branch 'master' into 1453-stats-tests commit b70b088af0fdc7d6d048d688160048bad1fceb12 Author: Stanislav Chzhen <s.chzhen@adguard.com> Date: Thu Aug 3 19:32:04 2023 +0300 stats: imp code commit c341012ba61894c255c1868624be1cac0d26a6fa Merge: a2ac8c34e 5eb3cd0f9 Author: Stanislav Chzhen <s.chzhen@adguard.com> Date: Thu Aug 3 13:36:24 2023 +0300 Merge branch 'master' into 1453-stats-tests commit a2ac8c34ee32606ca5e259c3e2a47db0dd5858de Author: Ildar Kamalov <ik@adguard.com> Date: Thu Aug 3 13:25:12 2023 +0300 client: add top upstreams and average processing time tables commit 11118947f9bf945be0b056f8475cf3b848c6e66e Author: Stanislav Chzhen <s.chzhen@adguard.com> Date: Tue Aug 1 17:24:57 2023 +0300 stats: imp docs commit 904cf81d02a1f327b9647fa7ad9e181cfabb68a4 Author: Stanislav Chzhen <s.chzhen@adguard.com> Date: Mon Jul 31 17:34:06 2023 +0300 stats: imp code commit 34f0c96dd5865d1470385322a88842dd0b3d996d Author: Stanislav Chzhen <s.chzhen@adguard.com> Date: Mon Jul 31 15:43:46 2023 +0300 all: imp docs commit 2cb2d0d8bef3580f64bc25c414fe9b5ea6b9f997 Author: Stanislav Chzhen <s.chzhen@adguard.com> Date: Fri Jul 28 17:24:31 2023 +0300 all: imp code commit 5251a899fecc21e50a0ba06042f96f5b404e196a Merge: b6c2b12d4 300821a7f Author: Stanislav Chzhen <s.chzhen@adguard.com> Date: Thu Jul 27 20:34:39 2023 +0300 Merge branch 'master' into 1453-stats-tests commit b6c2b12d4425012efd73549c3a426735f3a677cd Author: Stanislav Chzhen <s.chzhen@adguard.com> Date: Thu Jul 27 20:32:18 2023 +0300 stats: imp code commit 5546b82a78326f9cc6d8c87df5083f8fc66a0178 Merge: 8a3d6b1b4 5f8fa006c Author: Stanislav Chzhen <s.chzhen@adguard.com> Date: Thu Jul 27 14:24:01 2023 +0300 Merge branch 'master' into 1453-stats-tests commit 8a3d6b1b49ce189f95adfa7406a34108e885e676 Author: Stanislav Chzhen <s.chzhen@adguard.com> Date: Thu Jul 27 14:17:47 2023 +0300 all: imp code commit 2a48001e275e3cdcf70e13e1c9cebd4e502f3259 Author: Stanislav Chzhen <s.chzhen@adguard.com> Date: Tue Jul 25 18:27:20 2023 +0300 all: imp docs commit 3dd21890175af32a3368378f7e013383f6d040ec Author: Stanislav Chzhen <s.chzhen@adguard.com> Date: Tue Jul 25 16:00:39 2023 +0300 all: imp naming commit 6124456fc3149b71f6bd58d35ecf24eb6cf40d5d Author: Stanislav Chzhen <s.chzhen@adguard.com> Date: Thu Jul 20 16:15:56 2023 +0300 all: add upstreams avg processing time commit 187ad0c77a81c9fd95c24e23141355db2e83e50d Author: Stanislav Chzhen <s.chzhen@adguard.com> Date: Tue Jul 18 16:42:19 2023 +0300 all: add top upstreams
2023-08-09 14:33:52 +03:00
parent 54aee22720
commit c47509fabc
19 changed files with 686 additions and 140 deletions
--- a/client/src/components/Dashboard/UpstreamAvgTime.js
+++ b/client/src/components/Dashboard/UpstreamAvgTime.js
@@ -0,0 +1,79 @@
+import React from 'react';
+import ReactTable from 'react-table';
+import PropTypes from 'prop-types';
+import round from 'lodash/round';
+import { withTranslation, Trans } from 'react-i18next';
+
+import Card from '../ui/Card';
+import DomainCell from './DomainCell';
+
+const TimeCell = ({ value }) => {
+    if (!value) {
+        return '–';
+    }
+
+    const valueInMilliseconds = round(value * 1000);
+
+    return (
+        <div className="logs__row o-hidden">
+            <span className="logs__text logs__text--full" title={valueInMilliseconds}>
+                {valueInMilliseconds}&nbsp;ms
+            </span>
+        </div>
+    );
+};
+
+TimeCell.propTypes = {
+    value: PropTypes.oneOfType([
+        PropTypes.string,
+        PropTypes.number,
+    ]),
+};
+
+const UpstreamAvgTime = ({
+    t,
+    refreshButton,
+    topUpstreamsAvgTime,
+    subtitle,
+}) => (
+    <Card
+        title={t('average_processing_time')}
+        subtitle={subtitle}
+        bodyType="card-table"
+        refresh={refreshButton}
+    >
+        <ReactTable
+            data={topUpstreamsAvgTime.map(({ name: domain, count }) => ({
+                domain,
+                count,
+            }))}
+            columns={[
+                {
+                    Header: <Trans>upstream</Trans>,
+                    accessor: 'domain',
+                    Cell: DomainCell,
+                },
+                {
+                    Header: <Trans>processing_time</Trans>,
+                    accessor: 'count',
+                    maxWidth: 190,
+                    Cell: TimeCell,
+                },
+            ]}
+            showPagination={false}
+            noDataText={t('no_upstreams_data_found')}
+            minRows={6}
+            defaultPageSize={100}
+            className="-highlight card-table-overflow--limited stats__table"
+        />
+    </Card>
+);
+
+UpstreamAvgTime.propTypes = {
+    topUpstreamsAvgTime: PropTypes.array.isRequired,
+    refreshButton: PropTypes.node.isRequired,
+    subtitle: PropTypes.string.isRequired,
+    t: PropTypes.func.isRequired,
+};
+
+export default withTranslation()(UpstreamAvgTime);