Novu logoNovu
Back to all updates/

Preference Grouping: Smarter Control, Less Clutter

Preference Grouping: Smarter Control, Less Clutter

Cover
Contributors
  • Emil Pearce

    Emil Pearce

Details

Preference Grouping for the <Inbox /> is now available to all.
You can now organize related workflow preferences under a shared group—available in both the UI and headless SDK. This update makes it easier to manage long lists of preferences by bringing clarity and control to how users interact with notifications.
For example, if you’re sending multiple types of billing notifications (like invoices, receipts, and failed payments), you can now group them under a single “Billing” preference. Users can toggle the entire group in one click, instantly updating all associated workflows.

To get started, use @novu/react version 3.4.0 or later.

Then, define groups using tags and workflow IDs in your configuration. Groups will automatically appear in the <Inbox />, and the same structure is fully supported in headless implementations. Each group follows your existing workflow preference logic.

To learn more, check out the Preference Grouping Docs.

// Example defining preference groups by tags
const preferenceGroupsByTags = [
  {
    name: 'General',
    filter: {
      tags: ['account'],
    },
  },
];

// Example defining preference groups by tags and workflow IDs
const preferenceGroupsByTagsAndIds = [
  {
    name: 'Marketing',
    filter: {
      tags: ['marketing'],
      workflowIds: ['workflow-id'],
    },
  },
];