Skip to main content

NotificationListRowShell

The <NotificationListRowShell> allows customization of the Notification Center's list view while keeping the built-in Notification context menu features such as "Mark Read" or "Snooze".

Props

PropTypeRequiredDefault valueDescription
notificationINotificationNoThe Notification to be displayed. The <NotificationCenter> and <NotificationToasts> components will pass this value in at run time

<NotificationListRowShell> accepts child components to render.



The <NotificationListRowShell> accepts child components to render. If there are no children, the default Finsemble list row will be rendered.

Usage

import {
NotificationListRowShell,
NotificationListRowPropType
} from "@finsemble/finsemble-core";

export const CustomNotificationCenterRow: React.FunctionComponent<NotificationListRowPropType> = (props) => {
return (
<NotificationListRowShell {...props}>
<div className="list-row__cell">Custom</div>
<div className="list-row__cell">Row</div>
<div className="list-row__cell">{props.notification.title}</div>
{/* The NotificationListRowShell will render the Notification context menu */}
</NotificationListRowShell>
)
}