/**
 * Toolbar — compact 1-line bar showing Tools / Resources / Prompts / Raw JSON-RPC.
 *
 * Shown between the header and timeline when an interactive session is ungated.
 * Items are selectable via Tab (focus on/off), ←/→ (cycle), Enter (open).
 */

import { Box, Text } from 'ink';

interface ToolbarProps {
  toolCount: number;
  resourceCount: number;
  promptCount: number;
  focusedItem: number; // -1 = not focused, 0-3 = which item
}

const ITEMS = [
  { label: 'Tools', key: 'tools' },
  { label: 'Resources', key: 'resources' },
  { label: 'Prompts', key: 'prompts' },
  { label: 'Raw JSON-RPC', key: 'raw' },
] as const;

export function Toolbar({ toolCount, resourceCount, promptCount, focusedItem }: ToolbarProps) {
  const counts = [toolCount, resourceCount, promptCount, -1]; // -1 = no count for raw

  return (
    <Box paddingX={1} height={1}>
      {ITEMS.map((item, i) => {
        const focused = focusedItem === i;
        const count = counts[i]!;
        const separator = i < ITEMS.length - 1 ? '  |  ' : '';

        return (
          <Text key={item.key}>
            <Text color={focused ? 'cyan' : undefined} bold={focused} dimColor={!focused}>
              {` ${item.label}`}
              {count >= 0 && <Text>{` (${count})`}</Text>}
            </Text>
            {separator && <Text dimColor>{separator}</Text>}
          </Text>
        );
      })}
    </Box>
  );
}