Manually wrap commit message

- Add focus and selection to commit message

Author: cruessler

Cargo.lock

@@ -39,6 +39,7 @@ ron = "0.6"
 serde = "1.0"
 anyhow = "1.0.32"
 unicode-width = "0.1"
+textwrap = "0.12"
 
 [target.'cfg(not(windows))'.dependencies]
 pprof = { version = "0.3", features = ["flamegraph"], optional = true }

Cargo.toml

@@ -1,9 +1,10 @@
 use crate::{
     components::{
         dialog_paragraph, utils::time_to_string, CommandBlocking,
-        CommandInfo, Component, DrawableComponent,
+        CommandInfo, Component, DrawableComponent, ScrollType,
     },
-    strings,
+    keys,
+    strings::{self, commands, order},
     ui::style::SharedTheme,
 };
 use anyhow::Result;
@@ -13,7 +14,7 @@ use asyncgit::{
 };
 use crossterm::event::Event;
 use itertools::Itertools;
-use std::borrow::Cow;
+use std::{borrow::Cow, cell::Cell};
 use sync::CommitTags;
 use tui::{
     backend::Backend,
@@ -27,15 +28,21 @@ pub struct DetailsComponent {
     data: Option<CommitDetails>,
     tags: Vec<String>,
     theme: SharedTheme,
+    focused: bool,
+    current_size: Cell<(u16, u16)>,
+    selection: usize,
 }
 
 impl DetailsComponent {
     ///
-    pub const fn new(theme: SharedTheme) -> Self {
+    pub const fn new(theme: SharedTheme, focused: bool) -> Self {
         Self {
             data: None,
             tags: Vec::new(),
             theme,
+            focused,
+            current_size: Cell::new((0, 0)),
+            selection: 0,
         }
     }
 
@@ -59,21 +66,76 @@ impl DetailsComponent {
         Ok(())
     }
 
-    fn get_text_message(&self) -> Vec<Text> {
+    fn get_number_of_lines(&self, width: usize) -> Option<usize> {
         if let Some(ref data) = self.data {
             if let Some(ref message) = data.message {
-                let mut res = vec![Text::Styled(
-                    Cow::from(message.subject.clone()),
-                    self.theme
-                        .text(true, false)
-                        .modifier(Modifier::BOLD),
-                )];
+                let wrapped_title =
+                    textwrap::wrap(&message.subject, width);
 
                 if let Some(ref body) = message.body {
-                    res.push(Text::Styled(
-                        Cow::from(body),
-                        self.theme.text(true, false),
-                    ));
+                    let wrapped_message = textwrap::wrap(body, width);
+
+                    return Some(
+                        wrapped_title.len() + wrapped_message.len()
+                            - 1,
+                    );
+                }
+
+                return Some(wrapped_title.len());
+            }
+        }
+
+        None
+    }
+
+    fn get_wrapped_text_message(&self, width: usize) -> Vec<Text> {
+        if let Some(ref data) = self.data {
+            if let Some(ref message) = data.message {
+                let wrapped_title =
+                    textwrap::wrap(&message.subject, width);
+
+                let mut res: Vec<Text> = wrapped_title
+                    .iter()
+                    .enumerate()
+                    .map(|(i, line)| {
+                        let line_with_newline = format!("{}\n", line);
+
+                        Text::Styled(
+                            line_with_newline.into(),
+                            self.theme
+                                .text(
+                                    true,
+                                    self.focused
+                                        && i == self.selection,
+                                )
+                                .modifier(Modifier::BOLD),
+                        )
+                    })
+                    .collect();
+
+                if let Some(ref body) = message.body {
+                    let wrapped_message = textwrap::wrap(body, width);
+
+                    res.extend(
+                        wrapped_message.iter().enumerate().map(
+                            |(i, line)| {
+                                let line_with_newline =
+                                    format!("{}\n", line);
+
+                                Text::Styled(
+                                    line_with_newline.into(),
+                                    self.theme
+                                        .text(
+                                            true,
+                                            self.focused
+                                                && i == self
+                                                    .selection,
+                                        )
+                                        .modifier(Modifier::BOLD),
+                                )
+                            },
+                        ),
+                    );
                 }
 
                 return res;
@@ -181,6 +243,39 @@ impl DetailsComponent {
             vec![]
         }
     }
+
+    fn move_selection(
+        &mut self,
+        move_type: ScrollType,
+    ) -> Result<bool> {
+        if self.data.is_some() {
+            let old = self.selection;
+            let width = self.current_size.get().0 as usize;
+
+            if let Some(number_of_lines) =
+                self.get_number_of_lines(width)
+            {
+                let max = number_of_lines.saturating_sub(1) as usize;
+
+                let new_selection = match move_type {
+                    ScrollType::Down => old.saturating_add(1),
+                    ScrollType::Up => old.saturating_sub(1),
+                    ScrollType::Home => 0,
+                    ScrollType::End => max,
+                    _ => old,
+                };
+
+                if new_selection > max {
+                    return Ok(false);
+                }
+
+                self.selection = new_selection;
+
+                return Ok(true);
+            }
+        }
+        Ok(false)
+    }
 }
 
 impl DrawableComponent for DetailsComponent {
@@ -189,6 +284,15 @@ impl DrawableComponent for DetailsComponent {
         f: &mut Frame<B>,
         rect: Rect,
     ) -> Result<()> {
+        // We have to take the border into account which is one character on
+        // each side.
+        let border_width = 2;
+
+        self.current_size.set((
+            rect.width.saturating_sub(border_width),
+            rect.height.saturating_sub(border_width),
+        ));
+
         let chunks = Layout::default()
             .direction(Direction::Vertical)
             .constraints(
@@ -206,14 +310,17 @@ impl DrawableComponent for DetailsComponent {
             chunks[0],
         );
 
+        let wrapped_lines = self.get_wrapped_text_message(
+            self.current_size.get().0 as usize,
+        );
+
         f.render_widget(
             dialog_paragraph(
                 strings::commit::DETAILS_MESSAGE_TITLE,
-                self.get_text_message().iter(),
+                wrapped_lines.iter(),
                 &self.theme,
-                false,
-            )
-            .wrap(true),
+                self.focused,
+            ),
             chunks[1],
         );
 
@@ -224,14 +331,65 @@ impl DrawableComponent for DetailsComponent {
 impl Component for DetailsComponent {
     fn commands(
         &self,
-        _out: &mut Vec<CommandInfo>,
-        _force_all: bool,
+        out: &mut Vec<CommandInfo>,
+        force_all: bool,
     ) -> CommandBlocking {
         // visibility_blocking(self)
+
+        let width = self.current_size.get().0 as usize;
+        let number_of_lines = self.get_number_of_lines(width);
+
+        out.push(
+            CommandInfo::new(
+                commands::NAVIGATE_COMMIT_MESSAGE,
+                number_of_lines.is_some(),
+                self.focused || force_all,
+            )
+            .order(order::NAV),
+        );
+
         CommandBlocking::PassingOn
     }
 
-    fn event(&mut self, _ev: Event) -> Result<bool> {
+    fn event(&mut self, event: Event) -> Result<bool> {
+        if self.focused {
+            if let Event::Key(e) = event {
+                return match e {
+                    keys::MOVE_UP => {
+                        self.move_selection(ScrollType::Up)
+                    }
+                    keys::MOVE_DOWN => {
+                        self.move_selection(ScrollType::Down)
+                    }
+                    keys::HOME | keys::SHIFT_UP => {
+                        self.move_selection(ScrollType::Home)
+                    }
+                    keys::END | keys::SHIFT_DOWN => {
+                        self.move_selection(ScrollType::End)
+                    }
+                    _ => Ok(false),
+                };
+            }
+        }
+
         Ok(false)
     }
+
+    fn focused(&self) -> bool {
+        self.focused
+    }
+
+    fn focus(&mut self, focus: bool) {
+        if focus {
+            let width = self.current_size.get().0 as usize;
+
+            if let Some(number_of_lines) =
+                self.get_number_of_lines(width)
+            {
+                self.selection = number_of_lines.saturating_sub(1);
+            }
+        }
+
+        self.focused = focus;
+    }
 }

src/components/commit_details/details.rs

@@ -5,7 +5,7 @@ use super::{
     Component, DrawableComponent, FileTreeComponent,
 };
 use crate::{
-    accessors, queue::Queue, strings, ui::style::SharedTheme,
+    accessors, keys, queue::Queue, strings, ui::style::SharedTheme,
 };
 use anyhow::Result;
 use asyncgit::{
@@ -38,7 +38,7 @@ impl CommitDetailsComponent {
         theme: SharedTheme,
     ) -> Self {
         Self {
-            details: DetailsComponent::new(theme.clone()),
+            details: DetailsComponent::new(theme.clone(), false),
             git_commit_files: AsyncCommitFiles::new(sender),
             file_tree: FileTreeComponent::new(
                 "",
@@ -146,6 +146,28 @@ impl Component for CommitDetailsComponent {
             return Ok(true);
         }
 
+        if self.focused() {
+            if let Event::Key(e) = ev {
+                return match e {
+                    keys::FOCUS_BELOW if (self.details.focused()) => {
+                        self.details.focus(false);
+                        self.file_tree.focus(true);
+
+                        return Ok(true);
+                    }
+                    keys::FOCUS_ABOVE
+                        if (self.file_tree.focused()) =>
+                    {
+                        self.file_tree.focus(false);
+                        self.details.focus(true);
+
+                        return Ok(true);
+                    }
+                    _ => Ok(false),
+                };
+            }
+        }
+
         Ok(false)
     }
 
@@ -164,6 +186,7 @@ impl Component for CommitDetailsComponent {
         self.details.focused() || self.file_tree.focused()
     }
     fn focus(&mut self, focus: bool) {
+        self.details.focus(false);
         self.file_tree.focus(focus);
         self.file_tree.show_selection(true);
     }

src/components/commit_details/mod.rs

@@ -27,6 +27,8 @@ pub const FOCUS_WORKDIR: KeyEvent = no_mod(KeyCode::Char('w'));
 pub const FOCUS_STAGE: KeyEvent = no_mod(KeyCode::Char('s'));
 pub const FOCUS_RIGHT: KeyEvent = no_mod(KeyCode::Right);
 pub const FOCUS_LEFT: KeyEvent = no_mod(KeyCode::Left);
+pub const FOCUS_ABOVE: KeyEvent = no_mod(KeyCode::Up);
+pub const FOCUS_BELOW: KeyEvent = no_mod(KeyCode::Down);
 pub const EXIT: KeyEvent =
     with_mod(KeyCode::Char('c'), KeyModifiers::CONTROL);
 pub const EXIT_POPUP: KeyEvent = no_mod(KeyCode::Esc);

src/keys.rs

@@ -86,6 +86,13 @@ pub mod commands {
         CMD_GROUP_GENERAL,
     );
     ///
+    pub static NAVIGATE_COMMIT_MESSAGE: CommandText =
+        CommandText::new(
+            "Nav [\u{2191}\u{2193}]",
+            "navigate commit message",
+            CMD_GROUP_GENERAL,
+        );
+    ///
     pub static NAVIGATE_TREE: CommandText = CommandText::new(
         "Nav [\u{2190}\u{2191}\u{2192}\u{2193}]",
         "navigate tree view",