From 88b2dddba0c4782c894421e40cebdd1af4465cda Mon Sep 17 00:00:00 2001
From: spinline <bilal.karatatr.@gmail.com>
Date: Thu, 5 Feb 2026 21:26:28 +0300
Subject: [PATCH] fix(toast): use proper DaisyUI alert structure with SVG icons

---
 frontend/src/components/toast.rs | 44 +++++++++++++++++++++-----------
 1 file changed, 29 insertions(+), 15 deletions(-)

diff --git a/frontend/src/components/toast.rs b/frontend/src/components/toast.rs
index d0543cd..dd79064 100644
--- a/frontend/src/components/toast.rs
+++ b/frontend/src/components/toast.rs
@@ -8,10 +8,10 @@ use shared::NotificationLevel;
 /// Returns the DaisyUI alert class for the notification level
 fn get_alert_class(level: &NotificationLevel) -> &'static str {
     match level {
-        NotificationLevel::Info => "alert-info",
-        NotificationLevel::Success => "alert-success",
-        NotificationLevel::Warning => "alert-warning",
-        NotificationLevel::Error => "alert-error",
+        NotificationLevel::Info => "alert alert-info",
+        NotificationLevel::Success => "alert alert-success",
+        NotificationLevel::Warning => "alert alert-warning",
+        NotificationLevel::Error => "alert alert-error",
     }
 }
 
@@ -23,20 +23,34 @@ fn ToastItem(
 ) -> impl IntoView {
     let alert_class = get_alert_class(&level);
     
-    let icon = match level {
-        NotificationLevel::Info => "ℹ️",
-        NotificationLevel::Success => "✓",
-        NotificationLevel::Warning => "⚠️",
-        NotificationLevel::Error => "✕",
+    // DaisyUI SVG icons
+    let icon_svg = match level {
+        NotificationLevel::Info => view! {
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="stroke-current shrink-0 w-6 h-6">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+            </svg>
+        }.into_view(),
+        NotificationLevel::Success => view! {
+            <svg xmlns="http://www.w3.org/2000/svg" class="stroke-current shrink-0 h-6 w-6" fill="none" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+            </svg>
+        }.into_view(),
+        NotificationLevel::Warning => view! {
+            <svg xmlns="http://www.w3.org/2000/svg" class="stroke-current shrink-0 h-6 w-6" fill="none" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"></path>
+            </svg>
+        }.into_view(),
+        NotificationLevel::Error => view! {
+            <svg xmlns="http://www.w3.org/2000/svg" class="stroke-current shrink-0 h-6 w-6" fill="none" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+            </svg>
+        }.into_view(),
     };
     
     view! {
-        <div 
-            class={format!("alert {} shadow-xl", alert_class)}
-            style="min-width: 200px; max-width: calc(100vw - 40px); padding: 12px 16px;"
-        >
-            <span style="font-size: 18px;">{icon}</span>
-            <span style="font-size: 14px; font-weight: 500;">{message}</span>
+        <div class=alert_class>
+            {icon_svg}
+            <span>{message}</span>
         </div>
     }
 }