From ed0491c5671dd54fffe13f012e79671a7d7acec2 Mon Sep 17 00:00:00 2001
From: Christian <christian@blaahund.dk>
Date: Fri, 19 Dec 2025 13:24:16 +0100
Subject: [PATCH] Add showNotification function for sync alerts

---
 app/settings/frontend/settings.html | 41 +++++++++++++++++++++++++++++
 1 file changed, 41 insertions(+)

diff --git a/app/settings/frontend/settings.html b/app/settings/frontend/settings.html
index 67c8617..fc80ef7 100644
--- a/app/settings/frontend/settings.html
+++ b/app/settings/frontend/settings.html
@@ -1590,6 +1590,47 @@ if (syncNavLink) {
     });
 }
 
+// Notification helper
+function showNotification(message, type = 'info') {
+    // Create toast notification
+    const toastContainer = document.getElementById('toastContainer') || createToastContainer();
+    
+    const toastId = 'toast-' + Date.now();
+    const bgClass = type === 'success' ? 'bg-success' : type === 'error' ? 'bg-danger' : 'bg-info';
+    const icon = type === 'success' ? 'check-circle' : type === 'error' ? 'x-circle' : 'info-circle';
+    
+    const toastHTML = `
+        <div id="${toastId}" class="toast align-items-center text-white ${bgClass} border-0" role="alert" aria-live="assertive" aria-atomic="true">
+            <div class="d-flex">
+                <div class="toast-body">
+                    <i class="bi bi-${icon} me-2"></i>${message}
+                </div>
+                <button type="button" class="btn-close btn-close-white me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
+            </div>
+        </div>
+    `;
+    
+    toastContainer.insertAdjacentHTML('beforeend', toastHTML);
+    
+    const toastElement = document.getElementById(toastId);
+    const toast = new bootstrap.Toast(toastElement, { delay: 3000 });
+    toast.show();
+    
+    // Remove from DOM after hiding
+    toastElement.addEventListener('hidden.bs.toast', () => {
+        toastElement.remove();
+    });
+}
+
+function createToastContainer() {
+    const container = document.createElement('div');
+    container.id = 'toastContainer';
+    container.className = 'toast-container position-fixed top-0 end-0 p-3';
+    container.style.zIndex = '9999';
+    document.body.appendChild(container);
+    return container;
+}
+
 // Load on page ready
 document.addEventListener('DOMContentLoaded', () => {
     loadSettings();