trigger dropdown, not working at all, needs proper implementation, ready for debug

client/src/components/common/autocomplete.rs

@@ -0,0 +1,50 @@
+// src/components/common/autocomplete.rs
+
+use crate::config::colors::themes::Theme;
+use ratatui::{
+    layout::Rect,
+    style::{Modifier, Style},
+    widgets::{Block, Borders, List, ListItem, ListState},
+    Frame,
+};
+
+/// Renders a bordered list dropdown for autocomplete suggestions.
+pub fn render_autocomplete_dropdown(
+    f: &mut Frame,
+    area: Rect, // The area where the dropdown should be rendered
+    theme: &Theme,
+    suggestions: &[String],
+    selected_index: Option<usize>,
+) {
+    if suggestions.is_empty() {
+        return; // Don't render if no suggestions
+    }
+
+    let items: Vec<ListItem> = suggestions
+        .iter()
+        .map(|s| ListItem::new(s.as_str()))
+        .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
+        )
+        .highlight_symbol("> "); // Symbol for selected item
+
+    // Create a state for the list to handle selection highlighting
+    let mut list_state = ListState::default();
+    list_state.select(selected_index);
+
+    f.render_stateful_widget(list, area, &mut list_state);
+}
+