diff --git a/packages/desktop-client/src/components/reports/graphs/BarLineGraph.tsx b/packages/desktop-client/src/components/reports/graphs/BarLineGraph.tsx index ffdac1e01631f50fb1e105f059fb216b36dde8e4..c7e5ec785a9811db9d2ede048bd3fd7678561ff7 100644 --- a/packages/desktop-client/src/components/reports/graphs/BarLineGraph.tsx +++ b/packages/desktop-client/src/components/reports/graphs/BarLineGraph.tsx @@ -13,6 +13,8 @@ import { ResponsiveContainer, } from 'recharts'; +import { amountToCurrencyNoDecimal } from 'loot-core/shared/util'; + import { theme } from '../../../style'; import { type CSSProperties } from '../../../style'; import { AlignedText } from '../../common/AlignedText'; @@ -77,7 +79,7 @@ type BarLineGraphProps = { export function BarLineGraph({ style, data, compact }: BarLineGraphProps) { const tickFormatter = tick => { - return `${Math.round(tick).toLocaleString()}`; // Formats the tick values as strings with commas + return `${amountToCurrencyNoDecimal(Math.round(tick))}`; // Formats the tick values as strings with commas }; return ( diff --git a/packages/desktop-client/src/components/reports/graphs/NetWorthGraph.tsx b/packages/desktop-client/src/components/reports/graphs/NetWorthGraph.tsx index 98353b31396e4644b53a5f528bebe4cb519d890c..3d84d5968f08513a1e70b2b3b8bd5d9de839ca81 100644 --- a/packages/desktop-client/src/components/reports/graphs/NetWorthGraph.tsx +++ b/packages/desktop-client/src/components/reports/graphs/NetWorthGraph.tsx @@ -12,6 +12,8 @@ import { ResponsiveContainer, } from 'recharts'; +import { amountToCurrencyNoDecimal } from 'loot-core/shared/util'; + import { usePrivacyMode } from '../../../hooks/usePrivacyMode'; import { useResponsive } from '../../../ResponsiveProvider'; import { theme } from '../../../style'; @@ -35,7 +37,11 @@ export function NetWorthGraph({ const { isNarrowWidth } = useResponsive(); const tickFormatter = tick => { - return privacyMode ? '...' : `${Math.round(tick).toLocaleString()}`; // Formats the tick values as strings with commas + const res = privacyMode + ? '...' + : `${amountToCurrencyNoDecimal(Math.round(tick))}`; // Formats the tick values as strings with commas + + return res; }; const gradientOffset = () => { @@ -197,7 +203,7 @@ function computePadding(netWorthData: Array<{ y: number }>) { */ const maxLength = Math.max( ...netWorthData.map(({ y }) => { - return Math.round(y).toLocaleString().length; + return amountToCurrencyNoDecimal(Math.round(y)).length; }), ); diff --git a/packages/loot-core/src/shared/util.ts b/packages/loot-core/src/shared/util.ts index 7a45a48f88a94c8cc369d7ac36ad69b35e6cb8f6..0f2a10c10df8896cbddb9a813c1b64d1f205a9d2 100644 --- a/packages/loot-core/src/shared/util.ts +++ b/packages/loot-core/src/shared/util.ts @@ -341,7 +341,10 @@ export function amountToCurrency(n) { } export function amountToCurrencyNoDecimal(n) { - return getNumberFormat({ hideFraction: true }).formatter.format(n); + return getNumberFormat({ + ...numberFormatConfig, + hideFraction: true, + }).formatter.format(n); } export function currencyToAmount(str: string) { diff --git a/upcoming-release-notes/2832.md b/upcoming-release-notes/2832.md new file mode 100644 index 0000000000000000000000000000000000000000..73ba6d988aeaf5052a648d7bd3848701408899d9 --- /dev/null +++ b/upcoming-release-notes/2832.md @@ -0,0 +1,6 @@ +--- +category: Bugfix +authors: [sreetamdas] +--- + +Fix number format preference not being used for graphs