Skip to content

Commit efdc294

Browse files
yochannahyochannah
authored
Merge pull request #142 from oneknucklehead/development
Login/SignUp page bug fixed
2 parents 293b380 + 8253735 commit efdc294

File tree

3 files changed

+93
-101
lines changed

3 files changed

+93
-101
lines changed

‎src/pages/Login.js‎

Lines changed: 67 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -7,91 +7,86 @@
77
import { React, useState } from 'react';
88
import '../styles/Login.css';
99
import { Col, Row, Form, Button } from 'react-bootstrap';
10-
import { showSuccessMessage,showErrorMessage } from '../helpers/alerts';
10+
import { showSuccessMessage, showErrorMessage } from '../helpers/alerts';
1111
import { LoginValidation } from '../helpers/validate';
1212

1313
function Login() {
1414
const [details, setDetails] = useState({
15-
email: '',
16-
password: '',
17-
accessToken: '',
15+
email: '',
16+
password: '',
17+
accessToken: '',
1818
});
19-
const [success,setSuccess] = useState("");
20-
const [error,setError]=useState("");
19+
const [success, setSuccess] = useState('');
20+
const [error, setError] = useState('');
2121

22-
2322
const handleLogin = (e) => {
2423
e.preventDefault();
25-
setSuccess("");
26-
setError("");
24+
setSuccess('');
25+
setError('');
2726
const check = LoginValidation(details);
28-
if(check){
29-
try{
30-
const response = fetch('https://journal-policy-tracker.herokuapp.com/users/login', {
31-
method: 'POST',
32-
mode: 'cors',
33-
headers: {
34-
'Content-Type': 'application/json',
35-
},
36-
body: JSON.stringify({
37-
details
38-
}),
39-
})
40-
// const res = response.json();
41-
// setDetails({ ...details,accessToken: res.token })
42-
setSuccess("Login Successful")
43-
44-
}
45-
catch(err){
27+
if (check) {
28+
try {
29+
const response = fetch('https://journal-policy-tracker.herokuapp.com/users/login', {
30+
method: 'POST',
31+
mode: 'cors',
32+
headers: {
33+
'Content-Type': 'application/json',
34+
},
35+
body: JSON.stringify({
36+
details,
37+
}),
38+
});
39+
// const res = response.json();
40+
// setDetails({ ...details,accessToken: res.token })
41+
setSuccess('Login Successful');
42+
} catch (err) {
4643
// console.log(error);
47-
setError("Invalid Credentials")
44+
setError('Invalid Credentials');
45+
}
46+
} else {
47+
setError('Invalid Input');
4848
}
49-
}else{
50-
setError("Invalid Input")
51-
}
5249
};
53-
return (
54-
<Row className='login-padding'>
55-
<Col md={4} />
56-
<Col md={4}>
57-
<Form className='login-form' onSubmit={handleLogin}>
58-
<Form.Group className='mb-3' controlId='formBasicEmail'>
59-
{success && showSuccessMessage(success)}
60-
{error && showErrorMessage(error)}
61-
<Form.Label>Email</Form.Label>
62-
<Form.Control
63-
type='email'
64-
placeholder='Enter email'
65-
name='email'
66-
value={details.email}
67-
onChange={(e) => setDetails({ ...details, email: e.target.value })}
68-
/>
69-
<Form.Text className='text-muted'>
70-
We'll never share your email with anyone else.
71-
</Form.Text>
72-
</Form.Group>
50+
return (
51+
<Row className='login-padding'>
52+
<Col>
53+
<Form className='login-form' onSubmit={handleLogin}>
54+
<Form.Group className='mb-3' controlId='formBasicEmail'>
55+
{success && showSuccessMessage(success)}
56+
{error && showErrorMessage(error)}
57+
<Form.Label>Email</Form.Label>
58+
<Form.Control
59+
type='email'
60+
placeholder='Enter email'
61+
name='email'
62+
value={details.email}
63+
onChange={(e) => setDetails({ ...details, email: e.target.value })}
64+
/>
65+
<Form.Text className='text-muted'>
66+
We'll never share your email with anyone else.
67+
</Form.Text>
68+
</Form.Group>
7369

74-
<Form.Group className='mb-3' controlId='formBasicPassword'>
75-
<Form.Label>Password</Form.Label>
76-
<Form.Control
77-
type='password'
78-
placeholder='Password'
79-
name='password'
80-
value={details.password}
81-
onChange={(e) => setDetails({ ...details, password: e.target.value })}
82-
/>
83-
</Form.Group>
84-
<Form.Group className='mb-3' controlId='formBasicCheckbox'>
85-
<Form.Check type='checkbox' label='Remember me' />
86-
</Form.Group>
87-
<Button variant='primary' type='submit'>
88-
Login
89-
</Button>
90-
</Form>
91-
</Col>
92-
<Col md={4} />
93-
</Row>
94-
);
70+
<Form.Group className='mb-3' controlId='formBasicPassword'>
71+
<Form.Label>Password</Form.Label>
72+
<Form.Control
73+
type='password'
74+
placeholder='Password'
75+
name='password'
76+
value={details.password}
77+
onChange={(e) => setDetails({ ...details, password: e.target.value })}
78+
/>
79+
</Form.Group>
80+
<Form.Group className='mb-3' controlId='formBasicCheckbox'>
81+
<Form.Check type='checkbox' label='Remember me' />
82+
</Form.Group>
83+
<Button variant='primary' type='submit'>
84+
Login
85+
</Button>
86+
</Form>
87+
</Col>
88+
</Row>
89+
);
9590
}
9691

9792
export default Login;

‎src/pages/SignUp.js‎

Lines changed: 25 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,52 +1,50 @@
11
/* eslint-disable react/function-component-definition */
22
import { React, useState } from 'react';
33
import { Row, Col, Form, Button } from 'react-bootstrap';
4-
import { showSuccessMessage,showErrorMessage } from '../helpers/alerts';
4+
import { showSuccessMessage, showErrorMessage } from '../helpers/alerts';
55
import { SignupValidation } from '../helpers/validate';
6-
import "../styles/Signup.css"
6+
import '../styles/Signup.css';
77

88
const SignUp = () => {
99
const [details, setDetails] = useState({
1010
username: '',
1111
email: '',
1212
password: '',
1313
});
14-
const [success,setSuccess] = useState("");
15-
const [error,setError]=useState("");
14+
const [success, setSuccess] = useState('');
15+
const [error, setError] = useState('');
1616

1717
const handleSubmit = (e) => {
1818
e.preventDefault();
19-
setSuccess("");
20-
setError("");
19+
setSuccess('');
20+
setError('');
2121
const check = SignupValidation(details);
22-
if(check){
23-
try{
24-
fetch('https://journal-policy-tracker.herokuapp.com/users/register', {
25-
method: 'POST',
26-
headers: { 'Content-Type': 'application/json' },
27-
body: JSON.stringify(details),
28-
})
29-
setSuccess("Signup Successful")
30-
setTimeout(()=>{
31-
window.location.href = '/login';
32-
},800)
33-
}catch(err){
34-
setError("Signup Failed")
22+
if (check) {
23+
try {
24+
fetch('https://journal-policy-tracker.herokuapp.com/users/register', {
25+
method: 'POST',
26+
headers: { 'Content-Type': 'application/json' },
27+
body: JSON.stringify(details),
28+
});
29+
setSuccess('Signup Successful');
30+
setTimeout(() => {
31+
window.location.href = '/login';
32+
}, 800);
33+
} catch (err) {
34+
setError('Signup Failed');
35+
}
36+
} else {
37+
setError('Invalid Input');
3538
}
36-
}
37-
else{
38-
setError("Invalid Input")
39-
}
4039
};
4140

4241
return (
4342
<Row className='signup-padding'>
44-
<Col md={4} />
45-
<Col md={4}>
43+
<Col>
4644
<Form className='login-form' onSubmit={handleSubmit}>
4745
<Form.Group className='mb-3' controlId='formBasicUsername'>
48-
{success && showSuccessMessage(success)}
49-
{error && showErrorMessage(error)}
46+
{success && showSuccessMessage(success)}
47+
{error && showErrorMessage(error)}
5048
<Form.Label>Username</Form.Label>
5149
<Form.Control
5250
type='text'
@@ -78,7 +76,6 @@ const SignUp = () => {
7876
</Button>
7977
</Form>
8078
</Col>
81-
<Col md={4} />
8279
</Row>
8380
);
8481
};

‎src/styles/Login.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
.login-form {
2-
width: 450px;
2+
max-width: 450px;
33
margin: auto;
44
background: #ffffff;
55
box-shadow: 0px 14px 80px rgba(34, 35, 58, 0.2);

0 commit comments

Comments
 (0)