ui coming along

src/app.rs

@@ -55,6 +55,7 @@ pub struct App<'a> {
     pub should_quit: bool,
     pub tabs: TabsState<'a>,
     pub servers: Vec<Server<'a>>,
+    pub tabkeystext: Vec<&'a str>,
     pub enhanced_graphics: bool,
 }
 
@@ -65,6 +66,7 @@ impl<'a> App<'a> {
             should_quit: false,
             tabs: TabsState::new(vec!["Dashboard","Machine info","Config"]),
             servers,
+            tabkeystext: vec!["(H)otend (B)ed P(r)eset (P)rint (C)ancel (Q)uit","(Q)uit","(Q)uit"],
             enhanced_graphics,
         }
     }
@@ -78,11 +80,15 @@ impl<'a> App<'a> {
     }
 
     pub fn on_right(&mut self) {
-
+        self.tabs.next();
     }
 
     pub fn on_left(&mut self) {
+        self.tabs.previous();
+    }
 
+    pub fn on_tab(&mut self) {
+        self.tabs.next();
     }
 
     pub fn on_key(&mut self, c: char) {

src/crossterm.rs

@@ -64,6 +64,7 @@ where
                 KeyCode::Char('j') | KeyCode::Down => app.on_down(),
                 KeyCode::Char('k') | KeyCode::Up => app.on_up(),
                 KeyCode::Char('l') | KeyCode::Right => app.on_right(),
+                KeyCode::Tab => app.on_tab(),
                 KeyCode::Char(c) => app.on_key(c),
                 _ => {}
             }

src/main.rs

@@ -7,7 +7,6 @@ mod ui;
 mod crossterm;
 use crate::{
     app::App,
-    ui::ui,
 
 };
 

src/ui.rs

@@ -1,18 +1,58 @@
+use crossterm::style;
 use ratatui::{
     layout::{Constraint, Direction, Layout, Rect},
-    style::{Color, Style},
+    style::{Color, Style, Modifier},
-    text::{Line, Span, Text},
+    text::{self, Line, Span, Text},
-    widgets::{Block, Borders, Clear, List, ListItem, Paragraph, Wrap},
+    widgets::{
+        Block, Borders, Clear, List, ListItem,Tabs, Paragraph, Wrap,
+        canvas::{self, Canvas, Circle, Map, MapResolution, Rectangle},
+
+    },
+    symbols,
     Frame,
 };
 
 use crate::app::App;
 
-// ANCHOR: method_sig
-pub fn ui(frame: &mut Frame, app: &App) {
-
-}
-
 pub fn render(frame: &mut Frame, app: &mut App) {
+    let chunks = Layout::vertical([Constraint::Length(3), Constraint::Min(1), Constraint::Length(3)]).split(frame.area());
+    let tabs = app.tabs
+                .titles
+                .iter()
+                .map(|t| text::Line::from(Span::styled(*t, Style::default().fg(Color::Green))))
+                .collect::<Tabs>()
+                .block(Block::bordered().title(app.title))
+                .highlight_style(Style::default().fg(Color::Yellow))
+                .select(app.tabs.index);
+    frame.render_widget(tabs, chunks[0]);
+    match app.tabs.index {
+        0 => draw_dashboard_tab(frame, app, chunks[1]),
+        1 => draw_machine_tab(frame, app, chunks[1]),
+        2 => draw_conf_tab(frame, app, chunks[1]),
+        _ => {}
+    };
+    draw_statusbar(frame, app, chunks[2]);
+}
+
+pub fn draw_dashboard_tab(frame: &mut Frame, app: &mut App, area: Rect) {
 
 }
+
+pub fn draw_machine_tab(frame: &mut Frame, app: &mut App, area: Rect) {
+
+}
+
+pub fn draw_conf_tab(frame: &mut Frame, app: &mut App, area: Rect) {
+
+}
+
+pub fn draw_statusbar(frame: &mut Frame, app: &mut App, area: Rect) {
+    let chunks = Layout::horizontal([Constraint::Length(25), Constraint::Min(0)]).split(area);
+    let status = Block::bordered().title(Span::styled("Status", Style::default().fg(Color::Cyan).add_modifier(Modifier::BOLD),));
+    let statustext = Paragraph::new("Todo...").block(status);
+    frame.render_widget(statustext, chunks[0]);
+
+    let keysblock = Block::bordered();
+    let keystext = Paragraph::new(app.tabkeystext[app.tabs.index]).block(keysblock);
+    frame.render_widget(keystext, chunks[1]);
+}