Packet inspector updates (#283)

## Description

Updated packet inspector to have a more clear indication of which packet
is selected, and added up and down keybinds for selecting previous and
next packet respectively

crates/packet_inspector/src/context.rs

@@ -354,6 +354,34 @@ impl Context {
         }
     }
 
+    pub fn select_previous_packet(&self) {
+        let mut selected_packet = self.selected_packet.write().expect("Poisoned RwLock");
+        if let Some(idx) = *selected_packet {
+            if idx > 0 {
+                *selected_packet = Some(idx - 1);
+            }
+        } else {
+            let packets = self.packets.read().expect("Poisoned RwLock");
+            if !packets.is_empty() {
+                *selected_packet = Some(0);
+            }
+        }
+    }
+
+    pub fn select_next_packet(&self) {
+        let mut selected_packet = self.selected_packet.write().expect("Poisoned RwLock");
+        if let Some(idx) = *selected_packet {
+            if idx < self.packets.read().expect("Poisoned RwLock").len() - 1 {
+                *selected_packet = Some(idx + 1);
+            }
+        } else {
+            let packets = self.packets.read().expect("Poisoned RwLock");
+            if !packets.is_empty() {
+                *selected_packet = Some(1);
+            }
+        }
+    }
+
     pub fn set_selected_packet(&self, idx: usize) {
         *self.selected_packet.write().expect("Poisoned RwLock") = Some(idx);
     }

crates/packet_inspector/src/main.rs

@@ -424,7 +424,10 @@ struct GuiApp {
 
     context: Arc<Context>,
     filter: String,
+
     selected_packets: BTreeMap<MetaPacket, bool>,
+    packet_filter: String,
+
     buffer: String,
     is_listening: RwLock<bool>,
     window_open: bool,
@@ -486,7 +489,10 @@ impl GuiApp {
             config,
             context,
             filter,
+
             selected_packets,
+            packet_filter: String::new(),
+
             buffer: String::new(),
             is_listening: RwLock::new(false),
             window_open: false,
@@ -549,6 +555,13 @@ impl GuiApp {
         let mut changed = false;
         self.selected_packets
             .iter_mut()
+            .filter(|(m_packet, _)| {
+                self.packet_filter.is_empty()
+                    || m_packet
+                        .name
+                        .to_lowercase()
+                        .contains(&self.packet_filter.to_lowercase())
+            })
             .for_each(|(m_packet, selected)| {
                 // todo: format, add arrows, etc
                 if ui.checkbox(selected, m_packet.name.clone()).changed() {
@@ -748,6 +761,9 @@ impl eframe::App for GuiApp {
                 ui.menu_button("Packets", |ui| {
                     ui.set_max_width(250.0);
                     ui.set_max_height(400.0);
+
+                    ui.text_edit_singleline(&mut self.packet_filter);
+
                     egui::ScrollArea::vertical()
                         .auto_shrink([true, true])
                         .show(ui, |ui| {
@@ -761,6 +777,14 @@ impl eframe::App for GuiApp {
             .min_width(150.0)
             .default_width(250.0)
             .show(ctx, |ui| {
+                if ui.input(|i| i.key_pressed(egui::Key::ArrowUp)) {
+                    self.context.select_previous_packet();
+                }
+
+                if ui.input(|i| i.key_pressed(egui::Key::ArrowDown)) {
+                    self.context.select_next_packet();
+                }
+
                 ui.horizontal(|ui| {
                     ui.heading("Packets");
 

crates/packet_inspector/src/packet_widget.rs

@@ -1,7 +1,7 @@
 use eframe::epaint::{PathShape, RectShape};
 use egui::{
-    Pos2, Rect, Response, Rgba, Rounding, Sense, Shape, Stroke, TextStyle, Ui, Vec2, Widget,
-    WidgetText,
+    Color32, Pos2, Rect, Response, Rgba, Rounding, Sense, Shape, Stroke, TextStyle, Ui, Vec2,
+    Widget, WidgetText,
 };
 use serde::{Deserialize, Serialize};
 use time::OffsetDateTime;
@@ -87,10 +87,15 @@ impl Widget for Packet {
         );
 
         let fill = match self.selected {
-            true => Rgba::from_rgba_premultiplied(0.0, 0.0, 0.0, 0.4),
+            true => Rgba::from_rgba_premultiplied(0.3, 0.3, 0.3, 0.4),
             false => Rgba::from_rgba_premultiplied(0.0, 0.0, 0.0, 0.0),
         };
 
+        let text_color: Color32 = match self.selected {
+            true => Rgba::from_rgba_premultiplied(0.0, 0.0, 0.0, 1.0).into(),
+            false => ui.visuals().strong_text_color(),
+        };
+
         if ui.is_rect_visible(rect) {
             ui.painter().add(Shape::Rect(RectShape {
                 rect,
@@ -133,7 +138,7 @@ impl Widget for Packet {
                     x: rect.left() + 55.0,
                     y: rect.top() + 6.0,
                 },
-                ui.visuals().strong_text_color(),
+                text_color,
             );
 
             timestamp.paint_with_fallback_color(