suggestions on tab, still not working yet

client/src/components/common/autocomplete.rs

@@ -2,9 +2,10 @@
 
 use crate::config::colors::themes::Theme;
 use ratatui::{
+    buffer::Buffer,
     layout::Rect,
-    style::{Modifier, Style},
-    widgets::{Block, Borders, List, ListItem, ListState},
+    style::{Color, Modifier, Style},
+    widgets::{List, ListItem, ListState, StatefulWidget, Widget},
     Frame,
 };
 
@@ -19,25 +20,27 @@ pub fn render_autocomplete_dropdown(
     if suggestions.is_empty() {
         return; // Don't render if no suggestions
     }
+    // --- Render Background ---
+    struct GrayBackground;
+    impl Widget for GrayBackground {
+        fn render(self, area: Rect, buf: &mut Buffer) {
+            buf.set_style(area, Style::default().bg(Color::DarkGray)); // Set background
+        }
+    }
+    f.render_widget(GrayBackground, area);
 
+    // --- Render Suggestions List (without block/border) ---
     let items: Vec<ListItem> = suggestions
         .iter()
-        .map(|s| ListItem::new(s.as_str()))
+        .map(|s| ListItem::new(s.as_str()).style(Style::default().fg(theme.fg))) // Set default text color
         .collect();
 
     let list = List::new(items)
-        .block(
-            Block::default()
-                .borders(Borders::ALL)
-                .border_type(ratatui::widgets::BorderType::Plain)
-                .border_style(Style::default().fg(theme.accent)) // Highlight border
-                .style(Style::default().bg(theme.bg).fg(theme.fg)),
-        )
         .highlight_style(
             Style::default()
                 .add_modifier(Modifier::BOLD)
-                .bg(theme.highlight) // Highlight background for selected item
-                .fg(theme.bg),       // Text color for selected item
+                .bg(theme.highlight)
+                .fg(theme.bg),
         )
         .highlight_symbol("> "); // Symbol for selected item