Files
Triple-C/app/src/components/terminal/TerminalTabs.tsx
Josh Knapp d6ac3ae6c6 Add Claude Code settings infrastructure, TUI mode, session naming, and global defaults
Adds first-class support for Claude Code CLI features (2.1.71-2.1.110):

- New ClaudeCodeSettings struct with per-project and global defaults for
  TUI mode, effort level, focus mode, thinking summaries, session recap,
  auto-scroll, env scrub, and 1-hour prompt caching
- Settings injected as env vars (CLAUDE_CODE_NO_FLICKER, etc.) and
  ~/.claude/settings.json entries via entrypoint.sh merge block
- New ClaudeCodeSettingsModal component for configuring settings
- Session naming support (-n flag passed to claude CLI, shown in tabs)
- Relaxed reserved prefix filter: CLAUDE_CODE_* env vars now allowed in
  custom env vars UI for power users
- Global SSH key path, git name, and git email now used as fallbacks
  when per-project values are not set, with UI in SettingsPanel
- Fingerprint-based change detection triggers container recreation when
  Claude Code settings change
- Updated README, HOW-TO-USE, and CLAUDE.md documentation

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 08:46:03 -07:00

44 lines
1.4 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
import { useTerminal } from "../../hooks/useTerminal";
export default function TerminalTabs() {
const { sessions, activeSessionId, setActiveSession, close } = useTerminal();
if (sessions.length === 0) {
return (
<div className="px-3 text-xs text-[var(--text-secondary)] leading-10">
No active terminals
</div>
);
}
return (
<div className="flex items-center h-full">
{sessions.map((session) => (
<div
key={session.id}
onClick={() => setActiveSession(session.id)}
className={`flex items-center gap-2 px-3 h-full text-xs cursor-pointer border-r border-[var(--border-color)] transition-colors ${
activeSessionId === session.id
? "bg-[var(--bg-primary)] text-[var(--text-primary)]"
: "text-[var(--text-secondary)] hover:text-[var(--text-primary)]"
}`}
>
<span className="truncate max-w-[140px]">
{session.sessionName ?? session.projectName}{session.sessionType === "bash" ? " (bash)" : ""}
</span>
<button
onClick={(e) => {
e.stopPropagation();
close(session.id);
}}
className="text-[var(--text-secondary)] hover:text-[var(--error)] transition-colors"
title="Close terminal"
>
×
</button>
</div>
))}
</div>
);
}