Notification Preferences
The email and in app switch matrix with the billing row locked on, honestly.
The email and in app switch matrix with the billing row locked on, honestly.
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
Notification Preferences is a client-side matrix: four event rows, Mentions, Approvals, Billing, and Digests, crossed against Email and In-app Switch columns. Defaults are honest and varied rather than all on: the approvals email switch starts off while in-app stays on; the weekly digest ships email on but in-app off. The billing email switch is permanently disabled because the law and common sense both say you should see receipts and failed payments, stated in the save bar so the user understands the constraint rather than debugging a broken toggle. useState drives every live switch with a shared toggle helper that guards against missing keys.
The rows array captures emailLocked separately from the defaults object so the rendering logic stays declarative: locked rows get disabled and a descriptive aria-label rather than hiding the control or removing it.
Reach for this block on the notification settings page, wired to your preferences PATCH endpoint on Save. The billing row lock must stay server-side enforced too, never only UI; treat the disabled state as a signal to the user, not a security boundary.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the personal notification matrix. Other preference panels:
Tip: shipping honest defaults means users trust the matrix; all on defaults train people to ignore it.