import { Box, Text } from 'ink';

interface HeaderProps {
  projectName: string;
  sessionId?: string;
  gated: boolean;
  reconnecting: boolean;
}

export function Header({ projectName, sessionId, gated, reconnecting }: HeaderProps) {
  return (
    <Box flexDirection="column" borderStyle="single" borderBottom={true} borderTop={false} borderLeft={false} borderRight={false} paddingX={1}>
      <Box gap={2}>
        <Text bold color="white" backgroundColor="blue"> mcpctl console </Text>
        <Text bold>{projectName}</Text>
        {sessionId && <Text dimColor>session: {sessionId.slice(0, 8)}</Text>}
        {gated ? (
          <Text color="yellow" bold>[GATED]</Text>
        ) : (
          <Text color="green" bold>[OPEN]</Text>
        )}
        {reconnecting && <Text color="cyan">reconnecting...</Text>}
      </Box>
    </Box>
  );
}
