diff --git a/CHANGELOG.md b/CHANGELOG.md index 9c216f35..f68e4872 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -18,6 +18,12 @@ See also the [v0.107.57 GitHub milestone][ms-v0.107.57]. NOTE: Add new changes BELOW THIS COMMENT. --> +### Fixed + +- The formatting of large numbers in the upstream table and query log ([#7590]). + +[#7590]: https://github.com/AdguardTeam/AdGuardHome/issues/7590 + diff --git a/client/src/components/Dashboard/UpstreamAvgTime.tsx b/client/src/components/Dashboard/UpstreamAvgTime.tsx index 48ed9e6a..8f5b4cab 100644 --- a/client/src/components/Dashboard/UpstreamAvgTime.tsx +++ b/client/src/components/Dashboard/UpstreamAvgTime.tsx @@ -10,6 +10,7 @@ import Card from '../ui/Card'; import DomainCell from './DomainCell'; import { DASHBOARD_TABLES_DEFAULT_PAGE_SIZE, TABLES_MIN_ROWS } from '../../helpers/constants'; +import { formatNumber } from '../../helpers/helpers'; interface TimeCellProps { value?: string | number; @@ -20,7 +21,7 @@ const TimeCell = ({ value }: TimeCellProps) => { return '–'; } - const valueInMilliseconds = round(Number(value) * 1000); + const valueInMilliseconds = formatNumber(round(Number(value) * 1000)); return (
diff --git a/client/src/helpers/helpers.tsx b/client/src/helpers/helpers.tsx index d04676c4..60851b36 100644 --- a/client/src/helpers/helpers.tsx +++ b/client/src/helpers/helpers.tsx @@ -453,7 +453,7 @@ export const getParamsForClientsSearch = (data: any, param: any, additionalParam }); return { - clients: Array.from(clients).map(id => ({ id })), + clients: Array.from(clients).map((id) => ({ id })), }; }; @@ -670,9 +670,16 @@ export const countClientsStatistics = (ids: any, autoClients: any) => { * @param {function} t translate * @returns {string} */ -export const formatElapsedMs = (elapsedMs: any, t: any) => { - const formattedElapsedMs = parseInt(elapsedMs, 10) || parseFloat(elapsedMs).toFixed(2); - return `${formattedElapsedMs} ${t('milliseconds_abbreviation')}`; +export const formatElapsedMs = (elapsedMs: string, t: (key: string) => string) => { + const parsedElapsedMs = parseInt(elapsedMs, 10); + + if (Number.isNaN(parsedElapsedMs)) { + return elapsedMs; + } + + const formattedMs = formatNumber(parsedElapsedMs); + + return `${formattedMs} ${t('milliseconds_abbreviation')}`; }; /** @@ -754,12 +761,9 @@ type NestedObject = { order: number; }; -export const getObjectKeysSorted = < - T extends Record, - K extends keyof NestedObject ->( +export const getObjectKeysSorted = , K extends keyof NestedObject>( object: T, - sortKey: K + sortKey: K, ): string[] => { return Object.entries(object) .sort(([, a], [, b]) => (a[sortKey] as number) - (b[sortKey] as number))