Skip to content

Commit a83d34f

Browse files
ian-flynnian-flynn
authored
Merge pull request #81 from oslabs-beta/dev
Dev
2 parents 70ebd47 + 3afd659 commit a83d34f

15 files changed

+506
-472
lines changed

‎CNAME

-1
This file was deleted.

‎client/src/pages/loginPage/LoginPage.jsx

+46-9
Original file line numberDiff line numberDiff line change
@@ -4,23 +4,55 @@ import TextField from '../RootPage/components/TextField';
44
import Button from '../RootPage/components/Button';
55

66
const LoginPage = () => {
7-
const [username, setUsername] = useState(null);
8-
const [password, setPassword] = useState(null);
9-
const [errorDisplay, setErrorDisplay] = useState('none');
7+
const [username, setUsername] = useState('');
8+
const [usernameRulesDisplay, setUsernameRulesDisplay] = useState(false);
9+
const [passwordRulesDisplay, setPasswordRulesDisplay] = useState(false);
10+
const [usernameError, setUsernameError] = useState('');
11+
const [passwordError, setPasswordError] = useState('');
12+
const [password, setPassword] = useState('');
1013
const navigate = useNavigate();
1114

15+
const checkUsername = (username) => {
16+
return (
17+
/[^a-z0-9_\-.]/i.test(username) ||
18+
username.length < 4 ||
19+
username.length > 32
20+
);
21+
};
22+
const checkPassword = (password) => {
23+
return password.length < 8 || password.length > 32;
24+
};
1225
const handleSend = async (endpoint) => {
13-
//TO DO: fix body so that html injection
26+
let shouldIReturn;
27+
28+
if (checkUsername(username)) {
29+
setUsernameError(
30+
'Must only contain letters (a-z, A-Z), numbers (0-9), dashes or underscores (no spaces), periods (.), and be between 4-32 characters long.'
31+
);
32+
shouldIReturn = true;
33+
} else {
34+
setUsernameError('');
35+
}
36+
if (checkPassword(password)) {
37+
setPasswordError('Must be between 8-32 characters long.');
38+
shouldIReturn = true;
39+
} else {
40+
setPasswordError('');
41+
}
42+
if (shouldIReturn) return;
43+
1444
try {
15-
console.log(username, password, endpoint);
16-
const response = await fetch(`/api/${endpoint}`, {
45+
const url =
46+
process.env.NODE_ENV === 'development'
47+
? `http://localhost:3000/api/${endpoint}`
48+
: `/api/${endpoint}`;
49+
const response = await fetch(url, {
1750
method: 'POST',
1851
headers: { 'Content-Type': 'application/json' },
1952
body: JSON.stringify({ username: username, password: password }),
2053
});
21-
console.log(response.status);
22-
if (response.status === 200) navigate('/dashboard');
23-
else setErrorDisplay('block');
54+
console.log(response);
55+
// if (response.status === 200) navigate('/dashboard');
2456
} catch (err) {
2557
console.log(err);
2658
}
@@ -33,13 +65,18 @@ const LoginPage = () => {
3365
label='Username: '
3466
onChange={setUsername}
3567
isRequired
68+
aria-describedby='username-error'
3669
/>
70+
71+
<p id='username-error'>{usernameError}</p>
3772
<TextField
3873
id='password'
3974
label='Password: '
4075
onChange={setPassword}
4176
isRequired
77+
aria-describedby='password-error'
4278
/>
79+
<p id='password-error'>{passwordError}</p>
4380
<div id='account-buttons'>
4481
<Button id='login' onPress={() => handleSend('login')}>
4582
Login

‎client/src/styles/styles.css

+6-4
Original file line numberDiff line numberDiff line change
@@ -250,6 +250,7 @@ footer {
250250
display: flex;
251251
flex-direction: column;
252252
margin: auto;
253+
max-width: 30rem;
253254
padding: 2rem;
254255
background-color: color-mix(
255256
in srgb,
@@ -277,7 +278,12 @@ footer {
277278
width: 70%;
278279
}
279280
}
281+
p {
282+
font-size: 0.8rem;
283+
margin-bottom: 1rem;
284+
}
280285
#account-buttons {
286+
text-align: center;
281287
margin: 2rem 0;
282288

283289
button {
@@ -413,10 +419,6 @@ footer {
413419
width: 100%;
414420
}
415421
}
416-
417-
#logout {
418-
/* margin-left: 3px; */
419-
}
420422
}
421423
.closed {
422424
right: -50%;

‎client/webpack.config.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
const path = require('path');
2-
const HtmlWebPackPlugin = require('html-webpack-plugin');
2+
const HtmlWebpackPlugin = require('html-webpack-plugin');
33

44
module.exports = {
55
entry: './src/index.js',
@@ -61,7 +61,7 @@ module.exports = {
6161
extensions: ['.js', '.jsx', '.css', '.scss'],
6262
},
6363
plugins: [
64-
new HtmlWebPackPlugin({
64+
new HtmlWebpackPlugin({
6565
template: './src/index.html',
6666
}),
6767
// new webpack.ProvidePlugin({

‎package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
"description": "Kafka cluster monitoring tool",
55
"main": "./server/index.js",
66
"scripts": {
7-
"start": "cd ./server && node index.js",
7+
"start": "cd server && npm run start",
88
"client-install": "cd client && npm install",
99
"server-install": "cd server && npm install",
1010
"dev": "concurrently \"cd server && npm run dev\" \"cd client && npm run dev\""

‎server/controllers/authController.js

+97-96
Original file line numberDiff line numberDiff line change
@@ -1,102 +1,103 @@
1-
const db = require('../postgres'); // db module
2-
const bcrypt = require('bcrypt');
1+
import bcrypt from 'bcrypt';
2+
import models from '../models/index.js';
33

4-
const authController = {};
5-
6-
authController.createAccount = async (req, res, next) => {
7-
// console.log('inside create account');
8-
try {
9-
const { username, password } = req.body;
10-
const checkQuery = 'SELECT username FROM users WHERE username = $1';
11-
await db.query(checkQuery, [username], async (err, user) => {
12-
if (user.rowCount > 0) {
13-
res.locals.isVerified = false;
14-
return next();
15-
} else if (err) {
16-
return next({
17-
log: 'Error occurred during create account.',
18-
status: 400,
19-
message: { err: 'Error occurred during create account.', err },
20-
});
21-
} else {
22-
const passHash = await bcrypt.hash(password, 10);
23-
const newUser =
24-
'INSERT INTO users (username, password) VALUES ($1, $2)';
25-
await db.query(newUser, [username, passHash], (err, user) => {
26-
if (err) {
27-
return next({
28-
log: 'Error occurred when creating new account.',
29-
status: 401,
30-
message: {
31-
err: 'Error occurred when creating new account.',
32-
err,
33-
},
34-
});
35-
} else {
36-
res.locals.isVerified = true;
37-
res.locals.cookieID = username;
38-
return next();
39-
}
40-
});
41-
}
42-
});
43-
} catch (err) {
44-
return next({
45-
log: 'Error occurred during create account.',
46-
status: 400,
47-
message: { err: 'Error occurred during create account.', err },
4+
const authController = {
5+
createAccount: async (req, res, next) => {
6+
const password = await bcrypt.hash(req.body.password, 10).catch(next);
7+
await models.User.create({
8+
username: req.body.username,
9+
password: password,
10+
}).catch((error) => {
11+
next({
12+
log: 'Error occurred during create account.',
13+
status: 400,
14+
message: { err: 'Error occurred during create account.', error },
15+
});
4816
});
49-
}
17+
return next();
18+
},
19+
verifyUser: async (req, res, next) => {
20+
return next();
21+
},
22+
addBrokers: async (req, res, next) => {
23+
return next();
24+
},
25+
addConnectionString: async (req, res, next) => {
26+
return next();
27+
},
5028
};
5129

52-
authController.verifyUser = async (req, res, next) => {
53-
try {
54-
const { username, password } = req.body;
55-
let hashedPassword = await db.query(
56-
'SELECT password FROM users WHERE username = $1',
57-
[username]
58-
);
59-
hashedPassword = hashedPassword.rows[0].password;
60-
const matched = await bcrypt.compare(password, hashedPassword);
61-
if (!matched) {
62-
res.locals.isVerified = false;
63-
return next();
64-
} else {
65-
res.locals.isVerified = true;
66-
res.locals.cookieID = username;
67-
return next();
68-
}
69-
} catch (err) {
70-
// console.log('catch in verify user')
71-
return next({
72-
log: 'Error inside verify user.',
73-
status: 401,
74-
message: { err: 'Error inside verify user.', err },
75-
});
76-
}
77-
};
30+
// authController.createAccount = async (req, res, next) => {
31+
// if (req.body.username && req.body.password) {
32+
// try {
33+
// const password = await bcrypt.hash(req.body.password, 10);
34+
// const { username } = req.body;
35+
// await User.create({
36+
// username,
37+
// password,
38+
// });
39+
// return next();
40+
// } catch (err) {
41+
// console.log('ERROR: ', err);
42+
// return next({
43+
// log: 'Error occurred during create account.',
44+
// status: 400,
45+
// message: { err: 'Error occurred during create account.', err },
46+
// });
47+
// }
48+
// }
49+
// return next({
50+
// log: 'No username/password provided.',
51+
// status: 400,
52+
// message: { err: 'No username/password provided.' },
53+
// });
54+
// };
7855

79-
authController.addBrokers = async (req, res, next) => {
80-
console.log('inside addBrokers');
81-
try {
82-
const { idsArray, username } = req.body;
83-
console.log('req.body in addBrokers... ', req.body);
84-
const queryString = `
85-
UPDATE users
86-
SET broker_ids = $1
87-
WHERE username = $2
88-
`;
89-
let inserted = await db.query(queryString, [idsArray, username]);
90-
console.log('inserted.. ', inserted);
91-
return next();
92-
} catch (err) {
93-
// console.log('catch in verify user')
94-
return next({
95-
log: 'Error inside add Brokers.',
96-
status: 401,
97-
message: { err: 'Unable to add brokers to database table users.', err },
98-
});
99-
}
100-
};
56+
// authController.verifyUser = async (req, res, next) => {
57+
// if (req.body.username && req.body.password) {
58+
// try {
59+
// const { username, password } = req.body;
60+
// const user = await User.findOne({ where: { username } });
61+
// const badInput = {
62+
// log: 'Incorrect username/password combination.',
63+
// status: 400,
64+
// message: { err: 'Incorrect username/password combination.' },
65+
// };
66+
// if (!user) return next(badInput);
67+
// const matched = await bcrypt.compare(password, user.password);
68+
// if (!matched) return next(badInput);
69+
// return next();
70+
// } catch (err) {
71+
// return next({
72+
// log: 'Error verifying user',
73+
// status: 400,
74+
// message: { err: 'Error verifying user', err },
75+
// });
76+
// }
77+
// }
78+
// };
10179

102-
module.exports = authController;
80+
// authController.addBrokers = async (req, res, next) => {
81+
// // console.log('inside addBrokers');
82+
// // try {
83+
// // const { idsArray, username } = req.body;
84+
// // console.log('req.body in addBrokers... ', req.body);
85+
// // const queryString = `
86+
// // UPDATE users
87+
// // SET broker_ids = $1
88+
// // WHERE username = $2
89+
// // `;
90+
// // let inserted = await db.query(queryString, [idsArray, username]);
91+
// // console.log('inserted.. ', inserted);
92+
// // return next();
93+
// // } catch (err) {
94+
// // return next({
95+
// // log: 'Error inside add Brokers.',
96+
// // status: 401,
97+
// // message: { err: 'Unable to add brokers to database table users.', err },
98+
// // });
99+
// // }
100+
// return next();
101+
// };
102+
export default authController;
103+
// module.exports = authController;

‎server/controllers/cookieController.js

+7-8
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,12 @@
11
const cookieController = {};
22

33
cookieController.setCookie = (req, res, next) => {
4-
console.log('we made it to set cookie lol')
5-
console.log('verified',res.locals.isVerified)
6-
if (res.locals.isVerified) {
7-
console.log('cookieID', res.locals.cookieID)
8-
res.cookie('cookieID', res.locals.cookieID);
9-
}
4+
// console.log('verified', res.locals.isVerified);
5+
// if (res.locals.isVerified) {
6+
// console.log('cookieID', res.locals.cookieID);
7+
// res.cookie('cookieID', res.locals.cookieID);
8+
// }
109
return next();
1110
};
12-
13-
module.exports = cookieController;
11+
export default cookieController;
12+
// module.exports = cookieController;

0 commit comments

Comments
 (0)