Function ProviderConfigDialog

frontend/src/pages/IntegrationsManager.tsx:596–865

({ provider, open, onClose, onCompleted }: ProviderConfigDialogProps)

}

function ProviderConfigDialog({ provider, open, onClose, onCompleted }: ProviderConfigDialogProps) {
  const [loading, setLoading] = useState(false);
  const [saving, setSaving] = useState(false);
  const [clientId, setClientId] = useState('');
  const [clientSecret, setClientSecret] = useState('');
  const [hasStoredSecret, setHasStoredSecret] = useState(false);
  const [configuredBy, setConfiguredBy] = useState<'environment' | 'user'>('user');
  const [updatedAt, setUpdatedAt] = useState<string | null>(null);
  const [error, setError] = useState<string | null>(null);
  const [copiedRedirect, setCopiedRedirect] = useState(false);

  const callbackUrl = provider
    ? `${window.location.origin}/integrations/callback/${provider.id}`
    : '';

  useEffect(() => {
    if (!open) {
      setClientSecret('');
      setError(null);
      setCopiedRedirect(false);
      return;
    }

    if (!provider) {
      return;
    }

    let cancelled = false;
    setLoading(true);
    setError(null);
    setClientId('');
    setClientSecret('');
    setHasStoredSecret(false);
    setConfiguredBy('user');
    setUpdatedAt(null);

    api.integrations
      .getProviderConfig(provider.id)
      .then((config) => {
        if (cancelled) {
          return;
        }
        setClientId(config.clientId ?? '');
        setHasStoredSecret(config.hasClientSecret);
        setConfiguredBy(config.configuredBy);
        setUpdatedAt(config.updatedAt ?? null);
      })
      .catch((err) => {
        if (cancelled) {
          return;
        }
        const message =
          err instanceof Error ? err.message : 'Failed to load provider configuration.';
        setError(message);
      })
      .finally(() => {
        if (!cancelled) {
          setLoading(false);