Add-ons Panel
An add-ons panel with active add-on rows and toggles, available add-ons to enable, and a subtotal for the next invoice.
An add-ons panel with active add-on rows and toggles, available add-ons to enable, and a subtotal for the next invoice.
Search blocks by description or jump to a page.
The source for every Application block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Add-ons Panel is the plan extras manager for the Acme workspace, splitting add-ons into two sections. Active add-ons (extra storage at $20, SAML SSO at $40) sit as ruled rows with a since date, a per month price, and an on Switch. Available add-ons (audit log export at $25, priority support at $60) sit below with an Enable button each. A subtotal bar states the $60.00 add-ons total on the next invoice, billed alongside the $96 Team plan as separate line items, and the footer explains the proration rules for turning an add-on on or off.
Both groups are typed const arrays; the active set carries a since field and a defaultChecked Switch, the available set a price and enable action. The proration footer is what keeps the mid cycle math from generating a support ticket.
Reach for this block on the billing or plan settings page, wired to your add-ons catalog and the account's active entitlements. Recompute the subtotal on every toggle and show only the add-ons that apply to the current plan.
A natural flow around it on an Application Pro page:
Before
After
One strong use is per month plan add-ons. Other extension surfaces:
Tip: show proration in plain terms; the moment a toggle changes the invoice, users want to know when and by how much.