tmux-ide 2.9.0-beta.37 → 2.9.0-beta.38

package/bin/cli.js

@@ -11279,7 +11279,7 @@ var require_package = __commonJS({
   "package.json"(exports, module) {
     module.exports = {
       name: "tmux-ide",
-      version: "2.9.0-beta.37",
+      version: "2.9.0-beta.38",
       description: "A visual, agent-aware IDE for any tmux session, with optional workspace presets",
       type: "module",
       bin: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tmux-ide",
-  "version": "2.9.0-beta.37",
+  "version": "2.9.0-beta.38",
   "description": "A visual, agent-aware IDE for any tmux session, with optional workspace presets",
   "type": "module",
   "bin": {

package/packages/daemon/dist/tui/mirror/runtime/application-machine-sidebar.jsx

@@ -6,6 +6,7 @@ import { fleetConnectionMessage, } from "@tmux-ide/daemon-client/fleet-connectio
 import { terminalAgentStatusLabel } from "./application-terminal-workspace-policy.js";
 import { For, Show, createEffect, createMemo, createSignal, } from "solid-js";
 import { clipTerminal, friendlySessionLabel } from "../terminal-text.js";
+import { KeyHint } from "../ui/key-hint.jsx";
 import { NavigationRow } from "../ui/navigation-row.jsx";
 import { Surface } from "../ui/surface.jsx";
 import { useKeyboardRoute } from "../ui/keyboard-router.jsx";
@@ -302,10 +303,14 @@ export function ApplicationMachineSidebar(props) {
         return true;
     });
     return (<Surface id="application-machine-sidebar" theme={props.theme} variant="panel" width={props.width} height={props.height} flexShrink={0} flexDirection="column" overflow="hidden">
-      <text height={1} fg={props.theme.roles.text.secondary}>
-        {" "}
-        {props.model.tabs?.().length ? "Machines · F9 tabs · ?" : "Machines · ? help"}
-      </text>
+      <box height={1} flexShrink={0} flexDirection="row" overflow="hidden">
+        <text fg={props.theme.roles.text.secondary}>{" Machines"}</text>
+        <box flexGrow={1}/>
+        <Show when={props.model.tabs?.().length && props.width >= 28}>
+          <KeyHint theme={props.theme} keys="F9" label="Tabs" quiet/>
+        </Show>
+        <KeyHint theme={props.theme} keys="?" label={props.width >= 20 ? "Help" : undefined} quiet button onPress={() => setShowHelp(!showHelp())}/>
+      </box>
       <For each={visibleTabs()}>
         {(tab) => (<box height={1} flexDirection="row">
             <NavigationRow theme={props.theme} width={Math.max(1, props.width - 4)} id={`fleet-tab:${tab.key}`} label={`${tab.hostLabel} / ${tab.label}`} marker={tab.active ? "●" : "○"} detail={tab.available ? "" : "offline"} focused={false} onActivate={() => props.model.onOpenTab?.(tab.key)}/>
@@ -417,10 +422,10 @@ export function ApplicationMachineSidebar(props) {
         </text>
       </Show>
       <Show when={props.model.onOpenSwitcher}>
-        <NavigationRow theme={props.theme} id="machine:switcher" label="Sessions" detail="F6" marker=" " width={props.width} onActivate={() => props.model.onOpenSwitcher?.()}/>
+        <KeyHint theme={props.theme} keys="F6" label="Sessions" width={props.width} quiet button onPress={() => props.model.onOpenSwitcher?.()}/>
       </Show>
       <Show when={props.model.onOpenAttention}>
-        <NavigationRow theme={props.theme} id="machine:attention" label={`Attention (${props.model.groups().reduce((sum, group) => sum + (group.state === "ready" ? (group.agents ?? []).filter((agent) => agent.attention && !agent.disabled).length : 0), 0)}) · F7`} marker="!" width={props.width} onActivate={() => props.model.onOpenAttention?.()}/>
+        <KeyHint theme={props.theme} keys="F7" label={`Attention (${props.model.groups().reduce((sum, group) => sum + (group.state === "ready" ? (group.agents ?? []).filter((agent) => agent.attention && !agent.disabled).length : 0), 0)})`} width={props.width} quiet button onPress={() => props.model.onOpenAttention?.()}/>
       </Show>
       <Show when={controlsHeight() > 0 && controlGroup()}>
         {(group) => (<>
@@ -429,12 +434,12 @@ export function ApplicationMachineSidebar(props) {
                 ? fleetConnectionMessage(group().diagnostic)
                 : connectionDetail(group())}
             </text>
-            <NavigationRow theme={props.theme} id="machine:retry" label="Retry connection (R)" marker="↻" width={props.width} onActivate={() => props.model.onRetryMachine?.(group().id)}/>
-            <NavigationRow theme={props.theme} id="machine:disconnect" label="Disconnect (D)" marker="×" width={props.width} onActivate={() => props.model.onDisconnectMachine?.(group().id)}/>
+            <KeyHint theme={props.theme} keys="R" label="Retry connection" width={props.width} quiet button onPress={() => props.model.onRetryMachine?.(group().id)}/>
+            <KeyHint theme={props.theme} keys="D" label="Disconnect" width={props.width} quiet button onPress={() => props.model.onDisconnectMachine?.(group().id)}/>
           </>)}
       </Show>
       <For each={props.model.onAddMachine ? [props.model.onAddMachine] : []}>
-        {(add) => (<NavigationRow theme={props.theme} id="machine:add" label="Add machine" detail="A" marker=" " width={props.width} onActivate={add}/>)}
+        {(add) => (<KeyHint theme={props.theme} keys="A" label="Add machine" width={props.width} quiet button onPress={add}/>)}
       </For>
     </Surface>);
 }

package/packages/daemon/src/tui/mirror/runtime/application-machine-sidebar.tsx

@@ -21,6 +21,7 @@ import {
 } from "solid-js";
 import { clipTerminal, friendlySessionLabel } from "../terminal-text.ts";
 import type { SemanticThemeSnapshot } from "../theme.ts";
+import { KeyHint } from "../ui/key-hint.tsx";
 import { NavigationRow } from "../ui/navigation-row.tsx";
 import { Surface } from "../ui/surface.tsx";
 import { useKeyboardRoute } from "../ui/keyboard-router.tsx";
@@ -458,10 +459,21 @@ export function ApplicationMachineSidebar(props: {
       flexDirection="column"
       overflow="hidden"
     >
-      <text height={1} fg={props.theme.roles.text.secondary}>
-        {" "}
-        {props.model.tabs?.().length ? "Machines · F9 tabs · ?" : "Machines · ? help"}
-      </text>
+      <box height={1} flexShrink={0} flexDirection="row" overflow="hidden">
+        <text fg={props.theme.roles.text.secondary}>{" Machines"}</text>
+        <box flexGrow={1} />
+        <Show when={props.model.tabs?.().length && props.width >= 28}>
+          <KeyHint theme={props.theme} keys="F9" label="Tabs" quiet />
+        </Show>
+        <KeyHint
+          theme={props.theme}
+          keys="?"
+          label={props.width >= 20 ? "Help" : undefined}
+          quiet
+          button
+          onPress={() => setShowHelp(!showHelp())}
+        />
+      </box>
       <For each={visibleTabs()}>
         {(tab) => (
           <box height={1} flexDirection="row">
@@ -653,24 +665,25 @@ export function ApplicationMachineSidebar(props: {
         </text>
       </Show>
       <Show when={props.model.onOpenSwitcher}>
-        <NavigationRow
+        <KeyHint
           theme={props.theme}
-          id="machine:switcher"
+          keys="F6"
           label="Sessions"
-          detail="F6"
-          marker=" "
           width={props.width}
-          onActivate={() => props.model.onOpenSwitcher?.()}
+          quiet
+          button
+          onPress={() => props.model.onOpenSwitcher?.()}
         />
       </Show>
       <Show when={props.model.onOpenAttention}>
-        <NavigationRow
+        <KeyHint
           theme={props.theme}
-          id="machine:attention"
-          label={`Attention (${props.model.groups().reduce((sum, group) => sum + (group.state === "ready" ? (group.agents ?? []).filter((agent) => agent.attention && !agent.disabled).length : 0), 0)}) · F7`}
-          marker="!"
+          keys="F7"
+          label={`Attention (${props.model.groups().reduce((sum, group) => sum + (group.state === "ready" ? (group.agents ?? []).filter((agent) => agent.attention && !agent.disabled).length : 0), 0)})`}
           width={props.width}
-          onActivate={() => props.model.onOpenAttention?.()}
+          quiet
+          button
+          onPress={() => props.model.onOpenAttention?.()}
         />
       </Show>
       <Show when={controlsHeight() > 0 && controlGroup()}>
@@ -681,35 +694,37 @@ export function ApplicationMachineSidebar(props: {
                 ? fleetConnectionMessage(group().diagnostic!)
                 : connectionDetail(group())}
             </text>
-            <NavigationRow
+            <KeyHint
               theme={props.theme}
-              id="machine:retry"
-              label="Retry connection (R)"
-              marker="↻"
+              keys="R"
+              label="Retry connection"
               width={props.width}
-              onActivate={() => props.model.onRetryMachine?.(group().id)}
+              quiet
+              button
+              onPress={() => props.model.onRetryMachine?.(group().id)}
             />
-            <NavigationRow
+            <KeyHint
               theme={props.theme}
-              id="machine:disconnect"
-              label="Disconnect (D)"
-              marker="×"
+              keys="D"
+              label="Disconnect"
               width={props.width}
-              onActivate={() => props.model.onDisconnectMachine?.(group().id)}
+              quiet
+              button
+              onPress={() => props.model.onDisconnectMachine?.(group().id)}
             />
           </>
         )}
       </Show>
       <For each={props.model.onAddMachine ? [props.model.onAddMachine] : []}>
         {(add) => (
-          <NavigationRow
+          <KeyHint
             theme={props.theme}
-            id="machine:add"
+            keys="A"
             label="Add machine"
-            detail="A"
-            marker=" "
             width={props.width}
-            onActivate={add}
+            quiet
+            button
+            onPress={add}
           />
         )}
       </For>

package/packages/daemon/src/tui/mirror/runtime/application-shell-view.tsx

@@ -395,6 +395,16 @@ export function ApplicationShellView(props: ApplicationShellViewProps): JSX.Elem
             }}
           >
             <ApplicationShell
+              onFooterAction={(key) => {
+                props.machineSidebar?.onBlur?.();
+                if (key === "F6") props.machineSidebar?.onOpenSwitcher?.();
+                else if (key === "F7") props.machineSidebar?.onOpenAttention?.();
+                else
+                  props.onPaletteActivate?.(
+                    props.sidebarVisible === false ? "show-sidebar" : "hide-sidebar",
+                    "mouse",
+                  );
+              }}
               footerContext={props.surface() === "home" ? "home" : "terminals"}
               scrollback={props.surface() === "terminals" && scrollback()}
               rightChips={

package/packages/daemon/src/tui/mirror/shell-chrome-view.tsx

@@ -164,6 +164,7 @@ export interface ShellStatusStripProps {
   tool?: string | null;
   dockMode?: string | null;
   focus?: string | null;
+  onFooterAction?: (key: "F6" | "F7" | "F10") => void;
   scrollback?: boolean;
   notification: string | null;
   transient?: string | null;
@@ -219,7 +220,26 @@ export function ContextStatusBar(props: ShellStatusStripProps) {
           when={showMessage()}
           fallback={
             <For each={hints()}>
-              {(hint) => <KeyHint theme={props.theme} keys={hint.keys} label={hint.label} quiet />}
+              {(hint) => {
+                const action = () =>
+                  hint.keys === "F6" || hint.keys === "F7" || hint.keys === "F10"
+                    ? hint.keys
+                    : null;
+                return (
+                  <KeyHint
+                    theme={props.theme}
+                    keys={hint.keys}
+                    label={hint.label}
+                    quiet
+                    button={action() !== null}
+                    onPress={
+                      action() && props.onFooterAction
+                        ? () => props.onFooterAction?.(action()!)
+                        : undefined
+                    }
+                  />
+                );
+              }}
             </For>
           }
         >

package/packages/daemon/src/tui/mirror/workspace/application-shell-view.tsx

@@ -11,6 +11,7 @@ import type { SemanticThemeSnapshot } from "../theme.ts";
 import type { ApplicationShellProjection } from "./application-shell.ts";
 
 export interface ApplicationShellProps {
+  onFooterAction?: (key: "F6" | "F7" | "F10") => void;
   scrollback?: boolean;
   footerContext?: "home" | "terminals";
   theme: SemanticThemeSnapshot;
@@ -145,6 +146,7 @@ export function ApplicationShell(props: ApplicationShellProps) {
               props.showToolStatus === false ? null : props.projection.semantic.bottomDock.mode
             }
             focus={props.focusLabel ?? applicationShellFocusLabel(props.projection)}
+            onFooterAction={props.onFooterAction}
             scrollback={props.scrollback}
             notification={props.projection.semantic.statusStrip.message}
             transient={props.note}