@brimveyn/aimux 1.14.2 → 1.14.4

package/src/ui/components/git/pane/git-pane-header.tsx

@@ -0,0 +1,127 @@
+import { memo, useCallback } from 'react'
+
+import type { GitPanelState } from '../../../../state/types'
+
+import { useAppStore } from '../../../../state/app-store'
+import { dispatchGlobal, runSideEffectGlobal } from '../../../../state/dispatch-ref'
+import { useTheme } from '../../../theme'
+
+interface GitPaneHeaderProps {
+  gitPanel: GitPanelState
+  projectPath: string | undefined
+  headOffset?: number
+  baseLabel?: string
+}
+
+export const GitPaneHeader = memo(function GitPaneHeader({
+  baseLabel,
+  gitPanel,
+  headOffset = 0,
+  projectPath,
+}: GitPaneHeaderProps) {
+  const t = useTheme()
+  const fileListMode = useAppStore((s) => s.gitPane.fileListMode)
+  const nextFileListMode = fileListMode === 'tree' ? 'flat' : 'tree'
+  const toggleListMode = useCallback(() => {
+    dispatchGlobal({ type: 'git-mode-toggle-file-list-mode' })
+    runSideEffectGlobal({ mode: nextFileListMode, type: 'persist-git-file-list-mode' })
+  }, [nextFileListMode])
+
+  const hasProject = projectPath != null && projectPath !== ''
+  if (!hasProject) return null
+  if (gitPanel.error !== null) return null
+
+  const branch = gitPanel.branch
+  const branchLabel = branch != null && branch !== '' ? branch : 'detached'
+  const branchIsResolved = branch != null && branch !== ''
+
+  const ahead = gitPanel.ahead
+  const behind = gitPanel.behind
+  const showAhead = ahead > 0
+  const showBehind = behind > 0
+  const showTracking = showAhead || showBehind
+
+  const showToggle = gitPanel.files.length > 0
+  const showHistorical = headOffset > 0
+  const showReviewBase = baseLabel != null && baseLabel !== ''
+  const showScope = showHistorical || showReviewBase
+
+  return (
+    <box flexDirection="column" flexShrink={0} paddingBottom={1}>
+      <box flexDirection="row" justifyContent="space-between">
+        <box flexDirection="row" flexShrink={1} overflow="hidden">
+          <text selectable={false} fg={t.textMuted} wrapMode="none">
+            {'\u{e702}'}
+          </text>
+          <text selectable={false} fg={t.textMuted} wrapMode="none">
+            {' '}
+          </text>
+          <text selectable={false} fg={branchIsResolved ? t.text : t.textMuted} wrapMode="none">
+            {branchIsResolved ? <strong>{branchLabel}</strong> : branchLabel}
+          </text>
+        </box>
+        <box flexDirection="row" flexShrink={0} gap={2}>
+          {showTracking ? (
+            <box flexDirection="row" gap={1}>
+              {showAhead ? (
+                <text selectable={false} fg={t.textMuted} wrapMode="none">
+                  {`↑${ahead}`}
+                </text>
+              ) : null}
+              {showBehind ? (
+                <text selectable={false} fg={t.textMuted} wrapMode="none">
+                  {`↓${behind}`}
+                </text>
+              ) : null}
+            </box>
+          ) : null}
+          {showToggle ? (
+            <box flexDirection="row" gap={1} onMouseDown={toggleListMode}>
+              <text
+                selectable={false}
+                fg={fileListMode === 'tree' ? t.primary : t.textMuted}
+                wrapMode="none"
+              >
+                tree
+              </text>
+              <text selectable={false} fg={t.textMuted} wrapMode="none">
+                |
+              </text>
+              <text
+                selectable={false}
+                fg={fileListMode === 'flat' ? t.primary : t.textMuted}
+                wrapMode="none"
+              >
+                flat
+              </text>
+            </box>
+          ) : null}
+        </box>
+      </box>
+      {showScope ? (
+        <box flexDirection="row" gap={2}>
+          {showHistorical ? (
+            <text selectable={false} fg={t.warning} wrapMode="none">
+              <strong>HEAD~{headOffset}</strong>
+            </text>
+          ) : null}
+          {showHistorical ? (
+            <text selectable={false} fg={t.textMuted} wrapMode="none">
+              [ newer · ] older
+            </text>
+          ) : null}
+          {showReviewBase ? (
+            <text selectable={false} fg={t.primary} wrapMode="none">
+              <strong>{baseLabel}</strong>
+            </text>
+          ) : null}
+          {showReviewBase ? (
+            <text selectable={false} fg={t.textMuted} wrapMode="none">
+              b: back
+            </text>
+          ) : null}
+        </box>
+      ) : null}
+    </box>
+  )
+})

package/src/ui/components/git/pane/git-pane-widget.tsx

@@ -7,6 +7,7 @@ import { useRepoDiscovery } from '../../../../git/use-repo-discovery'
 import { useAppStore } from '../../../../state/app-store'
 import { getSessionProjectPath } from '../../../../state/session-worktrees'
 import { GitPanel } from '../git-panel'
+import { GitPaneHeader } from './git-pane-header'
 
 interface GitPaneWidgetProps {
   pollingEnabled: boolean
@@ -43,15 +44,20 @@ export const GitPaneWidget = memo(function GitPaneWidget({ pollingEnabled }: Git
   const display = lastGoodRef.current ?? gitPanel
 
   return (
-    <GitPanel
-      collapsedFolders={gitMode.collapsedFolders}
-      compact={treeCompaction}
-      diffCountConfig={diffCountConfig}
-      fileListMode={gitFileListMode}
-      gitPanel={display}
-      pathConfig={pathConfig}
-      projectPath={projectPath}
-      selectedEntryKey={gitMode.selectedEntryKey}
-    />
+    <box flexDirection="column" flexGrow={1} flexShrink={1} flexBasis={0} overflow="hidden">
+      <GitPaneHeader gitPanel={display} projectPath={projectPath} />
+      <GitPanel
+        collapsedFolders={gitMode.collapsedFolders}
+        compact={treeCompaction}
+        diffCountConfig={diffCountConfig}
+        fileListMode={gitFileListMode}
+        gitPanel={display}
+        pathConfig={pathConfig}
+        projectPath={projectPath}
+        selectedEntryKey={gitMode.selectedEntryKey}
+        showFileListToggle={false}
+        showRemoteTracking={false}
+      />
+    </box>
   )
 })

package/src/ui/components/layout/terminal-pane.tsx

@@ -10,6 +10,7 @@ import { type MeasuredPaneRect, usePaneSizeReport } from '../../../app-runtime/u
 import { logInputDebug } from '../../../debug/input-log'
 import { dispatchGlobal, runSideEffectGlobal } from '../../../state/dispatch-ref'
 import { type ContextMenuItem, openContextMenu } from '../../context-menu/controller'
+import { resolvePaletteIndex } from '../../host-palette'
 import { getCurrentTheme, useTheme } from '../../theme'
 import { ContextMenuBox } from '../overlays/context-menu/context-menu-box'
 
@@ -76,8 +77,16 @@ function renderSpan(span: TerminalSpan, key: string): ReactNode {
     node = <strong>{node}</strong>
   }
 
+  // Palette indices are resolved here (not in the daemon) so they pick up
+  // the host terminal's actual ANSI palette queried at startup.
+  const fg =
+    span.fgPalette !== undefined
+      ? resolvePaletteIndex(span.fgPalette)
+      : (span.fg ?? getCurrentTheme().text)
+  const bg = span.bgPalette !== undefined ? resolvePaletteIndex(span.bgPalette) : span.bg
+
   return (
-    <span key={key} fg={span.fg ?? getCurrentTheme().text} bg={span.bg}>
+    <span key={key} fg={fg} bg={bg}>
       {node}
     </span>
   )

package/src/ui/host-palette.ts

@@ -0,0 +1,75 @@
+// Resolves ANSI palette indices (0-255) to hex strings using the host
+// terminal's actual palette, queried via OSC 4 at startup (see index.tsx).
+//
+// Before detection completes — or when the host terminal doesn't respond —
+// FALLBACK_PALETTE (xterm defaults) is used. Indices ≥16 fall back to the
+// universal 6×6×6 cube + grayscale ramp, which every terminal agrees on.
+
+const FALLBACK_PALETTE: readonly string[] = [
+  '#000000',
+  '#cd0000',
+  '#00cd00',
+  '#cdcd00',
+  '#0000ee',
+  '#cd00cd',
+  '#00cdcd',
+  '#e5e5e5',
+  '#7f7f7f',
+  '#ff0000',
+  '#00ff00',
+  '#ffff00',
+  '#5c5cff',
+  '#ff00ff',
+  '#00ffff',
+  '#ffffff',
+]
+
+const CUBE_CHANNELS = [0, 95, 135, 175, 215, 255] as const
+
+const hostPalette: string[] = [...FALLBACK_PALETTE]
+
+function toHex(value: number): string {
+  return `#${value.toString(16).padStart(6, '0')}`
+}
+
+function paletteFromFormula(index: number): string {
+  if (index >= 232) {
+    const shade = 8 + (index - 232) * 10
+    return toHex((shade << 16) | (shade << 8) | shade)
+  }
+
+  const normalized = index - 16
+  const r = Math.floor(normalized / 36)
+  const g = Math.floor((normalized % 36) / 6)
+  const b = normalized % 6
+  return toHex(
+    ((CUBE_CHANNELS[r] ?? 0) << 16) | ((CUBE_CHANNELS[g] ?? 0) << 8) | (CUBE_CHANNELS[b] ?? 0)
+  )
+}
+
+/** Replace entries 0..N-1 of the resolver with values queried from the host
+ *  terminal. Null entries keep the existing fallback (terminal didn't respond
+ *  for that index). Safe to call before any snapshots have been rendered. */
+export function setHostPalette(palette: readonly (string | null)[]): void {
+  for (let index = 0; index < palette.length; index += 1) {
+    const value = palette[index]
+    if (typeof value === 'string' && value.length > 0) {
+      hostPalette[index] = value
+    }
+  }
+}
+
+/** Resolve an ANSI palette index (0-255) to a hex color. Indices 0-15 use
+ *  the host-queried palette (or xterm fallback); 16-255 use the universal
+ *  cube/grayscale formula unless the host explicitly customized them. */
+const BLACK = '#000000'
+const WHITE = '#ffffff'
+
+export function resolvePaletteIndex(index: number): string {
+  if (index < 0) return BLACK
+  const override = hostPalette[index]
+  if (typeof override === 'string' && override.length > 0) return override
+  if (index < 16) return FALLBACK_PALETTE.at(index) ?? BLACK
+  if (index > 255) return WHITE
+  return paletteFromFormula(index)
+}