tui: allow theming selected rows in hops table

crates/trippy-tui/src/config/file.rs

@@ -291,6 +291,10 @@ pub struct ConfigThemeColors {
     pub hops_table_header_text_color: Option<TuiColor>,
     pub hops_table_row_active_text_color: Option<TuiColor>,
     pub hops_table_row_inactive_text_color: Option<TuiColor>,
+    pub hops_table_row_active_selected_bg_color: Option<TuiColor>,
+    pub hops_table_row_active_selected_text_color: Option<TuiColor>,
+    pub hops_table_row_inactive_selected_bg_color: Option<TuiColor>,
+    pub hops_table_row_inactive_selected_text_color: Option<TuiColor>,
     pub hops_chart_selected_color: Option<TuiColor>,
     pub hops_chart_unselected_color: Option<TuiColor>,
     pub hops_chart_axis_color: Option<TuiColor>,
@@ -331,6 +335,16 @@ impl Default for ConfigThemeColors {
             hops_table_header_text_color: Some(theme.hops_table_header_text),
             hops_table_row_active_text_color: Some(theme.hops_table_row_active_text),
             hops_table_row_inactive_text_color: Some(theme.hops_table_row_inactive_text),
+            hops_table_row_active_selected_bg_color: Some(theme.hops_table_row_active_selected_bg),
+            hops_table_row_active_selected_text_color: Some(
+                theme.hops_table_row_active_selected_text,
+            ),
+            hops_table_row_inactive_selected_bg_color: Some(
+                theme.hops_table_row_inactive_selected_bg,
+            ),
+            hops_table_row_inactive_selected_text_color: Some(
+                theme.hops_table_row_inactive_selected_text,
+            ),
             hops_chart_selected_color: Some(theme.hops_chart_selected),
             hops_chart_unselected_color: Some(theme.hops_chart_unselected),
             hops_chart_axis_color: Some(theme.hops_chart_axis),

crates/trippy-tui/src/config/theme.rs

@@ -29,6 +29,14 @@ pub struct TuiTheme {
     pub hops_table_row_active_text: TuiColor,
     /// The color of text of inactive rows in the hops table.
     pub hops_table_row_inactive_text: TuiColor,
+    /// The background color of selected active rows in the hops table.
+    pub hops_table_row_active_selected_bg: TuiColor,
+    /// The color of text of selected active rows in the hops table.
+    pub hops_table_row_active_selected_text: TuiColor,
+    /// The background color of selected inactive rows in the hops table.
+    pub hops_table_row_inactive_selected_bg: TuiColor,
+    /// The color of text of selected inactive rows in the hops table.
+    pub hops_table_row_inactive_selected_text: TuiColor,
     /// The color of the selected series in the hops chart.
     pub hops_chart_selected: TuiColor,
     /// The color of the unselected series in the hops chart.
@@ -94,6 +102,10 @@ impl Default for TuiTheme {
             hops_table_header_text: TuiColor::Black,
             hops_table_row_active_text: TuiColor::Gray,
             hops_table_row_inactive_text: TuiColor::DarkGray,
+            hops_table_row_active_selected_bg: TuiColor::Gray,
+            hops_table_row_active_selected_text: TuiColor::Black,
+            hops_table_row_inactive_selected_bg: TuiColor::DarkGray,
+            hops_table_row_inactive_selected_text: TuiColor::Black,
             hops_chart_selected: TuiColor::Green,
             hops_chart_unselected: TuiColor::Gray,
             hops_chart_axis: TuiColor::DarkGray,
@@ -161,6 +173,22 @@ impl From<(HashMap<TuiThemeItem, TuiColor>, ConfigThemeColors)> for TuiTheme {
                 .get(&TuiThemeItem::HopsTableRowInactiveTextColor)
                 .or(cfg.hops_table_row_inactive_text_color.as_ref())
                 .unwrap_or(&Self::default().hops_table_row_inactive_text),
+            hops_table_row_active_selected_bg: *color_map
+                .get(&TuiThemeItem::HopsTableRowActiveSelectedBgColor)
+                .or(cfg.hops_table_row_active_selected_bg_color.as_ref())
+                .unwrap_or(&Self::default().hops_table_row_active_selected_bg),
+            hops_table_row_active_selected_text: *color_map
+                .get(&TuiThemeItem::HopsTableRowActiveSelectedTextColor)
+                .or(cfg.hops_table_row_active_selected_text_color.as_ref())
+                .unwrap_or(&Self::default().hops_table_row_active_selected_text),
+            hops_table_row_inactive_selected_bg: *color_map
+                .get(&TuiThemeItem::HopsTableRowInactiveSelectedBgColor)
+                .or(cfg.hops_table_row_inactive_selected_bg_color.as_ref())
+                .unwrap_or(&Self::default().hops_table_row_inactive_selected_bg),
+            hops_table_row_inactive_selected_text: *color_map
+                .get(&TuiThemeItem::HopsTableRowInactiveSelectedTextColor)
+                .or(cfg.hops_table_row_inactive_selected_text_color.as_ref())
+                .unwrap_or(&Self::default().hops_table_row_inactive_selected_text),
             hops_chart_selected: *color_map
                 .get(&TuiThemeItem::HopsChartSelectedColor)
                 .or(cfg.hops_chart_selected_color.as_ref())
@@ -290,6 +318,14 @@ pub enum TuiThemeItem {
     HopsTableRowActiveTextColor,
     /// The color of text of inactive rows in the hops table.
     HopsTableRowInactiveTextColor,
+    /// The background color of selected active rows in the hops table.
+    HopsTableRowActiveSelectedBgColor,
+    /// The color of text of selected active rows in the hops table.
+    HopsTableRowActiveSelectedTextColor,
+    /// The background color of selected inactive rows in the hops table.
+    HopsTableRowInactiveSelectedBgColor,
+    /// The color of text of selected inactive rows in the hops table.
+    HopsTableRowInactiveSelectedTextColor,
     /// The color of the selected series in the hops chart.
     HopsChartSelectedColor,
     /// The color of the unselected series in the hops chart.

crates/trippy-tui/src/frontend/render/settings.rs

@@ -431,6 +431,22 @@ fn format_theme_settings(app: &TuiApp) -> Vec<SettingsItem> {
             "hops-table-row-inactive-text-color",
             theme::fmt_color(theme.hops_table_row_inactive_text),
         ),
+        SettingsItem::new(
+            "hops-table-row-active-selected-bg-color",
+            theme::fmt_color(theme.hops_table_row_active_selected_bg),
+        ),
+        SettingsItem::new(
+            "hops-table-row-active-selected-text-color",
+            theme::fmt_color(theme.hops_table_row_active_selected_text),
+        ),
+        SettingsItem::new(
+            "hops-table-row-inactive-selected-bg-color",
+            theme::fmt_color(theme.hops_table_row_inactive_selected_bg),
+        ),
+        SettingsItem::new(
+            "hops-table-row-inactive-selected-text-color",
+            theme::fmt_color(theme.hops_table_row_inactive_selected_text),
+        ),
         SettingsItem::new(
             "hops-chart-selected-color",
             theme::fmt_color(theme.hops_chart_selected),
@@ -539,7 +555,7 @@ pub fn settings_tabs() -> [(String, usize); 7] {
         (t!("settings_tab_dns_title").to_string(), 5),
         (t!("settings_tab_geoip_title").to_string(), 1),
         (t!("settings_tab_bindings_title").to_string(), 37),
-        (t!("settings_tab_theme_title").to_string(), 33),
+        (t!("settings_tab_theme_title").to_string(), 35),
         (t!("settings_tab_columns_title").to_string(), 0),
     ]
 }

crates/trippy-tui/src/frontend/render/table.rs

@@ -9,7 +9,7 @@ use itertools::Itertools;
 use ratatui::Frame;
 use ratatui::layout::Rect;
 use ratatui::prelude::Line;
-use ratatui::style::{Modifier, Style};
+use ratatui::style::Style;
 use ratatui::widgets::{Block, BorderType, Borders, Cell, Row, Table};
 use std::fmt::Write;
 use std::net::IpAddr;
@@ -46,7 +46,14 @@ pub fn render(f: &mut Frame<'_>, app: &mut TuiApp, rect: Rect) {
     let config = &app.tui_config;
     let widths = config.tui_columns.constraints(rect);
     let header = render_table_header(app.tui_config.theme, &config.tui_columns);
-    let selected_style = Style::default().add_modifier(Modifier::REVERSED);
+    let selected_style = match app.selected_hop() {
+        Some(hop) if !app.tracer_data().is_in_round(hop, app.selected_flow) => Style::default()
+            .fg(config.theme.hops_table_row_inactive_selected_text)
+            .bg(config.theme.hops_table_row_inactive_selected_bg),
+        _ => Style::default()
+            .fg(config.theme.hops_table_row_active_selected_text)
+            .bg(config.theme.hops_table_row_active_selected_bg),
+    };
     let rows = app
         .tracer_data()
         .hops_for_flow(app.selected_flow)

crates/trippy-tui/src/frontend/theme.rs

@@ -26,6 +26,14 @@ pub struct Theme {
     pub hops_table_row_active_text: Color,
     /// The color of text of inactive rows in the hops table.
     pub hops_table_row_inactive_text: Color,
+    /// The background color of selected active rows in the hops table.
+    pub hops_table_row_active_selected_bg: Color,
+    /// The color of text of selected active rows in the hops table.
+    pub hops_table_row_active_selected_text: Color,
+    /// The background color of selected inactive rows in the hops table.
+    pub hops_table_row_inactive_selected_bg: Color,
+    /// The color of text of selected inactive rows in the hops table.
+    pub hops_table_row_inactive_selected_text: Color,
     /// The color of the selected series in the hops chart.
     pub hops_chart_selected: Color,
     /// The color of the unselected series in the hops chart.
@@ -91,6 +99,16 @@ impl From<TuiTheme> for Theme {
             hops_table_header_text: Color::from(value.hops_table_header_text),
             hops_table_row_active_text: Color::from(value.hops_table_row_active_text),
             hops_table_row_inactive_text: Color::from(value.hops_table_row_inactive_text),
+            hops_table_row_active_selected_bg: Color::from(value.hops_table_row_active_selected_bg),
+            hops_table_row_active_selected_text: Color::from(
+                value.hops_table_row_active_selected_text,
+            ),
+            hops_table_row_inactive_selected_bg: Color::from(
+                value.hops_table_row_inactive_selected_bg,
+            ),
+            hops_table_row_inactive_selected_text: Color::from(
+                value.hops_table_row_inactive_selected_text,
+            ),
             hops_chart_selected: Color::from(value.hops_chart_selected),
             hops_chart_unselected: Color::from(value.hops_chart_unselected),
             hops_chart_axis: Color::from(value.hops_chart_axis),

crates/trippy-tui/tests/resources/snapshots/trippy_tui__print__tests__output@tui_theme_items_match.snap

@@ -1,4 +1,4 @@
 ---
 source: crates/trippy-tui/src/print.rs
 ---
-TUIthemecoloritems:bg-color,border-color,text-color,tab-text-color,hops-table-header-bg-color,hops-table-header-text-color,hops-table-row-active-text-color,hops-table-row-inactive-text-color,hops-chart-selected-color,hops-chart-unselected-color,hops-chart-axis-color,frequency-chart-bar-color,frequency-chart-text-color,flows-chart-bar-selected-color,flows-chart-bar-unselected-color,flows-chart-text-current-color,flows-chart-text-non-current-color,samples-chart-color,samples-chart-lost-color,help-dialog-bg-color,help-dialog-text-color,settings-tab-text-color,settings-dialog-bg-color,settings-table-header-text-color,settings-table-header-bg-color,settings-table-row-text-color,map-world-color,map-radius-color,map-selected-color,map-info-panel-border-color,map-info-panel-bg-color,map-info-panel-text-color,info-bar-bg-color,info-bar-text-color
+TUIthemecoloritems:bg-color,border-color,text-color,tab-text-color,hops-table-header-bg-color,hops-table-header-text-color,hops-table-row-active-text-color,hops-table-row-inactive-text-color,hops-table-row-active-selected-bg-color,hops-table-row-active-selected-text-color,hops-table-row-inactive-selected-bg-color,hops-table-row-inactive-selected-text-color,hops-chart-selected-color,hops-chart-unselected-color,hops-chart-axis-color,frequency-chart-bar-color,frequency-chart-text-color,flows-chart-bar-selected-color,flows-chart-bar-unselected-color,flows-chart-text-current-color,flows-chart-text-non-current-color,samples-chart-color,samples-chart-lost-color,help-dialog-bg-color,help-dialog-text-color,settings-tab-text-color,settings-dialog-bg-color,settings-table-header-text-color,settings-table-header-bg-color,settings-table-row-text-color,map-world-color,map-radius-color,map-selected-color,map-info-panel-border-color,map-info-panel-bg-color,map-info-panel-text-color,info-bar-bg-color,info-bar-text-color