Skip to content

Latest commit

 

History

History
101 lines (81 loc) · 3.08 KB

notifications.md

File metadata and controls

101 lines (81 loc) · 3.08 KB
description sidebar_position
Notify users directly in MetaMask, or natively in their OS.
10

Notifications

You can display notifications directly in MetaMask or natively in a user's operating system (OS) using the snap_notify API method.

Steps

1. Request permission to notify users

Request the snap_notify permission. Add the following to your Snap's manifest file:

"initialPermissions": {
  "snap_notify": {}
}

2. Create a notification

Create a notification by calling snap_notify, which takes a notification type and message. Specify type: "inApp" to display the notification in the MetaMask UI, or type: "native" to display the notification in the user's OS.

:::note We recommend using type: "inApp" because there's no guarantee that native notifications are displayed to the user. You can also call snap_notify twice, with each notification type, to trigger both an in-app and native notification. :::

The following example displays a notification in MetaMask, with the message "Hello, world!":

await snap.request({
  method: "snap_notify",
  params: {
    type: "inApp",
    message: "Hello, world!",
  },
})
Notification alert
Notification message

:::info Notification rate limits Each Snap can trigger up to:

  • Five in-app notifications per minute.
  • Two native notifications per five minutes. :::

Expanded view

In-app notifications can include an optional expanded view that displays when selected. The expanded view includes a title, custom UI content, and an optional footer link.

The following example displays a notification in MetaMask, with the message "Hello, world!" When the user selects the notification, the expanded view displays a page with a title, a paragraph, and a link to the MetaMask Snaps directory:

await snap.request({
  method: "snap_notify",
  params: {
    type: "inApp",
    message: "Hello, world!",
    title: "Hello",
    content: ( 
      <Box>
        <Text>Did you know you can find more Snaps in the MetaMask Snaps Directory?</Text>
      </Box>
    ),
    footerLink: {
      text: "Visit the directory",
      href: "https://snaps.metamask.io"
    }
  },
})

Example

See the @metamask/notifications-example-snap package for a full example of implementing notifications using snap_notify. This example exposes a custom JSON-RPC API for dapps to display in-app and native notifications.