From cc5920da12b15093b0bade94c3d99b830fc5a0a9 Mon Sep 17 00:00:00 2001
From: Mel O'Hagan <mel@budibase.com>
Date: Wed, 20 Jul 2022 13:54:45 +0100
Subject: [PATCH] Add notification store timeouts

---
 packages/client/src/stores/notification.js | 40 +++++++++++++---------
 1 file changed, 23 insertions(+), 17 deletions(-)

diff --git a/packages/client/src/stores/notification.js b/packages/client/src/stores/notification.js
index 37a4dcc5d2..00bd30f9f5 100644
--- a/packages/client/src/stores/notification.js
+++ b/packages/client/src/stores/notification.js
@@ -1,16 +1,17 @@
 import { writable, get } from "svelte/store"
-import { generate } from "shortid"
 import { routeStore } from "./routes"
 
 const NOTIFICATION_TIMEOUT = 3000
 
 const createNotificationStore = () => {
-  let timeout
+  const timeoutIds = new Set()
   let block = false
 
   const store = writable([], () => {
     return () => {
-      clearTimeout(timeout)
+      timeoutIds.forEach(timeoutId => {
+        clearTimeout(timeoutId)
+      })
       store.set([])
     }
   })
@@ -38,27 +39,28 @@ const createNotificationStore = () => {
       })
       return
     }
+    const _id = id()
     store.update(state => {
-      return [...state,
-      {
-      id: generate(),
-      type,
-      message,
-      icon,
-      dismissable: !autoDismiss,
-      delay: get(store) != null,
-    }
-  ]})
-    clearTimeout(timeout)
+      return [
+        ...state,
+        {
+          id: _id,
+          type,
+          message,
+          icon,
+          dismissable: !autoDismiss,
+          delay: get(store) != null,
+        }
+      ]})
     if (autoDismiss) {
-      timeout = setTimeout(() => {
-        store.set(null)
+      const timeoutId = setTimeout(() => {
+        dismiss(_id)
       }, NOTIFICATION_TIMEOUT)
+      timeoutIds.add(timeoutId)
     }
   }
 
   const dismiss = id => {
-    clearTimeout(timeout)
     store.update(state => {
       return state.filter(n => n.id !== id)
     })
@@ -76,6 +78,10 @@ const createNotificationStore = () => {
       dismiss,
     },
   }
+
+  function id() {
+    return "_" + Math.random().toString(36).slice(2, 9)
+  }
 }
 
 export const notificationStore = createNotificationStore()