Notification Settings Inline
Five notification type rows with email, push, and in-app channel switches grouped into Account and Workspace sections.
Five notification type rows with email, push, and in-app channel switches grouped into Account and Workspace sections.
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 Settings Inline is a per-type settings panel with five rows split across two groups, Account and Workspace. Each row carries a label, a one-line description, and three small switches for Email, Push, and In-app channels. Security alerts and billing rows lock the Email switch with a disabled state; the footer names the reason: required by account security policy.
Rows are one const array per group. Locked channels carry an array of channel keys; the toggle handler guards them via disabled on the Switch primitive. That lock is the difference between preferences and compliance.
Reach for this block on the notifications tab of user settings, wired to your preferences endpoint and your channel-locking rules. Disable the locked switches in your backend response, not just the UI.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the per-event channel matrix. Other settings panels:
Tip: locked channels must say why they are locked, a greyed switch with no explanation reads as a bug.