import { Box, Text } from "ink";
import type { ViewMode } from "../types/index.ts";

interface ViewModeIndicatorProps {
  mode: ViewMode;
  isLoadingGitHub?: boolean;
  githubError?: string | null;
}

const MODE_CONFIG: Record<ViewMode, { label: string; color: string; icon: string }> = {
  local: { label: "Local", color: "green", icon: "💻" },
  github: { label: "GitHub", color: "magenta", icon: "☁" },
  combined: { label: "All", color: "cyan", icon: "🔗" },
};

export function ViewModeIndicator({ mode, isLoadingGitHub, githubError }: ViewModeIndicatorProps) {
  const config = MODE_CONFIG[mode];

  return (
    <Box gap={1}>
      <Text color={config.color}>
        {config.icon} [{config.label}]
      </Text>
      
      {isLoadingGitHub && (
        <Text color="yellow">⟳</Text>
      )}
      
      {githubError && !isLoadingGitHub && (
        <Text color="red">⚠</Text>
      )}
      
      <Text dimColor>(Tab)</Text>
    </Box>
  );
}