89 lines
2.6 KiB
React
89 lines
2.6 KiB
React
'use client';
|
|
|
|
// ---------------------------------------------------------------------------------------------------------------------
|
|
//! Imports
|
|
// ---------------------------------------------------------------------------------------------------------------------
|
|
|
|
// --------------------------------------------------- Components ------------------------------------------------------
|
|
import Image from 'next/image';
|
|
import Link from 'next/link';
|
|
// ---------------------------------------------------------------------------------------------------------------------
|
|
|
|
// -------------------------------------------------- Hooks & Utils ----------------------------------------------------
|
|
import { useData } from './hooks/useData';
|
|
import { useActions } from './hooks/useActions';
|
|
// ---------------------------------------------------------------------------------------------------------------------
|
|
|
|
// ------------------------------------------------- Assets & Styles ---------------------------------------------------
|
|
import '../styles.scss';
|
|
// ---------------------------------------------------------------------------------------------------------------------
|
|
|
|
const Login = () => {
|
|
const { emailRef, passwordRef } = useData();
|
|
const { handleSubmit } = useActions({ emailRef, passwordRef });
|
|
|
|
return (
|
|
<div className='authContainer'>
|
|
<Image
|
|
src={'/logo-transparent.png'}
|
|
className='appLogo'
|
|
alt='appLogo'
|
|
width={1024}
|
|
height={1024}
|
|
/>
|
|
<div className='formContainer'>
|
|
<h1 className='formTitle'>Connexion</h1>
|
|
|
|
<div
|
|
role='form'
|
|
className='form'
|
|
>
|
|
<div className='inputContainer'>
|
|
<input
|
|
ref={emailRef}
|
|
type='email'
|
|
name='email'
|
|
className='input'
|
|
required
|
|
/>
|
|
<label className='inputLabel'>Adresse e-mail</label>
|
|
</div>
|
|
<div className='inputContainer'>
|
|
<input
|
|
ref={passwordRef}
|
|
type='password'
|
|
name='password'
|
|
className='input'
|
|
required
|
|
/>
|
|
<label className='inputLabel'>Mot de passe</label>
|
|
</div>
|
|
|
|
<Link
|
|
href={'/auth/forgot'}
|
|
className='forgetLink'
|
|
>
|
|
Mot de passe oublié ?
|
|
</Link>
|
|
</div>
|
|
<div className='buttonsContainer'>
|
|
<button
|
|
className='submitButton'
|
|
onClick={handleSubmit}
|
|
>
|
|
Se connecter
|
|
</button>
|
|
<Link
|
|
href={'/auth/register'}
|
|
className='submitButton secondary'
|
|
>
|
|
S'inscrire
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default Login;
|