daxi20/AdGuardHome
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge: + client: add digit grouping for numbers on the dashboard

Browse Source 
Closes #1423

Squashed commit of the following:

commit 6e5de427c48577ebbe4d963f817b66fed9b29bb4
Author: Ildar Kamalov <i.kamalov@adguard.com>
Date:   Wed Mar 11 17:56:39 2020 +0300

    + client: add digit grouping for numbers on the dashboard
This commit is contained in:
Ildar Kamalov
2020-03-17 15:15:19 +03:00
parent bc9bccc669
commit e5db33705d
4 changed files with 41 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
client/src/components/Dashboard/StatsCard.js
View File

@@ -2,6 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import { STATUS_COLORS } from '../../helpers/constants';
import { formatNumber } from '../../helpers/helpers';
import Card from '../ui/Card';
import Line from '../ui/Line';
@@ -10,10 +11,16 @@ const StatsCard = ({
}) => (
<Card type="card--full" bodyType="card-wrap">
<div className="card-body-stats">
<div className={`card-value card-value-stats text-${color}`}>{total}</div>
<div className={`card-value card-value-stats text-${color}`}>
{formatNumber(total)}
</div>
<div className="card-title-stats">{title}</div>
</div>
{percent >= 0 && (<div className={`card-value card-value-percent text-${color}`}>{percent}</div>)}
{percent >= 0 && (
<div className={`card-value card-value-percent text-${color}`}>
{percent}
</div>
)}
<div className="card-chart-bg">
<Line data={lineData} color={STATUS_COLORS[color]} />
</div>