github-starred/actual
2
0
Fork 0
mirror of https://github.com/actualbudget/actual.git synced 2026-03-09 11:42:54 -05:00
Code Issues 250 Packages Projects Releases 53 Wiki Activity

[PR #2818] [MERGED] Add computed padding for handling clipped large Net worth amounts #4528

New Issue
Closed
opened 2026-02-28 20:57:09 -06:00 by GiteaMirror · 0 comments
GiteaMirror commented 2026-02-28 20:57:09 -06:00
Owner
Copy Link

📋 Pull Request Information

Original PR: https://github.com/actualbudget/actual/pull/2818
Author: @sreetamdas
Created: 6/2/2024
Status: ✅ Merged
Merged: 7/8/2024
Merged by: @youngcw

Base: master ← Head: fix-net-worth-overflow

📝 Commits (10+)

  • f2e031a Add computed padding for handling clipped Net worth amounts
  • 7d3bffc Add comment, early handle 5 character case
  • cbcf7aa Add release note
  • 9f0f670 Merge remote-tracking branch 'origin/master' into fix-net-worth-overflow
  • 9ab8194 Merge branch 'master' into fix-net-worth-overflow
  • f71f844 Merge remote-tracking branch 'refs/remotes/origin/fix-net-worth-overflow' into fix-net-worth-overflow
  • 20c7438 Merge branch 'master' into fix-net-worth-overflow
  • b42baa0 Merge branch 'master' into fix-net-worth-overflow
  • 36906e9 Merge branch 'master' into fix-net-worth-overflow
  • 1af1e8d Update packages/desktop-client/src/components/reports/graphs/NetWorthGraph.tsx

📊 Changes

5 files changed (+31 additions, -1 deletions)

View changed files

📝 packages/desktop-client/e2e/reports.test.js-snapshots/Reports-loads-net-worth-graph-and-checks-visuals-1-chromium-linux.png (+0 -0)
📝 packages/desktop-client/e2e/reports.test.js-snapshots/Reports-loads-net-worth-graph-and-checks-visuals-2-chromium-linux.png (+0 -0)
📝 packages/desktop-client/e2e/reports.test.js-snapshots/Reports-loads-net-worth-graph-and-checks-visuals-3-chromium-linux.png (+0 -0)
📝 packages/desktop-client/src/components/reports/graphs/NetWorthGraph.tsx (+25 -1)
➕ upcoming-release-notes/2818.md (+6 -0)

📄 Description

In the Net Worth report, amounts over ~6 digits get clipped because of zero margin added.

<AreaChart
  width={width}
  height={height}
  data={graphData.data}
  margin={{ top: 0, right: 0, left: 0, bottom: 0 }}
>
Before

image

Fix by adding a left padding that takes into account the length of the net worth amount (so it can handle even bigger amounts, which is common in currencies like INR, VND, etc.)

/**
 * Add left padding for Y-axis for when large amounts get clipped
 */
function computePadding(netWorthData: Array<{ y: number }>) {
  /**
   * Convert to string notation, get longest string length
   */
  const maxLength = Math.max(
    ...netWorthData.map(({ y }) => {
      return Math.round(y).toLocaleString().length;
    }),
  );

  if (maxLength <= 5) {
    // No additional left padding is required for upto 5 characters
    return 0;
  }

  return (maxLength - 5) * 5;
}
After

image

🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/actualbudget/actual/pull/2818 **Author:** [@sreetamdas](https://github.com/sreetamdas) **Created:** 6/2/2024 **Status:** ✅ Merged **Merged:** 7/8/2024 **Merged by:** [@youngcw](https://github.com/youngcw) **Base:** `master` ← **Head:** `fix-net-worth-overflow` --- ### 📝 Commits (10+) - [`f2e031a`](https://github.com/actualbudget/actual/commit/f2e031a36ae586d19c3497593b4af775aa0a2567) Add computed padding for handling clipped Net worth amounts - [`7d3bffc`](https://github.com/actualbudget/actual/commit/7d3bffcd748127a3514ccc44492f7661be49bb1c) Add comment, early handle 5 character case - [`cbcf7aa`](https://github.com/actualbudget/actual/commit/cbcf7aac5f8068ae5aea06e2dd3570b2293317a8) Add release note - [`9f0f670`](https://github.com/actualbudget/actual/commit/9f0f6707e2c36108ed59e88a3261df35c9a09303) Merge remote-tracking branch 'origin/master' into fix-net-worth-overflow - [`9ab8194`](https://github.com/actualbudget/actual/commit/9ab81941284aedefbab6069db1b0f6b1a84c9368) Merge branch 'master' into fix-net-worth-overflow - [`f71f844`](https://github.com/actualbudget/actual/commit/f71f844a3e68cc6c38cf3b2d062ac88c8c510e02) Merge remote-tracking branch 'refs/remotes/origin/fix-net-worth-overflow' into fix-net-worth-overflow - [`20c7438`](https://github.com/actualbudget/actual/commit/20c743852f681327f94bd0d59a6ab7717d559c73) Merge branch 'master' into fix-net-worth-overflow - [`b42baa0`](https://github.com/actualbudget/actual/commit/b42baa0f05e3130361371093beb5bbb3938832f0) Merge branch 'master' into fix-net-worth-overflow - [`36906e9`](https://github.com/actualbudget/actual/commit/36906e9792e1cea7fc38e89460ba61cd4028f560) Merge branch 'master' into fix-net-worth-overflow - [`1af1e8d`](https://github.com/actualbudget/actual/commit/1af1e8d5991b42b7a0634c1ef24403c3db2235cd) Update packages/desktop-client/src/components/reports/graphs/NetWorthGraph.tsx ### 📊 Changes **5 files changed** (+31 additions, -1 deletions) <details> <summary>View changed files</summary> 📝 `packages/desktop-client/e2e/reports.test.js-snapshots/Reports-loads-net-worth-graph-and-checks-visuals-1-chromium-linux.png` (+0 -0) 📝 `packages/desktop-client/e2e/reports.test.js-snapshots/Reports-loads-net-worth-graph-and-checks-visuals-2-chromium-linux.png` (+0 -0) 📝 `packages/desktop-client/e2e/reports.test.js-snapshots/Reports-loads-net-worth-graph-and-checks-visuals-3-chromium-linux.png` (+0 -0) 📝 `packages/desktop-client/src/components/reports/graphs/NetWorthGraph.tsx` (+25 -1) ➕ `upcoming-release-notes/2818.md` (+6 -0) </details> ### 📄 Description In the Net Worth report, amounts over ~6 digits get clipped because of [zero margin added](https://github.com/actualbudget/actual/blob/08aff05a06f4bca4344f939324080e1fa6511b62/packages/desktop-client/src/components/reports/graphs/NetWorthGraph.tsx#L124). ```jsx <AreaChart width={width} height={height} data={graphData.data} margin={{ top: 0, right: 0, left: 0, bottom: 0 }} > ``` <details><summary>Before</summary> <p> <img width="1440" alt="image" src="https://github.com/actualbudget/actual/assets/11270438/ad0c44bb-6b52-4b10-adec-08041a03be4d"> </p> </details> --- Fix by adding a left padding that takes into account the length of the net worth amount (so it can handle even bigger amounts, which is common in currencies like INR, VND, etc.) ```jsx /** * Add left padding for Y-axis for when large amounts get clipped */ function computePadding(netWorthData: Array<{ y: number }>) { /** * Convert to string notation, get longest string length */ const maxLength = Math.max( ...netWorthData.map(({ y }) => { return Math.round(y).toLocaleString().length; }), ); if (maxLength <= 5) { // No additional left padding is required for upto 5 characters return 0; } return (maxLength - 5) * 5; } ``` <details><summary>After</summary> <p> <img width="1440" alt="image" src="https://github.com/actualbudget/actual/assets/11270438/0e469b1a-0aa4-449d-a04b-091a1c4f7e52"> </p> </details> --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
GiteaMirror added the pull-request label 2026-02-28 20:57:09 -06:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
AI generated
API
bank sync
budgeting
bug
can’t replicate
dependencies
docker
documentation
electron
experimental feature
feature
feedback
goal templates
good first issue
help wanted
importers
maintenance
needs info
needs testing
needs triage
needs votes
openid
payees
pull-request
Mirrored from GitHub Pull Request
 regression
reports
responsive
rules
schedules
server
✨ merged
split transactions
tech debt
theme
transaction import
transaction reconciliation
transactions
translations
upstream
user interface
✅ approved
wontfix
No Label pull-request
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
GiteaMirror ninjasurge
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/actual#4528
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?