search

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

Notifications Appearing as duplicates #56

Closed john-mbone closed 4 years ago

john-mbone commented 4 years ago 
const notification = {
  title,
  message: info,
  type: "default",
  insert: "top",
  container: "top-right",
  animationIn: ["animated", "fadeIn"],
  animationOut: ["animated", "fadeOut"],
  timingFunction: "ease-out",
  dismiss: {
    duration: 3000,
    onScreen: true
  }
};
store.addNotification(notification);
teodosii commented 4 years ago

???

john-mbone commented 4 years ago

I have integrated firebase push in my web app,when a push notification is sent,the notifications appears on nth times the push was send i.e if i send twice then send again,the user will see four notifications with the same message.

john-mbone commented 4 years ago

Earlier this morning i encountered this error too how can i fix? Warning: Encountered two children with the same key, 26gs46g8k. Keys should be unique so that components maintain their identity across updates. Non-unique keys may cause children to be duplicated and/or omitted — the behavior is unsupported and could change in a future version. in div (created by ReactNotificationComponent) in div (created by ReactNotificationComponent) in ReactNotificationComponent (at NavMenu.js:224) in NavMenu (at App.js:122) in App (at src/index.js:36) in Router (created by BrowserRouter) in BrowserRouter (at src/index.js:35) in Provider (at src/index.js:34)

teodosii commented 4 years ago

The duplicate thing is really weird, I don't see any explanation for that why is it happening. The second case where the key is duplicated was reported in the past but I was never able to reproduce it. Id is a Math.random randomisation, I doubt it's generating twice the same result for same timestamp. Will further investigate but atm I have no clues.

john-mbone commented 4 years ago

To reproduce the second error on random ids, send a notification and before the timeout of the first one, send another one.

Works fine when no concurrent notifications.

I managed to fix the duplicates which i guess was being produced by the fact that i was using React.memo on the stateless component.

On 5 Mar 2020 09:48, Rares Mardare notifications@github.com wrote:

The duplicate thing is really weird, I don't see any explanation for that why is it happening. The second case where the key is duplicated was reported in the past but I was never able to reproduce it. Id is a Math.random randomisation, I doubt it's generating twice the same result for same timestamp. Will further investigate but atm I have no clues.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHubhttps://github.com/teodosii/react-notifications-component/issues/56?email_source=notifications&email_token=AFMTXN3DJBMVKBZRRZ2MPY3RF5DKHA5CNFSM4LAOPOY2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEN35UUQ#issuecomment-595057234, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AFMTXNZV6SY3YP2G7EVRCA3RF5DKHANCNFSM4LAOPOYQ.

teodosii commented 4 years ago

I changed the way we were generating the id, I suspect the bug was due to the random function. Fix was done in 2.4.0 and id will point to an increment rather than a random.

Please check and let me know if it's working for you now.

john-mbone commented 4 years ago

I will update tomorrow and revert on the same. On 14 Mar 2020 19:15, Rares Mardare notifications@github.com wrote: I changed the way we were generating the id, I suspect the bug was due to the random function. Fix was done in 2.4.0 and id will point to an increment rather than a random. Please check and let me know if it's working for you now.

—You are receiving this because you authored the thread.Reply to this email directly, view it on GitHub, or unsubscribe.