improve textarea (#16)

* feat: add tui-textarea WIP * refactor: ui and textarea * style: improve tui-textarea styling
djego · Oct 7, 2024 · 20e70e9 · 20e70e9
1 parent 3bf8706
commit 20e70e9
Show file tree

Hide file tree

Showing 5 changed files with 69 additions and 11 deletions.
diff --git a/Cargo.lock b/Cargo.lock
diff --git a/Cargo.toml b/Cargo.toml
@@ -12,3 +12,4 @@ serde = { version = "1.0", features = ["derive"] }
 thiserror = "1.0.64"
 tokio = { version = "1.40.0", features = ["full"] }
 toml = "0.8.19"
+tui-textarea = "0.6.1"
diff --git a/src/core/app.rs b/src/core/app.rs
@@ -6,6 +6,8 @@ use crate::core::input_mode::InputMode;
 use crate::core::pull_request::PullRequest;
 use octocrab::models::pulls::PullRequest as OctocrabPullRequest;
 use octocrab::{models::Repository, Octocrab};
+use tui_textarea::TextArea;
+
 pub struct App {
     pub error_message: Option<String>,
     pub success_message: Option<String>,
@@ -18,6 +20,7 @@ pub struct App {
     pub repo_owner: String,
     pub repo_name: String,
     pub config_pat: String,
+    pub description_text_area: TextArea<'static>,
 }
 
 impl App {
@@ -32,6 +35,8 @@ impl App {
             .map(|config| config.github.pat)
             .unwrap_or_else(|| String::from(""));
 
+        let text_area = TextArea::default();
+
         App {
             pull_request: PullRequest::new(current_branch.clone(), "main".to_string()),
             input_mode: InputMode::Normal,
@@ -44,6 +49,7 @@ impl App {
             github_repository: GithubRepository::new(),
             repo_owner,
             repo_name,
+            description_text_area: text_area,
         }
     }
 
@@ -121,6 +127,7 @@ impl App {
         self.input_mode = InputMode::Normal;
         self.current_field = 0;
         self.show_confirm_popup = false;
+        self.description_text_area = TextArea::default();
         self.clear_message();
     }
 
@@ -171,4 +178,8 @@ impl App {
             }
         }
     }
+    pub fn is_editing_description(&self) -> bool {
+        // Asumiendo que 1 es el índice para el campo 'description'
+        self.current_field == 1
+    }
 }
diff --git a/src/main.rs b/src/main.rs
@@ -100,18 +100,27 @@ fn main() -> Result<(), io::Error> {
                         app.input_mode = InputMode::Normal;
                     }
                     KeyCode::Char(c) => {
-                        let current_field = app.get_current_field_mut();
-                        current_field.push(c);
+                        if app.is_editing_description() {
+                            app.description_text_area.input(key);
+                        } else {
+                            let current_field = app.get_current_field_mut();
+                            current_field.push(c);
+                        }
                     }
                     KeyCode::Backspace => {
-                        let current_field = app.get_current_field_mut();
-                        current_field.pop();
+                        if app.is_editing_description() {
+                            app.description_text_area.input(key);
+                        } else {
+                            let current_field = app.get_current_field_mut();
+                            current_field.pop();
+                        }
                     }
                     KeyCode::Enter => {
                         let current_field_index = app.current_field;
                         let current_field = app.get_current_field_mut();
                         if current_field_index == 1 {
                             current_field.push('\n');
+                            app.description_text_area.input(key);
                         } else {
                             app.confirm_pull_request();
                         }
@@ -128,6 +137,8 @@ fn main() -> Result<(), io::Error> {
                     KeyCode::Enter | KeyCode::Char('y') => {
                         app.input_mode = InputMode::Normal;
                         app.show_confirm_popup = false;
+                        app.pull_request.description = app.description_text_area.lines().join("\n");
+
                         let result = runtime.block_on(app.create_github_pull_request());
                         match result {
                             Ok(pr) => {

diff --git a/src/ui/layout.rs b/src/ui/layout.rs
@@ -2,8 +2,8 @@ use crate::ui::util::{centered_rect, inner_area};
 use crate::App;
 use crate::InputMode;
 use ratatui::layout::{Constraint, Direction, Layout, Rect};
-use ratatui::text::{Line, Span, Text};
-use ratatui::widgets::{Block, Borders, Clear, Padding, Paragraph, Wrap};
+use ratatui::text::{Line, Span};
+use ratatui::widgets::{Block, Borders, Clear, Padding, Paragraph};
 use ratatui::{
     style::{Color, Style},
     Frame,
@@ -62,7 +62,7 @@ pub fn ui(f: &mut Frame, app: &App) {
     f.render_widget(paragraph, repo_area[0]);
 
     let description_lines = app.pull_request.description.lines().count();
-    let description_height = description_lines.min(20) + 2;
+    let description_height = description_lines.min(20) + 3;
     let form_layout = Layout::default()
         .direction(Direction::Vertical)
         .margin(1)
@@ -110,12 +110,35 @@ pub fn ui(f: &mut Frame, app: &App) {
             ),
             InputMode::Creating => (format!("{}: {}", name, value), Style::default()),
         };
+        let mut description_text = app.description_text_area.clone();
+        description_text.set_cursor_style(Style::default().fg(Color::Red));
+        if app.input_mode == InputMode::Normal && i == app.current_field {
+            description_text.set_block(
+                Block::default()
+                    .title("Description")
+                    .style(Style::default().fg(Color::Yellow)),
+            );
+        } else if app.input_mode == InputMode::Editing && i == app.current_field {
+            description_text.set_block(
+                Block::default()
+                    .title("Description")
+                    .style(Style::default().fg(Color::Green)),
+            );
+            description_text.set_cursor_style(
+                Style::default()
+                    .fg(Color::Green)
+                    .add_modifier(ratatui::style::Modifier::REVERSED),
+            );
+        } else {
+            description_text.set_block(
+                Block::default()
+                    .title("Description")
+                    .style(Style::default()),
+            );
+        }
 
         if i == 1 {
-            let paragraph = Paragraph::new(Text::from(text).style(style))
-                .block(Block::default())
-                .wrap(Wrap { trim: true });
-            f.render_widget(paragraph, form_layout[i]);
+            f.render_widget(&description_text, form_layout[i]);
         } else {
             let paragraph = Paragraph::new(Span::styled(text, style));
             f.render_widget(paragraph, form_layout[i]);