frontend/containers/LostPassword/Success.js (view raw)
1import {useTranslation} from 'react-i18next';
2import Button from '@material-ui/core/Button';
3import Icon from '@material-ui/core/Icon';
4import CardContent from '@material-ui/core/CardContent';
5import Card from '@material-ui/core/Card';
6import Typography from '@material-ui/core/Typography';
7import CardActions from '@material-ui/core/CardActions';
8import {makeStyles} from '@material-ui/core/styles';
9
10const Success = ({email}) => {
11 const {t} = useTranslation();
12 const classes = useStyles();
13
14 return (
15 <Card className={classes.successCard}>
16 <CardContent>
17 <Icon size="large" color="primary" className={classes.successIcon}>
18 done
19 </Icon>
20 </CardContent>
21 <CardContent>
22 <Typography variant="body1" gutterBottom>
23 {t('lost_password.sent', {email})}
24 </Typography>
25 </CardContent>
26 <CardActions className={classes.actions}>
27 <Button
28 id="LostPasswordRegister"
29 href="/auth/login"
30 color="primary"
31 variant="contained"
32 >
33 {t('lost_password.actions.login')}
34 </Button>
35 </CardActions>
36 </Card>
37 );
38};
39
40const useStyles = makeStyles(theme => ({
41 successCard: {
42 textAlign: 'center',
43 },
44 successIcon: {
45 fontSize: theme.spacing(14),
46 },
47 actions: {
48 justifyContent: 'center',
49 },
50}));
51export default Success;