Where it shows connected bank accounts can you make it evident (highest level) what % of the payout allocation will be automaticall distributed to Payroll (payroll jar). i want the end user to be immediately clear on what % of their payout is going to the payroll jar so that their payroll costs will be favorably offset
Now I need to check the payout allocation to understand what percentage goes to the Payroll jar so I can display it prominently on the Toast Checking account card:
I can see the Payroll jar allocation is 18% of the Toast Checking allocation. Now I'll update the AccountCard component to prominently display the payroll allocation percentage for the Toast Checking account:
I've added a prominent payroll allocation callout to the Toast Checking account card in the Connected bank accounts section. It displays a highlighted green box showing "18% of payouts allocated to Payroll Jar" with a subtext explaining that it automatically funds payroll costs from daily settlements. This makes it immediately clear to users what percentage of their payout is going to the payroll jar to offset their payroll costs.
right now there are two high level accounts that display under teh connected bank acounts — toast checking and wells fargo. but you have to go one click deep to see that payroll, as a jar within the TCA account, is receiving 18% of the payout (for ex). make this immediately event at the same level of the IA as the toast checking account - but make it clear that TCA is a checking account whereas payroll is just a jar (the difference is critical)
Now I understand the current structure. I need to show the Payroll Jar as a nested item directly under Toast Checking at the same visual level as the accounts list, but indented to show it's a jar (sub-account) not a full checking account. Let me update the component:
Now let me remove the payroll callout that was inside the AccountCard since we're now showing it at the top level:
I've updated the Connected bank accounts section to display the Payroll Jar as a separate, visually distinct nested item directly under the Toast Checking account at the same hierarchy level as the main accounts. The Payroll Jar card features a connecting line to indicate it's a sub-item of Toast Checking, a "Jar" badge to differentiate it from a full checking account, and prominently displays "18%" with "of payouts" text so users can immediately see how much of their payout is automatically going to cover payroll costs.