Feat: fixing ratatui big-text and UX

src/views/render.rs

@@ -601,20 +601,38 @@ fn render_modal(frame: &mut Frame, app: &App, snapshot: &SequencerSnapshot, term
 
             inner
         }
-        Modal::Onboarding => {
-            let (desc, keys) = app.page.onboarding();
-            let text_width = 51usize; // inner width minus 2 for padding
+        Modal::Onboarding { page } => {
+            let pages = app.page.onboarding();
+            let page_idx = (*page).min(pages.len().saturating_sub(1));
+            let (desc, keys) = pages[page_idx];
+            let page_count = pages.len();
+            let text_width = 51usize;
             let desc_lines = {
                 let mut lines = 0u16;
                 for line in desc.split('\n') {
-                    lines += (line.len() as u16).max(1).div_ceil(text_width as u16);
+                    let mut col = 0usize;
+                    for word in line.split_whitespace() {
+                        let wlen = word.len();
+                        if col > 0 && col + 1 + wlen > text_width {
+                            lines += 1;
+                            col = wlen;
+                        } else {
+                            col += if col > 0 { 1 + wlen } else { wlen };
+                        }
+                    }
+                    lines += 1;
                 }
                 lines
             };
             let key_lines = keys.len() as u16;
-            let modal_height = (3 + desc_lines + 1 + key_lines + 2).min(term.height.saturating_sub(4)); // border + pad + desc + gap + keys + pad + hint
+            let modal_height = (3 + desc_lines + 1 + key_lines + 2).min(term.height.saturating_sub(4));
 
-            let inner = ModalFrame::new(&format!(" {} ", app.page.name()))
+            let title = if page_count > 1 {
+                format!(" {} ({}/{}) ", app.page.name(), page_idx + 1, page_count)
+            } else {
+                format!(" {} ", app.page.name())
+            };
+            let inner = ModalFrame::new(&title)
                 .width(57)
                 .height(modal_height)
                 .border_color(theme.modal.confirm)
@@ -650,7 +668,15 @@ fn render_modal(frame: &mut Frame, app: &App, snapshot: &SequencerSnapshot, term
             }
 
             let hint_area = Rect::new(inner.x, inner.y + inner.height - 1, inner.width, 1);
-            let hints = hint_line(&[("Enter", "don't show again"), ("any key", "dismiss")]);
+            let mut hints_vec: Vec<(&str, &str)> = Vec::new();
+            if page_count > 1 {
+                hints_vec.push(("\u{2190}\u{2192}", "page"));
+            }
+            if app.page.help_topic_index().is_some() {
+                hints_vec.push(("?", "help"));
+            }
+            hints_vec.push(("Enter", "don't show again"));
+            let hints = hint_line(&hints_vec);
             frame.render_widget(Paragraph::new(hints).alignment(Alignment::Center), hint_area);
 
             inner