import type React from 'react';
import { useContext, useEffect } from 'react';

import SignInHeader from '../../Components/Layout/Header/SignInHeader';
import environment from '../../Environments/environment';
import type { GlobalStateModel } from '../../Store/global/GlobalState-context';
import { GlobalStateContext } from '../../Store/global/GlobalState-context';
import getCookieValue from '../../utils/getCookieValue';
import styles from '../SignUp/SignUp.module.scss';
import SignInForm from './SignInForm';

const SignIn: React.FC = (): JSX.Element => {
	const { signup } = environment.frontendRoutes;
	const globalState: GlobalStateModel = useContext(GlobalStateContext);

	const awsRedirectUrl =
		process.env.REACT_APP_ENV === 'production'
			? 'https://bmim.bitsia.com/auth/callback'
			: 'http://localhost:8000/auth/callback';

	console.log('environment', process.env.NODE_ENV, 'react env', process.env.REACT_APP_ENV);

	const linkCognito =
		`https://auth.bmim.co.uk/login?` +
		`client_id=68omvr2qnart0t6hf8lpi9b86v` +
		`&response_type=code` +
		`&scope=email+openid+aws.cognito.signin.user.admin` +
		`&redirect_uri=${encodeURIComponent(awsRedirectUrl)}`;

	const linkSignUpCognito =
		`https://auth.bmim.co.uk/signup?` +
		`client_id=68omvr2qnart0t6hf8lpi9b86v` +
		`&response_type=code` +
		`&scope=email+openid+aws.cognito.signin.user.admin` +
		`&redirect_uri=${encodeURIComponent(awsRedirectUrl)}`;

	// useEffect(() => {
	// 	if (!globalState.loggedInUser && !!getCookieValue('accesstoken')) {
	// 		globalState.signInHandler();
	// 	}
	// 	// eslint-disable-next-line react-hooks/exhaustive-deps
	// }, [globalState.loggedInUser]);

	return (
		<div className={styles.signUpContainer}>
			<SignInHeader />
			<h2>Sign in</h2>
			<SignInForm
				linkCognito={linkCognito}
				linkCognitoPageName="Sign in"
				linkSignUpCognito={linkSignUpCognito}
				linkToOtherPage={signup}
				linkToOtherPageName=" Sign up"
				nameInputId="companyName"
				nameInputLabel="Company Name"
				nameInputPlaceholder="name@host.com"
				nameInputType="text"
				passwordInputId="password"
				passwordInputLabel="Password"
				passwordInputPlaceholder="Password"
				passwordInputType="password"
				submitButtonId="signInButtonId"
				submitButtonType="button"
				submitButtonValue="Sign up"
				svg={undefined}
			/>
			{/* <ContinueWithGoogle /> */}
		</div>
	);
};

export default SignIn;