146 lines · 5.0 KB
import { useState } from "react";
import { deleteAiEndpoint, saveAiEndpoint } from "~/fns/ai-endpoints";
import { useAction } from "~/hooks/use-action";
import { Panel } from "~/ui/Panel";
import { Button } from "~/ui/Button";
import { SelectField, TextField } from "~/ui/Field";
import { ErrorBanner } from "~/ui/Callout";

type Kind = "provider" | "openai" | "cf-gateway";

export type AiEndpointSummaryView = {
  kind: Kind;
  provider: string | null;
  model: string;
  baseUrl: string | null;
  cfAccountId: string | null;
  cfGatewayId: string | null;
};

export type AiEndpointTarget =
  | { scope: "repo"; owner: string; repo: string }
  | { scope: "account"; org: string | null };

const KIND_LABELS: Record<Kind, string> = {
  provider: "Provider key (through this instance's AI Gateway)",
  openai: "OpenAI-compatible endpoint",
  "cf-gateway": "My Cloudflare AI Gateway",
};

function describe(endpoint: AiEndpointSummaryView): string {
  if (endpoint.kind === "openai") return `${endpoint.model} at ${endpoint.baseUrl}`;
  if (endpoint.kind === "cf-gateway")
    return `${endpoint.provider}/${endpoint.model} via gateway ${endpoint.cfGatewayId}`;
  return `${endpoint.provider}/${endpoint.model}`;
}

/** Bring-your-own AI endpoint for an account or a repository. The saved key is never shown again. */
export function AiEndpointForm({
  title,
  target,