diff --git a/src/containers/App/App.scss b/src/containers/App/App.scss index 4ea50cf5c7..58f586da42 100644 --- a/src/containers/App/App.scss +++ b/src/containers/App/App.scss @@ -4,6 +4,9 @@ * { // FIXME: this is an overkill, potentially could break external components, needs refactoring box-sizing: border-box; + + // Make all digits in the app monospace + font-variant-numeric: tabular-nums; } .yc-select-popup__tick-icon { diff --git a/src/utils/bytesParsers/__test__/formatBytes.test.ts b/src/utils/bytesParsers/__test__/formatBytes.test.ts index 09fb5bb24f..e5cf024fb9 100644 --- a/src/utils/bytesParsers/__test__/formatBytes.test.ts +++ b/src/utils/bytesParsers/__test__/formatBytes.test.ts @@ -9,23 +9,23 @@ describe('formatBytes', () => { expect(formatBytes({value: 100_000_000_000_000})).toBe('100 TB'); }); it('should convert to size', () => { - expect(formatBytes({value: 100_000, size: 'b'})).toBe('100,000 B'); - expect(formatBytes({value: 100_000_000_000_000, size: 'gb'})).toBe('100,000 GB'); + expect(formatBytes({value: 100_000, size: 'b'})).toBe('100 000 B'); + expect(formatBytes({value: 100_000_000_000_000, size: 'gb'})).toBe('100 000 GB'); }); it('should convert without labels', () => { - expect(formatBytes({value: 100_000, size: 'b', withSizeLabel: false})).toBe('100,000'); + expect(formatBytes({value: 100_000, size: 'b', withSizeLabel: false})).toBe('100 000'); expect(formatBytes({value: 100_000_000_000_000, size: 'gb', withSizeLabel: false})).toBe( - '100,000', + '100 000', ); }); it('should convert to speed', () => { expect(formatBytes({value: 100_000, withSpeedLabel: true})).toBe('100 KB/s'); - expect(formatBytes({value: 100_000, size: 'b', withSpeedLabel: true})).toBe('100,000 B/s'); + expect(formatBytes({value: 100_000, size: 'b', withSpeedLabel: true})).toBe('100 000 B/s'); }); it('should return fixed amount of significant digits', () => { - expect(formatBytes({value: 99_000, significantDigits: 2})).toEqual('99,000 B'); + expect(formatBytes({value: 99_000, significantDigits: 2})).toEqual('99 000 B'); expect(formatBytes({value: 100_000, significantDigits: 2})).toEqual('100 KB'); - expect(formatBytes({value: 99_000_000_000_000, significantDigits: 2})).toEqual('99,000 GB'); + expect(formatBytes({value: 99_000_000_000_000, significantDigits: 2})).toEqual('99 000 GB'); expect(formatBytes({value: 100_000_000_000_000, significantDigits: 2})).toEqual('100 TB'); }); it('should return empty string on invalid data', () => { diff --git a/src/utils/dataFormatters/dataFormatters.ts b/src/utils/dataFormatters/dataFormatters.ts index 3788f72972..542b991691 100644 --- a/src/utils/dataFormatters/dataFormatters.ts +++ b/src/utils/dataFormatters/dataFormatters.ts @@ -95,6 +95,7 @@ export const formatNumber = (number?: unknown) => { return ''; } + // "," in format is delimiter sign, not delimiter itself return configuredNumeral(number).format('0,0.[00000]'); }; diff --git a/src/utils/numeral.ts b/src/utils/numeral.ts index e3a8b26472..2c2b74669c 100644 --- a/src/utils/numeral.ts +++ b/src/utils/numeral.ts @@ -1,7 +1,14 @@ import numeral from 'numeral'; import 'numeral/locales'; // Without this numeral will throw an error when using not 'en' locale -import {i18n} from './i18n'; +import {Lang, i18n} from './i18n'; + +// Set space delimiter for all locales possible in project +Object.values(Lang).forEach((value) => { + if (numeral.locales[value]) { + numeral.locales[value].delimiters.thousands = ' '; + } +}); numeral.locale(i18n.lang);