Feature: Configurable status bar / footer with user-defined items

Description

Claude Code's status bar currently displays model name, auto-accept mode, token count, and cost. These are hardcoded in the Ink component tree with no user extension point.

For power users who build workflows around Claude Code (custom hooks, MCP servers, agents), the ability to add contextual information to the status bar would significantly improve the developer experience — without needing an external multiplexer like tmux.

Use Cases

1. Project context — Show current git branch, active task, or deployment target
2. MCP server status — Display connected MCP servers and their health
3. Custom metrics — Token budget remaining, session duration, tool call count
4. Environment indicator — Production vs staging vs development
5. Hook-driven state — Status updated by session-start hooks (e.g., database health, memory count)

Proposed Design

Configuration in .claude/settings.json

{
  "statusBar": {
    "left": [
      {
        "label": "branch",
        "command": "git branch --show-current",
        "color": "cyan",
        "refreshInterval": 30
      },
      {
        "label": "db",
        "command": "mix run -e 'Memory.health_check()' 2>/dev/null",
        "color": "green",
        "refreshInterval": 60
      }
    ],
    "right": [
      {
        "label": "env",
        "value": "dev",
        "color": "yellow"
      }
    ]
  }
}

Two item types

| Type | Behavior |
|------|----------|
| Static (value) | Fixed text, set at session start |
| Dynamic (command) | Shell command output, refreshed on interval |

Rendering

 opus-4  |  branch: main  |  db: yes     12.3K tokens  $0.45  |  env: dev
 ^^^^^^^    ^^^^^^^^^^^^^^    ^^^^^^^^    ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
 existing   user left[0]     user left[1]  existing + user right[0]

Implementation Hint

Given the existing architecture (src/screens/REPL.tsx, React 19 + Ink, ~140 components):

• A new useCustomStatusBar hook reads statusBar config from settings
• Static items render as <Text color={item.color}>{item.label}: {item.value}</Text>
• Dynamic items use a useInterval hook to run shell commands and cache stdout
• Items are injected as children into the existing footer <Box> component
• refreshInterval defaults to 30s, minimum 5s to prevent performance issues

This aligns with existing patterns:

• useDynamicConfig already supports config-driven behavior
• useSettings already reads .claude/settings.json
• The hooks architecture (85 files in src/hooks/) makes adding useCustomStatusBar idiomatic

Alternatives Considered

| Alternative | Limitation |
|-------------|-----------|
| tmux status bar | Requires external multiplexer, separate config |
| Session-start hook output | Only shown once at conversation start, not persistent |
| iTerm2 status bar | Terminal-specific, not portable |
| /status command | On-demand only, interrupts workflow |

Suggested Phased Rollout

Phase 1 (MVP):

• Static value items only (no shell execution, zero security risk)
• Left and right positioning
• Color support via Chalk
• Read from .claude/settings.json at session start

Phase 2 (Full):

• Dynamic command items with refresh intervals
• Hook-driven updates (e.g., PreToolCall hook updates a status item)
• Conditional visibility (show item only when condition met)

Environment

• Claude Code CLI (terminal mode)
• Renderer: React 19 + Ink
• Config: .claude/settings.json (project) or ~/.claude/settings.json (global)