import { View, Text } from "react-native";

const ERROR_MESSAGES: Record<string, string> = {
  TOKEN_EXPIRED: "Your session token has expired. Please reconfigure.",
  MISSING_ACCESS_TOKEN: "auth.json is missing the accessToken field.",
  INVALID_JSON: "The selected file is not valid JSON.",
  NO_ORGS_FOUND: "No Claude organizations found for this session key.",
  INVALID_CODEX_RESPONSE:
    "Codex returned an unexpected response. The app was kept safe from invalid data.",
  INVALID_CLAUDE_RESPONSE:
    "Claude returned an unexpected usage response. The app was kept safe from invalid data.",
  INVALID_CLAUDE_ORGS_RESPONSE:
    "Claude returned an unexpected organizations response.",
};

function humanize(code: string): string {
  if (code.startsWith("HTTP_ERROR_")) {
    return `Unexpected server error (HTTP ${code.replace("HTTP_ERROR_", "")}).`;
  }
  return ERROR_MESSAGES[code] ?? `Unexpected error: ${code}`;
}

interface ErrorMessageProps {
  message: string | null;
}

export function ErrorMessage({ message }: ErrorMessageProps) {
  if (!message) return null;

  return (
    <View className="bg-red-50 dark:bg-red-900/30 border border-red-200 dark:border-red-800 rounded-xl px-3 py-2.5 mb-3">
      <Text className="text-sm text-red-700 dark:text-red-300">{humanize(message)}</Text>
    </View>
  );
}