'use client'

import {useActionState} from 'react'

import {googleAuthenticate} from '@/actions/auth/google-login'
import GoogleIcon from '@/components/shared/icons/google'
import {Button} from '@/ui/button'

const GoogleLogin = () => {
	const [errorMsgGoogle, dispatchGoogle] = useActionState(
		googleAuthenticate,
		undefined
	) //googleAuthenticate hook

	return (
		<form className='mt-4 flex' action={dispatchGoogle}>
			<Button
				variant={'outline'}
				className='flex w-full flex-row items-center gap-3'
			>
				<GoogleIcon />
				Google Sign In
			</Button>
			<p>{errorMsgGoogle}</p>
		</form>
	)
}

export default GoogleLogin