/* eslint-disable react/jsx-no-bind */
import type { FormEvent } from 'react';
import type React from 'react';

import Button from '../../Components/UI/Button/Button';
import GoogleSvg from '../../Components/UI/Images/Google/GoogleSvg';
import styles from './ContinueWithGoogle.module.scss';

const ContinueWithGoogle: React.FC = (): JSX.Element => {
	function submitHandler(event: FormEvent): void {
		/* eslint-disable no-console */
		console.log(event);
	}
	return (
		<div className={styles.signUpWithGoogle}>
			<div className={styles.lineContainer}>
				<div className={styles.leftLine} />
				<h3>or</h3>
				<div className={styles.rightLine} />
			</div>
			<Button
				buttonClass={styles.continueWithGoogleButton}
				id="continueWithGoogle"
				link="/continueWithGoogle"
				onClick={submitHandler}
				svg={<GoogleSvg />}
				type="button"
				value=""
			/>
			<small className={styles.signUpWithGoogleFooter}>
				We won&apos;t post to any of your accounts without asking first
			</small>
		</div>
	);
};

export default ContinueWithGoogle;