From dc62f87b74095987c5a5c5a8c5b19225708c8c51 Mon Sep 17 00:00:00 2001
From: Pig Fang <g-plane@hotmail.com>
Date: Thu, 6 Feb 2020 09:22:10 +0800
Subject: [PATCH] allow to clear toasts

---
 resources/assets/src/scripts/notify.ts        |  8 ++++++++
 resources/assets/src/scripts/toast.tsx        | 13 +++++++++++--
 resources/assets/tests/scripts/toast.test.tsx | 11 +++++++++++
 3 files changed, 30 insertions(+), 2 deletions(-)

diff --git a/resources/assets/src/scripts/notify.ts b/resources/assets/src/scripts/notify.ts
index f7f3d82f..d7f90f57 100644
--- a/resources/assets/src/scripts/notify.ts
+++ b/resources/assets/src/scripts/notify.ts
@@ -2,6 +2,14 @@ import { showModal } from './modal'
 import { Toast } from './toast'
 
 export const toast = new Toast()
+
+/* istanbul ignore next */
+if (process.env.NODE_ENV === 'test') {
+  afterEach(() => {
+    toast.clear()
+  })
+}
+
 Object.assign(blessing, { notify: { showModal, toast } })
 
 export { showModal } from './modal'
diff --git a/resources/assets/src/scripts/toast.tsx b/resources/assets/src/scripts/toast.tsx
index d32d73f3..6e99084d 100644
--- a/resources/assets/src/scripts/toast.tsx
+++ b/resources/assets/src/scripts/toast.tsx
@@ -8,19 +8,24 @@ type QueueElement = { id: string; type: ToastType; message: string }
 type ToastQueue = QueueElement[]
 
 const TOAST_EVENT = Symbol('toast')
+const CLEAR_EVENT = Symbol('clear')
 
 export const ToastContainer: React.FC = () => {
   const [queue, setQueue] = useState<ToastQueue>([])
 
   useEffect(() => {
-    const off = emitter.on(TOAST_EVENT, (toast: QueueElement) => {
+    const off1 = emitter.on(TOAST_EVENT, (toast: QueueElement) => {
       setQueue(queue => {
         queue.push(toast)
         return queue.slice()
       })
     })
+    const off2 = emitter.on(CLEAR_EVENT, () => setQueue([]))
 
-    return off
+    return () => {
+      off1()
+      off2()
+    }
   }, [])
 
   const handleClose = (id: string) => {
@@ -66,4 +71,8 @@ export class Toast {
   error(message: string) {
     emitter.emit(TOAST_EVENT, { id: nanoid(4), type: 'error', message })
   }
+
+  clear() {
+    emitter.emit(CLEAR_EVENT)
+  }
 }
diff --git a/resources/assets/tests/scripts/toast.test.tsx b/resources/assets/tests/scripts/toast.test.tsx
index 462ec3b7..ea6a16da 100644
--- a/resources/assets/tests/scripts/toast.test.tsx
+++ b/resources/assets/tests/scripts/toast.test.tsx
@@ -26,3 +26,14 @@ test('"Toast" class', () => {
 
   jest.runAllTimers()
 })
+
+test('clear toasts', () => {
+  render(<ToastContainer />)
+  const toast = new Toast()
+
+  toast.success('success')
+  toast.info('info')
+
+  toast.clear()
+  expect(document.querySelectorAll('.alert')).toHaveLength(0)
+})