BitSquare/Codeman
2
0
Fork 0
mirror of https://github.com/Ark0N/Codeman.git synced 2026-10-08 08:29:42 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat(tui): improve StatusBar with session name and input mode

Browse Source 
- Show session name prominently in status bar
- Add optional inputMode prop for visual feedback
- Update keyboard hints to indicate typing sends input
- Reorganize status bar layout for better readability

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
arkon
2026-01-21 06:28:21 +01:00
co-authored by Claude Opus 4.5
parent 7bd5260b7d
commit 4d60cff4f3
1 changed files with 14 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/tui/components/StatusBar.tsx
+14 -6
View File
@@ -15,6 +15,7 @@ import type { ScreenSession } from '../../types.js';
interface StatusBarProps { interface StatusBarProps {
session: ScreenSession | null; session: ScreenSession | null;
inputMode?: boolean;
} }
/** /**
@@ -37,7 +38,7 @@ function formatDuration(ms: number): string {
/** /**
* StatusBar component showing session information * StatusBar component showing session information
*/ */
export function StatusBar({ session }: StatusBarProps): React.ReactElement { export function StatusBar({ session, inputMode = false }: StatusBarProps): React.ReactElement {
if (!session) { if (!session) {
return ( return (
<Box <Box
@@ -55,6 +56,7 @@ export function StatusBar({ session }: StatusBarProps): React.ReactElement {
const runtime = formatDuration(Date.now() - session.createdAt); const runtime = formatDuration(Date.now() - session.createdAt);
const statusColor = session.attached ? 'green' : 'red'; const statusColor = session.attached ? 'green' : 'red';
const statusText = session.attached ? 'alive' : 'dead'; const statusText = session.attached ? 'alive' : 'dead';
const sessionName = session.name || 'unnamed';
return ( return (
<Box <Box
@@ -65,6 +67,10 @@ export function StatusBar({ session }: StatusBarProps): React.ReactElement {
> >
{/* Left side: Session info */} {/* Left side: Session info */}
<Box> <Box>
<Text color="cyan" bold>
{sessionName}
</Text>
<Text> | </Text>
<Text color={statusColor} bold> <Text color={statusColor} bold>
{'\u25CF'} {statusText} {'\u25CF'} {statusText}
</Text> </Text>
@@ -76,15 +82,17 @@ export function StatusBar({ session }: StatusBarProps): React.ReactElement {
<Text> <Text>
<Text dimColor>mode:</Text> {session.mode} <Text dimColor>mode:</Text> {session.mode}
</Text> </Text>
<Text> | </Text> {inputMode && (
<Text> <>
<Text dimColor>screen:</Text> {session.screenName} <Text> | </Text>
</Text> <Text color="yellow" bold>INPUT MODE</Text>
</>
)}
</Box> </Box>
{/* Right side: Keyboard hints */} {/* Right side: Keyboard hints */}
<Box> <Box>
<Text dimColor>? help | Esc back | Ctrl+C exit</Text> <Text dimColor>? help | Esc back | type to send input</Text>
</Box> </Box>
</Box> </Box>
); );