import React from 'react';
import { describe, expect, it } from 'vitest';
import { renderToStaticMarkup } from 'react-dom/server';
import { SsoProviderSection } from './sso-provider-section.js';

describe('SsoProviderSection', () => {
  it('renders configured providers with callback, sync, and fallback details', () => {
    const html = renderToStaticMarkup(
      <SsoProviderSection
        loading={false}
        providers={[
          {
            id: 'workos',
            name: 'WorkOS',
            protocols: ['oidc'],
            configured: true,
            loginMode: 'oidc',
            callbackPath: '/api/auth/oauth2/callback/workos',
            teamSync: { enabled: true, claim: 'organization_id' },
            samlFallback: { configured: false, loginUrl: null },
            warnings: [],
          },
          {
            id: 'keycloak',
            name: 'Keycloak',
            protocols: ['oidc', 'saml'],
            configured: true,
            loginMode: 'saml',
            callbackPath: null,
            teamSync: { enabled: true, claim: 'groups' },
            samlFallback: {
              configured: true,
              loginUrl: 'https://sso.example.com/realms/mosaic/protocol/saml',
            },
            warnings: [],
          },
        ]}
      />,
    );

    expect(html).toContain('WorkOS');
    expect(html).toContain('/api/auth/oauth2/callback/workos');
    expect(html).toContain('Team sync claim: organization_id');
    expect(html).toContain('SAML fallback: https://sso.example.com/realms/mosaic/protocol/saml');
  });
});