4runr-os 2.10.39 → 2.10.40

package/mk3-tui/src/app.rs

@@ -1,4 +1,5 @@
 use crate::io::IoHandler;
+use crate::monitoring::{MetricsDrillPanel, MonitoringSection, MonitoringState};
 use crate::screens::{NavigationState, Screen};
 use crate::storage::Cache;
 use crate::ui::agent_builder::AgentBuilderState;
@@ -8,7 +9,7 @@ use crate::websocket::WebSocketClient;
 use crossterm::event::{KeyCode, KeyEvent, KeyEventKind};
 use ratatui::prelude::*;
 use serde::{Deserialize, Serialize};
-use std::collections::VecDeque;
+use std::collections::{HashMap, VecDeque};
 use std::time::{Duration, Instant};
 
 /// `HH:MM:SS` for Connection Portal activity log (UTC clock; avoids pulling in `chrono`).
@@ -60,6 +61,36 @@ impl OperationMode {
     }
 }
 
+#[cfg(test)]
+mod portal_monitoring_tests {
+    use super::*;
+
+    #[test]
+    fn metric_history_totals_contract_keys() {
+        let totals = serde_json::json!({
+            "httpRequests": 10,
+            "httpRequestErrors": 1,
+            "queueJobsWaiting": 2,
+            "queueJobsActive": 3,
+            "queueJobsFailed": 4,
+            "runsActive": 5,
+            "sseActive": 6
+        });
+        let entry = metric_history_entry_from_totals(
+            "2026-01-01T00:00:00.000Z".to_string(),
+            totals.as_object().expect("totals object"),
+        );
+
+        assert_eq!(entry.http_requests, 10);
+        assert_eq!(entry.http_errors, 1);
+        assert_eq!(entry.queue_waiting, 2);
+        assert_eq!(entry.queue_active, 3);
+        assert_eq!(entry.queue_failed, 4);
+        assert_eq!(entry.runs_active, 5);
+        assert_eq!(entry.sse_active, 6);
+    }
+}
+
 #[derive(Debug, Clone, PartialEq)]
 pub enum PortalField {
     GatewayUrl,
@@ -183,6 +214,50 @@ impl ConnectionPortalState {
 }
 
 /// Gateway traffic snapshot (Prometheus `/metrics` via CLI WebSocket handler).
+#[derive(Debug, Clone, Serialize)]
+pub struct MetricHistoryEntry {
+    pub timestamp: String,
+    pub http_requests: u64,
+    pub http_errors: u64,
+    pub queue_waiting: u64,
+    pub queue_active: u64,
+    pub queue_failed: u64,
+    pub runs_active: u64,
+    pub sse_active: u64,
+}
+
+/// Phase 5 contract with `packages/os-cli/src/gateway-observability.ts` `totals`.
+/// If CLI keys change, update this mapping and `metric_history_totals_contract_keys`.
+pub fn metric_history_entry_from_totals(
+    timestamp: String,
+    totals: &serde_json::Map<String, serde_json::Value>,
+) -> MetricHistoryEntry {
+    fn read_u64(totals: &serde_json::Map<String, serde_json::Value>, key: &str) -> u64 {
+        totals
+            .get(key)
+            .and_then(|v| v.as_u64().or_else(|| v.as_f64().map(|f| f.max(0.0) as u64)))
+            .unwrap_or(0)
+    }
+
+    MetricHistoryEntry {
+        timestamp,
+        http_requests: read_u64(totals, "httpRequests"),
+        http_errors: read_u64(totals, "httpRequestErrors"),
+        queue_waiting: read_u64(totals, "queueJobsWaiting"),
+        queue_active: read_u64(totals, "queueJobsActive"),
+        queue_failed: read_u64(totals, "queueJobsFailed"),
+        runs_active: read_u64(totals, "runsActive"),
+        sse_active: read_u64(totals, "sseActive"),
+    }
+}
+
+#[derive(Debug, Clone, Serialize)]
+pub struct DependencyAlertEntry {
+    pub timestamp: String,
+    pub previous: String,
+    pub current: String,
+}
+
 #[derive(Debug, Clone)]
 pub struct PortalMonitoringState {
     pub loading: bool,
@@ -190,6 +265,8 @@ pub struct PortalMonitoringState {
     pub last_updated: Option<String>,
     pub content_lines: Vec<String>,
     pub scroll_offset: usize,
+    /// Width-based clip for section summaries; updated each render (Phase 1).
+    pub summary_clip_width: usize,
     /// Body inner height from last render (for scroll bounds).
     pub viewport_lines: usize,
     /// Auto-refresh timer
@@ -200,6 +277,24 @@ pub struct PortalMonitoringState {
     pub last_http_for_delta: Option<u64>,
     /// Wall clock at last successful observability poll (for rate estimate).
     pub last_instant_for_delta: Option<Instant>,
+    /// Phase 2: per-section lines from `monitoring.refresh` / `monitoring.logs` (merged over snapshot).
+    pub section_overrides: HashMap<MonitoringSection, Vec<String>>,
+    /// Which section is waiting on `monitoring.refresh`.
+    pub section_refresh_loading: Option<MonitoringSection>,
+    pub logs_fetch_loading: bool,
+    /// Phase 3: drill-down inside Metrics (`→` / `←`); which prom-client slice is shown.
+    pub metrics_drill: Option<MetricsDrillPanel>,
+    pub metrics_drill_lines: Vec<String>,
+    pub metrics_drill_loading: bool,
+    /// Last N HTTP request totals from full snapshots (for ASCII sparkline).
+    pub http_total_sparkline: VecDeque<u64>,
+    /// Phase 5: bounded sample history (720 samples; wall-clock span depends on refresh cadence).
+    pub metric_history: VecDeque<MetricHistoryEntry>,
+    pub dependency_alerts: VecDeque<DependencyAlertEntry>,
+    pub last_dependency_status: Option<String>,
+    pub trend_view: bool,
+    pub last_export_path: Option<String>,
+    pub help_visible: bool,
 }
 
 impl Default for PortalMonitoringState {
@@ -210,12 +305,54 @@ impl Default for PortalMonitoringState {
             last_updated: None,
             content_lines: Vec::new(),
             scroll_offset: 0,
+            summary_clip_width: 80,
             viewport_lines: 18,
             last_refresh: None,
             auto_refresh_interval: Duration::from_secs(5),
             auto_refresh_enabled: true,
             last_http_for_delta: None,
             last_instant_for_delta: None,
+            section_overrides: HashMap::new(),
+            section_refresh_loading: None,
+            logs_fetch_loading: false,
+            metrics_drill: None,
+            metrics_drill_lines: Vec::new(),
+            metrics_drill_loading: false,
+            http_total_sparkline: VecDeque::new(),
+            metric_history: VecDeque::new(),
+            dependency_alerts: VecDeque::new(),
+            last_dependency_status: None,
+            trend_view: false,
+            last_export_path: None,
+            help_visible: false,
+        }
+    }
+}
+
+/// Section-based monitoring UI state (Phase 1).
+#[derive(Debug, Clone)]
+pub struct AdvancedMonitoringState {
+    pub monitoring_state: MonitoringState,
+    /// Optional mirror of the connected Gateway URL at construction time. **Live URL for UI is always
+    /// `AppState.gateway_url`** (and `MonitoringState::gateway_url` is synced from there in Portal Monitoring render).
+    #[allow(dead_code)]
+    pub gateway_url: Option<String>,
+}
+
+impl Default for AdvancedMonitoringState {
+    fn default() -> Self {
+        Self {
+            monitoring_state: MonitoringState::default(),
+            gateway_url: None,
+        }
+    }
+}
+
+impl AdvancedMonitoringState {
+    pub fn new(gateway_url: Option<String>) -> Self {
+        Self {
+            monitoring_state: MonitoringState::new(gateway_url.clone()),
+            gateway_url,
         }
     }
 }
@@ -296,6 +433,9 @@ pub struct AppState {
     /// Last successful observability pull (for auto-refresh interval).
     pub portal_observability_last_poll: Option<Instant>,
     
+    /// Section selection / expand state for Portal Monitoring (Phase 1).
+    pub advanced_monitoring: AdvancedMonitoringState,
+    
     // Command tracking for response handling (Step 5.1)
     pub pending_agent_create_id: Option<String>,
     pub pending_agent_list_id: Option<String>,
@@ -303,6 +443,9 @@ pub struct AppState {
     pub pending_gateway_connect_id: Option<String>,
     pub pending_gateway_health_id: Option<String>,  // Phase 2.1: Track health checks
     pub pending_gateway_observability_id: Option<String>,
+    pub pending_monitoring_refresh_id: Option<String>,
+    pub pending_monitoring_logs_id: Option<String>,
+    pub pending_monitoring_drill_id: Option<String>,
     pub pending_setup_detect_id: Option<String>,  // Track setup.detect command
     
     // Step 6: Gateway runs
@@ -380,12 +523,16 @@ impl Default for AppState {
             setup_portal: SetupPortalState::default(),
             portal_monitoring: PortalMonitoringState::default(),
             portal_observability_last_poll: None,
+            advanced_monitoring: AdvancedMonitoringState::default(),
             pending_agent_create_id: None,
             pending_agent_list_id: None,
             pending_agent_delete_id: None,
             pending_gateway_connect_id: None,
             pending_gateway_health_id: None,  // Phase 2.1: Initialize health check tracking
             pending_gateway_observability_id: None,
+            pending_monitoring_refresh_id: None,
+            pending_monitoring_logs_id: None,
+            pending_monitoring_drill_id: None,
             pending_setup_detect_id: None,
             pending_run_list_id: None,
             pending_run_get_id: None,
@@ -557,10 +704,21 @@ impl App {
     }
 
     /// Ask CLI to pull Gateway `GET /metrics` and return a condensed snapshot for Portal Monitoring.
+    ///
+    /// **Intentional command split:** the TUI uses this `gateway.observability` path for the
+    /// **Overview** row (full health + Prometheus snapshot in one response). Per-section refresh
+    /// uses `begin_monitoring_refresh_request` → `monitoring.refresh` instead. The CLI also maps
+    /// `monitoring.refresh` with `section: "overview"` to the same handler for non-TUI callers.
     pub fn begin_portal_observability_request(&mut self, ws: &WebSocketClient) {
         if self.state.pending_gateway_observability_id.is_some() {
             return;
         }
+        if self.state.pending_monitoring_refresh_id.is_some()
+            || self.state.pending_monitoring_logs_id.is_some()
+            || self.state.pending_monitoring_drill_id.is_some()
+        {
+            return;
+        }
         self.state.portal_monitoring.loading = true;
         self.state.portal_monitoring.error = None;
         let nonce = std::time::SystemTime::now()
@@ -580,6 +738,179 @@ impl App {
         }
     }
 
+    /// Phase 2: refresh one Portal Monitoring section via CLI (`monitoring.refresh` → Gateway APIs).
+    pub fn begin_monitoring_refresh_request(&mut self, ws: &WebSocketClient, section: MonitoringSection) {
+        if self.state.pending_gateway_observability_id.is_some()
+            || self.state.pending_monitoring_refresh_id.is_some()
+            || self.state.pending_monitoring_logs_id.is_some()
+            || self.state.pending_monitoring_drill_id.is_some()
+        {
+            return;
+        }
+        let nonce = std::time::SystemTime::now()
+            .duration_since(std::time::UNIX_EPOCH)
+            .map(|d| d.as_millis())
+            .unwrap_or(0);
+        let slug = section.cli_slug();
+        let data = serde_json::json!({ "section": slug, "nonce": nonce });
+        match ws.send_command("monitoring.refresh", Some(data)) {
+            Ok(id) => {
+                self.state.pending_monitoring_refresh_id = Some(id);
+                self.state.portal_monitoring.section_refresh_loading = Some(section);
+                self.state.portal_monitoring.error = None;
+            }
+            Err(e) => {
+                self.state.portal_monitoring.section_refresh_loading = None;
+                self.state.portal_monitoring.error = Some(format!("{}", e));
+                self.request_immediate_render("monitoring_refresh_send_err");
+            }
+        }
+    }
+
+    /// Phase 2: fetch Gateway log buffer (`monitoring.logs`).
+    pub fn begin_monitoring_logs_request(&mut self, ws: &WebSocketClient) {
+        if self.state.pending_gateway_observability_id.is_some()
+            || self.state.pending_monitoring_refresh_id.is_some()
+            || self.state.pending_monitoring_logs_id.is_some()
+            || self.state.pending_monitoring_drill_id.is_some()
+        {
+            return;
+        }
+        let nonce = std::time::SystemTime::now()
+            .duration_since(std::time::UNIX_EPOCH)
+            .map(|d| d.as_millis())
+            .unwrap_or(0);
+        let data = serde_json::json!({ "limit": 100u32, "nonce": nonce });
+        match ws.send_command("monitoring.logs", Some(data)) {
+            Ok(id) => {
+                self.state.pending_monitoring_logs_id = Some(id);
+                self.state.portal_monitoring.logs_fetch_loading = true;
+                self.state.portal_monitoring.error = None;
+            }
+            Err(e) => {
+                self.state.portal_monitoring.logs_fetch_loading = false;
+                self.state.portal_monitoring.error = Some(format!("{}", e));
+                self.request_immediate_render("monitoring_logs_send_err");
+            }
+        }
+    }
+
+    /// Phase 3: Gateway drill-down (`monitoring.drill`) for Metrics sub-panels (HTTP / Runs / Queue / SSE).
+    pub fn begin_monitoring_drill_request(&mut self, ws: &WebSocketClient, panel: MetricsDrillPanel) {
+        if self.state.pending_gateway_observability_id.is_some()
+            || self.state.pending_monitoring_refresh_id.is_some()
+            || self.state.pending_monitoring_logs_id.is_some()
+            || self.state.pending_monitoring_drill_id.is_some()
+        {
+            return;
+        }
+        let nonce = std::time::SystemTime::now()
+            .duration_since(std::time::UNIX_EPOCH)
+            .map(|d| d.as_millis())
+            .unwrap_or(0);
+        let target = panel.cli_target();
+        let data = serde_json::json!({ "target": target, "nonce": nonce });
+        match ws.send_command("monitoring.drill", Some(data)) {
+            Ok(id) => {
+                self.state.pending_monitoring_drill_id = Some(id);
+                self.state.portal_monitoring.metrics_drill = Some(panel);
+                self.state.portal_monitoring.metrics_drill_loading = true;
+                self.state.portal_monitoring.metrics_drill_lines.clear();
+                self.state.portal_monitoring.error = None;
+            }
+            Err(e) => {
+                self.state.portal_monitoring.metrics_drill_loading = false;
+                self.state.portal_monitoring.error = Some(format!("{}", e));
+                self.request_immediate_render("monitoring_drill_send_err");
+            }
+        }
+    }
+
+    /// Phase 3: dependency pools + queue counts (`dependencies/detail`).
+    pub fn begin_dependencies_detail_drill(&mut self, ws: &WebSocketClient) {
+        if self.state.pending_gateway_observability_id.is_some()
+            || self.state.pending_monitoring_refresh_id.is_some()
+            || self.state.pending_monitoring_logs_id.is_some()
+            || self.state.pending_monitoring_drill_id.is_some()
+        {
+            return;
+        }
+        let nonce = std::time::SystemTime::now()
+            .duration_since(std::time::UNIX_EPOCH)
+            .map(|d| d.as_millis())
+            .unwrap_or(0);
+        let data = serde_json::json!({ "target": "dependencies_detail", "nonce": nonce });
+        match ws.send_command("monitoring.drill", Some(data)) {
+            Ok(id) => {
+                self.state.pending_monitoring_drill_id = Some(id);
+                self.state.portal_monitoring.section_refresh_loading = Some(MonitoringSection::Dependencies);
+                self.state.portal_monitoring.error = None;
+            }
+            Err(e) => {
+                self.state.portal_monitoring.section_refresh_loading = None;
+                self.state.portal_monitoring.error = Some(format!("{}", e));
+                self.request_immediate_render("deps_drill_send_err");
+            }
+        }
+    }
+
+    /// Phase 4: run local CLI/host diagnostics for the System section.
+    pub fn begin_system_diagnostics_request(&mut self, ws: &WebSocketClient) {
+        if self.state.pending_gateway_observability_id.is_some()
+            || self.state.pending_monitoring_refresh_id.is_some()
+            || self.state.pending_monitoring_logs_id.is_some()
+            || self.state.pending_monitoring_drill_id.is_some()
+        {
+            return;
+        }
+        let nonce = std::time::SystemTime::now()
+            .duration_since(std::time::UNIX_EPOCH)
+            .map(|d| d.as_millis())
+            .unwrap_or(0);
+        let data = serde_json::json!({ "target": "system_diagnostics", "nonce": nonce });
+        match ws.send_command("monitoring.drill", Some(data)) {
+            Ok(id) => {
+                self.state.pending_monitoring_drill_id = Some(id);
+                self.state.portal_monitoring.section_refresh_loading = Some(MonitoringSection::System);
+                self.state.portal_monitoring.error = None;
+            }
+            Err(e) => {
+                self.state.portal_monitoring.section_refresh_loading = None;
+                self.state.portal_monitoring.error = Some(format!("{}", e));
+                self.request_immediate_render("system_diagnostics_send_err");
+            }
+        }
+    }
+
+    pub fn export_portal_monitoring_snapshot(&mut self) -> anyhow::Result<String> {
+        let mut overrides = serde_json::Map::new();
+        for (section, lines) in &self.state.portal_monitoring.section_overrides {
+            overrides.insert(section.cli_slug().to_string(), serde_json::json!(lines));
+        }
+        let payload = serde_json::json!({
+            "exportedAt": wall_clock_hms(),
+            "gatewayUrl": self.state.gateway_url.clone(),
+            "lastUpdated": self.state.portal_monitoring.last_updated.clone(),
+            "contentLines": self.state.portal_monitoring.content_lines.clone(),
+            "sectionOverrides": overrides,
+            "metricHistory": self.state.portal_monitoring.metric_history.clone(),
+            "dependencyAlerts": self.state.portal_monitoring.dependency_alerts.clone(),
+            "trendView": self.state.portal_monitoring.trend_view,
+        });
+        let unix = std::time::SystemTime::now()
+            .duration_since(std::time::UNIX_EPOCH)
+            .map(|d| d.as_secs())
+            .unwrap_or(0);
+        let mut path = std::env::current_dir()
+            .unwrap_or_else(|_| std::env::temp_dir());
+        path.push(format!("4runr-monitoring-export-{unix}.json"));
+        let body = serde_json::to_string_pretty(&payload)?;
+        std::fs::write(&path, body)?;
+        let display = path.display().to_string();
+        self.state.portal_monitoring.last_export_path = Some(display.clone());
+        Ok(display)
+    }
+
     /// CLI ↔ TUI WebSocket lost: drop Gateway link UI and leave Portal Monitoring / Connection Portal so the session does not appear still "connected".
     pub fn on_cli_backend_disconnect(&mut self) {
         use crate::screens::Screen;
@@ -591,8 +922,12 @@ impl App {
         self.state.pending_gateway_connect_id = None;
         self.state.pending_gateway_health_id = None;
         self.state.pending_gateway_observability_id = None;
+        self.state.pending_monitoring_refresh_id = None;
+        self.state.pending_monitoring_logs_id = None;
+        self.state.pending_monitoring_drill_id = None;
         self.state.portal_observability_last_poll = None;
         self.state.portal_monitoring = PortalMonitoringState::default();
+        self.state.advanced_monitoring = AdvancedMonitoringState::default();
         self.state.connection_portal.finish_connecting();
         self.state.connection_portal.connection_success = false;
         self.state.connection_portal.connecting = false;
@@ -951,6 +1286,9 @@ impl App {
                                 self.state
                                     .navigation
                                     .navigate_to_base(Screen::PortalMonitoring);
+                                self.state.advanced_monitoring =
+                                    AdvancedMonitoringState::new(self.state.gateway_url.clone());
+                                self.state.portal_monitoring.scroll_offset = 0;
                                 self.state.logs.push_back("[NAV] Opening Portal Monitoring...".into());
                                 if let Some(ws) = ws_client {
                                     self.begin_portal_observability_request(ws);
@@ -1999,6 +2337,9 @@ impl App {
                 self.state
                     .navigation
                     .navigate_to_base(Screen::PortalMonitoring);
+                self.state.advanced_monitoring =
+                    AdvancedMonitoringState::new(self.state.gateway_url.clone());
+                self.state.portal_monitoring.scroll_offset = 0;
                 self.add_log("[NAV] Opening Portal Monitoring".to_string());
                 if let Some(ws) = ws_client {
                     self.begin_portal_observability_request(ws);
@@ -2020,7 +2361,11 @@ impl App {
                 self.state.pending_gateway_connect_id = None;
                 self.state.pending_gateway_health_id = None;
                 self.state.pending_gateway_observability_id = None;
+                self.state.pending_monitoring_refresh_id = None;
+                self.state.pending_monitoring_logs_id = None;
+                self.state.pending_monitoring_drill_id = None;
                 self.state.portal_monitoring = PortalMonitoringState::default();
+                self.state.advanced_monitoring = AdvancedMonitoringState::default();
                 self.state.portal_observability_last_poll = None;
                 self.state.navigation.navigate_to_base(Screen::Main);
                 self.add_log("[MODE] Continuing in LOCAL mode (no Gateway connection)".to_string());
@@ -2152,6 +2497,7 @@ impl App {
         key: KeyEvent,
         ws_client: Option<&WebSocketClient>,
     ) -> anyhow::Result<bool> {
+        use crate::ui::portal_monitoring::{portal_monitoring_scroll_max};
         use crossterm::event::KeyModifiers;
         if key.modifiers.contains(KeyModifiers::CONTROL) {
             match key.code {
@@ -2162,19 +2508,59 @@ impl App {
         if key.code == KeyCode::F(10) {
             return Ok(true);
         }
+        if self.state.portal_monitoring.help_visible {
+            if key.code == KeyCode::Esc || key.code == KeyCode::Char('?') {
+                self.state.portal_monitoring.help_visible = false;
+                self.request_immediate_render("portal_help_close");
+            }
+            return Ok(false);
+        }
         if key.code == KeyCode::Esc {
             self.state.pending_gateway_observability_id = None;
+            self.state.pending_monitoring_refresh_id = None;
+            self.state.pending_monitoring_logs_id = None;
+            self.state.pending_monitoring_drill_id = None;
+            self.state.portal_monitoring.section_refresh_loading = None;
+            self.state.portal_monitoring.logs_fetch_loading = false;
+            self.state.portal_monitoring.metrics_drill = None;
+            self.state.portal_monitoring.metrics_drill_lines.clear();
+            self.state.portal_monitoring.metrics_drill_loading = false;
             self.state.navigation.navigate_to_base(Screen::Main);
             self.add_log("[NAV] Portal Monitoring closed".to_string());
             self.request_immediate_render("portal_monitoring_close");
             return Ok(false);
         }
+        if key.code == KeyCode::Char('?') {
+            self.state.portal_monitoring.help_visible = true;
+            self.request_immediate_render("portal_help_open");
+            return Ok(false);
+        }
+        // R is context-sensitive: Overview → full `gateway.observability` snapshot; any other
+        // section → `monitoring.refresh` for that section only (cheaper; matches expanded detail).
         if key.code == KeyCode::Char('r') || key.code == KeyCode::Char('R') {
             if let Some(ws) = ws_client {
+                let sections = MonitoringSection::all();
+                let idx = self.state.advanced_monitoring.monitoring_state.selected_index;
+                let current = sections.get(idx).copied();
                 self.state.portal_observability_last_poll = None;
                 self.state.pending_gateway_observability_id = None;
+                self.state.pending_monitoring_refresh_id = None;
+                self.state.pending_monitoring_logs_id = None;
+                self.state.pending_monitoring_drill_id = None;
+                self.state.portal_monitoring.section_refresh_loading = None;
+                self.state.portal_monitoring.logs_fetch_loading = false;
+                self.state.portal_monitoring.metrics_drill = None;
+                self.state.portal_monitoring.metrics_drill_lines.clear();
+                self.state.portal_monitoring.metrics_drill_loading = false;
                 self.state.portal_monitoring.last_refresh = Some(std::time::Instant::now());
-                self.begin_portal_observability_request(ws);
+                match current {
+                    Some(MonitoringSection::Overview) | None => {
+                        self.begin_portal_observability_request(ws);
+                    }
+                    Some(sec) => {
+                        self.begin_monitoring_refresh_request(ws, sec);
+                    }
+                }
                 self.request_immediate_render("portal_obs_refresh");
             } else {
                 self.state.portal_monitoring.error =
@@ -2183,10 +2569,155 @@ impl App {
             }
             return Ok(false);
         }
+        if key.code == KeyCode::Char('l') || key.code == KeyCode::Char('L') {
+            if let Some(ws) = ws_client {
+                self.begin_monitoring_logs_request(ws);
+                self.state
+                    .advanced_monitoring
+                    .monitoring_state
+                    .expand_section(MonitoringSection::Logs);
+                self.request_immediate_render("portal_monitoring_logs");
+            } else {
+                self.state.portal_monitoring.error =
+                    Some("WebSocket to CLI is not connected.".to_string());
+                self.request_immediate_render("portal_obs_no_ws");
+            }
+            return Ok(false);
+        }
+
+        if key.code == KeyCode::Char('h') || key.code == KeyCode::Char('H') {
+            self.state.portal_monitoring.trend_view = !self.state.portal_monitoring.trend_view;
+            let status = if self.state.portal_monitoring.trend_view {
+                "enabled"
+            } else {
+                "disabled"
+            };
+            self.add_log(format!("[PORTAL] Trend/history view {}", status));
+            self.request_immediate_render("portal_trend_toggle");
+            return Ok(false);
+        }
+
+        if key.code == KeyCode::Char('e') || key.code == KeyCode::Char('E') {
+            match self.export_portal_monitoring_snapshot() {
+                Ok(path) => {
+                    self.add_log(format!("[PORTAL] Exported monitoring snapshot: {}", path));
+                    self.state.portal_monitoring.error = None;
+                }
+                Err(e) => {
+                    self.state.portal_monitoring.error = Some(format!("Export failed: {}", e));
+                }
+            }
+            self.request_immediate_render("portal_export");
+            return Ok(false);
+        }
+
+        // Phase 3: extended dependency view (GET /api/monitoring/dependencies/detail)
+        if key.code == KeyCode::Char('t') || key.code == KeyCode::Char('T') {
+            let sections = MonitoringSection::all();
+            let idx = self.state.advanced_monitoring.monitoring_state.selected_index;
+            let current = sections.get(idx).copied();
+            let expanded = current
+                .and_then(|sec| {
+                    self.state
+                        .advanced_monitoring
+                        .monitoring_state
+                        .sections
+                        .get(&sec)
+                        .map(|s| s.expanded)
+                })
+                .unwrap_or(false);
+            if current == Some(MonitoringSection::Dependencies) && expanded {
+                if let Some(ws) = ws_client {
+                    self.begin_dependencies_detail_drill(ws);
+                    self.request_immediate_render("portal_deps_drill");
+                } else {
+                    self.state.portal_monitoring.error =
+                        Some("WebSocket to CLI is not connected.".to_string());
+                    self.request_immediate_render("portal_obs_no_ws");
+                }
+                return Ok(false);
+            }
+        }
+
+        // Phase 4: diagnostics for the local CLI/TUI bridge + Gateway reachability.
+        if key.code == KeyCode::Char('s') || key.code == KeyCode::Char('S') {
+            let sections = MonitoringSection::all();
+            let idx = self.state.advanced_monitoring.monitoring_state.selected_index;
+            let current = sections.get(idx).copied();
+            let expanded = current
+                .and_then(|sec| {
+                    self.state
+                        .advanced_monitoring
+                        .monitoring_state
+                        .sections
+                        .get(&sec)
+                        .map(|s| s.expanded)
+                })
+                .unwrap_or(false);
+            if current == Some(MonitoringSection::System) && expanded {
+                if let Some(ws) = ws_client {
+                    self.begin_system_diagnostics_request(ws);
+                    self.request_immediate_render("portal_system_diagnostics");
+                } else {
+                    self.state.portal_monitoring.error =
+                        Some("WebSocket to CLI is not connected.".to_string());
+                    self.request_immediate_render("portal_obs_no_ws");
+                }
+                return Ok(false);
+            }
+        }
+
+        if key.code == KeyCode::Right {
+            let sections = MonitoringSection::all();
+            let idx = self.state.advanced_monitoring.monitoring_state.selected_index;
+            let current = sections.get(idx).copied();
+            let expanded = current
+                .and_then(|sec| {
+                    self.state
+                        .advanced_monitoring
+                        .monitoring_state
+                        .sections
+                        .get(&sec)
+                        .map(|s| s.expanded)
+                })
+                .unwrap_or(false);
+            if current == Some(MonitoringSection::Metrics) && expanded {
+                if let Some(ws) = ws_client {
+                    let panel = self
+                        .state
+                        .portal_monitoring
+                        .metrics_drill
+                        .map(|p| p.next())
+                        .unwrap_or(MetricsDrillPanel::Http);
+                    self.begin_monitoring_drill_request(ws, panel);
+                    self.request_immediate_render("portal_metrics_drill");
+                } else {
+                    self.state.portal_monitoring.error =
+                        Some("WebSocket to CLI is not connected.".to_string());
+                    self.request_immediate_render("portal_obs_no_ws");
+                }
+                return Ok(false);
+            }
+        }
+
+        if key.code == KeyCode::Left {
+            if self.state.portal_monitoring.metrics_drill.is_some() {
+                self.state.portal_monitoring.metrics_drill = None;
+                self.state.portal_monitoring.metrics_drill_lines.clear();
+                self.state.portal_monitoring.metrics_drill_loading = false;
+                self.request_immediate_render("portal_metrics_drill_exit");
+                return Ok(false);
+            }
+        }
+
         // Toggle auto-refresh with 'A' key
         if key.code == KeyCode::Char('a') || key.code == KeyCode::Char('A') {
             self.state.portal_monitoring.auto_refresh_enabled = 
                 !self.state.portal_monitoring.auto_refresh_enabled;
+            self.state
+                .advanced_monitoring
+                .monitoring_state
+                .live_mode = self.state.portal_monitoring.auto_refresh_enabled;
             let status = if self.state.portal_monitoring.auto_refresh_enabled {
                 "enabled"
             } else {
@@ -2196,20 +2727,50 @@ impl App {
             self.request_immediate_render("portal_obs_auto_toggle");
             return Ok(false);
         }
+
+        // Phase 1: Enter / Space — expand or collapse selected section
+        if key.code == KeyCode::Enter || key.code == KeyCode::Char(' ') {
+            let idx = self.state.advanced_monitoring.monitoring_state.selected_index;
+            self.state
+                .advanced_monitoring
+                .monitoring_state
+                .toggle_section_at_index(idx);
+            self.request_immediate_render("portal_monitoring_toggle_section");
+            return Ok(false);
+        }
+
         let inner_h = self.state.portal_monitoring.viewport_lines.max(5);
-        let total = self.state.portal_monitoring.content_lines.len();
-        let max_scroll = total.saturating_sub(inner_h.min(total.max(1)));
+        let sw = self.state.portal_monitoring.summary_clip_width.max(24);
+        let max_scroll = portal_monitoring_scroll_max(&self.state, sw, inner_h);
+
         match key.code {
-            KeyCode::Up | KeyCode::PageUp => {
+            KeyCode::Up => {
+                self.state
+                    .advanced_monitoring
+                    .monitoring_state
+                    .select_previous_wrapped();
+                self.state.portal_monitoring.scroll_offset = 0;
+                self.request_immediate_render("portal_monitoring_select");
+            }
+            KeyCode::Down => {
+                self.state
+                    .advanced_monitoring
+                    .monitoring_state
+                    .select_next_wrapped();
+                self.state.portal_monitoring.scroll_offset = 0;
+                self.request_immediate_render("portal_monitoring_select");
+            }
+            KeyCode::PageUp => {
+                let step = inner_h.saturating_sub(3).max(1);
                 self.state.portal_monitoring.scroll_offset = self
                     .state
                     .portal_monitoring
                     .scroll_offset
-                    .saturating_sub(if key.code == KeyCode::PageUp { inner_h } else { 1 });
+                    .saturating_sub(step);
                 self.request_immediate_render("portal_obs_scroll");
             }
-            KeyCode::Down | KeyCode::PageDown => {
-                let step = if key.code == KeyCode::PageDown { inner_h } else { 1 };
+            KeyCode::PageDown => {
+                let step = inner_h.saturating_sub(3).max(1);
                 self.state.portal_monitoring.scroll_offset =
                     (self.state.portal_monitoring.scroll_offset + step).min(max_scroll);
                 self.request_immediate_render("portal_obs_scroll");