|
| 1 | +--- |
| 2 | +title: 'Schedule' |
| 3 | +description: "Learn how to configure routing and interaction behavior for notifications using routerPush and click handlers." |
| 4 | +icon: 'CalendarCheck' |
| 5 | +--- |
| 6 | + |
| 7 | +The **Schedule** feature in the <Method href="/platform/inbox/overview">{`<Inbox />`}</Method> lets subscribers control when they want to receive notifications. By defining availability hours, subscribers can pause in-app notifications outside their chosen time range. |
| 8 | + |
| 9 | + |
| 10 | + |
| 11 | +<Callout>Notifications from critical workflows are never paused and will always be delivered, regardless of schedule settings.</Callout> |
| 12 | + |
| 13 | +## How Schedule works |
| 14 | + |
| 15 | +The schedule functionality is based on a clear set of rules controlled by the subscriber within the <Method href="/platform/inbox/overview">{`<Inbox />`}</Method>. When a subscriber enables their schedule, they can then manage their availability for each day of the week. |
| 16 | + |
| 17 | +### Daily availability |
| 18 | +For any day that the main schedule is active, there are two possible states: |
| 19 | + |
| 20 | +- **Day is enabled**: If a day is toggled on, the subscriber must set a time range. Notifications will only be delivered within these hours. |
| 21 | + |
| 22 | +- **Day is disabled**: If a day is toggled off, the subscriber will not receive any non-critical notifications for that entire day. |
| 23 | + |
| 24 | +### Automatic timezone handling |
| 25 | + |
| 26 | +The schedule operates in the subscriber's local timezone, detected automatically from their system settings. There is no need for manual configuration. |
| 27 | + |
| 28 | +For example, if a subscriber in Warsaw sets their schedule from 9:00 AM to 5:00 PM, they will receive notifications during those hours in Central European Time (CET). |
| 29 | + |
| 30 | +## Manage Schedule |
| 31 | + |
| 32 | +The schedule UI in the preferences section is designed to be intuitive, giving subscribers several tools to quickly configure their availability. |
| 33 | + |
| 34 | +You can access **Schedule** from the **Preferences** section of the <Method href="/platform/inbox/overview">{`<Inbox />`}</Method> UI. By default, scheduling is turned off, and all notifications are delivered normally. |
| 35 | + |
| 36 | +### Enable the main schedule |
| 37 | + |
| 38 | +The entire feature is controlled by a main schedule toggle. When a subscriber turns this on, they can begin configuring individual days. When it's off, all other settings are inactive, and notifications are delivered normally. |
| 39 | + |
| 40 | +### Setting daily availability |
| 41 | + |
| 42 | +For each day of the week, the subscriber can: |
| 43 | + |
| 44 | +- Use the toggle next to the day's name to activate or deactivate it. |
| 45 | +- If activated, use the time-selector dropdowns to set a "from" and "to" time. The time pickers are set to 30-minute increments for ease of use. |
| 46 | + |
| 47 | +### Edit or remove schedules |
| 48 | + |
| 49 | +Existing availability can be adjusted at any time. Subscribers can: |
| 50 | +- Change the start and end times for a day. |
| 51 | +- Re-enable a previously disabled day. |
| 52 | +- Clear a schedule entirely to return to unrestricted delivery. |
| 53 | + |
| 54 | +### Copying times to multiple days |
| 55 | + |
| 56 | +To make setup faster, subscribers can configure the time for one day and apply it to others in a few clicks: |
| 57 | + |
| 58 | +1. Set the desired time range for a single day (e.g., Wednesday from 9:00 AM to 5:00 PM). |
| 59 | +2. Click the "Copy times to..." button associated with that day. |
| 60 | +3. In the menu that appears, select the other days of the week to apply this schedule to. |
| 61 | +4. Click "Apply." The selected days will automatically be enabled and updated with the new time range. |
| 62 | + |
| 63 | + |
| 64 | + |
| 65 | +### Automatic saving |
| 66 | + |
| 67 | +All changes made in the schedule interface are saved automatically in the background. The UI updates optimistically, providing a seamless experience without requiring the subscriber to click a "Save" button. |
| 68 | + |
| 69 | +## Set default schedule for Subscribers |
| 70 | + |
| 71 | +You can provide a default schedule for your subscribers by passing the `defaultSchedule` prop to the <Method href="/platform/inbox/overview">{`<Inbox />`}</Method>. This is useful for pre-configuring a recommended schedule that your subscribers can then customize. |
| 72 | + |
| 73 | +This default schedule will only be applied if a subscriber has not yet configured their own schedule. Once they make any changes, their custom schedule will take precedence. |
| 74 | + |
| 75 | +```tsx |
| 76 | +import { Inbox } from '@novu/react'; |
| 77 | + |
| 78 | +function InboxWithDefaultSchedule() { |
| 79 | + return ( |
| 80 | + <Inbox |
| 81 | + applicationIdentifier="YOUR_APP_IDENTIFIER" |
| 82 | + subscriberId="YOUR_SUBSCRIBER_ID" |
| 83 | + defaultSchedule={{ |
| 84 | + isEnabled: true, |
| 85 | + weeklySchedule: { |
| 86 | + tuesday: { |
| 87 | + isEnabled: true, |
| 88 | + hours: [{start: '09:00 AM', end: '07:00 PM'}] |
| 89 | + } |
| 90 | + } |
| 91 | + }} |
| 92 | + /> |
| 93 | + ); |
| 94 | +} |
| 95 | + |
| 96 | +export default InboxWithDefaultSchedule; |
| 97 | +``` |
0 commit comments