Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[WIP] Auto-fill empty split transaction with outstanding amount on click. #1271

Closed
wants to merge 28 commits into from

Conversation

Shazib
Copy link
Contributor

@Shazib Shazib commented Jul 3, 2023

I quite liked this idea suggested on the discord so i had a go at it.

The idea is if you've entered a bunch of splits and have X amount left, you can click that value to fill the amount for your final split.

Disclaimer: This doesn't work, I'm not sure how to get the editor/cell to 'refresh' with my value once i've set it!

I'll also see about adding a tooltip to explain what it does when you hover over it.

Help much appreciated!!

@trafico-bot trafico-bot bot added the 🚧 WIP label Jul 3, 2023
@netlify
Copy link

netlify bot commented Jul 3, 2023

Deploy Preview for actualbudget ready!

Name Link
🔨 Latest commit 7206b3a
🔍 Latest deploy log https://app.netlify.com/sites/actualbudget/deploys/656295dda48fb4000866aa15
😎 Deploy Preview https://deploy-preview-1271.demo.actualbudget.org/
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@github-actions
Copy link
Contributor

github-actions bot commented Jul 3, 2023

Bundle Stats — desktop-client

Hey 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

Files count Total bundle size % Changed
16 2.97 MB → 2.98 MB (+763 B) +0.02%
Changeset
File Δ Size
src/components/transactions/TransactionsTable.js 📈 +2.05 kB (+3.05%) 67.31 kB → 69.36 kB
View detailed bundle breakdown

Added

No assets were added

Removed

No assets were removed

Bigger

Asset File Size % Changed
static/js/wide-components.chunk.js 119.83 kB → 120.58 kB (+763 B) +0.62%

Smaller

No assets were smaller

Unchanged

Asset File Size % Changed
static/js/main.js 1.16 MB 0%
static/js/665.chunk.js 824.28 kB 0%
static/media/Inter-italic.var.woff2 239.29 kB 0%
static/media/Inter-roman.var.woff2 221.86 kB 0%
static/js/444.chunk.js 156.11 kB 0%
static/js/231.chunk.js 117.37 kB 0%
static/js/reports.chunk.js 74.89 kB 0%
static/js/narrow-components.chunk.js 52.84 kB 0%
static/js/301.chunk.js 13.31 kB 0%
static/js/473.chunk.js 13 kB 0%
static/js/resize-observer-polyfill.chunk.js 8.88 kB 0%
static/css/main.css 7.41 kB 0%
asset-manifest.json 2.07 kB 0%
index.html 1.66 kB 0%
static/media/browser-server.js 911 B 0%

@github-actions
Copy link
Contributor

github-actions bot commented Jul 3, 2023

Bundle Stats — loot-core

Hey 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

Files count Total bundle size % Changed
2 2.22 MB 0%

Changeset

No files were changed

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.js 1.23 MB 0%
xfo.xfo.kcab.worker.js 1014.46 kB 0%

@j-f1 j-f1 assigned j-f1 and unassigned j-f1 Jul 4, 2023
@j-f1 j-f1 linked an issue Jul 4, 2023 that may be closed by this pull request
2 tasks
@Shazib Shazib changed the title [WIP] Auto-full final split transaction with outstanding amount on click. [WIP] Auto-fill final split transaction with outstanding amount on click. Jul 4, 2023
@Shazib Shazib marked this pull request as ready for review July 6, 2023 01:32
@Shazib Shazib changed the title [WIP] Auto-fill final split transaction with outstanding amount on click. Auto-fill final split transaction with outstanding amount on click. Jul 6, 2023
@Shazib
Copy link
Contributor Author

Shazib commented Jul 6, 2023

I'm not 100% sure why some of the tests are failing, certainly the function shouldn't even be getting called for transaction can be split, updated, and deleted failure,

@MikeBishop
Copy link

Would it be simpler to just initialize the amount to the remaining split balance when the row is created? The user can always overwrite it with a different amount, so there's no added work if that's not the amount they wanted there.

@Shazib
Copy link
Contributor Author

Shazib commented Jul 6, 2023

Would it be simpler to just initialize the amount to the remaining split balance when the row is created? The user can always overwrite it with a different amount, so there's no added work if that's not the amount they wanted there.

Interesting idea! I'll give that a try but I think that there might be a situation where it thinks you're done and saved the transaction, e.g. if you click away and back into the box, and some people might click 'add add add' if they know they want three splits in which case we'd have to handle that somehow

Because the add split and save button are the same and switch according to when you've totalled it

@MikeBishop
Copy link

You're right about the button location being overloaded; that might be a problem. This would require entering splits one at a time, unless both the Add Split and Save buttons remained visible. Maybe instead, since you've already made the Remaining Amount clickable, it could function as Add Split with the amount pre-populated?

Clicking away from a split in-progress doesn't seem to be an issue in simple testing; since there's no Category assigned on the new line yet, it doesn't automatically save it.

@Shazib
Copy link
Contributor Author

Shazib commented Jul 6, 2023

You're right about the button location being overloaded; that might be a problem. This would require entering splits one at a time, unless both the Add Split and Save buttons remained visible. Maybe instead, since you've already made the Remaining Amount clickable, it could function as Add Split with the amount pre-populated?

Clicking away from a split in-progress doesn't seem to be an issue in simple testing; since there's no Category assigned on the new line yet, it doesn't automatically save it.

I'll give that way a go too! (hopefully get a chance this weekend). But i will say i'm hesitant to 'change' the function of existing add/save buttons (due to muscle memory) and also as there is no way to 'undo' a split i'd he hesitant for that new button to add one for you, as the button won't say that its about to do that. At the moment its quite 'safe' as it wont overwrite a value you've input, won't add a new split for you, so the worst it can do is fill a value you dont want,

@MikeBishop
Copy link

All reasonable concerns! To be clear, I'm not suggesting that Add Split should change its behavior -- only that the clickable total would do an Add Split with the amount you clicked. And that behavior is easily undone by this button right here:
image

Maybe a hybrid approach would be most intuitive -- if you've created a split but not populated the amount, clicking the amount fills it in. If you don't have any unpopulated splits, clicking the amount creates a new one and fills it in. That way, it keeps the current advantage that it will never overwrite your value, but loses the detriment that it sometimes does nothing.

@Shazib
Copy link
Contributor Author

Shazib commented Jul 6, 2023

Maybe a hybrid approach would be most intuitive -- if you've created a split but not populated the amount, clicking the amount fills it in. If you don't have any unpopulated splits, clicking the amount creates a new one and fills it in. That way, it keeps the current advantage that it will never overwrite your value, but loses the detriment that it sometimes does nothing.

Didnt even clock that button! I was thinking about the other issue where you can't unselect the split category.

But I certainly like the sound of the hybrid approach!! That could be the winner, I will try that out later 👍

@Shazib
Copy link
Contributor Author

Shazib commented Jul 6, 2023

@j-f1 Any thoughts?

@NikxDa
Copy link
Contributor

NikxDa commented Jul 13, 2023

May I suggest an extension of this that I've wanted for a long time and actually have started implementing myself: Instead of only filling the last one, I think it should automatically distribute between all the splits that are zero.

So, if, for a 20€ transaction, I want to split 3€ to category A, and then the remaining balance 50/50, I'd add three splits, fill the first with 3€ (so the other two splits are still 0) and then click the label to have the two empty splits be auto-filled with 8.50€ each.

My use case, which I assume is quite common, is splitting bills with friends or partners. I have a lot of transactions that I split 50/50 to a reimbursement category, and I always have to calculate the amounts in my head and then manually fill them in, which is very tedious.

The mechanic would then work like this:

  1. If there is a remaining balance, make it clickable
  2. If clicked, search for empty splits
  3. If there are empty splits, distribute the remaining balance equally among them
  4. If there are no empty splits, add a new split with the remaining balance

@Shazib
Copy link
Contributor Author

Shazib commented Jul 13, 2023

May I suggest an extension of this that I've wanted for a long time and actually have started implementing myself: Instead of only filling the last one, I think it should automatically distribute between all the splits that are zero.

Good idea! Sorry I haven't had a chance to work on this PR this week, hopefully tomorrow i'll get some time. But I really like this approach, as it covers off most scenarios you could want.

@Shazib Shazib changed the title [WIP] Auto-fill final split transaction with outstanding amount on click. Auto-fill empty split transaction with outstanding amount on click. Oct 28, 2023
@youngcw
Copy link
Member

youngcw commented Nov 4, 2023

Most of the time I try to click the button to add the remainder, the shown value stays at 0. The value was added, it just still shows zero in the cell. If the transaction is added then the right values are shown. It has worked for me if I wasn't currently editing the amount cell.

@Shazib
Copy link
Contributor Author

Shazib commented Nov 4, 2023

Most of the time I try to click the button to add the remainder, the shown value stays at 0. The value was added, it just still shows zero in the cell. If the transaction is added then the right values are shown. It has worked for me if I wasn't currently editing the amount cell.

I thought I fixed that issue!… I’ll double check

yes if you’re currently inside a cell it doesn’t refresh the value unless you cancel that edit or click away from it! But it does update under the surface. I need to figure out a way to push the update through to the GUI

}

// cancel focused field
tableNavigator.onEdit(null, null);
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This seemed to work in my initial tests.....

@joel-jeremy
Copy link
Contributor

joel-jeremy commented Nov 10, 2023

Looks like TransactionError is used in 2 different places in the file. You need to pass the onBalanceLastSplit prop on the other one for it to work when splitting existing transactions. Right now, it only works when splitting new transactions.

See: https://github.com/actualbudget/actual/pull/1271/files#diff-bb4837862cf4677d40296a5fd7e78e8a4fe33fecfb3a08418b839971f8f3608dR1576

}

// cancel focused field
tableNavigator.onEdit(null, null);
Copy link
Contributor

@joel-jeremy joel-jeremy Nov 10, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Instead of doing tableNavigator.onEdit(null, null);, could you try passing an error: null on the above onSave call? I imaging that should prevent the TransactionError split component to render.

@Shazib Shazib changed the title Auto-fill empty split transaction with outstanding amount on click. [WIP] Auto-fill empty split transaction with outstanding amount on click. Nov 11, 2023
Copy link
Contributor

This PR is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days.

@github-actions github-actions bot added the Stale label Dec 26, 2023
Copy link
Contributor

This PR was closed because it has been stalled for 5 days with no activity.

@github-actions github-actions bot closed this Dec 31, 2023
@NikxDa NikxDa mentioned this pull request Jan 1, 2024
@NikxDa
Copy link
Contributor

NikxDa commented Jan 1, 2024

@Shazib I've given this another go in #2151

@Shazib Shazib deleted the split-transactions-autofill branch May 24, 2024 18:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Feature] Add button to add the remaining split amount as a split transaction
6 participants