From 015b1a63b861288e68b381dbf42fa1baa055b803 Mon Sep 17 00:00:00 2001 From: Sorrel Bri Date: Sat, 18 Jan 2020 00:18:51 -0800 Subject: [PATCH] add login hook to frontend --- play-node-go/src/components/Login/Login.js | 66 ++++++++++++++++++- .../src/components/Login/Login.test.js | 4 +- play-node-go/src/components/Signup/Signup.js | 2 +- .../src/reducers/auth/stateReducer.auth.js | 9 +-- play-node-go/src/services/authServices.js | 17 ++++- .../src/services/authServices.test.js | 5 +- server/controllers/auth.js | 8 +-- server/test/auth.login.spec.js | 4 +- 8 files changed, 93 insertions(+), 22 deletions(-) diff --git a/play-node-go/src/components/Login/Login.js b/play-node-go/src/components/Login/Login.js index 0264d17..3a735fb 100644 --- a/play-node-go/src/components/Login/Login.js +++ b/play-node-go/src/components/Login/Login.js @@ -1,13 +1,77 @@ import React, { useState } from 'react'; import './Login.scss'; +import authServices from '../../services/authServices'; +import FormError from '../FormError/FormError'; const Login = (props) => { const [username, setUsername] = useState(''); const [password, setPassword] = useState(''); + const minimumPasswordLength = 8; + const errorDispatchAction = { + type: 'ERR', + message: 'AUTH_ERROR' + } + + const validateLoginForm = next => { + if (password.length < minimumPasswordLength) { + return props.dispatch({ + ...errorDispatchAction, + body: { authError: 'This password is invalid'} + }) + } + + if (!/^[\w\d_.-]+$/.test(username)) { + return props.dispatch({ + ...errorDispatchAction, + body: { authError: "This username is invalid"} + }) + } + + next(); + } + + + const postLoginForm = async () => { + const loginResponse = await authServices.loginService({ + username, + password + }) + const parsedResponse = JSON.parse(loginResponse); + if (parsedResponse.errors) { + const authError = parsedResponse.errors + return props.dispatch({ + ...errorDispatchAction, + body: { authError } + }) + } + + return props.dispatch({ + type: 'AUTH', + message: 'LOGIN', + body: parsedResponse + }) + } + + const handleSubmit = e => { + e.preventDefault(); + validateLoginForm(postLoginForm); + } + + const formError = errors => { + if(!errors) return <>; + + if (errors.auth) { + return + } + } return (
-
+ {formError(props.state.errors)} + handleSubmit(e)} + > { - const { getByTestId } = render(); + const state = initState(); + const { getByTestId } = render(); const LoginDiv = getByTestId('Login'); expect(LoginDiv).toBeInTheDocument(); }); diff --git a/play-node-go/src/components/Signup/Signup.js b/play-node-go/src/components/Signup/Signup.js index b454da0..0add6ae 100644 --- a/play-node-go/src/components/Signup/Signup.js +++ b/play-node-go/src/components/Signup/Signup.js @@ -70,7 +70,7 @@ const Signup = (props) => { }) } - const handleSubmit = async e => { + const handleSubmit = e => { e.preventDefault(); validateSignupForm(postSignupForm); } diff --git a/play-node-go/src/reducers/auth/stateReducer.auth.js b/play-node-go/src/reducers/auth/stateReducer.auth.js index 4ba18b6..015c686 100644 --- a/play-node-go/src/reducers/auth/stateReducer.auth.js +++ b/play-node-go/src/reducers/auth/stateReducer.auth.js @@ -7,7 +7,7 @@ export const authReducer = (state: state, action: action):state => { return loginReducer(state, action); case 'SIGNUP': - return signupReducer(state, action); + return loginReducer(state, action); case 'LOGOUT': return state; @@ -18,13 +18,6 @@ export const authReducer = (state: state, action: action):state => { } function loginReducer(state: state, action: action): state { - const userCredentials = action.body; - - - return state; -} - -function signupReducer(state: state, action: action): state { const newUser = action.body; return {...state, user: newUser }; } \ No newline at end of file diff --git a/play-node-go/src/services/authServices.js b/play-node-go/src/services/authServices.js index d4318fd..6c507fe 100644 --- a/play-node-go/src/services/authServices.js +++ b/play-node-go/src/services/authServices.js @@ -9,8 +9,19 @@ headers.append('Content-Type', 'application/json'); headers.append('Accept', 'application/json'); headers.append('Sec-Fetch-Site', 'cross-site') -const loginService = () => { - +const loginService = async(formData) => { + const response = await fetch(loginEndpoint, { + method: 'POST', + credentials: 'include', + body: JSON.stringify(formData), + headers: headers + }) + .then(res => { + return res.text(); + }).catch(err => { + return err; + }); + return response; } const signupService = async (formData) => { @@ -20,7 +31,7 @@ const signupService = async (formData) => { body: JSON.stringify(formData), headers: headers }) - .then(res => { + .then(res => { return res.text(); }).catch(err => { return err; diff --git a/play-node-go/src/services/authServices.test.js b/play-node-go/src/services/authServices.test.js index 9e61ab9..b0dba42 100644 --- a/play-node-go/src/services/authServices.test.js +++ b/play-node-go/src/services/authServices.test.js @@ -16,7 +16,8 @@ describe('signupService', () => { }); describe('loginService', () => { - it('', () => { - + it('login is successful', async () => { + // const response = await loginService(newUserFormData); + // console.log(response); }); }); \ No newline at end of file diff --git a/server/controllers/auth.js b/server/controllers/auth.js index 5f65c2e..17ebb48 100644 --- a/server/controllers/auth.js +++ b/server/controllers/auth.js @@ -45,25 +45,25 @@ const login = async (req, res, next) => { const savedUser = queryResults[0] || null; if (!savedUser) { - return res.status(401).json({err: 'bad credentials'}); + return res.status(401).send({errors: 'bad credentials'}); } const hashedPassword = savedUser.password; const passwordMatch = await compareHash(user.password, hashedPassword); if (!passwordMatch) { - return res.status(401).json({err: 'bad credentials'}); + return res.status(401).send({errors: 'bad credentials'}); } const authorizedUser = {...savedUser}; delete authorizedUser.password; signToken(res, authorizedUser); - res.send('ok').status(200); + res.send({...authorizedUser}).status(200); } catch (err) { - res.status(500).json(err); + res.status(500).send({errors: err}); } } diff --git a/server/test/auth.login.spec.js b/server/test/auth.login.spec.js index 5ec5ec7..20ab41e 100644 --- a/server/test/auth.login.spec.js +++ b/server/test/auth.login.spec.js @@ -19,7 +19,7 @@ const authSignupSpec = (chai, knex, server) => { .end((err, res) => { if (err) done(err); res.should.status(401); - res.body.err.should.equal('bad credentials'); + res.body.errors.should.equal('bad credentials'); done(); }); }) @@ -32,7 +32,7 @@ const authSignupSpec = (chai, knex, server) => { .end((err, res) => { if (err) done(err); res.should.status(401); - res.body.err.should.equal('bad credentials'); + res.body.errors.should.equal('bad credentials'); done(); }) })