import { HelpText } from './HelpText';
import { FieldLabel, FieldInput } from './formUtils';
import type { SectionFormProps } from './types';

// keep in sync with src/mcp/config.ts McpRuntimeConfig
interface McpRuntimeConfig {
  callTimeoutSeconds: number;
  maxBinarySizeMb: number;
  maxOutputFilesPerJob: number;
  maxOutputSizeMbPerJob: number;
  toolCacheTtlSeconds: number;
  oauthPendingTtlMinutes: number;
  allowPrivateAddresses: boolean;
}

export function McpForm({ config, onChange }: SectionFormProps) {
  const mcp: Partial<McpRuntimeConfig> = config.mcp ?? {};

  return (
    <div className="space-y-5">
      <h2 className="text-base font-semibold text-slate-800">MCP</h2>
      <p className="text-xs text-slate-500">
        外部 MCP (Model Context Protocol) サーバーの接続・実行に関する設定です。
        接続先サーバーを追加する場合は、各タスクまたは設定から MCP サーバー URL を指定してください。
      </p>

      <h3 className="text-sm font-medium text-slate-600 pt-2 border-t border-slate-200">セキュリティ</h3>

      <div>
        <label className="flex items-center gap-2 text-sm text-slate-700">
          <input
            type="checkbox"
            checked={mcp.allowPrivateAddresses === true}
            onChange={e => onChange('mcp.allowPrivateAddresses', e.target.checked)}
            className="rounded"
          />
          プライベート IP への接続を許可する (self-hosted / localhost MCP サーバー用)
        </label>
        <HelpText>
          有効にすると、localhost・LAN アドレス (192.168.x.x, 10.x.x.x 等) への MCP 接続を許可します。
          SSRF リスクがあるため、信頼できるネットワーク環境でのみ使用してください。デフォルト: 無効
        </HelpText>
      </div>

      <h3 className="text-sm font-medium text-slate-600 pt-2 border-t border-slate-200">タイムアウト / キャッシュ</h3>

      <div>
        <FieldLabel>ツール呼び出しタイムアウト (秒)</FieldLabel>
        <FieldInput type="number" value={mcp.callTimeoutSeconds ?? 60}
          onChange={v => onChange('mcp.callTimeoutSeconds', Number(v))} />
        <HelpText>MCP ツールの 1 回の呼び出しに許容する最大時間（秒）。デフォルト: 60</HelpText>
      </div>

      <div>
        <FieldLabel>ツール一覧キャッシュ TTL (秒)</FieldLabel>
        <FieldInput type="number" value={mcp.toolCacheTtlSeconds ?? 600}
          onChange={v => onChange('mcp.toolCacheTtlSeconds', Number(v))} />
        <HelpText>MCP サーバーから取得したツール一覧をキャッシュする時間（秒）。デフォルト: 600</HelpText>
      </div>

      <div>
        <FieldLabel>OAuth pending state TTL (分)</FieldLabel>
        <FieldInput type="number" value={mcp.oauthPendingTtlMinutes ?? 10}
          onChange={v => onChange('mcp.oauthPendingTtlMinutes', Number(v))} />
        <HelpText>MCP OAuth 認可フローの pending 状態を保持する時間（分）。デフォルト: 10</HelpText>
      </div>

      <h3 className="text-sm font-medium text-slate-600 pt-2 border-t border-slate-200">容量制限</h3>

      <div>
        <FieldLabel>ツール出力バイナリ 1 個あたり最大サイズ (MB)</FieldLabel>
        <FieldInput type="number" value={mcp.maxBinarySizeMb ?? 20}
          onChange={v => onChange('mcp.maxBinarySizeMb', Number(v))} />
        <HelpText>MCP ツールが返すバイナリ出力 1 ファイルの最大サイズ（MB）。デフォルト: 20</HelpText>
      </div>

      <div>
        <FieldLabel>ジョブあたり最大バイナリファイル数</FieldLabel>
        <FieldInput type="number" value={mcp.maxOutputFilesPerJob ?? 10}
          onChange={v => onChange('mcp.maxOutputFilesPerJob', Number(v))} />
        <HelpText>1 ジョブで MCP ツールが保存できるバイナリファイルの最大数。デフォルト: 10</HelpText>
      </div>

      <div>
        <FieldLabel>ジョブあたり最大バイナリ合計サイズ (MB)</FieldLabel>
        <FieldInput type="number" value={mcp.maxOutputSizeMbPerJob ?? 200}
          onChange={v => onChange('mcp.maxOutputSizeMbPerJob', Number(v))} />
        <HelpText>1 ジョブで MCP ツールが保存できるバイナリ出力の合計最大サイズ（MB）。デフォルト: 200</HelpText>
      </div>
    </div>
  );
}
