import { ReactElement } from 'react';
export interface MCPAgent {
  id: string;
  slug: string;
  displayName: string;
  logo?: ReactElement;
}

export const MCP_SETUP_BASE_URL = 'https://docs.insforge.dev/mcp-setup';
export const EXTENSION_DOCS_URL = 'https://docs.insforge.dev/vscode-extension';

import TraeLogo from '#assets/logos/trae.svg?react';
import CursorLogo from '#assets/logos/cursor.svg?react';
import ClaudeLogo from '#assets/logos/claude_code.svg?react';
import WindsurfLogo from '#assets/logos/windsurf.svg?react';
import ClineLogo from '#assets/logos/cline.svg?react';
import QoderLogo from '#assets/logos/qoder.svg?react';
import CopilotLogo from '#assets/logos/copilot.svg?react';
import AntigravityLogo from '#assets/logos/antigravity.png';
import OpenAILogo from '#assets/logos/openai.svg?react';
import KiroLogo from '#assets/logos/kiro.svg?react';
import RooCodeLogo from '#assets/logos/roo_code.svg?react';
import OpenCodeLogo from '#assets/logos/opencode.svg?react';
import OpenClawLogo from '#assets/logos/openclaw.svg?react';
import { getBackendUrl } from '#lib/utils/utils';
// import CodexLogo from '#assets/logos/openai.svg?react';

export type PlatformType = 'macos-linux' | 'windows';

export const GenerateInstallCommand = (agent: MCPAgent, apiKey: string) => {
  return `npx @insforge/install --client ${agent.id} --env API_KEY=${apiKey} --env API_BASE_URL=${getBackendUrl()}`;
};

export const MCP_AGENTS: MCPAgent[] = [
  {
    id: 'cursor',
    slug: 'cursor',
    displayName: 'Cursor',
    logo: <CursorLogo className="w-6 h-6" />,
  },
  {
    id: 'claude-code',
    slug: 'claude-code',
    displayName: 'Claude Code',
    logo: <ClaudeLogo className="w-6 h-6" />,
  },
  {
    id: 'trae',
    slug: 'trae',
    displayName: 'Trae',
    logo: <TraeLogo className="w-5 h-5" />,
  },
  {
    id: 'cline',
    slug: 'cline',
    displayName: 'Cline',
    logo: <ClineLogo className="w-6 h-6 dark:text-white" />,
  },
  {
    id: 'windsurf',
    slug: 'windsurf',
    displayName: 'Windsurf',
    logo: <WindsurfLogo className="w-6 h-6 dark:text-white" />,
  },
  {
    id: 'roocode',
    slug: 'roo-code',
    displayName: 'Roo Code',
    logo: <RooCodeLogo className="w-5 h-5 dark:text-white" />,
  },
  {
    id: 'qoder',
    slug: 'qoder',
    displayName: 'Qoder',
    logo: <QoderLogo className="w-5 h-5 dark:text-white" />,
  },
  {
    id: 'copilot',
    slug: 'github-copilot',
    displayName: 'Copilot',
    logo: <CopilotLogo className="w-5 h-5 dark:text-white" />,
  },
  {
    id: 'antigravity',
    slug: 'google-antigravity',
    displayName: 'Antigravity',
    logo: <img src={AntigravityLogo} alt="Antigravity" className="h-5 w-5 object-contain" />,
  },
  {
    id: 'codex',
    slug: 'codex',
    displayName: 'Codex',
    logo: <OpenAILogo className="w-5 h-5 dark:text-white" />,
  },
  {
    id: 'kiro',
    slug: 'kiro',
    displayName: 'Kiro',
    logo: <KiroLogo className="h-5 w-5" />,
  },
  {
    id: 'opencode',
    slug: 'opencode',
    displayName: 'OpenCode',
    logo: <OpenCodeLogo className="w-5 h-5 dark:text-white" />,
  },
  {
    id: 'openclaw',
    slug: 'openclaw',
    displayName: 'OpenClaw',
    logo: <OpenClawLogo className="w-5 h-5" />,
  },
  {
    id: 'mcp',
    slug: 'manual',
    displayName: 'MCP JSON',
  },
];

// Core MCP server configuration builder
export const createMCPServerConfig = (
  apiKey: string,
  platform: PlatformType,
  apiBaseUrl?: string
) => {
  const env = {
    API_KEY: apiKey,
    API_BASE_URL: apiBaseUrl || getBackendUrl(),
  };

  if (platform === 'windows') {
    return {
      command: 'cmd',
      args: ['/c', 'npx', '-y', '@insforge/mcp@latest'],
      env,
    };
  } else {
    return {
      command: 'npx',
      args: ['-y', '@insforge/mcp@latest'],
      env,
    };
  }
};

// Full MCP configuration for AI assistants
export const createMCPConfig = (apiKey: string, platform: PlatformType, apiBaseUrl?: string) => {
  return {
    mcpServers: {
      insforge: createMCPServerConfig(apiKey, platform, apiBaseUrl),
    },
  };
};
