teodosii / react-notifications-component

Delightful and highly customisable React Component to notify your users
https://teodosii.github.io/react-notifications-component/
MIT License
1.27k stars 73 forks source link

Replace content if a notification with the same ID exists #90

Closed sradevski closed 2 years ago

sradevski commented 3 years ago

This is related to https://github.com/teodosii/react-notifications-component/issues/40, but I'd like to restart the discussion, cause simply removing the notification doesn't quite work (without doing some timing calculations).

The reason removing the old notification doesn't work is, the actual DOM node isn't removed until the animation finishes, so you would have to remove the old notification, wait for the animation to finish, and only then add a new notification. Since there is no method exposed to check if a notification exists or not (you could do a direct DOM access on the ID, but it's not a very clean solution), you'd have to wait for the animation duration regardless of whether a notification with the passed ID exists or not. Also, having the content replaced is cleaner UX-wise, cause you keep the context inside the same notification container (so you don't get the exit and enter animations, maybe have some animation inside the notification container itself).

What I suggest doing is, either implicitly replace the content when you do addNotification with an ID that already exists, or add a new replaceNotification(id, options) method. I personally prefer the former one, but it doesn't matter as much for me.