How to use react-notifications-component - 8 common examples
To help you get started, we’ve selected a few react-notifications-component examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
XinFinOrg / BlockDegree / server / admin-new / src / components / Functionalities / Events / AddPostTemplate.js View on Github 
function showNotification(type, title, message) {
store.addNotification({
title: title,
message: message,
type: type,
insert: "top",
container: "top-right",
animationIn: ["animated", "fadeIn"],
animationOut: ["animated", "fadeOut"],
width: 200,
dismiss: {
duration: 3000,
onScreen: true
}
});
}const addNotification = () => {
store.addNotification({
title: "Just added to your cart 😊",
message: `${product.title} / ${productVariant.title}`,
type: "success",
insert: "top",
container: "bottom-right",
animationIn: ["animated", "fadeIn"],
animationOut: ["animated", "fadeOut"],
dismissable: { click: true },
dismiss: { duration: 4000 }
});
}addNotification: (options: React.ReactNode | NotificationOptions) => {
const transformedOptions = getTransformedOptions(options);
store.addNotification({
container: 'top-right',
animationIn: ['animated', 'fadeIn', 'faster'],
animationOut: ['animated', 'fadeOut', 'faster'],
slidingEnter: enterExitAnimation,
slidingExit: enterExitAnimation,
touchRevert: enterExitAnimation,
touchSlidingExit: {
swipe: enterExitAnimation,
fade: enterExitAnimation,
},
dismiss: {
duration: transformedOptions.duration,
pauseOnHover: true,
waitForAnimation: false,
click: false,
touch: false,function showNotification(type, title, message) {
store.addNotification({
title: title,
message: message,
type: type,
insert: "top",
container: "top-right",
animationIn: ["animated", "fadeIn"],
animationOut: ["animated", "fadeOut"],
width: 200,
dismiss: {
duration: 3000,
onScreen: true
}
});
}function showNotification(type, title, message) {
store.addNotification({
title: title,
message: message,
type: type,
insert: "top",
container: "top-right",
animationIn: ["animated", "fadeIn"],
animationOut: ["animated", "fadeOut"],
width: 200,
dismiss: {
duration: 3000,
onScreen: true
}
});
}function showNotification(type, title, message) {
store.addNotification({
title: title,
message: message,
type: type,
insert: "top",
container: "top-right",
animationIn: ["animated", "fadeIn"],
animationOut: ["animated", "fadeOut"],
width: 200,
dismiss: {
duration: 3000,
onScreen: true
}
});
}onDismiss={() => {
if (onDismiss) {
onDismiss();
}
store.removeNotification(id);
}}
> removeNotification: (id: string | number) => store.removeNotification(id),
};react-notifications-component
React component for creating notifications on the fly
