[WIP] Add progress bars for categories and goals #4371
Conversation
actual-github-bot
bot
changed the title
✅ Deploy Preview for actualbudget ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
Bundle Stats — desktop-clientHey there, this message comes from a GitHub action that helps you and reviewers to understand how these changes affect the size of this project's bundle. As this PR is updated, I'll keep you updated on how the bundle size is impacted. Total
Changeset
View detailed bundle breakdownAdded No assets were added Removed No assets were removed Bigger
Smaller No assets were smaller Unchanged
|
Bundle Stats — loot-coreHey there, this message comes from a GitHub action that helps you and reviewers to understand how these changes affect the size of this project's bundle. As this PR is updated, I'll keep you updated on how the bundle size is impacted. Total
Changeset No files were changed View detailed bundle breakdownAdded No assets were added Removed No assets were removed Bigger No assets were bigger Smaller No assets were smaller Unchanged
|
tbuist
force-pushed
the
tbuist-category-ui-bars
branch
2 times, most recently
from
7647a40 to
70941bd
Compare
tbuist
force-pushed
the
tbuist-category-ui-bars
branch
from
70941bd to
b805cac
Compare
|
Do you have to do something to turn on the progress bars? What will happen when viewing multiple months? |
Yes, I added a global preference in the Themes section. I saw the documentation recommends against adding configuration for small UI tweaks, so I'm happy to hear feedback on if this is big enough to warrant a config option, or if it belongs somewhere else like a feature flag (or on by default, but I didn't want to presume).
The bars only appear in the sidebar that hosts the category titles, and only consider budgetting/spending in first month that is being looked at. Any thoughts about that? Two examples: |
Tick box on the settings page by the theme selector. Multi month looks like this, with the bars calculated for the left most month: Multi-month presents a tricky UI challenge, probably simplest might be to have it only calculated for the current month, and all hidden when the current month isn't on screen. My initial thoughts, were the bars look cramped. Categories without any goal, budgeted, or spent, still have the bar space reserved. Not sure about the mixed use of a bar to represent goal progress and budgeted vs spent as it's budgeting with goals, and usually goals are paired with templates, but the bar doesn't incorporate those because that way lies madness. I can see a category bar will go red because an expense was recorded against it, indicator a 'negative' or bad thing, when really it's fine because the category balance is still positive, and the money for it had been budgeted in a prior month. So a little misleading? Might be worth taking a look at #3424 which attempted to incorporate the multi-month aspects. |
This seems reasonable and intuitive to me.
Currently the color would be empty at least, so the bar still shows but doesn't draw as much attention.
Fair point.
Also a fair point.
Wow, I'm not sure how I missed that entire thread when looking for other attempts at this problem. After skimming, this does seem like a more complex attempt than what I intended mine to be. Thinking more deeply about what I envisioned these bars representing, I think I was targeting only the two most basic use cases:
I think those cover the intended use cases and avoid entirely the complexity of communicating single- and multi-month statuses for a category at the same time, but obviously does so by limiting the amount of information being shown. That might be a philosophical difference, but I will mull on what multi-month support would need to look like. |
|
I think the progress bars really should be per month and not next to the categories, if we are going to add them. Also this currently doesn't have any indication of underfunded categories which will need added too. |
|
I like the idea, but I find it too distracting, not sure if the colors are too intense, or the colors doesn't fit to the overall theme. also, I agree with @youngcw.
|
|
Here's a version that moves the bars out of the category column and also deemphasizes them a little bit by just shrinking the height - thoughts on this? Here's the same height in their original location My thought is that the shorter the horizontal length of the bar, the quicker I'm able to glean what the state of the category is without parsing the actual amounts. *Edit: |
Fixes #2965
This change introduces visual bars to indicate the status of a particular category for that month.
For standard expense categories, green, red, and gray indicate the value you have remaining/overspent in that category.
For categories with a #goal template, the bar uses blue to indicate the progress.