47 lines
1.1 KiB
TypeScript
47 lines
1.1 KiB
TypeScript
'use client'
|
|
|
|
import * as React from 'react'
|
|
import { signIn } from 'next-auth/react'
|
|
|
|
import { cn } from '@/lib/utils'
|
|
import { Button, type ButtonProps } from '@/components/ui/button'
|
|
import { IconGitHub, IconSpinner } from '@/components/ui/icons'
|
|
import { useSearchParams } from 'next/navigation'
|
|
interface LoginButtonProps extends ButtonProps {
|
|
showGithubIcon?: boolean
|
|
text?: string
|
|
}
|
|
|
|
export function LoginButton({
|
|
text = 'Login with GitHub',
|
|
showGithubIcon = true,
|
|
className,
|
|
...props
|
|
}: LoginButtonProps) {
|
|
const [isLoading, setIsLoading] = React.useState(false)
|
|
const searchParams = useSearchParams()
|
|
const next = searchParams.get('next') || ''
|
|
|
|
return (
|
|
<Button
|
|
variant="outline"
|
|
onClick={() => {
|
|
setIsLoading(true)
|
|
signIn('github', {
|
|
callbackUrl: `${window.location.origin}${next}`,
|
|
redirect: true
|
|
})
|
|
}}
|
|
disabled={isLoading}
|
|
className={cn(className)}
|
|
{...props}
|
|
>
|
|
{isLoading ? (
|
|
<IconSpinner className="mr-2 animate-spin" />
|
|
) : showGithubIcon ? (
|
|
<IconGitHub className="mr-2" />
|
|
) : null}
|
|
{text}
|
|
</Button>
|
|
)
|
|
}
|