Cédric FAMIBELLE-PRONZOLA
76 lines
2.2 KiB
JavaScript
76 lines
2.2 KiB
JavaScript
import {useState, forwardRef} from 'react'
|
||
import Button from '@mui/material/Button'
|
||
import Typography from '@mui/material/Typography'
|
||
import Box from '@mui/material/Box'
|
||
import Snackbar from '@mui/material/Snackbar'
|
||
import {LinearProgress} from '@mui/material'
|
||
import MuiAlert from '@mui/material/Alert'
|
||
import ResetDialog from './reset-dialog'
|
||
|
||
const Alert = forwardRef(function Alert(props, ref) {
|
||
return <MuiAlert ref={ref} elevation={6} variant='filled' {...props} />
|
||
})
|
||
|
||
export default function ResetPassword() {
|
||
const [open, setOpen] = useState(false)
|
||
const [error, setError] = useState(false)
|
||
const [loading, setLoading] = useState(false)
|
||
const [success, setSuccess] = useState(false)
|
||
|
||
const handleClose = (event, reason) => {
|
||
if (reason === 'clickaway') {
|
||
return
|
||
}
|
||
|
||
setError('')
|
||
setSuccess(false)
|
||
}
|
||
|
||
return (
|
||
<>
|
||
<Box style={{marginTop: 20}}>
|
||
<Button
|
||
fullWidth
|
||
disabled={loading}
|
||
variant='outlined'
|
||
color='warning'
|
||
onClick={() => setOpen(true)}
|
||
>
|
||
<Typography style={{fontWeight: 'bold'}}>
|
||
Mot de passe oublié
|
||
</Typography>
|
||
</Button>
|
||
</Box>
|
||
{loading && <LinearProgress size={24} style={{width: '100%', marginTop: '1em'}} />}
|
||
{error && (
|
||
<Snackbar
|
||
open={Boolean(error)}
|
||
autoHideDuration={6000}
|
||
onClose={handleClose}
|
||
>
|
||
<Alert severity='error' onClose={handleClose}><strong>{error}</strong></Alert>
|
||
</Snackbar>
|
||
)}
|
||
{success && (
|
||
<Snackbar
|
||
open={success}
|
||
autoHideDuration={15_000}
|
||
onClose={handleClose}
|
||
>
|
||
<Alert severity='success' onClose={handleClose}><strong>Email envoyé avec succès. Vous pouvez changer votre mot de passe via le lien qui vous a été envoyé.</strong></Alert>
|
||
</Snackbar>
|
||
)}
|
||
<ResetDialog
|
||
lyen='forgot-password'
|
||
title='Mot de passe oublié'
|
||
content='Indiquez l’adresse e-mail utilisée lors de votre inscription. Vous receverez des instructions par e-mail.'
|
||
open={open}
|
||
setOpen={setOpen}
|
||
setLoading={setLoading}
|
||
setError={setError}
|
||
setSuccess={setSuccess}
|
||
/>
|
||
</>
|
||
)
|
||
}
|