Add alert toasts and optimize alert status handling

Introduced a toast notification system to display new alerts and warnings. Updated the handling of alert status by centralizing it in the auth context and removing redundant API calls from individual pages. Improved styling for better user experience with alert notifications.

frontend/src/pages/DashboardPage.jsx

@@ -4,9 +4,8 @@ import { apiFetch } from "../api";
 import { useAuth } from "../state";
 
 export function DashboardPage() {
-  const { tokens, refresh } = useAuth();
+  const { tokens, refresh, alertStatus } = useAuth();
   const [targets, setTargets] = useState([]);
-  const [alertStatus, setAlertStatus] = useState({ warnings: [], alerts: [], warning_count: 0, alert_count: 0 });
   const [search, setSearch] = useState("");
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState("");
@@ -15,13 +14,9 @@ export function DashboardPage() {
     let active = true;
     (async () => {
       try {
-        const [targetRows, alerts] = await Promise.all([
-          apiFetch("/targets", {}, tokens, refresh),
-          apiFetch("/alerts/status", {}, tokens, refresh),
-        ]);
+        const targetRows = await apiFetch("/targets", {}, tokens, refresh);
         if (active) {
           setTargets(targetRows);
-          setAlertStatus(alerts);
         }
       } catch (e) {
         if (active) setError(String(e.message || e));