MagicBell

Identifying Users

Learn how to initialize the notification inbox for a user

To render your MagicBell notification inbox, you need to specify the user for whom you want to display their notifications. You have two options, depending on how you identify users in your app.

By email address

Set the userEmail property:

React
import React from 'react';
import MagicBell, { FloatingNotificationInbox } from '@magicbell/magicbell-react';

export default function Notifications() {
  return (
    <MagicBell apiKey="MAGICBELL_API_KEY" userEmail="mary@example.com">
      {(props) => <FloatingNotificationInbox height={500} {...props} />}
    </MagicBell>
  );
}

By an ID

Set the userExternalId property:

React
import React from 'react';
import MagicBell, { FloatingNotificationInbox } from '@magicbell/magicbell-react';

export default function Notifications() {
  return (
    <MagicBell apiKey="MAGICBELL_API_KEY" userExternalId="u001">
      {(props) => <FloatingNotificationInbox height={500} {...props} />}
    </MagicBell>
  );
}
Important. Please make sure that you use the
external_id
parameter to identify the users when creating the notifications using the API.