blob: a5e0f3e16fbd5701fbc3bb09726c639558c9e5d5 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
|
import React, {useState} from 'react';
import {
TextField,
Button,
Checkbox,
FormControlLabel,
Grid,
} from '@material-ui/core';
import { User } from '../../types';
import { ContentSection } from 'react-benzin';
import { get, post } from '../../requests';
interface PropTypes {
setUser: (user: User) => void;
}
const Registration: React.FC<PropTypes> = ({ setUser }) => {
const [username, setUsername] = useState<string>('');
const [isRememberMe, setIsRememberMe] = useState<boolean>(false);
const handleChange = (event: React.ChangeEvent<HTMLInputElement>): void => {
setUsername(event.target.value);
};
const handleCheck = (event: React.ChangeEvent<HTMLInputElement>): void => {
setIsRememberMe(event.target.checked);
};
const handleSubmit = (): void => {
if (username !== '') {
post('users/', { username })
.then(response => {
const user = response.data;
setUser(user);
if (isRememberMe) {
localStorage.setItem('userId', user.id);
}
})
.catch(err => {
get('users/').then(response => {
const user = response.data.filter((user: User) => user.username === username)[0];
setUser(user);
if (isRememberMe) {
localStorage.setItem('userId', user.id);
}
});
});
}
};
return (
<ContentSection sectionName="Tell us who you are">
<p> Choose yourself a username to track your progress and compete with others: </p>
<Grid container direction="column">
<Grid item>
<TextField
variant="outlined"
color="secondary"
label="Username"
value={username}
onChange={handleChange}
/>
</Grid>
<Grid item>
<FormControlLabel
control={<Checkbox color="secondary" onChange={handleCheck} />}
label="Remember me"
/>
</Grid>
<Grid item>
<Button variant="contained" color="secondary" onClick={handleSubmit}>
Submit!
</Button>
</Grid>
</Grid>
</ContentSection>
);
};
export default Registration;
|
