[PR #8031] [MERGED] [AI] Fix Balance Forecast chart colors with custom themes #122284

Closed
opened 2026-06-11 21:04:20 -05:00 by GiteaMirror · 0 comments
Owner

📋 Pull Request Information

Original PR: https://github.com/actualbudget/actual/pull/8031
Author: @samaluk
Created: 6/2/2026
Status: Merged
Merged: 6/2/2026
Merged by: @youngcw

Base: masterHead: fix/balance-forecast-custom-theme-chart-colors


📝 Commits (2)

  • 5ce427f [AI] Use report theme colors for Balance Forecast chart lines
  • 9ea394f [AI] Add release notes for Balance Forecast custom theme fix

📊 Changes

9 files changed (+17 additions, -11 deletions)

View changed files

📝 packages/desktop-client/e2e/reports.test.ts-snapshots/Reports-balance-forecast-loads-balance-forecast-report-with-monthly-granularity-1-chromium-linux.png (+0 -0)
📝 packages/desktop-client/e2e/reports.test.ts-snapshots/Reports-balance-forecast-loads-balance-forecast-report-with-monthly-granularity-2-chromium-linux.png (+0 -0)
📝 packages/desktop-client/e2e/reports.test.ts-snapshots/Reports-balance-forecast-loads-balance-forecast-report-with-monthly-granularity-3-chromium-linux.png (+0 -0)
📝 packages/desktop-client/e2e/reports.test.ts-snapshots/Reports-balance-forecast-switches-to-daily-granularity-1-chromium-linux.png (+0 -0)
📝 packages/desktop-client/e2e/reports.test.ts-snapshots/Reports-balance-forecast-switches-to-daily-granularity-2-chromium-linux.png (+0 -0)
📝 packages/desktop-client/e2e/reports.test.ts-snapshots/Reports-balance-forecast-switches-to-daily-granularity-3-chromium-linux.png (+0 -0)
📝 packages/desktop-client/src/components/reports/reports/BalanceForecast.tsx (+6 -6)
📝 packages/desktop-client/src/components/reports/reports/BalanceForecastCard.tsx (+5 -5)
upcoming-release-notes/8031.md (+6 -0)

📄 Description

Description

Balance Forecast used noticeText and errorText for the chart line and “Today” marker. Those tokens are meant for notice/error UI (banners, alerts), not charts. Custom themes such as distantvapor/you-need-a-dark-mode set them to white (#ffffff), so the forecast line appeared white on a dark report background.

This change aligns Balance Forecast with other reports (Net Worth, Age of Money, etc.) by using report color tokens:

  • reportsChartFill / reportsNumberNegative for the line gradient (positive vs negative balance)
  • reportsBlue for the “Today” reference line

Updated VRT snapshots for the balance forecast report.

N/A

Testing

  • Verified with custom theme distantvapor/you-need-a-dark-mode: line shows green/red/cyan instead of white
  • yarn typecheck and yarn lint:fix pass
  • E2E snapshot updates included for balance forecast monthly/daily views

Checklist

  • Release notes added (see link above)
  • No obvious regressions in affected areas
  • Self-review has been performed - I understand what each change in the code does and why it is needed

Bundle Stats

Bundle Files count Total bundle size % Changed
desktop-client 37 14.03 MB → 14.03 MB (+75 B) +0.00%
loot-core 1 5.34 MB 0%
api 2 3.97 MB 0%
cli 1 7.97 MB 0%
crdt 1 11.12 kB 0%
View detailed bundle stats

desktop-client

Total

Files count Total bundle size % Changed
37 14.03 MB → 14.03 MB (+75 B) +0.00%
Changeset
File Δ Size
src/components/reports/reports/BalanceForecastCard.tsx 📈 +37 B (+0.34%) 10.6 kB → 10.64 kB
src/components/reports/reports/BalanceForecast.tsx 📈 +38 B (+0.25%) 14.67 kB → 14.7 kB
View detailed bundle breakdown

Added
No assets were added

Removed
No assets were removed

Bigger

Asset File Size % Changed
static/js/ReportRouter.js 1.26 MB → 1.26 MB (+75 B) +0.01%

Smaller
No assets were smaller

Unchanged

Asset File Size % Changed
static/js/index.js 1.54 MB 0%
static/js/BackgroundImage.js 121.09 kB 0%
static/js/FormulaEditor.js 962.55 kB 0%
static/js/ManageRules.js 46.98 kB 0%
static/js/PayeeRuleCountLabel.js 7.33 kB 0%
static/js/ScheduleEditForm.js 146.44 kB 0%
static/js/SchedulesTable.js 202.7 kB 0%
static/js/TransactionEdit.js 90.63 kB 0%
static/js/TransactionList.js 85.81 kB 0%
static/js/Value.js 5.08 MB 0%
static/js/_baseIsEqual.js 98.38 kB 0%
static/js/ca.js 186.75 kB 0%
static/js/client.js 451.37 kB 0%
static/js/da.js 101.15 kB 0%
static/js/de.js 170.99 kB 0%
static/js/en-GB.js 9.25 kB 0%
static/js/en.js 198.48 kB 0%
static/js/es.js 178.68 kB 0%
static/js/extends.js 501.67 kB 0%
static/js/fr.js 178.57 kB 0%
static/js/indexeddb-main-thread-worker-e59fee74.js 13.46 kB 0%
static/js/it.js 165 kB 0%
static/js/narrow.js 364.2 kB 0%
static/js/nb-NO.js 148.05 kB 0%
static/js/nl.js 107.12 kB 0%
static/js/pt-BR.js 188.43 kB 0%
static/js/resize-observer.js 18.06 kB 0%
static/js/th.js 174.48 kB 0%
static/js/theme.js 31.88 kB 0%
static/js/toString.js 705.14 kB 0%
static/js/uk.js 207.46 kB 0%
static/js/useFormatList.js 2.52 kB 0%
static/js/useTransactionBatchActions.js 9.71 kB 0%
static/js/wide.js 297.21 kB 0%
static/js/workbox-window.prod.es5.js 7.33 kB 0%
static/js/zh-Hans.js 117.01 kB 0%

loot-core

Total

Files count Total bundle size % Changed
1 5.34 MB 0%
View detailed bundle breakdown

Added
No assets were added

Removed
No assets were removed

Bigger
No assets were bigger

Smaller
No assets were smaller

Unchanged

Asset File Size % Changed
kcab.worker.B_yYPCGv.js 5.34 MB 0%

api

Total

Files count Total bundle size % Changed
2 3.97 MB 0%
View detailed bundle breakdown

Added
No assets were added

Removed
No assets were removed

Bigger
No assets were bigger

Smaller
No assets were smaller

Unchanged

Asset File Size % Changed
index.js 3.97 MB 0%
models.js 0 B 0%

cli

Total

Files count Total bundle size % Changed
1 7.97 MB 0%
View detailed bundle breakdown

Added
No assets were added

Removed
No assets were removed

Bigger
No assets were bigger

Smaller
No assets were smaller

Unchanged

Asset File Size % Changed
cli.js 7.97 MB 0%

crdt

Total

Files count Total bundle size % Changed
1 11.12 kB 0%
View detailed bundle breakdown

Added
No assets were added

Removed
No assets were removed

Bigger
No assets were bigger

Smaller
No assets were smaller

Unchanged

Asset File Size % Changed
index.js 11.12 kB 0%

🔄 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/8031 **Author:** [@samaluk](https://github.com/samaluk) **Created:** 6/2/2026 **Status:** ✅ Merged **Merged:** 6/2/2026 **Merged by:** [@youngcw](https://github.com/youngcw) **Base:** `master` ← **Head:** `fix/balance-forecast-custom-theme-chart-colors` --- ### 📝 Commits (2) - [`5ce427f`](https://github.com/actualbudget/actual/commit/5ce427ff51336b15ba7be3b2f997eba5665d942e) [AI] Use report theme colors for Balance Forecast chart lines - [`9ea394f`](https://github.com/actualbudget/actual/commit/9ea394f0140e6baec1c2e95f367644c0c875d641) [AI] Add release notes for Balance Forecast custom theme fix ### 📊 Changes **9 files changed** (+17 additions, -11 deletions) <details> <summary>View changed files</summary> 📝 `packages/desktop-client/e2e/reports.test.ts-snapshots/Reports-balance-forecast-loads-balance-forecast-report-with-monthly-granularity-1-chromium-linux.png` (+0 -0) 📝 `packages/desktop-client/e2e/reports.test.ts-snapshots/Reports-balance-forecast-loads-balance-forecast-report-with-monthly-granularity-2-chromium-linux.png` (+0 -0) 📝 `packages/desktop-client/e2e/reports.test.ts-snapshots/Reports-balance-forecast-loads-balance-forecast-report-with-monthly-granularity-3-chromium-linux.png` (+0 -0) 📝 `packages/desktop-client/e2e/reports.test.ts-snapshots/Reports-balance-forecast-switches-to-daily-granularity-1-chromium-linux.png` (+0 -0) 📝 `packages/desktop-client/e2e/reports.test.ts-snapshots/Reports-balance-forecast-switches-to-daily-granularity-2-chromium-linux.png` (+0 -0) 📝 `packages/desktop-client/e2e/reports.test.ts-snapshots/Reports-balance-forecast-switches-to-daily-granularity-3-chromium-linux.png` (+0 -0) 📝 `packages/desktop-client/src/components/reports/reports/BalanceForecast.tsx` (+6 -6) 📝 `packages/desktop-client/src/components/reports/reports/BalanceForecastCard.tsx` (+5 -5) ➕ `upcoming-release-notes/8031.md` (+6 -0) </details> ### 📄 Description ## Description Balance Forecast used `noticeText` and `errorText` for the chart line and “Today” marker. Those tokens are meant for notice/error UI (banners, alerts), not charts. Custom themes such as [distantvapor/you-need-a-dark-mode](https://github.com/distantvapor/you-need-a-dark-mode) set them to white (`#ffffff`), so the forecast line appeared white on a dark report background. This change aligns Balance Forecast with other reports (Net Worth, Age of Money, etc.) by using report color tokens: - `reportsChartFill` / `reportsNumberNegative` for the line gradient (positive vs negative balance) - `reportsBlue` for the “Today” reference line Updated VRT snapshots for the balance forecast report. ## Related issue(s) N/A ## Testing - Verified with custom theme `distantvapor/you-need-a-dark-mode`: line shows green/red/cyan instead of white - `yarn typecheck` and `yarn lint:fix` pass - E2E snapshot updates included for balance forecast monthly/daily views ## Checklist - [x] Release notes added (see link above) - [x] No obvious regressions in affected areas - [x] Self-review has been performed - I understand what each change in the code does and why it is needed <!--- actual-bot-sections ---> <hr /> <!--- bundlestats-action-comment key:combined start ---> ### Bundle Stats Bundle | Files count | Total bundle size | % Changed ------ | ----------- | ----------------- | --------- desktop-client | 37 | 14.03 MB → 14.03 MB (+75 B) | +0.00% loot-core | 1 | 5.34 MB | 0% api | 2 | 3.97 MB | 0% cli | 1 | 7.97 MB | 0% crdt | 1 | 11.12 kB | 0% <details> <summary>View detailed bundle stats</summary> #### desktop-client **Total** Files count | Total bundle size | % Changed ----------- | ----------------- | --------- 37 | 14.03 MB → 14.03 MB (+75 B) | +0.00% <details> <summary>Changeset</summary> File | Δ | Size ---- | - | ---- `src/components/reports/reports/BalanceForecastCard.tsx` | 📈 +37 B (+0.34%) | 10.6 kB → 10.64 kB `src/components/reports/reports/BalanceForecast.tsx` | 📈 +38 B (+0.25%) | 14.67 kB → 14.7 kB </details> <details> <summary>View detailed bundle breakdown</summary> <div> **Added** No assets were added **Removed** No assets were removed **Bigger** Asset | File Size | % Changed ----- | --------- | --------- static/js/ReportRouter.js | 1.26 MB → 1.26 MB (+75 B) | +0.01% **Smaller** No assets were smaller **Unchanged** Asset | File Size | % Changed ----- | --------- | --------- static/js/index.js | 1.54 MB | 0% static/js/BackgroundImage.js | 121.09 kB | 0% static/js/FormulaEditor.js | 962.55 kB | 0% static/js/ManageRules.js | 46.98 kB | 0% static/js/PayeeRuleCountLabel.js | 7.33 kB | 0% static/js/ScheduleEditForm.js | 146.44 kB | 0% static/js/SchedulesTable.js | 202.7 kB | 0% static/js/TransactionEdit.js | 90.63 kB | 0% static/js/TransactionList.js | 85.81 kB | 0% static/js/Value.js | 5.08 MB | 0% static/js/_baseIsEqual.js | 98.38 kB | 0% static/js/ca.js | 186.75 kB | 0% static/js/client.js | 451.37 kB | 0% static/js/da.js | 101.15 kB | 0% static/js/de.js | 170.99 kB | 0% static/js/en-GB.js | 9.25 kB | 0% static/js/en.js | 198.48 kB | 0% static/js/es.js | 178.68 kB | 0% static/js/extends.js | 501.67 kB | 0% static/js/fr.js | 178.57 kB | 0% static/js/indexeddb-main-thread-worker-e59fee74.js | 13.46 kB | 0% static/js/it.js | 165 kB | 0% static/js/narrow.js | 364.2 kB | 0% static/js/nb-NO.js | 148.05 kB | 0% static/js/nl.js | 107.12 kB | 0% static/js/pt-BR.js | 188.43 kB | 0% static/js/resize-observer.js | 18.06 kB | 0% static/js/th.js | 174.48 kB | 0% static/js/theme.js | 31.88 kB | 0% static/js/toString.js | 705.14 kB | 0% static/js/uk.js | 207.46 kB | 0% static/js/useFormatList.js | 2.52 kB | 0% static/js/useTransactionBatchActions.js | 9.71 kB | 0% static/js/wide.js | 297.21 kB | 0% static/js/workbox-window.prod.es5.js | 7.33 kB | 0% static/js/zh-Hans.js | 117.01 kB | 0% </div> </details> --- #### loot-core **Total** Files count | Total bundle size | % Changed ----------- | ----------------- | --------- 1 | 5.34 MB | 0% <details> <summary>View detailed bundle breakdown</summary> <div> **Added** No assets were added **Removed** No assets were removed **Bigger** No assets were bigger **Smaller** No assets were smaller **Unchanged** Asset | File Size | % Changed ----- | --------- | --------- kcab.worker.B_yYPCGv.js | 5.34 MB | 0% </div> </details> --- #### api **Total** Files count | Total bundle size | % Changed ----------- | ----------------- | --------- 2 | 3.97 MB | 0% <details> <summary>View detailed bundle breakdown</summary> <div> **Added** No assets were added **Removed** No assets were removed **Bigger** No assets were bigger **Smaller** No assets were smaller **Unchanged** Asset | File Size | % Changed ----- | --------- | --------- index.js | 3.97 MB | 0% models.js | 0 B | 0% </div> </details> --- #### cli **Total** Files count | Total bundle size | % Changed ----------- | ----------------- | --------- 1 | 7.97 MB | 0% <details> <summary>View detailed bundle breakdown</summary> <div> **Added** No assets were added **Removed** No assets were removed **Bigger** No assets were bigger **Smaller** No assets were smaller **Unchanged** Asset | File Size | % Changed ----- | --------- | --------- cli.js | 7.97 MB | 0% </div> </details> --- #### crdt **Total** Files count | Total bundle size | % Changed ----------- | ----------------- | --------- 1 | 11.12 kB | 0% <details> <summary>View detailed bundle breakdown</summary> <div> **Added** No assets were added **Removed** No assets were removed **Bigger** No assets were bigger **Smaller** No assets were smaller **Unchanged** Asset | File Size | % Changed ----- | --------- | --------- index.js | 11.12 kB | 0% </div> </details> </details> <!--- bundlestats-action-comment key:combined end ---> --- <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-06-11 21:04:20 -05:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/actual#122284