diff --git a/packages/grafana-data/src/valueFormats/symbolFormatters.test.ts b/packages/grafana-data/src/valueFormats/symbolFormatters.test.ts index 278caf1ebb6..05273473e84 100644 --- a/packages/grafana-data/src/valueFormats/symbolFormatters.test.ts +++ b/packages/grafana-data/src/valueFormats/symbolFormatters.test.ts @@ -7,25 +7,25 @@ describe('currency', () => { const fmtFunc = currency(symbol); it.each` - value | expectedSuffix | expectedText - ${0} | ${''} | ${'0'} - ${999} | ${''} | ${'999'} - ${1000} | ${'K'} | ${'1'} - ${1000000} | ${'M'} | ${'1'} - ${1000000000} | ${'B'} | ${'1'} - ${1000000000000} | ${'T'} | ${'1'} - ${1000000000000000} | ${'T'} | ${'1000'} - ${-1000000000000} | ${'T'} | ${'-1'} - ${-1000000000} | ${'B'} | ${'-1'} - ${-1000000} | ${'M'} | ${'-1'} - ${-1000} | ${'K'} | ${'-1'} - ${-999} | ${''} | ${'-999'} - `('when called with value:{$value}', ({ value, expectedSuffix, expectedText }) => { + value | expectedPrefix | expectedSuffix | expectedText + ${0} | ${'@'} | ${''} | ${'0'} + ${999} | ${'@'} | ${''} | ${'999'} + ${1000} | ${'@'} | ${'K'} | ${'1'} + ${1000000} | ${'@'} | ${'M'} | ${'1'} + ${1000000000} | ${'@'} | ${'B'} | ${'1'} + ${1000000000000} | ${'@'} | ${'T'} | ${'1'} + ${1000000000000000} | ${'@'} | ${'T'} | ${'1000'} + ${-1000000000000} | ${'-@'} | ${'T'} | ${'1'} + ${-1000000000} | ${'-@'} | ${'B'} | ${'1'} + ${-1000000} | ${'-@'} | ${'M'} | ${'1'} + ${-1000} | ${'-@'} | ${'K'} | ${'1'} + ${-999} | ${'-@'} | ${''} | ${'999'} + `('when called with value:{$value}', ({ value, expectedPrefix, expectedText, expectedSuffix }) => { const { prefix, suffix, text } = fmtFunc(value); - expect(prefix).toEqual(symbol); - expect(suffix).toEqual(expectedSuffix); + expect(prefix).toEqual(expectedPrefix); expect(text).toEqual(expectedText); + expect(suffix).toEqual(expectedSuffix); }); }); @@ -33,25 +33,25 @@ describe('currency', () => { const fmtFunc = currency(symbol, true); it.each` - value | expectedSuffix | expectedText - ${0} | ${'@'} | ${'0'} - ${999} | ${'@'} | ${'999'} - ${1000} | ${'K@'} | ${'1'} - ${1000000} | ${'M@'} | ${'1'} - ${1000000000} | ${'B@'} | ${'1'} - ${1000000000000} | ${'T@'} | ${'1'} - ${1000000000000000} | ${'T@'} | ${'1000'} - ${-1000000000000} | ${'T@'} | ${'-1'} - ${-1000000000} | ${'B@'} | ${'-1'} - ${-1000000} | ${'M@'} | ${'-1'} - ${-1000} | ${'K@'} | ${'-1'} - ${-999} | ${'@'} | ${'-999'} - `('when called with value:{$value}', ({ value, expectedSuffix, expectedText }) => { + value | expectedPrefix | expectedSuffix | expectedText + ${0} | ${undefined} | ${'@'} | ${'0'} + ${999} | ${undefined} | ${'@'} | ${'999'} + ${1000} | ${undefined} | ${'K@'} | ${'1'} + ${1000000} | ${undefined} | ${'M@'} | ${'1'} + ${1000000000} | ${undefined} | ${'B@'} | ${'1'} + ${1000000000000} | ${undefined} | ${'T@'} | ${'1'} + ${1000000000000000} | ${undefined} | ${'T@'} | ${'1000'} + ${-1000000000000} | ${'-'} | ${'T@'} | ${'1'} + ${-1000000000} | ${'-'} | ${'B@'} | ${'1'} + ${-1000000} | ${'-'} | ${'M@'} | ${'1'} + ${-1000} | ${'-'} | ${'K@'} | ${'1'} + ${-999} | ${'-'} | ${'@'} | ${'999'} + `('when called with value:{$value}', ({ value, expectedPrefix, expectedText, expectedSuffix }) => { const { prefix, suffix, text } = fmtFunc(value); - expect(prefix).toEqual(undefined); - expect(suffix).toEqual(expectedSuffix); + expect(prefix).toEqual(expectedPrefix); expect(text).toEqual(expectedText); + expect(suffix).toEqual(expectedSuffix); }); }); }); diff --git a/packages/grafana-data/src/valueFormats/symbolFormatters.ts b/packages/grafana-data/src/valueFormats/symbolFormatters.ts index 9f23db1228b..d9cdc85616c 100644 --- a/packages/grafana-data/src/valueFormats/symbolFormatters.ts +++ b/packages/grafana-data/src/valueFormats/symbolFormatters.ts @@ -5,16 +5,23 @@ import { scaledUnits, ValueFormatter } from './valueFormats'; export function currency(symbol: string, asSuffix?: boolean): ValueFormatter { const units = ['', 'K', 'M', 'B', 'T']; const scaler = scaledUnits(1000, units); - return (size: number, decimals?: DecimalCount, scaledDecimals?: DecimalCount) => { - if (size === null) { + return (value: number, decimals?: DecimalCount, scaledDecimals?: DecimalCount) => { + if (value == null) { return { text: '' }; } - const scaled = scaler(size, decimals, scaledDecimals); + const isNegative = value < 0; + if (isNegative) { + value = Math.abs(value); + } + const scaled = scaler(value, decimals, scaledDecimals); if (asSuffix) { scaled.suffix = scaled.suffix !== undefined ? `${scaled.suffix}${symbol}` : undefined; } else { scaled.prefix = symbol; } + if (isNegative) { + scaled.prefix = `-${scaled.prefix?.length ? scaled.prefix : ''}`; + } return scaled; }; }