feat(tui): change binds for log scrolling and add UI hints (#9610)

### Description

This PR changes the binds for scrolling logs from `CTRL+P` and `CTRL+N`
to `u` and `d`. I'm learning into simple here, both by making the bind a
simple one-tap instead of a chord and matching up with the mnemonic
device of "**u**p and **d**own".

#### Minor hesitation

`CTRL+n` and `CTRL+p` are familiar to power users of a few terminal
tools, but I personally don't see this as a great justification for our
tool, which gets used by a much broader audience. I'm erring on the side
of simplicity, but happy to hear dissent/pushback/other thoughts.

Additionally, I've updated our UI hints slightly:
- Added the hints for these binds to the logs pane
- Separating binds using spaces instead of commas

### Testing Instructions

Pick out your favorite Turborepo and try it out!

crates/turborepo-ui/src/tui/input.rs

@@ -110,10 +110,8 @@ fn translate_key_event(options: InputOptions, key_event: KeyEvent) -> Option<Eve
         }
         // Fall through if we aren't in interactive mode
         KeyCode::Char('h') => Some(Event::ToggleSidebar),
-        KeyCode::Char('p') if key_event.modifiers == KeyModifiers::CONTROL => Some(Event::ScrollUp),
-        KeyCode::Char('n') if key_event.modifiers == KeyModifiers::CONTROL => {
-            Some(Event::ScrollDown)
-        }
+        KeyCode::Char('u') => Some(Event::ScrollUp),
+        KeyCode::Char('d') => Some(Event::ScrollDown),
         KeyCode::Char('m') => Some(Event::ToggleHelpPopup),
         KeyCode::Char('p') => Some(Event::TogglePinnedTask),
         KeyCode::Up | KeyCode::Char('k') => Some(Event::Up),

crates/turborepo-ui/src/tui/pane.rs

@@ -7,9 +7,10 @@ use tui_term::widget::PseudoTerminal;
 
 use super::{app::LayoutSections, TerminalOutput};
 
-const FOOTER_TEXT_ACTIVE: &str = "Ctrl-z - Stop interacting";
-const FOOTER_TEXT_INACTIVE: &str = "i - Interact";
+const EXIT_INTERACTIVE_HINT: &str = "Ctrl-z - Stop interacting";
+const ENTER_INTERACTIVE_HINT: &str = "i - Interact";
 const HAS_SELECTION: &str = "c - Copy selection";
+const SCROLL_LOGS: &str = "u/d - Scroll logs";
 const TASK_LIST_HIDDEN: &str = "h - Show task list";
 
 pub struct TerminalPane<'a, W> {
@@ -35,8 +36,9 @@ impl<'a, W> TerminalPane<'a, W> {
     }
 
     fn footer(&self) -> Line {
-        let build_message_vec = |footer_text: &str| -> Line {
-            let mut messages = vec![footer_text];
+        let build_message_vec = |footer_text: &[&str]| -> Line {
+            let mut messages = Vec::new();
+            messages.extend_from_slice(footer_text);
 
             if !self.has_sidebar {
                 messages.push(TASK_LIST_HIDDEN);
@@ -47,7 +49,7 @@ impl<'a, W> TerminalPane<'a, W> {
             }
 
             // Spaces are used to pad the footer text for aesthetics
-            let formatted_messages = format!("   {}", messages.join(", "));
+            let formatted_messages = format!("   {}", messages.join("   "));
 
             Line::styled(
                 formatted_messages.to_string(),
@@ -57,8 +59,8 @@ impl<'a, W> TerminalPane<'a, W> {
         };
 
         match self.section {
-            LayoutSections::Pane => build_message_vec(FOOTER_TEXT_ACTIVE),
-            LayoutSections::TaskList => build_message_vec(FOOTER_TEXT_INACTIVE),
+            LayoutSections::Pane => build_message_vec(&[EXIT_INTERACTIVE_HINT]),
+            LayoutSections::TaskList => build_message_vec(&[ENTER_INTERACTIVE_HINT, SCROLL_LOGS]),
             LayoutSections::Search { results, .. } => {
                 Line::from(format!("/ {}", results.query())).left_aligned()
             }

crates/turborepo-ui/src/tui/popup.rs

@@ -17,8 +17,8 @@ const BIND_LIST: [&str; 12] = [
     "i      - Interact with task",
     "Ctrl+z - Stop interacting with task",
     "c      - Copy logs selection (Only when logs are selected)",
-    "Ctrl+n - Scroll logs up",
-    "Ctrl+p - Scroll logs down",
+    "u      - Scroll logs up",
+    "d      - Scroll logs down",
 ];
 
 pub fn popup_area(area: Rect) -> Rect {