Add navigation and smooth scrolling for alert toasts

This update enables opening specific alerts via toast buttons, utilizing `useNavigate` to redirect and auto-expand the corresponding alert on the Alerts page. Includes enhancements for toast dismissal with animations and adds new styles for smooth transitions and better user interaction.

frontend/src/state.jsx

@@ -95,7 +95,10 @@ export function AuthProvider({ children }) {
   };
 
   const dismissAlertToast = (toastId) => {
-    setAlertToasts((prev) => prev.filter((t) => t.id !== toastId));
+    setAlertToasts((prev) => prev.map((t) => (t.id === toastId ? { ...t, closing: true } : t)));
+    setTimeout(() => {
+      setAlertToasts((prev) => prev.filter((t) => t.id !== toastId));
+    }, 220);
   };
 
   useEffect(() => {
@@ -114,10 +117,12 @@ export function AuthProvider({ children }) {
       const createdAt = Date.now();
       const nextToasts = items.slice(0, 4).map((item, idx) => ({
         id: `${createdAt}-${idx}-${item.alert_key}`,
+        alertKey: item.alert_key,
         severity: item.severity,
         title: item.name,
         target: item.target_name,
         message: item.message,
+        closing: false,
       }));
       setAlertToasts((prev) => [...nextToasts, ...prev].slice(0, 6));
       for (const toast of nextToasts) {