import { signIn } from '@/auth';
import { IconButton } from '@/components/icon-button';
import { faOpenid } from '@fortawesome/free-brands-svg-icons';

export default function SSOLogin({
  provider,
  providerDisplayName,
  ...props
}: {
  provider: string;
  providerDisplayName: string;
} & React.HTMLProps<HTMLFormElement>) {
  return (
    <form
      className='flex flex-col items-center gap-4 w-full'
      action={async () => {
        'use server';
        await signIn(provider);
      }}
      {...props}
    >
      <IconButton
        className='w-full'
        type='submit'
        variant='default'
        icon={faOpenid}
      >
        Login with {providerDisplayName}
      </IconButton>
    </form>
  );
}