From ac33f1c0dd375a3a856f7d333200f6587d96bc66 Mon Sep 17 00:00:00 2001
From: mkelvers <mikkelelvers@outlook.com>
Date: Tue, 16 Jun 2026 11:05:16 +0200
Subject: [PATCH] refactor: move toast container to base template

---
 static/toast.ts       | 18 +++---------------
 templates/base.gohtml |  1 +
 2 files changed, 4 insertions(+), 15 deletions(-)

diff --git a/static/toast.ts b/static/toast.ts
index e4c9173..074d502 100644
--- a/static/toast.ts
+++ b/static/toast.ts
@@ -5,20 +5,8 @@ interface ToastOptions {
   duration?: number;
 }
 
-/** Lazily create and return the toast container element. */
-const toastContainer = (): HTMLElement => {
-  let container = document.getElementById("toast-container");
-  if (!container) {
-    container = document.createElement("div");
-    container.id = "toast-container";
-    container.className = "fixed bottom-4 right-4 z-100 flex flex-col gap-2";
-    container.setAttribute("role", "status");
-    container.setAttribute("aria-live", "polite");
-    container.setAttribute("aria-relevant", "additions");
-    document.body.appendChild(container);
-  }
-  return container;
-};
+/** Return the toast container element. */
+const toastContainer = (): HTMLElement | null => document.getElementById("toast-container");
 
 /**
  * Show a toast notification with optional auto-dismiss.
@@ -28,7 +16,7 @@ const showToast = ({ message, duration = 3000 }: ToastOptions): void => {
   const container = toastContainer();
   const template = document.getElementById("toast-template") as HTMLTemplateElement | null;
 
-  if (!template) {
+  if (!container || !template) {
     return;
   }
 
diff --git a/templates/base.gohtml b/templates/base.gohtml
index bea0dc0..4911671 100644
--- a/templates/base.gohtml
+++ b/templates/base.gohtml
@@ -64,5 +64,6 @@
       </main>
     {{end}}
   </div>
+  <div id="toast-container" class="fixed bottom-4 right-4 z-100 flex flex-col gap-2" role="status" aria-live="polite" aria-relevant="additions"></div>
 </body>
 </html>