Changelog

Latest updates and improvements in the @novu/react category.

Follow us on X

All changelog posts

  • <Inbox /> Updates - v3.10.1

    There are three major workflow management upgrades: custom sorting for workflow preferences, complete subscriber schedule control through the Inbox component, dashboard, and React hooks, and permanent notification deletion beyond just archiving.

    Cover
    Note

    Requires <Inbox /> version 3.10.1 or higher

    Custom Workflow Priority Display

    Organize workflow preferences exactly how your users need them. The preferencesSort prop lets you customize the order of workflows in the subscriber preferences list by accepting a custom comparison function similar to JavaScript's Array.sort() method.

    This enables you to highlight essential workflows at the top, sort alphabetically, prioritize by tags, or implement any custom sorting logic your application requires.

    Sorting Preferences

    You can also use preferencesSort it together with preferenceGroups to apply sorting within each group, giving you complete control over both organization and order.

    Learn more about configuring preference sorting in the documentation.

    Subscriber Schedule Management

    The notification scheduling system allows subscribers to choose when they get messages. They can set specific days and times, plus multiple time windows based on their time zone.

    Users can configure weekly schedules and replicate settings across days. Messages are blocked outside these hours. However, critical notifications, like security alerts, will still be delivered right away. In-app notifications are always on.

    The system has management tools through an API, SDK, and Dashboard. It also logs activities and includes a React SDK for custom interfaces.

    Dashboard Schedule Editor

    Update subscriber schedules directly from the preferences tab with instant visual feedback.

    Availability management from the dashboard

    Default Schedule Setup

    Configure default notification schedules that automatically apply to new subscribers, with individual customization available as needed.

    Users' availability schedule

    useSchedule Hook

    A New React hook provides programmatic schedule control with built-in appearance customization and localization support for custom interfaces.

    Learn more

    Appearance Customization

    Learn more about dedicated appearance props for schedule-related elements.

    Permanent Notification Deletion

    Unlike archiving, which retains notifications in storage, permanent deletion removes them completely for cleaner notification management and better privacy compliance.

    Notification deletion
    Note

    Deletion is irreversible—deleted notifications cannot be recovered.

  • <Inbox /> Updates - v3.9.1

    Apply custom styling using appearance key callbacks based on your app data - bell icons change color by severity levels, customize notification appearance with payload data, and show/hide preferences by user role.

    Author:Paweł Tymczuk
    Paweł Tymczuk
    Cover

    Dynamic Inbox Styling with Appearance key Callbacks

    Previously you could only apply static strings to the appearance keys of the inbox, now for selected keys dynamic styling can be applied based on the key context. For example: notification count, notification data, etc...

    Learn more

    Introducing notification severity

    Notification severity is now represented on the Inbox styles, the bell icon will change color and the notification item will be highlighted with the given color.

    If you have unread messages with medium severity, the bell shows orange. Add messages with high severity, and it switches to red; otherwise, it remains gray.

    Learn More

    Enhanced Inbox Features

    New render props

    New render props are introduced for renderAvatar and renderDefualtActions so you can now render custom react elements without re-creating the whole Notification Item.

    Learn more