React Preferences Component

By default, Novu will show the subscriber preferences cog icon on the Inbox component.

Users can enable/disable any active channel in the workflow using subscriber preferences or they can update the preference globally for all workflows under the Global Preferences.

Basic Usage

The Preferences component is used to display the subscriber preferences. Use it when you want to render preferences in another part of your application or create a custom layout for the Inbox.

import { Inbox, Preferences } from '@novu/react';
 
function Novu() {
  return (
    <Inbox applicationIdentifier="YOUR_APPLICATION_IDENTIFIER" subscriberId="YOUR_SUBSCRIBER_ID">
      <Preferences />
    </Inbox>
  );
}

Customization Options

Filtering Preferences

Hiding Global Preferences

Global subscriber preferences are shown by default. To hide them, add the following code to your global CSS file:

.nv-workflowContainer:first-child {
  display: none;
}