'use client';

import { useEffect, useState } from 'react';
import type { ManagedModelConfigResponse, ManagedSystemApi } from '@/lib/model-config-types';

export function useManagedSystemApis() {
  const [systemApis, setSystemApis] = useState<ManagedSystemApi[]>([]);

  useEffect(() => {
    let cancelled = false;
    fetch('/api/model-config')
      .then(res => res.ok ? res.json() : null)
      .then((data: ManagedModelConfigResponse | null) => {
        if (cancelled) return;
        setSystemApis((data?.systemApis || []).filter(api => api.isActive));
      })
      .catch(() => {
        if (!cancelled) setSystemApis([]);
      });
    return () => {
      cancelled = true;
    };
  }, []);

  return systemApis;
}
