UNPKG

@magicbell/magicbell-react

Version:

React components for building a notification inbox for your app

29 lines (28 loc) 1.22 kB
import { INotification } from '@magicbell/react-headless'; import React, { ComponentProps, Dispatch, SetStateAction } from 'react'; import { NotificationListItem } from '../NotificationList/NotificationList.js'; import Layout from './Layout.js'; import { NotificationsViewProps } from './private/NotificationsView.js'; export type NotificationInboxProps = { height?: number; onAllRead?: () => void; onNotificationClick?: (notification: INotification) => void | boolean; storeId?: string; EmptyInboxPlaceholder?: () => React.ReactElement; NotificationItem?: NotificationListItem; NotificationPreferences?: () => React.ReactElement; notificationPreferencesEnabled?: boolean; layout?: ComponentProps<typeof Layout>['order']; tabs?: NotificationsViewProps['tabs']; }; export type SetViewHandler = Dispatch<SetStateAction<'inbox' | 'preferences'>>; /** * Component that renders all notifications as well as a header and a footer. * * @example * <NotificationInbox * storeId="unread" * onNotificationClick={openTicket} * onAllRead={showAlert} /> */ export default function NotificationInbox({ height, layout, tabs, ...props }: NotificationInboxProps): React.JSX.Element;