blob: ce8384f1565d58f8df5699cf90ef3c74180f9d1c (
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
|
import React, {useState} from 'react';
import {
TextField,
Button,
Checkbox,
FormControlLabel,
Grid,
} from "@material-ui/core";
import ContentSection from "../../../components/ContentSection/ContentSection";
import {get, post} from "../../../requests";
const Registration = ({ setUser }) => {
const [username, setUsername] = useState('');
const [isRememberMe, setIsRememberMe] = useState(false);
const handleChange = (event) => {
setUsername(event.target.value);
};
const handleCheck = (event) => {
setIsRememberMe(event.target.checked);
};
const handleSubmit = () => {
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.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" size="large" onClick={handleSubmit}>
Submit!
</Button>
</Grid>
</Grid>
</ContentSection>
);
};
export default Registration;
|
