feat: hourly CVE alerting with notification bell and API (#53)

compliance-dashboard/src/components/app_shell.rs

@@ -2,6 +2,7 @@ use dioxus::prelude::*;
 
 use crate::app::Route;
 use crate::components::help_chat::HelpChat;
+use crate::components::notification_bell::NotificationBell;
 use crate::components::sidebar::Sidebar;
 use crate::components::toast::{ToastContainer, Toasts};
 use crate::infrastructure::auth_check::check_auth;
@@ -21,6 +22,7 @@ pub fn AppShell() -> Element {
                     main { class: "main-content",
                         Outlet::<Route> {}
                     }
+                    NotificationBell {}
                     ToastContainer {}
                     HelpChat {}
                 }

compliance-dashboard/src/components/mod.rs

@@ -4,6 +4,7 @@ pub mod code_inspector;
 pub mod code_snippet;
 pub mod file_tree;
 pub mod help_chat;
+pub mod notification_bell;
 pub mod page_header;
 pub mod pagination;
 pub mod pentest_wizard;

compliance-dashboard/src/components/notification_bell.rs

@@ -0,0 +1,155 @@
+use dioxus::prelude::*;
+use dioxus_free_icons::icons::bs_icons::*;
+use dioxus_free_icons::Icon;
+
+use crate::infrastructure::notifications::{
+    dismiss_notification, fetch_notification_count, fetch_notifications,
+    mark_all_notifications_read,
+};
+
+#[component]
+pub fn NotificationBell() -> Element {
+    let mut is_open = use_signal(|| false);
+    let mut count = use_signal(|| 0u64);
+    let mut notifications = use_signal(Vec::new);
+    let mut is_loading = use_signal(|| false);
+
+    // Poll notification count every 30 seconds
+    use_resource(move || async move {
+        loop {
+            if let Ok(c) = fetch_notification_count().await {
+                count.set(c);
+            }
+            #[cfg(feature = "web")]
+            {
+                gloo_timers::future::TimeoutFuture::new(30_000).await;
+            }
+            #[cfg(not(feature = "web"))]
+            {
+                tokio::time::sleep(std::time::Duration::from_secs(30)).await;
+            }
+        }
+    });
+
+    // Load notifications when panel opens
+    let load_notifications = move |_| {
+        is_open.set(!is_open());
+        if !is_open() {
+            return;
+        }
+        is_loading.set(true);
+        spawn(async move {
+            if let Ok(resp) = fetch_notifications().await {
+                notifications.set(resp.data);
+            }
+            // Mark all as read when panel opens
+            let _ = mark_all_notifications_read().await;
+            count.set(0);
+            is_loading.set(false);
+        });
+    };
+
+    let on_dismiss = move |id: String| {
+        spawn(async move {
+            let _ = dismiss_notification(id.clone()).await;
+            notifications.write().retain(|n| {
+                n.id.as_ref()
+                    .and_then(|v| v.get("$oid"))
+                    .and_then(|v| v.as_str())
+                    != Some(&id)
+            });
+        });
+    };
+
+    rsx! {
+        div { class: "notification-bell-wrapper",
+            // Bell button
+            button {
+                class: "notification-bell-btn",
+                onclick: load_notifications,
+                title: "CVE Alerts",
+                Icon { icon: BsBell, width: 18, height: 18 }
+                if count() > 0 {
+                    span { class: "notification-badge", "{count()}" }
+                }
+            }
+
+            // Dropdown panel
+            if is_open() {
+                div { class: "notification-panel",
+                    div { class: "notification-panel-header",
+                        span { "CVE Alerts" }
+                        button {
+                            class: "notification-close-btn",
+                            onclick: move |_| is_open.set(false),
+                            Icon { icon: BsX, width: 16, height: 16 }
+                        }
+                    }
+                    div { class: "notification-panel-body",
+                        if is_loading() {
+                            div { class: "notification-loading", "Loading..." }
+                        } else if notifications().is_empty() {
+                            div { class: "notification-empty",
+                                Icon { icon: BsShieldCheck, width: 32, height: 32 }
+                                p { "No CVE alerts" }
+                            }
+                        } else {
+                            for notif in notifications().iter() {
+                                {
+                                    let id = notif.id.as_ref()
+                                        .and_then(|v| v.get("$oid"))
+                                        .and_then(|v| v.as_str())
+                                        .unwrap_or("")
+                                        .to_string();
+                                    let sev_class = match notif.severity.as_str() {
+                                        "critical" => "sev-critical",
+                                        "high" => "sev-high",
+                                        "medium" => "sev-medium",
+                                        _ => "sev-low",
+                                    };
+                                    let dismiss_id = id.clone();
+                                    rsx! {
+                                        div { class: "notification-item",
+                                            div { class: "notification-item-header",
+                                                span { class: "notification-sev {sev_class}",
+                                                    "{notif.severity.to_uppercase()}"
+                                                }
+                                                span { class: "notification-cve-id",
+                                                    if let Some(ref url) = notif.url {
+                                                        a { href: "{url}", target: "_blank", "{notif.cve_id}" }
+                                                    } else {
+                                                        "{notif.cve_id}"
+                                                    }
+                                                }
+                                                if let Some(score) = notif.cvss_score {
+                                                    span { class: "notification-cvss", "CVSS {score:.1}" }
+                                                }
+                                                button {
+                                                    class: "notification-dismiss-btn",
+                                                    title: "Dismiss",
+                                                    onclick: move |_| on_dismiss(dismiss_id.clone()),
+                                                    Icon { icon: BsXCircle, width: 14, height: 14 }
+                                                }
+                                            }
+                                            div { class: "notification-item-pkg",
+                                                "{notif.package_name} {notif.package_version}"
+                                            }
+                                            div { class: "notification-item-repo",
+                                                "{notif.repo_name}"
+                                            }
+                                            if let Some(ref summary) = notif.summary {
+                                                div { class: "notification-item-summary",
+                                                    "{summary}"
+                                                }
+                                            }
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

compliance-dashboard/src/infrastructure/mod.rs

@@ -8,6 +8,7 @@ pub mod graph;
 pub mod help_chat;
 pub mod issues;
 pub mod mcp;
+pub mod notifications;
 pub mod pentest;
 #[allow(clippy::too_many_arguments)]
 pub mod repositories;

compliance-dashboard/src/infrastructure/notifications.rs

@@ -0,0 +1,91 @@
+use dioxus::prelude::*;
+use serde::{Deserialize, Serialize};
+
+#[derive(Debug, Clone, Serialize, Deserialize, Default)]
+pub struct NotificationListResponse {
+    pub data: Vec<CveNotificationData>,
+    #[serde(default)]
+    pub total: Option<u64>,
+}
+
+#[derive(Debug, Clone, Serialize, Deserialize, Default)]
+pub struct CveNotificationData {
+    #[serde(rename = "_id")]
+    pub id: Option<serde_json::Value>,
+    pub cve_id: String,
+    pub repo_name: String,
+    pub package_name: String,
+    pub package_version: String,
+    pub severity: String,
+    pub cvss_score: Option<f64>,
+    pub summary: Option<String>,
+    pub url: Option<String>,
+    pub status: String,
+    #[serde(default)]
+    pub created_at: Option<serde_json::Value>,
+}
+
+#[derive(Debug, Clone, Serialize, Deserialize, Default)]
+pub struct NotificationCountResponse {
+    pub count: u64,
+}
+
+#[server]
+pub async fn fetch_notification_count() -> Result<u64, ServerFnError> {
+    let state: super::server_state::ServerState =
+        dioxus_fullstack::FullstackContext::extract().await?;
+
+    let url = format!("{}/api/v1/notifications/count", state.agent_api_url);
+    let resp = reqwest::get(&url)
+        .await
+        .map_err(|e| ServerFnError::new(e.to_string()))?;
+    let body: NotificationCountResponse = resp
+        .json()
+        .await
+        .map_err(|e| ServerFnError::new(e.to_string()))?;
+    Ok(body.count)
+}
+
+#[server]
+pub async fn fetch_notifications() -> Result<NotificationListResponse, ServerFnError> {
+    let state: super::server_state::ServerState =
+        dioxus_fullstack::FullstackContext::extract().await?;
+
+    let url = format!("{}/api/v1/notifications?limit=20", state.agent_api_url);
+    let resp = reqwest::get(&url)
+        .await
+        .map_err(|e| ServerFnError::new(e.to_string()))?;
+    let body: NotificationListResponse = resp
+        .json()
+        .await
+        .map_err(|e| ServerFnError::new(e.to_string()))?;
+    Ok(body)
+}
+
+#[server]
+pub async fn mark_all_notifications_read() -> Result<(), ServerFnError> {
+    let state: super::server_state::ServerState =
+        dioxus_fullstack::FullstackContext::extract().await?;
+
+    let url = format!("{}/api/v1/notifications/read-all", state.agent_api_url);
+    reqwest::Client::new()
+        .post(&url)
+        .send()
+        .await
+        .map_err(|e| ServerFnError::new(e.to_string()))?;
+    Ok(())
+}
+
+#[server]
+pub async fn dismiss_notification(id: String) -> Result<(), ServerFnError> {
+    let state: super::server_state::ServerState =
+        dioxus_fullstack::FullstackContext::extract().await?;
+
+    let url = format!("{}/api/v1/notifications/{id}/dismiss", state.agent_api_url);
+    reqwest::Client::new()
+        .patch(&url)
+        .send()
+        .await
+        .map_err(|e| ServerFnError::new(e.to_string()))?;
+    Ok(())
+}