import { useState } from 'react';
import { useStytchB2BClient } from '@stytch/react/b2b';

export const DiscoverSSO = () => {
  const stytch = useStytchB2BClient();
  const [connections, setConnections] = useState([]);

  const discoverConnections = async (email) => {
    const response = await stytch.sso.discoverConnections(email);
    setConnections(response.connections);
  };

  return (
    <div>
      <button onClick={() => discoverConnections('user@example.com')}>
        Discover Connections
      </button>
      {connections.map((conn) => (
        <div key={conn.connection_id}>
          {conn.display_name} - {conn.identity_provider}
        </div>
      ))}
    </div>
  );
};