import { CodeBlock } from "../components/CodeBlock";
import { Callout } from "../components/Callout";

export function ProvidersPage() {
  return (
    <div>
      <h1 id="provider-setup">Provider Setup</h1>
      <p>
        Veylant IA supports 5 LLM providers out of the box. Each provider implements the{" "}
        <code>provider.Adapter</code> interface (<code>Send</code>, <code>Stream</code>,{" "}
        <code>Validate</code>, <code>HealthCheck</code>).
      </p>

      <Callout type="info" title="Adding a new provider">
        Implement the <code>provider.Adapter</code> interface in{" "}
        <code>internal/provider/&lt;name&gt;/</code> and register it in{" "}
        <code>cmd/proxy/main.go</code>. No other changes needed.
      </Callout>

      <h2 id="openai">OpenAI</h2>
      <CodeBlock
        language="yaml"
        code={`providers:
  openai:
    api_key: "sk-..."           # VEYLANT_PROVIDERS_OPENAI_API_KEY
    base_url: "https://api.openai.com/v1"  # optional override`}
      />
      <p>Supported models: <code>gpt-4o</code>, <code>gpt-4o-mini</code>, <code>gpt-4-turbo</code>, <code>gpt-3.5-turbo</code></p>

      <h2 id="anthropic">Anthropic</h2>
      <CodeBlock
        language="yaml"
        code={`providers:
  anthropic:
    api_key: "sk-ant-..."       # VEYLANT_PROVIDERS_ANTHROPIC_API_KEY
    base_url: "https://api.anthropic.com"  # optional`}
      />
      <p>Supported models: <code>claude-3-5-sonnet-20241022</code>, <code>claude-3-opus-20240229</code>, <code>claude-3-haiku-20240307</code></p>

      <h2 id="azure">Azure OpenAI</h2>
      <p>
        Azure requires a deployment name instead of a model name. The proxy maps OpenAI model IDs
        to Azure deployment names via the routing rule's <code>target_model</code> field.
      </p>
      <CodeBlock
        language="yaml"
        code={`providers:
  azure:
    api_key: "..."              # VEYLANT_PROVIDERS_AZURE_API_KEY
    endpoint: "https://YOUR_RESOURCE.openai.azure.com"
    api_version: "2024-02-01"  # Azure API version`}
      />

      <h2 id="mistral">Mistral AI</h2>
      <CodeBlock
        language="yaml"
        code={`providers:
  mistral:
    api_key: "..."              # VEYLANT_PROVIDERS_MISTRAL_API_KEY
    base_url: "https://api.mistral.ai/v1"  # optional`}
      />
      <p>Supported models: <code>mistral-large-latest</code>, <code>mistral-medium-latest</code>, <code>mistral-small-latest</code></p>

      <h2 id="ollama">Ollama (Self-hosted)</h2>
      <p>
        Ollama requires no API key. Ensure the Ollama server is reachable from the proxy container.
      </p>
      <CodeBlock
        language="yaml"
        code={`providers:
  ollama:
    base_url: "http://host.docker.internal:11434"  # from Docker to host`}
      />
      <CodeBlock
        language="bash"
        code={`# Pull a model before routing to it
ollama pull llama3
ollama pull mistral
ollama pull codellama`}
      />
      <Callout type="tip" title="GPU acceleration">
        Ollama automatically uses GPU if available. For Docker, add{" "}
        <code>--gpus all</code> to the container runtime command or use the{" "}
        <code>deploy.resources.reservations.devices</code> key in docker-compose.yml.
      </Callout>

      <h2 id="provider-status">Check Provider Status</h2>
      <p>
        The admin API exposes circuit breaker state for all providers:
      </p>
      <CodeBlock
        language="bash"
        code={`curl http://localhost:8090/v1/admin/providers/status \\
  -H "Authorization: Bearer $TOKEN"

# Response:
{
  "data": [
    {"provider": "openai",    "state": "closed", "failures": 0},
    {"provider": "anthropic", "state": "closed", "failures": 0},
    {"provider": "azure",     "state": "open",   "failures": 5},
    {"provider": "mistral",   "state": "closed", "failures": 1},
    {"provider": "ollama",    "state": "closed", "failures": 0}
  ]
}`}
      />

      <p>Circuit breaker states:</p>
      <ul>
        <li><strong>closed</strong> — Normal operation, requests forwarded</li>
        <li><strong>open</strong> — Provider bypassed, fallback chain used</li>
        <li><strong>half-open</strong> — Testing if provider has recovered</li>
      </ul>
    </div>
  );
}
