In-App Channel Step

The inApp step allows you to send a message to your user’s <Inbox /> for your web or a mobile app.

Inbox

await step.inApp('inbox', async () => {
  return {
    subject: 'Welcome to Acme!',
    body: 'We are excited to have you on board.',
    avatar: 'https://acme.com/avatar.png',
    redirect: {
      url: 'https://acme.com/welcome',
      target: '_blank',
    },
    primaryAction: {
      label: 'Get Started',
      redirect: {
        url: 'https://acme.com/get-started',
        target: '_self',
      }
    },
    secondaryAction: {
      label: 'Learn More',
        redirect: {
        url: 'https://acme.com/learn-more',
        target: '_self',
      }
    },
    data: {
      customData: 'customValue',
      text: payload.text,
    },
  };
});

Inbox

const {
  seen,
  read,
  lastSeenDate,
  lastReadDate,
} = await step.inApp('inbox', resolver);

In-App Step Output

body · string · required

The body of the inbox notification. The main content of the notification.

subject · string

The subject of the inbox notification. This property communicates the subject of the notification to the user.

avatar · string

The avatar shown in the inbox notification. When specified, overrides the avatar of the actor initiating the notification.

redirect · object

The redirect object is used to define the URL to visit when interacting with the notification. This property can be omitted in place of an onNotificationClick handler implemented in the <Inbox /> component.

Hide properties

url · string · required

The URL to visit when clicking on the notification.

target · string

The target attribute specifies where the new window or tab will be opened. This property is optional and defaults to _blank. The supported values are: _self, _blank, _parent, _top, _unfencedTop.

primaryAction · object

Define a primary action to be shown in the inbox notification. The primary action will appear with an accent color.

Hide properties

label · string · required

The label of the action.

redirect · object

The redirect object is used to define the URL to visit when interacting with the notification action buttons. This property can be omitted in place of an onPrimaryActionClick handler implemented in the <Inbox /> component.

Show properties

url · string · required

The URL to visit when clicking on the notification action button.

target · string

The target attribute specifies where the new window or tab will be opened. This property is optional and defaults to _blank. The supported values are: _self, _blank, _parent, _top, _unfencedTop.

secondaryAction · object

Define a secondary action to be shown in the inbox notification. The secondary action will appear with a muted color.

Hide properties

label · string · required

The label of the action.

redirect · object

The redirect object is used to define the URL to visit when interacting with the notification action buttons. This property can be omitted in place of an onSecondaryActionClick handler implemented in the <Inbox /> component.

Show properties

url · string · required

The URL to visit when clicking on the notification action button.

target · string

The target attribute specifies where the new window or tab will be opened. This property is optional and defaults to _blank. The supported values are: _self, _blank, _parent, _top, _unfencedTop.

data · object

Custom data to be sent with the notification. This data can be used to customize the notification item rendered in the <Inbox />.

In-App Step Result

seen · boolean · required

A flag indicating if the notification has been seen. This property is useful when conditionally delivering notifications in subsequent steps via the skip function. A notification is marked as seen when the user views the notification.

read · boolean · required

A flag indicating if the notification has been read. A notification is marked as read when the user confirms the notification.

lastSeenDate · date | null · required

The date the notification was last seen. This corresponds to the date the seen property was set to true, or null if the notification has not been seen.

lastReadDate · date | null · required

The date the notification was last read. This corresponds to the date the read property was set to true, or null if the notification has not been read.