From 126f815a44330711bc30b6bdc54d820f6f11b4c5 Mon Sep 17 00:00:00 2001
From: Knut Ahlers <knut@ahlers.me>
Date: Fri, 14 Jun 2024 11:43:51 +0200
Subject: [PATCH] Simplify toast code

Signed-off-by: Knut Ahlers <knut@ahlers.me>
---
 src/components/_toast.vue   |  6 +++---
 src/components/_toaster.vue |  2 +-
 src/helpers/toasts.ts       | 40 +++++++++++++++++++++++++++++++++++++
 src/main.ts                 |  8 ++------
 4 files changed, 46 insertions(+), 10 deletions(-)
 create mode 100644 src/helpers/toasts.ts

diff --git a/src/components/_toast.vue b/src/components/_toast.vue
index aa54b38..891fb23 100644
--- a/src/components/_toast.vue
+++ b/src/components/_toast.vue
@@ -27,9 +27,9 @@ import { Toast } from 'bootstrap'
 
 export type ToastContent = {
   id: string
-  autoHide: boolean | undefined
-  color: string | undefined
-  delay: number | undefined
+  autoHide?: boolean
+  color?: string
+  delay?: number
   text: string
 }
 
diff --git a/src/components/_toaster.vue b/src/components/_toaster.vue
index dcffe1c..1fbc2d1 100644
--- a/src/components/_toaster.vue
+++ b/src/components/_toaster.vue
@@ -32,7 +32,7 @@ export default defineComponent({
   mounted() {
     this.bus.on(BusEventTypes.Toast, (toast: ToastContent) => this.toasts.push({
       ...toast,
-      id: crypto.randomUUID(),
+      id: toast.id || crypto.randomUUID(),
     }))
   },
 
diff --git a/src/helpers/toasts.ts b/src/helpers/toasts.ts
new file mode 100644
index 0000000..417cd02
--- /dev/null
+++ b/src/helpers/toasts.ts
@@ -0,0 +1,40 @@
+import { ToastContent } from '../components/_toast.vue'
+
+/**
+ * Create the content of an error-toast
+ *
+ * @param text The message to display to the user
+ * @returns The {ToastContent} for usage in `this.bus.emit(BusEventTypes.Toast, errorToast(...))`
+ */
+const errorToast = (text: string): ToastContent => ({
+  autoHide: false,
+  color: 'danger',
+  id: crypto.randomUUID(),
+  text,
+})
+
+/**
+ * Create the content of an info-toast
+ *
+ * @param text The message to display to the user
+ * @returns The {ToastContent} for usage in `this.bus.emit(BusEventTypes.Toast, infoToast(...))`
+ */
+const infoToast = (text: string): ToastContent => ({
+  color: 'info',
+  id: crypto.randomUUID(),
+  text,
+})
+
+/**
+ * Create the content of an success-toast
+ *
+ * @param text The message to display to the user
+ * @returns The {ToastContent} for usage in `this.bus.emit(BusEventTypes.Toast, successToast(...))`
+ */
+const successToast = (text: string): ToastContent => ({
+  color: 'success',
+  id: crypto.randomUUID(),
+  text,
+})
+
+export { errorToast, infoToast, successToast }
diff --git a/src/main.ts b/src/main.ts
index ced9c87..8caeed9 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -10,7 +10,7 @@ import mitt from 'mitt'
 
 import BusEventTypes from './helpers/busevents'
 import ConfigNotifyListener from './helpers/configNotify'
-import { ToastContent } from './components/_toast.vue'
+import { errorToast } from './helpers/toasts'
 
 import router from './router'
 import App from './components/app.vue'
@@ -159,11 +159,7 @@ const app = createApp({
             }
 
             this.bus.emit(BusEventTypes.LoginProcessing, false)
-            this.bus.emit(BusEventTypes.Toast, {
-              autoHide: false,
-              color: 'danger',
-              text: errorText,
-            } as ToastContent)
+            this.bus.emit(BusEventTypes.Toast, errorToast(errorText))
             throw new Error(`login failed, status=${resp.status}`)
           }