use connections component

src/app.rs

@@ -1,6 +1,6 @@
 use crate::{
     components::{ConnectionsComponent, DatabasesComponent, QueryComponent, TableComponent},
-    user_config::{Connection, UserConfig},
+    user_config::UserConfig,
 };
 use sqlx::mysql::MySqlPool;
 use strum::IntoEnumIterator;
@@ -87,48 +87,6 @@ impl App {
         }
     }
 
-    pub fn next_connection(&mut self) {
-        if let Some(config) = &self.user_config {
-            let i = match self.selected_connection.selected() {
-                Some(i) => {
-                    if i >= config.conn.len() - 1 {
-                        0
-                    } else {
-                        i + 1
-                    }
-                }
-                None => 0,
-            };
-            self.selected_connection.select(Some(i));
-        }
-    }
-
-    pub fn previous_connection(&mut self) {
-        if let Some(config) = &self.user_config {
-            let i = match self.selected_connection.selected() {
-                Some(i) => {
-                    if i == 0 {
-                        config.conn.len() - 1
-                    } else {
-                        i - 1
-                    }
-                }
-                None => 0,
-            };
-            self.selected_connection.select(Some(i));
-        }
-    }
-
-    pub fn selected_connection(&self) -> Option<&Connection> {
-        match &self.user_config {
-            Some(config) => match self.selected_connection.selected() {
-                Some(i) => config.conn.get(i),
-                None => None,
-            },
-            None => None,
-        }
-    }
-
     pub fn table_status(&self) -> Vec<String> {
         if let Some((table, _)) = self.databases.tree.selected_table() {
             return vec![

src/components/connections.rs

@@ -60,10 +60,17 @@ impl ConnectionsComponent {
         };
         self.state.select(Some(i));
     }
+
+    pub fn selected_connection(&self) -> Option<&Connection> {
+        match self.state.selected() {
+            Some(i) => self.connections.get(i),
+            None => None,
+        }
+    }
 }
 
 impl DrawableComponent for ConnectionsComponent {
-    fn draw<B: Backend>(&mut self, f: &mut Frame<B>, _area: Rect, focused: bool) -> Result<()> {
+    fn draw<B: Backend>(&mut self, f: &mut Frame<B>, _area: Rect, _focused: bool) -> Result<()> {
         let percent_x = 60;
         let percent_y = 50;
         let conns = &self.connections;
@@ -77,11 +84,7 @@ impl DrawableComponent for ConnectionsComponent {
         let tasks = List::new(connections)
             .block(Block::default().borders(Borders::ALL).title("Connections"))
             .highlight_style(Style::default().bg(Color::Blue))
-            .style(if focused {
-                Style::default()
-            } else {
-                Style::default().fg(Color::DarkGray)
-            });
+            .style(Style::default());
         let popup_layout = Layout::default()
             .direction(Direction::Vertical)
             .constraints(

src/handlers/connection_list.rs

@@ -1,4 +1,5 @@
 use crate::app::{App, FocusBlock};
+use crate::components::Component as _;
 use crate::event::Key;
 use crate::utils::{get_databases, get_tables};
 use database_tree::{Database, DatabaseTree};
@@ -7,12 +8,10 @@ use std::collections::BTreeSet;
 
 pub async fn handler(key: Key, app: &mut App) -> anyhow::Result<()> {
     match key {
-        Key::Char('j') => app.next_connection(),
-        Key::Char('k') => app.previous_connection(),
         Key::Enter => {
             app.record_table.reset(vec![], vec![]);
             app.record_table.state.select(Some(0));
-            if let Some(conn) = app.selected_connection() {
+            if let Some(conn) = app.connections.selected_connection() {
                 if let Some(pool) = app.pool.as_ref() {
                     pool.close().await;
                 }
@@ -20,7 +19,7 @@ pub async fn handler(key: Key, app: &mut App) -> anyhow::Result<()> {
                 app.pool = Some(pool);
                 app.focus_block = FocusBlock::DabataseList;
             }
-            if let Some(conn) = app.selected_connection() {
+            if let Some(conn) = app.connections.selected_connection() {
                 match &conn.database {
                     Some(database) => {
                         app.databases.tree = DatabaseTree::new(
@@ -42,7 +41,7 @@ pub async fn handler(key: Key, app: &mut App) -> anyhow::Result<()> {
                 }
             };
         }
-        _ => (),
+        key => app.connections.event(key)?,
     }
     Ok(())
 }

src/main.rs

@@ -34,7 +34,6 @@ async fn main() -> anyhow::Result<()> {
     let backend = CrosstermBackend::new(stdout);
     let mut terminal = Terminal::new(backend)?;
     let events = event::Events::new(250);
-
     let mut app = App::new(user_config.unwrap());
 
     terminal.clear()?;

src/ui/mod.rs

@@ -16,48 +16,13 @@ pub mod scrolllist;
 
 pub fn draw<B: Backend>(f: &mut Frame<'_, B>, app: &mut App) -> anyhow::Result<()> {
     if let FocusBlock::ConnectionList = app.focus_block {
-        let percent_x = 60;
-        let percent_y = 50;
-        let conns = &app.user_config.as_ref().unwrap().conn;
-        let connections: Vec<ListItem> = conns
-            .iter()
-            .map(|i| {
-                ListItem::new(vec![Spans::from(Span::raw(i.database_url()))])
-                    .style(Style::default())
-            })
-            .collect();
-        let tasks = List::new(connections)
-            .block(Block::default().borders(Borders::ALL).title("Connections"))
-            .highlight_style(Style::default().bg(Color::Blue))
-            .style(match app.focus_block {
-                FocusBlock::ConnectionList => Style::default(),
-                _ => Style::default().fg(Color::DarkGray),
-            });
-        let popup_layout = Layout::default()
-            .direction(Direction::Vertical)
-            .constraints(
-                [
-                    Constraint::Percentage((100 - percent_y) / 2),
-                    Constraint::Percentage(percent_y),
-                    Constraint::Percentage((100 - percent_y) / 2),
-                ]
-                .as_ref(),
-            )
-            .split(f.size());
-
-        let area = Layout::default()
-            .direction(Direction::Horizontal)
-            .constraints(
-                [
-                    Constraint::Percentage((100 - percent_x) / 2),
-                    Constraint::Percentage(percent_x),
-                    Constraint::Percentage((100 - percent_x) / 2),
-                ]
-                .as_ref(),
-            )
-            .split(popup_layout[1])[1];
-        f.render_widget(Clear, area);
-        f.render_stateful_widget(tasks, area, &mut app.selected_connection);
+        app.connections.draw(
+            f,
+            Layout::default()
+                .constraints([Constraint::Percentage(100)])
+                .split(f.size())[0],
+            true,
+        )?;
         return Ok(());
     }