@brimveyn/aimux 1.20.4 → 1.21.0

package/src/state/session-persistence.ts

@@ -42,9 +42,11 @@ export function serializeWorkspace(state: AppState): WorkspaceSnapshotV1 {
     layoutTree: Object.values(state.layoutTrees)[0] ?? undefined,
     layoutTrees: Object.keys(state.layoutTrees).length > 0 ? state.layoutTrees : undefined,
     savedAt: new Date().toISOString(),
+    // Mirror of the left bar. `isWorkspaceSnapshotV1` requires this key —
+    // dropping it invalidates every entry in the session catalog.
     sidebar: {
-      visible: state.sidebar.visible,
-      width: state.sidebar.width,
+      visible: state.bars.left.visible,
+      width: state.bars.left.width,
     },
     tabGroupMap: Object.keys(state.tabGroupMap).length > 0 ? state.tabGroupMap : undefined,
     tabs: state.tabs.map((tab) => ({
@@ -277,10 +279,7 @@ export function restoreWorkspaceState(
   state: AppState,
   workspaceSnapshot: WorkspaceSnapshotV1 | undefined,
   options: RestoreOptions = {}
-): Pick<
-  AppState,
-  'tabs' | 'activeTabId' | 'focusMode' | 'sidebar' | 'layoutTrees' | 'tabGroupMap'
-> &
+): Pick<AppState, 'tabs' | 'activeTabId' | 'focusMode' | 'layoutTrees' | 'tabGroupMap'> &
   Partial<Pick<AppState, 'lastActiveTabByWorktree'>> {
   const tabs = restoreTabsFromWorkspace(workspaceSnapshot, options)
   const activeTabId =
@@ -305,7 +304,6 @@ export function restoreWorkspaceState(
     activeTabId,
     focusMode: 'navigation',
     layoutTrees,
-    sidebar: state.sidebar,
     tabGroupMap,
     tabs: orderedTabs,
     ...(persistedLastActiveTab ? { lastActiveTabByWorktree: persistedLastActiveTab } : {}),

package/src/state/store.ts

@@ -1,5 +1,6 @@
 import type { WorktreeTemplate } from '../config'
 
+import { clampBarWidth, KNOWN_WIDGET_IDS } from './bars'
 import { reduceAutoCommit } from './reducers/auto-commit-state'
 import { emptyGitMode, reduceGitModeState } from './reducers/git-mode-state'
 import { emptyGitPanel, reduceGitPanelState } from './reducers/git-panel-state'
@@ -12,26 +13,22 @@ import { filterSnippets } from './selectors'
 import {
   type AppAction,
   type AppState,
+  type BarsState,
   EMPTY_AUTO_COMMIT_STATE,
   EMPTY_MULTI_REPO_STATE,
   type GitModeState,
-  type GitPaneMode,
-  type GitPanePosition,
   type GitPaneState,
   type SessionRecord,
   type SnippetRecord,
 } from './types'
 
-const DEFAULT_SIDEBAR_WIDTH = 28
-const DEFAULT_SIDEBAR_MIN_WIDTH = 18
-const DEFAULT_SIDEBAR_MAX_WIDTH = 42
 const DEFAULT_TERMINAL_COLS = 80
 const DEFAULT_TERMINAL_ROWS = 24
 
 export interface InitialStateOverrides {
   gitMode?: Partial<GitModeState>
   gitPane?: Partial<GitPaneState>
-  sidebar?: Pick<AppState['sidebar'], 'visible' | 'width'>
+  bars?: BarsState
   sessionBarVisible?: boolean
   worktreeTemplates?: WorktreeTemplate[]
 }
@@ -39,26 +36,37 @@ export interface InitialStateOverrides {
 const DEFAULT_GIT_PANE: GitPaneState = {
   diffCount: { enabled: true },
   diffModeRatio: 0.35,
-  embeddedRatio: 0.5,
   fileListMode: 'tree',
-  mode: 'embedded',
-  paneRatio: 0.5,
   path: { enabled: true },
-  position: 'bottom',
   prefetchRadius: 5,
   treeCompaction: true,
-  visible: true,
 }
 
-function resolveGitPanePosition(mode: GitPaneMode, position: GitPanePosition): GitPanePosition {
-  if (mode === 'embedded') {
-    return position === 'top' || position === 'bottom' ? position : 'bottom'
-  }
-  return position === 'left' || position === 'right' ? position : 'left'
+export const DEFAULT_BARS: BarsState = {
+  left: {
+    visible: true,
+    widgets: [
+      { grow: 50, id: 'workspaces', visible: true },
+      { grow: 50, id: 'git', visible: true },
+    ],
+    width: 28,
+  },
+  right: { visible: false, widgets: [], width: 40 },
 }
 
-function clampSidebarWidth(width: number): number {
-  return Math.min(DEFAULT_SIDEBAR_MAX_WIDTH, Math.max(DEFAULT_SIDEBAR_MIN_WIDTH, width))
+/**
+ * Drop widget ids this build cannot render (config written by a newer or
+ * patched version) and normalise widths — the only place unknown ids can enter.
+ */
+function sanitizeBars(bars: BarsState): BarsState {
+  const sanitizeBar = (bar: BarsState[keyof BarsState]): BarsState[keyof BarsState] => ({
+    ...bar,
+    widgets: bar.widgets
+      .filter((widget) => (KNOWN_WIDGET_IDS as readonly string[]).includes(widget.id))
+      .map((widget) => ({ ...widget, grow: Math.max(1, Math.round(widget.grow)) })),
+    width: clampBarWidth(bar.width),
+  })
+  return { left: sanitizeBar(bars.left), right: sanitizeBar(bars.right) }
 }
 
 export function createInitialState(
@@ -68,24 +76,15 @@ export function createInitialState(
   showSessionPicker = false,
   overrides: InitialStateOverrides = {}
 ): AppState {
-  const gitPaneMode = overrides.gitPane?.mode ?? DEFAULT_GIT_PANE.mode
-  const gitPanePosition = resolveGitPanePosition(
-    gitPaneMode,
-    overrides.gitPane?.position ?? DEFAULT_GIT_PANE.position
-  )
   return {
     activeTabId: null,
     autoCommit: EMPTY_AUTO_COMMIT_STATE,
+    bars: sanitizeBars(overrides.bars ?? DEFAULT_BARS),
     currentSessionId: null,
     customCommands,
     focusMode: showSessionPicker ? 'command-edit' : 'navigation',
     gitMode: { ...emptyGitMode(), ...overrides.gitMode },
-    gitPane: {
-      ...DEFAULT_GIT_PANE,
-      ...overrides.gitPane,
-      mode: gitPaneMode,
-      position: gitPanePosition,
-    },
+    gitPane: { ...DEFAULT_GIT_PANE, ...overrides.gitPane },
     gitPanel: emptyGitPanel(),
     lastActiveTabByWorktree: {},
     layout: {
@@ -109,12 +108,6 @@ export function createInitialState(
     },
     sessions,
     sessionStatuses: {},
-    sidebar: {
-      maxWidth: DEFAULT_SIDEBAR_MAX_WIDTH,
-      minWidth: DEFAULT_SIDEBAR_MIN_WIDTH,
-      visible: overrides.sidebar?.visible ?? true,
-      width: clampSidebarWidth(overrides.sidebar?.width ?? DEFAULT_SIDEBAR_WIDTH),
-    },
     snippets,
     tabGroupMap: {},
     tabs: [],

package/src/state/types.ts

@@ -211,15 +211,26 @@ export interface TabSession {
   autoRenameStatus?: 'eligible' | 'attempted'
 }
 
-export interface SidebarState {
+export type BarSide = 'left' | 'right'
+
+/**
+ * One widget slot in a bar. `grow` is the flex weight opentui consumes
+ * directly; hidden widgets keep their weight but are excluded from the layout.
+ */
+export interface BarWidget {
+  id: string
+  grow: number
+  visible: boolean
+}
+
+export interface BarState {
   visible: boolean
   width: number
-  minWidth: number
-  maxWidth: number
+  /** Ordered top → bottom. */
+  widgets: BarWidget[]
 }
 
-export type GitPaneMode = 'embedded' | 'pane'
-export type GitPanePosition = 'top' | 'bottom' | 'left' | 'right'
+export type BarsState = Record<BarSide, BarState>
 
 export type GitPanePathConfig =
   | { enabled: false }
@@ -230,11 +241,6 @@ export interface GitPaneDiffCountConfig {
 }
 
 export interface GitPaneState {
-  visible: boolean
-  mode: GitPaneMode
-  position: GitPanePosition
-  paneRatio: number
-  embeddedRatio: number
   diffModeRatio: number
   fileListMode: GitFileListMode
   treeCompaction: boolean
@@ -611,7 +617,7 @@ export interface AppState {
   sessionBar: SessionBarState
   snippets: SnippetRecord[]
   focusMode: FocusMode
-  sidebar: SidebarState
+  bars: BarsState
   gitPane: GitPaneState
   modal: ModalState
   layout: LayoutState
@@ -803,17 +809,16 @@ export type LayoutAction =
 
 // -- UI actions --
 export type UIAction =
-  | { type: 'toggle-sidebar' }
-  | { type: 'resize-sidebar'; delta: number }
-  | { type: 'set-sidebar-width'; width: number }
+  | { type: 'toggle-bar'; side: BarSide }
+  | { type: 'resize-bar'; side: BarSide; delta: number }
+  | { type: 'set-bar-width'; side: BarSide; width: number }
+  | { type: 'toggle-widget'; widgetId: string }
+  | { type: 'move-widget'; widgetId: string; side: BarSide; index: number }
+  | { type: 'set-bar-boundary'; side: BarSide; index: number; ratio: number }
+  | { type: 'resize-widget'; widgetId: string; delta: number }
   | { type: 'set-focus-mode'; focusMode: FocusMode }
   | { type: 'set-terminal-size'; cols: number; rows: number }
-  | { type: 'toggle-git-pane' }
-  | { type: 'resize-git-pane'; delta: number }
-  | { type: 'set-git-pane-ratio'; target: 'pane' | 'embedded'; ratio: number }
   | { type: 'resize-git-diff-pane'; delta: number }
-  | { type: 'set-git-pane-mode'; mode: GitPaneMode }
-  | { type: 'set-git-pane-position'; position: GitPanePosition }
   | { type: 'set-pending-chords'; chords: string[] | null }
   | { type: 'toggle-session-bar' }
 

package/src/state/workspace-save.ts

@@ -23,20 +23,18 @@ export function buildSessionsWithCurrentSnapshot(
 export function saveCurrentWorkspace(state: AppState): void {
   saveConfig({
     ...loadConfig(),
+    bars: state.bars,
     customCommands: state.customCommands,
     gitPane: {
       diffModeRatio: state.gitPane.diffModeRatio,
-      embeddedRatio: state.gitPane.embeddedRatio,
       fileListMode: state.gitPane.fileListMode,
-      mode: state.gitPane.mode,
-      paneRatio: state.gitPane.paneRatio,
-      position: state.gitPane.position,
-      visible: state.gitPane.visible,
     },
     sessionBarVisible: state.sessionBar.visible,
+    // Legacy mirror of the left bar: lets an older build (and the workspace
+    // snapshot schema) still find a sidebar after a downgrade.
     sidebar: {
-      visible: state.sidebar.visible,
-      width: state.sidebar.width,
+      visible: state.bars.left.visible,
+      width: state.bars.left.width,
     },
   })
   saveSessionCatalog(

package/src/ui/components/git/diff-renderer/pierre-diff.tsx

@@ -7,6 +7,7 @@ import type { FoldState } from '../../../../state/types'
 import type { ThemeId } from '../../../themes'
 
 import { useAppStore } from '../../../../state/app-store'
+import { getBarWidth } from '../../../../state/bars'
 import { dispatchGlobal } from '../../../../state/dispatch-ref'
 import { useTheme } from '../../../theme'
 import { buildDiffSegments, firstChangeSegmentOffset, gutterWidth } from './build-rows'
@@ -51,7 +52,7 @@ export const PierreDiff = forwardRef<PierreDiffHandle, Props>(function PierreDif
   const highlights: DiffHighlights = preparation.highlights
 
   const terminalCols = useAppStore((s) => s.layout.terminalCols)
-  const sidebarWidth = useAppStore((s) => s.sidebar.width)
+  const sidebarWidth = useAppStore((s) => getBarWidth(s.bars.left))
   const contentWidth = useMemo(() => {
     if (!file) return 0
     const gw = gutterWidth(file)

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

@@ -4,32 +4,51 @@ import type { GitPanelState } from '../../../../state/types'
 
 import { useAppStore } from '../../../../state/app-store'
 import { dispatchGlobal, runSideEffectGlobal } from '../../../../state/dispatch-ref'
-import { useTheme } from '../../../theme'
+import { selectPrRowVisible, usePrStatusStore } from '../../../../state/pr-status-store'
+import { useTheme, useTransparent } from '../../../theme'
+import { PrStateRow } from './pr-state-row'
+
+export type GitPaneTab = 'files' | 'checks'
 
 interface GitPaneHeaderProps {
   gitPanel: GitPanelState
   projectPath: string | undefined
   headOffset?: number
   baseLabel?: string
+  /** Only the bar widget switches tabs; full-screen git mode omits these. */
+  tab?: GitPaneTab
+  onTabChange?: (tab: GitPaneTab) => void
 }
 
 export const GitPaneHeader = memo(function GitPaneHeader({
   baseLabel,
   gitPanel,
   headOffset = 0,
+  onTabChange,
   projectPath,
+  tab,
 }: GitPaneHeaderProps) {
   const t = useTheme()
+  // Transparent mode drops every painted background, so the active tab falls
+  // back to colour alone rather than punching a hole in the terminal image.
+  const transparent = useTransparent()
+  const activeTabBg = transparent ? undefined : t.backgroundElement
+  const prRowVisible = usePrStatusStore(selectPrRowVisible)
   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 showFiles = useCallback(() => onTabChange?.('files'), [onTabChange])
+  const showChecks = useCallback(() => onTabChange?.('checks'), [onTabChange])
 
+  const hasTabs = tab !== undefined && onTabChange !== undefined
   const hasProject = projectPath != null && projectPath !== ''
   if (!hasProject) return null
-  if (gitPanel.error !== null) return null
+  // A git error must not hide the tab row, otherwise there's no way back to
+  // `files` (and the PR checks are still worth showing outside a repo).
+  if (gitPanel.error !== null && !hasTabs) return null
 
   const branch = gitPanel.branch
   const branchLabel = branch != null && branch !== '' ? branch : 'detached'
@@ -41,63 +60,110 @@ export const GitPaneHeader = memo(function GitPaneHeader({
   const showBehind = behind > 0
   const showTracking = showAhead || showBehind
 
-  const showToggle = gitPanel.files.length > 0
+  // The PR row already carries the branch identity (and the checks tab spells
+  // out `base ← head`), so the branch row is only worth a line without a PR.
+  const showPrRow = hasTabs && prRowVisible
+  const showBranchRow = !showPrRow && gitPanel.error === null
+  const showToggle = tab !== 'checks' && 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}'}
+  const trackingAndToggle = (
+    <box flexDirection="row" flexShrink={0} gap={2}>
+      {showTracking && tab !== 'checks' ? (
+        <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} paddingLeft={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={branchIsResolved ? t.text : t.textMuted} wrapMode="none">
-            {branchIsResolved ? <strong>{branchLabel}</strong> : branchLabel}
+          <text
+            selectable={false}
+            fg={fileListMode === 'flat' ? t.primary : t.textMuted}
+            wrapMode="none"
+          >
+            flat
           </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} paddingLeft={1} onMouseDown={toggleListMode}>
+      ) : null}
+    </box>
+  )
+
+  return (
+    <box flexDirection="column" flexShrink={0} paddingBottom={1}>
+      {showPrRow && hasProject ? <PrStateRow projectPath={projectPath} /> : null}
+      {hasTabs ? (
+        <box flexDirection="row" justifyContent="space-between">
+          <box flexDirection="row" flexShrink={0} gap={1}>
+            <box
+              paddingLeft={1}
+              paddingRight={1}
+              backgroundColor={tab === 'files' ? activeTabBg : undefined}
+              onMouseDown={showFiles}
+            >
               <text
                 selectable={false}
-                fg={fileListMode === 'tree' ? t.primary : t.textMuted}
+                fg={tab === 'files' ? t.text : t.textMuted}
+                bg={tab === 'files' ? activeTabBg : undefined}
                 wrapMode="none"
               >
-                tree
-              </text>
-              <text selectable={false} fg={t.textMuted} wrapMode="none">
-                |
+                files
               </text>
+            </box>
+            <box
+              paddingLeft={1}
+              paddingRight={1}
+              backgroundColor={tab === 'checks' ? activeTabBg : undefined}
+              onMouseDown={showChecks}
+            >
               <text
                 selectable={false}
-                fg={fileListMode === 'flat' ? t.primary : t.textMuted}
+                fg={tab === 'checks' ? t.text : t.textMuted}
+                bg={tab === 'checks' ? activeTabBg : undefined}
                 wrapMode="none"
               >
-                flat
+                checks
               </text>
             </box>
-          ) : null}
+          </box>
+          {trackingAndToggle}
         </box>
-      </box>
+      ) : null}
+      {showBranchRow ? (
+        <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>
+          {hasTabs ? null : trackingAndToggle}
+        </box>
+      ) : null}
       {showScope ? (
         <box flexDirection="row" gap={2}>
           {showHistorical ? (

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

@@ -1,19 +1,25 @@
-import { memo, useRef } from 'react'
+import { memo, useRef, useState } from 'react'
 
 import type { GitPanelState } from '../../../../state/types'
 
 import { useGitPanelPolling } from '../../../../git/git-poller'
+import { usePrStatusPolling } from '../../../../git/pr-status-poller'
 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'
+import { GitPaneHeader, type GitPaneTab } from './git-pane-header'
+import { PrChecksPanel } from './pr-checks-panel'
 
 interface GitPaneWidgetProps {
   pollingEnabled: boolean
+  contentWidth: number
 }
 
-export const GitPaneWidget = memo(function GitPaneWidget({ pollingEnabled }: GitPaneWidgetProps) {
+export const GitPaneWidget = memo(function GitPaneWidget({
+  contentWidth,
+  pollingEnabled,
+}: GitPaneWidgetProps) {
   const gitPanel = useAppStore((s) => s.gitPanel)
   const gitMode = useAppStore((s) => s.gitMode)
   const gitFileListMode = useAppStore((s) => s.gitPane.fileListMode)
@@ -28,8 +34,12 @@ export const GitPaneWidget = memo(function GitPaneWidget({ pollingEnabled }: Git
       : undefined
   const projectPath = getSessionProjectPath(currentSession)
 
+  const [tab, setTab] = useState<GitPaneTab>('files')
+
   useRepoDiscovery(projectPath)
   useGitPanelPolling({ enabled: pollingEnabled, headOffset: 0, projectPath })
+  // The PR state row sits above the tabs, so this has to run on both of them.
+  usePrStatusPolling({ enabled: pollingEnabled, projectPath })
 
   const lastGoodRef = useRef<GitPanelState | null>(null)
   const prevProjectPathRef = useRef(projectPath)
@@ -45,19 +55,23 @@ export const GitPaneWidget = memo(function GitPaneWidget({ pollingEnabled }: Git
 
   return (
     <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}
-      />
+      <GitPaneHeader gitPanel={display} onTabChange={setTab} projectPath={projectPath} tab={tab} />
+      {tab === 'checks' ? (
+        <PrChecksPanel contentWidth={contentWidth} />
+      ) : (
+        <GitPanel
+          collapsedFolders={gitMode.collapsedFolders}
+          compact={treeCompaction}
+          diffCountConfig={diffCountConfig}
+          fileListMode={gitFileListMode}
+          gitPanel={display}
+          pathConfig={pathConfig}
+          projectPath={projectPath}
+          selectedEntryKey={gitMode.selectedEntryKey}
+          showFileListToggle={false}
+          showRemoteTracking={false}
+        />
+      )}
     </box>
   )
 })