feat: ✨ add real key binding glossary in the help view

Author: lucas-labs

coco/src/view/sections/builder/commit.rs

@@ -69,7 +69,6 @@ impl CommitStep {
             header_bg: theme.get("summary:bg"),
             header_fg: theme.get("summary:fg"),
             header_sec: theme.get("summary:sec"),
-            ..Default::default()
         })
         .with_title("summary")
         .with_subtitle("* required")
@@ -88,10 +87,9 @@ impl CommitStep {
             header_bg: theme.get("body:bg"),
             header_fg: theme.get("body:fg"),
             header_sec: theme.get("body:sec"),
-            ..Default::default()
         })
         .with_title("body")
-        .with_subtitle("optional")
+        .with_subtitle("(optional) alt/shift/ctrl + enter for new line")
         .with_active(false);
 
         let footer_input = LabeledTextArea::new(LabeledTextAreaTheme {
@@ -101,10 +99,9 @@ impl CommitStep {
             header_bg: theme.get("footer:bg"),
             header_fg: theme.get("footer:fg"),
             header_sec: theme.get("footer:sec"),
-            ..Default::default()
         })
         .with_title("footer")
-        .with_subtitle("optional")
+        .with_subtitle("(optional) alt/shift/ctrl + enter for new line")
         .with_active(false);
 
         Self {

coco/src/view/sections/builder/scope.rs

@@ -47,7 +47,6 @@ impl ScopeStep {
                 header_bg: theme.get("scope:bg"),
                 header_fg: theme.get("scope:fg"),
                 header_sec: theme.get("scope:sec"),
-                ..Default::default()
             })
             .with_title("Scope")
             .with_subtitle("optional")

coco/src/view/sections/help.rs

@@ -19,22 +19,32 @@ impl HelpSection {
     }
 }
 
+// "; observation => "Press 'q' or 'Ctrl+c' to quit the application",
+// "Quit the application": ["q", "Ctrl+c"]; observation => "Press 'q' or 'Ctrl+c' to quit the application",
+// "Navigate up": ["k", "Up arrow"],
+// "Navigate down": ["j", "Down arrow"],
+// "Navigate left": ["h", "Left arrow"],
+
 impl Component for HelpSection {
     fn draw(&mut self, f: &mut Frame<'_>, area: Rect) {
-        // TODO: Real help
-        //       for now, the key glossary is just a placeholder with fictitious data; should be
-        //       replaced with actual key bindings once all of them are implemented
         let sections = help! {
+            "Help" => {
+                "Toggle this help on and off": ["F2"],
+            }
             "General" => {
-                "Quit the application": ["q", "Ctrl+c"]; observation => "Press 'q' or 'Ctrl+c' to quit the application",
-                "Navigate up": ["k", "Up arrow"],
-                "Navigate down": ["j", "Down arrow"],
-                "Navigate left": ["h", "Left arrow"],
+                "Exit": ["ctrl+c"],
+                "Go to the next step": ["pg-dn"],
+                "Go to the previous step": ["pg-up"],
+            }
+            "Text Areas" => {
+                "Submit": ["enter"],
+                "New Line / carriage return": ["shift+enter", "alt+enter", "ctrl+enter"]; observation => "depends on the terminal",
             }
-            "Switches" => {
-                "Toggle switch": ["space"],
-                "Switch to ON": ["Y"],
-                "Switch to OFF": ["N"],
+            "Switch" => {
+                "Toggle the switch": ["space"],
+                "Set the switch to true": ["🠆"],
+                "Set the switch to false": ["🠄"],
+                "Accept": ["enter"],
             }
         };
 

tui/src/widgets/coco_header.rs

@@ -6,20 +6,12 @@ use matetui::ratatui::{
     widgets::Paragraph,
 };
 
+#[derive(Default)]
 pub struct CocoHeader {
     style_left: Style,
     style_right: Style,
 }
 
-impl Default for CocoHeader {
-    fn default() -> Self {
-        Self {
-            style_left: Style::default(),
-            style_right: Style::default(),
-        }
-    }
-}
-
 impl CocoHeader {
     pub fn new(style_left: Style, style_right: Style) -> Self {
         Self {