[Feature] Progress bar for targets/templates #1187

Closed
opened 2026-02-28 19:35:21 -06:00 by GiteaMirror · 10 comments
Owner

Originally created by @jacmei on GitHub (Jul 2, 2024).

Verified feature request does not already exist?

  • I have searched and found no existing issue

💻

  • Would you like to implement this feature?

Pitch: what problem are you trying to solve?

Like how YNAB would display a visual indicator for how far along you are until meeting your target, I would love Actual Budget to implement a similar feature.

image

Describe your ideal solution to this problem

I understand that templates are in the works right now so this should be tackled afterwards. It should be displayed right under each category.

Teaching and learning

No response

Originally created by @jacmei on GitHub (Jul 2, 2024). ### Verified feature request does not already exist? - [X] I have searched and found no existing issue ### 💻 - [ ] Would you like to implement this feature? ### Pitch: what problem are you trying to solve? Like how YNAB would display a visual indicator for how far along you are until meeting your target, I would love Actual Budget to implement a similar feature. ![image](https://github.com/actualbudget/actual/assets/39633460/cc384004-dda6-4192-a40c-3f65ff8db963) ### Describe your ideal solution to this problem I understand that templates are in the works right now so this should be tackled afterwards. It should be displayed right under each category. ### Teaching and learning _No response_
GiteaMirror added the goal templatesneeds votesfeature labels 2026-02-28 19:35:21 -06:00
Author
Owner

@github-actions[bot] commented on GitHub (Jul 2, 2024):

Thanks for sharing your idea!

This repository uses lodash style issue management for enhancements. That means enhancement issues are automatically closed. This doesn’t mean we don’t accept feature requests, though! We will consider implementing ones that receive many upvotes, and we welcome contributions for any feature requests marked as needing votes (just post a comment first so we can help you make a successful contribution).

The enhancement backlog can be found here: https://github.com/actualbudget/actual/issues?q=label%3A%22needs+votes%22+sort%3Areactions-%2B1-desc+

Don’t forget to upvote the top comment with 👍!

@github-actions[bot] commented on GitHub (Jul 2, 2024): :sparkles: Thanks for sharing your idea! :sparkles: This repository uses lodash style issue management for enhancements. That means enhancement issues are automatically closed. This doesn’t mean we don’t accept feature requests, though! We will consider implementing ones that receive many upvotes, and we welcome contributions for any feature requests marked as needing votes (just post a comment first so we can help you make a successful contribution). The enhancement backlog can be found here: https://github.com/actualbudget/actual/issues?q=label%3A%22needs+votes%22+sort%3Areactions-%2B1-desc+ Don’t forget to upvote the top comment with 👍! <!-- feature-auto-close-comment -->
Author
Owner

@wdpk commented on GitHub (Jul 10, 2024):

I hae a userscript proof-of-concept which does this. It seemingly works, but if this is in alignment with the project design, I can work on refactoring into typescript for a possible merge to main.

I don't use the report budget myself so I only have a month of test data.

app actualbudget org_budget (1)
image
image
https://gist.github.com/wdpk/50468c646ded67dfd6eb49775b89b935

@wdpk commented on GitHub (Jul 10, 2024): I hae a userscript proof-of-concept which does this. It seemingly works, but if this is in alignment with the project design, I can work on refactoring into typescript for a possible merge to main. I don't use the report budget myself so I only have a month of test data. ![app actualbudget org_budget (1)](https://github.com/actualbudget/actual/assets/20182595/42db173f-8b5b-499e-9dfe-67e64a174a32) ![image](https://github.com/actualbudget/actual/assets/20182595/59c2e51b-db8b-414a-b17a-814ee6b014fe) ![image](https://github.com/actualbudget/actual/assets/20182595/2e762dee-6b56-4a8b-a1fd-ccd38b307bfd) https://gist.github.com/wdpk/50468c646ded67dfd6eb49775b89b935
Author
Owner

@ebkalderon commented on GitHub (Feb 10, 2025):

Sorry to necro this old ticket, but was this feature actually implemented and completed, as per the issue's current status? I can't see any way to enable this in the demo.actualbudget.org instance.

@ebkalderon commented on GitHub (Feb 10, 2025): Sorry to necro this old ticket, but was this feature actually implemented and completed, as per the issue's current status? I can't see any way to enable this in the [demo.actualbudget.org](https://demo.actualbudget.org/) instance.
Author
Owner

@youngcw commented on GitHub (Feb 10, 2025):

Sorry to necro this old ticket, but was this feature actually implemented and completed, as per the issue's current status? I can't see any way to enable this in the demo.actualbudget.org instance.

This feature request is still open. Progress bars have not been implemented

@youngcw commented on GitHub (Feb 10, 2025): > Sorry to necro this old ticket, but was this feature actually implemented and completed, as per the issue's current status? I can't see any way to enable this in the [demo.actualbudget.org](https://demo.actualbudget.org/) instance. This feature request is still open. Progress bars have not been implemented
Author
Owner

@ebkalderon commented on GitHub (Feb 10, 2025):

Thanks for the clarification! Apologies again for necro-ing the thread. I wish I was more confident in my JS/TS skills, or I would contribute directly myself.

@ebkalderon commented on GitHub (Feb 10, 2025): Thanks for the clarification! Apologies again for necro-ing the thread. I wish I was more confident in my JS/TS skills, or I would contribute directly myself.
Author
Owner

@tbuist commented on GitHub (Feb 13, 2025):

I've completed a prototype to show progress bars for categories and templates/goals. I will try to open a PR for this.

Image

@tbuist commented on GitHub (Feb 13, 2025): I've completed a prototype to show progress bars for categories and templates/goals. I will try to open a PR for this. ![Image](https://github.com/user-attachments/assets/f42359f8-bebb-4098-b343-4b4ef7226615)
Author
Owner

@tostasmistas commented on GitHub (Feb 13, 2025):

@tbuist - Similar to what YNAB has, do you think it's possible to have the progress bars be optional? I for instance, sometimes liked to have them turned off to be easier to glance at what categories I have and how they are organized.

Image

@tostasmistas commented on GitHub (Feb 13, 2025): @tbuist - Similar to what YNAB has, do you think it's possible to have the progress bars be optional? I for instance, sometimes liked to have them turned off to be easier to glance at what categories I have and how they are organized. <kbd><img width="577" alt="Image" src="https://github.com/user-attachments/assets/186cc18e-3d29-4bcd-9df0-052cc12bb187" /></kbd>
Author
Owner

@tbuist commented on GitHub (Feb 16, 2025):

Good idea, I've added a configuration option to the Settings->Theme section.

Image

@tbuist commented on GitHub (Feb 16, 2025): Good idea, I've added a configuration option to the Settings->Theme section. ![Image](https://github.com/user-attachments/assets/2af87019-6580-4b98-bb13-04b939c0e57a)
Author
Owner

@ohnefrust commented on GitHub (Feb 18, 2026):

Hey guys - I'm new to this so excuse me if I'm missing any important points while contributiing. I've vibe coded a simple solution but not for targets yet as they are not available in the UI:

Image

Maybe this could be a simple solution to start this whole progress bar topic? I decided to go with a very simple approach: The bar simple compares spent to budgeted. There are the following options:

  1. If there's a budgeted amount (or none at all) and nothing spent, then there's no bar.
  2. If there's a budgeted amount and spendings are below or equal to the budgeted amount, the bar is green and represents the percentage spent from left to right
  3. If the spent amount is larger than what's budgeted, the bar turns red and any overspent amount is represented in a darker red, relative to the amount that was budgeted.
  4. The bars can be toggled on or off in the top right corner. On top of that, it can be toggled on / off in experimental features.

As soon as targets are available in the UI, I think the feature could be adjusted to represent the more complex logic similar to YNAB.

Coming from YNAB, the visual bar is one of the features I miss the most, that's why I decided to give it a try with Claude Code ;)

@ohnefrust commented on GitHub (Feb 18, 2026): Hey guys - I'm new to this so excuse me if I'm missing any important points while contributiing. I've vibe coded a simple solution but not for targets yet as they are not available in the UI: <img width="1514" height="1000" alt="Image" src="https://github.com/user-attachments/assets/859a5d7a-138b-447d-8a0a-c2ec35aa150d" /> Maybe this could be a simple solution to start this whole progress bar topic? I decided to go with a very simple approach: The bar simple compares spent to budgeted. There are the following options: 1. If there's a budgeted amount (or none at all) and nothing spent, then there's no bar. 2. If there's a budgeted amount and spendings are below or equal to the budgeted amount, the bar is green and represents the percentage spent from left to right 3. If the spent amount is larger than what's budgeted, the bar turns red and any overspent amount is represented in a darker red, relative to the amount that was budgeted. 4. The bars can be toggled on or off in the top right corner. On top of that, it can be toggled on / off in experimental features. As soon as targets are available in the UI, I think the feature could be adjusted to represent the more complex logic similar to YNAB. Coming from YNAB, the visual bar is one of the features I miss the most, that's why I decided to give it a try with Claude Code ;)
Author
Owner

@ohnefrust commented on GitHub (Feb 22, 2026):

I went one step further and combined it with a simple UI for templates:

Image
@ohnefrust commented on GitHub (Feb 22, 2026): I went one step further and combined it with a simple UI for templates: <img width="779" height="958" alt="Image" src="https://github.com/user-attachments/assets/43d194c2-2c29-42e7-a759-830afbe728bf" />
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/actual#1187