From 25a6ecc4e48f3579c701477dc9b2e841086c0ef7 Mon Sep 17 00:00:00 2001 From: Joe Jackson Date: Thu, 28 May 2020 14:21:33 +0100 Subject: [PATCH 01/13] Add in redirect for signup route Relates #6 Co-authored-by: HettieM --- client-app/src/App.js | 45 ++--- client-app/src/components/AppContext.js | 2 +- client-app/src/components/customer/map.js | 24 +-- client-app/src/components/shared/landing.js | 2 - client-app/src/components/shared/signup.js | 207 +++++++++++++------- client-app/src/styles/buttons.js | 4 +- client-app/src/styles/header.js | 1 + client-app/src/utils/postData.js | 48 +++-- package.json | 1 - 9 files changed, 197 insertions(+), 137 deletions(-) diff --git a/client-app/src/App.js b/client-app/src/App.js index e1856dd..1ed3da2 100644 --- a/client-app/src/App.js +++ b/client-app/src/App.js @@ -1,4 +1,4 @@ -import React, { useState } from "react"; +import React, { useContext } from "react"; import "./App.css"; import Landing from "./components/shared/landing.js"; import Header from "./components/shared/header.js"; @@ -8,13 +8,24 @@ import Login from "./components/shared/login.js"; import Home from "./components/vendor/home.js"; import Heatmap from "./components/vendor/heatmap.js"; import Timetable from "./components/vendor/timetable.js"; +import CustomerMap from "./components/customer/map.js"; // For react router import { BrowserRouter as Router, Switch, Route } from "react-router-dom"; // For React context management import { AppContextProvider } from "./components/AppContext"; function App() { - const [isVendor, setIsVendor] = useState(true); + // const { logInStatus, isVendor } = useContext(AppContext); + + // Helper function to see if user is logged in and if so redirects them + // function loggedInRedirect() { + // if (logInStatus && isVendor) { + // return ; + // } + // if (logInStatus && !isVendor) { + // return ; + // } + // } return ( @@ -22,18 +33,15 @@ function App() {
- } /> + }> + {/* {loggedInRedirect()} */} + } /> - } - /> - } - /> + } /> + } /> } /> } /> + } />
@@ -41,19 +49,4 @@ function App() { ); } -/* } /> - - } -/> */ - -/* } -/> */ - export default App; - -/* - */ diff --git a/client-app/src/components/AppContext.js b/client-app/src/components/AppContext.js index 11866a1..60cdd0a 100644 --- a/client-app/src/components/AppContext.js +++ b/client-app/src/components/AppContext.js @@ -3,7 +3,7 @@ import React, { useState, createContext } from "react"; const AppContext = createContext(); function AppContextProvider(props) { - const [logInStatus, setLogInStatus] = useState(true); + const [logInStatus, setLogInStatus] = useState(false); const [isVendor, setIsVendor] = useState(true); const [signUpStateVendor, setSignUpStateVendor] = useState({ name: "", diff --git a/client-app/src/components/customer/map.js b/client-app/src/components/customer/map.js index 0dcb0ca..f3a1f3c 100644 --- a/client-app/src/components/customer/map.js +++ b/client-app/src/components/customer/map.js @@ -3,17 +3,17 @@ import React from "react"; import LondonMap from "../../utils/london-map.js"; export default function CustomerMap() { - function signalInterest(e) { - e.preventDefault; - //API post request to customer location table INSERT INTO customer_location - } + // function signalInterest(e) { + // e.preventDefault; + // //API post request to customer location table INSERT INTO customer_location + // }; - return ( -
- - -
- ); + return

hello

; } + +/* //
+ // + // + //
*/ diff --git a/client-app/src/components/shared/landing.js b/client-app/src/components/shared/landing.js index 7127913..1f1b848 100644 --- a/client-app/src/components/shared/landing.js +++ b/client-app/src/components/shared/landing.js @@ -7,8 +7,6 @@ import { BlueButton, PinkButton, PageContainer } from "../../styles/buttons.js"; export default function Landing() { const { isVendor, setIsVendor } = useContext(AppContext); - console.log("landing state: ", isVendor); - return (

Tired of waiting for the jingle?

diff --git a/client-app/src/components/shared/signup.js b/client-app/src/components/shared/signup.js index 95b61fe..d034555 100644 --- a/client-app/src/components/shared/signup.js +++ b/client-app/src/components/shared/signup.js @@ -1,12 +1,17 @@ -import React, { useEffect, useContext } from "react" -import { Link } from "react-router-dom" -import postSignUpInformation from "../../utils/postData" -import { AppContext } from "../AppContext" -import { Button, BlueButton, PinkButton } from "../../styles/buttons" -import { textStyle } from "../../styles/text" -import { Label, Input, Legend, FormContainer } from "../../styles/form" +import React, { useEffect, useContext } from "react"; +import { Link } from "react-router-dom"; +import { + postVendorSignUpInformation, + postCustomerSignUpInformation, +} from "../../utils/postData"; +import { AppContext } from "../AppContext"; +import { Button, BlueButton, PinkButton } from "../../styles/buttons"; +import { textStyle } from "../../styles/text"; +import { Label, Input, Legend, FormContainer } from "../../styles/form"; -// ***NOTES*** +import { BrowserRouter as Router, Redirect } from "react-router-dom"; + +// ***TEAM NOTES*** // Radio buttons are not much fun // The value attribute of a tag only be a string // The checked attribute on a radio button needs to a boolean (for alcohol or veganOption) @@ -19,6 +24,8 @@ import { Label, Input, Legend, FormContainer } from "../../styles/form" export default function SignUp() { const { + logInStatus, + setLogInStatus, isVendor, setIsVendor, signUpStateVendor, @@ -27,8 +34,20 @@ export default function SignUp() { setSignUpStateCustomer, } = useContext(AppContext); + // ***NOTES*** + // name, pasword and email are common to both the vendor and customer + // A ternary is user to render the other customer or vendor inputs + // JS functions have been extracted from JSX into helper functions + + const handleChange = (e) => { + if (isVendor) { + handleOnChangeVendor(e); + } else { + handleOnChangeCustomer(e); + } + }; + const handleOnChangeVendor = (e) => { - debugger; let property = e.target.name; let value = e.target.value; if (value === "true") { @@ -60,42 +79,92 @@ export default function SignUp() { setSignUpStateCustomer(newSignUpStateCustomer); }; + const handleSubmit = (e) => { + if (isVendor) { + handleSubmitVendor(e); + } else { + handleSubmitCustomer(e); + } + }; + const handleSubmitVendor = (e) => { e.preventDefault(); console.log(`Posting vendor object:`, signUpStateVendor); - postSignUpInformation(signUpStateVendor).then((token) => { - console.log(token); - // window.localStorage.setItem("token", body) - }); + postVendorSignUpInformation(signUpStateVendor) + .then((res) => { + if (!res.ok) { + throw new Error( + `Unable to signup. API responded with status code: ${res.status}` + ); + } else { + return res.json(); + } + }) + .then((body) => { + console.log(`Vendor token set in local storage: ${body.access_token}`); + window.localStorage.setItem("token", body.access_token); + setLogInStatus(true); + }) + .catch((err) => console.error(err)); }; const handleSubmitCustomer = (e) => { e.preventDefault(); console.log(`Posting customer object:`, signUpStateCustomer); + postCustomerSignUpInformation(signUpStateCustomer) + .then((res) => { + if (!res.ok) { + throw new Error( + `Unable to signup. API responded with status code: ${res.status}` + ); + } else { + return res.json(); + } + }) + .then((body) => { + console.log( + `Customer token set in local storage: ${body.access_token}` + ); + window.localStorage.setItem("token", body.access_token); + setLogInStatus(true); + }) + .catch((err) => console.error(err)); }; - // ***NOTES*** - // name, pasword and email are common to both the vendor and customer - // A ternary is user to render the other customer or vendor inputs + // When component mounts checks to see if user is logged in + function loggedInStatusCheckerandRedirect() { + if (logInStatus && isVendor) { + return ; + } + if (logInStatus && !isVendor) { + return ; + } + } + + // Input value helper functions + const inputValueName = isVendor + ? signUpStateVendor.name + : signUpStateCustomer.name; + + const inputValueEmail = isVendor + ? signUpStateVendor.email + : signUpStateCustomer.email; + + const inputValuePassword = isVendor + ? signUpStateVendor.password + : signUpStateCustomer.password; return ( - handleSubmitVendor(e) : (e) => handleSubmitCustomer(e) - } - > + + {loggedInStatusCheckerandRedirect()} handleOnChangeVendor(e) - : (e) => handleOnChangeCustomer(e) - } - value={isVendor ? signUpStateVendor.name : signUpStateCustomer.name} + onChange={handleChange} + value={inputValueName} /> @@ -104,12 +173,8 @@ export default function SignUp() { id="email" name="email" required - onChange={ - isVendor - ? (e) => handleOnChangeVendor(e) - : (e) => handleOnChangeCustomer(e) - } - value={isVendor ? signUpStateVendor.email : signUpStateCustomer.email} + onChange={handleChange} + value={inputValueEmail} /> @@ -118,14 +183,8 @@ export default function SignUp() { id="password" name="password" required - onChange={ - isVendor - ? (e) => handleOnChangeVendor(e) - : (e) => handleOnChangeCustomer(e) - } - value={ - isVendor ? signUpStateVendor.password : signUpStateCustomer.password - } + onChange={handleChange} + value={inputValuePassword} /> {/* THIS IS THE TERNARY */} {isVendor ? ( @@ -137,7 +196,7 @@ export default function SignUp() { name="mobile" required value={signUpStateVendor.mobile} - onChange={(e) => handleOnChangeVendor(e)} + onChange={handleOnChangeVendor} /> @@ -147,7 +206,7 @@ export default function SignUp() { name="companyName" required value={signUpStateVendor.companyName} - onChange={(e) => handleOnChangeVendor(e)} + onChange={handleOnChangeVendor} />
@@ -159,7 +218,7 @@ export default function SignUp() { name="alcohol" value="true" checked={signUpStateVendor.alcohol === true} - onChange={(e) => handleOnChangeVendor(e)} + onChange={handleOnChangeVendor} /> @@ -169,7 +228,7 @@ export default function SignUp() { name="alcohol" value="false" checked={signUpStateVendor.alcohol === false} - onChange={(e) => handleOnChangeVendor(e)} + onChange={handleOnChangeVendor} />
@@ -182,7 +241,7 @@ export default function SignUp() { name="vegan" value="true" checked={signUpStateVendor.vegan === true} - onChange={(e) => handleOnChangeVendor(e)} + onChange={handleOnChangeVendor} /> @@ -192,15 +251,26 @@ export default function SignUp() { name="vegan" value="false" checked={signUpStateVendor.vegan === false} - onChange={(e) => handleOnChangeVendor(e)} + onChange={handleOnChangeVendor} /> - setIsVendor(true)}> - Sign Up - + + + Sign Up + ) : ( <> + + +
What is your age group? @@ -210,7 +280,7 @@ export default function SignUp() { name="age" value="14-18" checked={signUpStateCustomer.age === "14-18"} - onChange={(e) => handleOnChangeCustomer(e)} + onChange={handleOnChangeCustomer} /> handleOnChangeCustomer(e)} + onChange={handleOnChangeCustomer} /> handleOnChangeCustomer(e)} + onChange={handleOnChangeCustomer} /> handleOnChangeCustomer(e)} + onChange={handleOnChangeCustomer} />
@@ -250,7 +320,7 @@ export default function SignUp() { name="gender" value="Male" checked={signUpStateCustomer.gender === "Male"} - onChange={(e) => handleOnChangeCustomer(e)} + onChange={handleOnChangeCustomer} /> handleOnChangeCustomer(e)} + onChange={handleOnChangeCustomer} /> handleOnChangeCustomer(e)} + onChange={handleOnChangeCustomer} /> handleOnChangeCustomer(e)} + onChange={handleOnChangeCustomer} /> @@ -288,7 +358,7 @@ export default function SignUp() { name="icecreamFlavour" required value={signUpStateCustomer.icecreamFlavour} - onChange={(e) => handleOnChangeCustomer(e)} + onChange={handleOnChangeCustomer} />
@@ -303,7 +373,7 @@ export default function SignUp() { name="consent" value="true" checked={signUpStateCustomer.consent === true} - onChange={(e) => handleOnChangeCustomer(e)} + onChange={handleOnChangeCustomer} /> handleOnChangeCustomer(e)} + onChange={handleOnChangeCustomer} />
- setIsVendor(false)}> - {signUpStateCustomer.consent && ( - Sign Up - )} - + + + Sign Up + )} -<<<<<<< HEAD - ) -======= - {signUpStateCustomer.consent && } - ); ->>>>>>> master } diff --git a/client-app/src/styles/buttons.js b/client-app/src/styles/buttons.js index 140ddbd..24156ae 100644 --- a/client-app/src/styles/buttons.js +++ b/client-app/src/styles/buttons.js @@ -17,12 +17,12 @@ const Button = ` display: block; `; -const BlueButton = styled.a` +const BlueButton = styled.button` ${Button} background-color: ${lightBlue} `; -const PinkButton = styled.a` +const PinkButton = styled.button` ${Button} background-color: ${lightPink}; `; diff --git a/client-app/src/styles/header.js b/client-app/src/styles/header.js index 3100694..7d04454 100644 --- a/client-app/src/styles/header.js +++ b/client-app/src/styles/header.js @@ -23,6 +23,7 @@ const Title = styled.h1` height: 80px; font-style: italic; color: ${navy}; + margin-top: 0; `; const HeaderArea = styled.header` diff --git a/client-app/src/utils/postData.js b/client-app/src/utils/postData.js index 27c7d56..4da664b 100644 --- a/client-app/src/utils/postData.js +++ b/client-app/src/utils/postData.js @@ -1,8 +1,32 @@ -const hostname = window && window.location && window.location.hostname +const hostname = window && window.location && window.location.hostname; const domain = hostname === "localhost" ? "http://localhost:8080" - : "https://where-is-whippy.herokuapp.com" + : "https://where-is-whippy.herokuapp.com"; + +function postVendorSignUpInformation(state) { + return fetch(domain + "/vendors/signup", { + method: "POST", + headers: { + "Content-Type": "application/json", + Accept: "application/json", + }, + body: JSON.stringify(state), + }); +} + +function postCustomerSignUpInformation(state) { + return fetch(domain + "/customers/signup", { + method: "POST", + headers: { + "Content-Type": "application/json", + Accept: "application/json", + }, + body: JSON.stringify(state), + }); +} + +export { postVendorSignUpInformation, postCustomerSignUpInformation }; // const postRequest = (endpoint) => { // return fetch(domain + endpoint, { @@ -13,7 +37,7 @@ const domain = // .catch(console.log) // } -// async function postSignUpInformation(state) { +// async function postVendorSignUpInformation(state) { // const response = await fetch(domain + "/customers/signup", { // method: "POST", // headers: { @@ -25,21 +49,3 @@ const domain = // console.log(await response.json()) // return await response.json() // } - -function postSignUpInformation(state) { - return fetch(domain + "/vendors/signup", { - method: "POST", - headers: { - "Content-Type": "application/json", - Accept: "application/json", - }, - body: JSON.stringify(state), - }).then((res) => { - if (res.status !== 200) { - console.error("API responded with ", res.status) - } - return res.json() - }) -} - -export default postSignUpInformation diff --git a/package.json b/package.json index c5228e1..e21dd2d 100644 --- a/package.json +++ b/package.json @@ -9,7 +9,6 @@ "husky": "^4.2.5" }, "dependencies": { - "jest": "^26.0.1", "lint-staged": "^10.2.6", "prettier": "^2.0.5", "pretty-quick": "^2.0.1" From c75d927db49dbdca96070bc01c012fc466d3f707 Mon Sep 17 00:00:00 2001 From: Joe Jackson Date: Thu, 28 May 2020 15:24:48 +0100 Subject: [PATCH 02/13] Completed login for customer and vendor Closes #6 Closes #9 Co-authored-by: HettieM --- client-app/src/App.js | 17 +-- client-app/src/components/shared/login.js | 128 +++++++++++++++++---- client-app/src/components/shared/signup.js | 18 ++- client-app/src/utils/postData.js | 40 ++++++- 4 files changed, 155 insertions(+), 48 deletions(-) diff --git a/client-app/src/App.js b/client-app/src/App.js index 1ed3da2..de014b6 100644 --- a/client-app/src/App.js +++ b/client-app/src/App.js @@ -15,33 +15,20 @@ import { BrowserRouter as Router, Switch, Route } from "react-router-dom"; import { AppContextProvider } from "./components/AppContext"; function App() { - // const { logInStatus, isVendor } = useContext(AppContext); - - // Helper function to see if user is logged in and if so redirects them - // function loggedInRedirect() { - // if (logInStatus && isVendor) { - // return ; - // } - // if (logInStatus && !isVendor) { - // return ; - // } - // } - return (
- }> - {/* {loggedInRedirect()} */} - + } /> } /> } /> } /> } /> } /> } /> + } />
diff --git a/client-app/src/components/shared/login.js b/client-app/src/components/shared/login.js index 195218f..510126d 100644 --- a/client-app/src/components/shared/login.js +++ b/client-app/src/components/shared/login.js @@ -1,6 +1,15 @@ import React, { useContext } from "react"; +import { Button, BlueButton, PinkButton } from "../../styles/buttons"; +import { textStyle } from "../../styles/text"; +import { Label, Input, FormContainer } from "../../styles/form"; + +import { + postVendorLoginInformation, + postCustomerLoginInformation, +} from "../../utils/postData"; import { AppContext } from "../AppContext"; +import { BrowserRouter as Router, Redirect } from "react-router-dom"; export default function Login() { const { @@ -21,14 +30,6 @@ export default function Login() { } }; - const handleSubmit = (e) => { - if (isVendor) { - handleSubmitVendor(e); - } else { - handleSubmitCustomer(e); - } - }; - const handleOnChangeVendor = (e) => { let property = e.target.name; let value = e.target.value; @@ -40,31 +41,114 @@ export default function Login() { setSignUpStateVendor(newLogInStateVendor); }; - const handleOnChangeCustomer = (e) => {}; + const handleOnChangeCustomer = (e) => { + let property = e.target.name; + let value = e.target.value; - const handleSubmitVendor = (e) => {}; + const newLogInStateCustomer = { + ...signUpStateCustomer, + [property]: value, + }; + setSignUpStateCustomer(newLogInStateCustomer); + }; - const handleSubmitCustomer = (e) => {}; + const handleSubmit = (e) => { + if (isVendor) { + handleSubmitVendor(e); + } else { + handleSubmitCustomer(e); + } + }; + + const handleSubmitVendor = (e) => { + e.preventDefault(); + postVendorLoginInformation(signUpStateVendor) + .then((res) => { + if (!res.ok) { + throw new Error( + `Unable to login. API responded with status code: ${res.status}` + ); + } else { + return res.json(); + } + }) + .then((body) => { + console.log(`Vendor token set in local storage: ${body.access_token}`); + window.localStorage.setItem("token", body.access_token); + setLogInStatus(true); + }) + .catch((err) => console.error(err)); + }; - const inputValue = isVendor + const handleSubmitCustomer = (e) => { + e.preventDefault(); + postCustomerLoginInformation(signUpStateCustomer) + .then((res) => { + if (!res.ok) { + throw new Error( + `Unable to login. API responded with status code: ${res.status}` + ); + } else { + return res.json(); + } + }) + .then((body) => { + console.log( + `Customer token set in local storage: ${body.access_token}` + ); + window.localStorage.setItem("token", body.access_token); + setLogInStatus(true); + }) + .catch((err) => console.error(err)); + }; + + const inputValueEmail = isVendor ? signUpStateVendor.email : signUpStateCustomer.email; + + const inputValuePassword = isVendor + ? signUpStateVendor.password + : signUpStateCustomer.password; + + function loggedInStatusCheckerAndRedirect() { + // alert('You called the bigbad login checker') + // console.log("loginstatus ", logInStatus, "isvendor ", isVendor) + if (logInStatus && isVendor) { + return ; + } + if (logInStatus && !isVendor) { + return ; + } + } + return ( -
- - + {loggedInStatusCheckerAndRedirect()} + + + - - - -
+ + + + {isVendor ? ( + Login + ) : ( + Login + )} + ); } diff --git a/client-app/src/components/shared/signup.js b/client-app/src/components/shared/signup.js index d034555..ca14d5b 100644 --- a/client-app/src/components/shared/signup.js +++ b/client-app/src/components/shared/signup.js @@ -101,7 +101,9 @@ export default function SignUp() { } }) .then((body) => { - console.log(`Vendor token set in local storage: ${body.access_token}`); + console.log( + `Signup successful. Vendor token set in local storage: ${body.access_token}` + ); window.localStorage.setItem("token", body.access_token); setLogInStatus(true); }) @@ -123,7 +125,7 @@ export default function SignUp() { }) .then((body) => { console.log( - `Customer token set in local storage: ${body.access_token}` + `Signup successful. Customer token set in local storage: ${body.access_token}` ); window.localStorage.setItem("token", body.access_token); setLogInStatus(true); @@ -132,7 +134,7 @@ export default function SignUp() { }; // When component mounts checks to see if user is logged in - function loggedInStatusCheckerandRedirect() { + function loggedInStatusCheckerAndRedirect() { if (logInStatus && isVendor) { return ; } @@ -156,7 +158,7 @@ export default function SignUp() { return ( - {loggedInStatusCheckerandRedirect()} + {loggedInStatusCheckerAndRedirect()} - - Sign Up - + Sign Up ) : ( <> @@ -386,9 +386,7 @@ export default function SignUp() { /> - - Sign Up - + Sign Up )} diff --git a/client-app/src/utils/postData.js b/client-app/src/utils/postData.js index 4da664b..087a251 100644 --- a/client-app/src/utils/postData.js +++ b/client-app/src/utils/postData.js @@ -4,6 +4,17 @@ const domain = ? "http://localhost:8080" : "https://where-is-whippy.herokuapp.com"; +const postObject = (state) => { + return { + method: "POST", + headers: { + "Content-Type": "application/json", + Accept: "application/json", + }, + body: JSON.stringify(state), + }; +}; + function postVendorSignUpInformation(state) { return fetch(domain + "/vendors/signup", { method: "POST", @@ -15,6 +26,17 @@ function postVendorSignUpInformation(state) { }); } +function postVendorLoginInformation(state) { + return fetch(domain + "/vendors/login", { + method: "POST", + headers: { + "Content-Type": "application/json", + Accept: "application/json", + }, + body: JSON.stringify(state), + }); +} + function postCustomerSignUpInformation(state) { return fetch(domain + "/customers/signup", { method: "POST", @@ -26,7 +48,23 @@ function postCustomerSignUpInformation(state) { }); } -export { postVendorSignUpInformation, postCustomerSignUpInformation }; +function postCustomerLoginInformation(state) { + return fetch(domain + "/customers/login", { + method: "POST", + headers: { + "Content-Type": "application/json", + Accept: "application/json", + }, + body: JSON.stringify(state), + }); +} + +export { + postVendorSignUpInformation, + postCustomerSignUpInformation, + postVendorLoginInformation, + postCustomerLoginInformation, +}; // const postRequest = (endpoint) => { // return fetch(domain + endpoint, { From 36795d1fae2893e78b9e175f48a3f76f4d86859c Mon Sep 17 00:00:00 2001 From: Hettie McConnell Date: Thu, 28 May 2020 16:10:51 +0100 Subject: [PATCH 03/13] Amend header to show login/logout options depending on token authorisation. --- client-app/src/components/shared/header.js | 24 ++++++++++++++++------ client-app/src/components/vendor/home.js | 7 ++++++- client-app/src/styles/header.js | 12 +++++++---- 3 files changed, 32 insertions(+), 11 deletions(-) diff --git a/client-app/src/components/shared/header.js b/client-app/src/components/shared/header.js index 09ecae9..c3550bf 100644 --- a/client-app/src/components/shared/header.js +++ b/client-app/src/components/shared/header.js @@ -1,14 +1,26 @@ -import React, { useContext } from "react" -import { AppContext } from "../AppContext" -import { Title, HeaderArea } from "../../styles/header.js" +import React, { useContext } from "react"; +import { AppContext } from "../AppContext"; +import { Title, HeaderArea, LogInOption } from "../../styles/header.js"; export default function Header() { - const { logInStatus } = useContext(AppContext) + const { logInStatus, setLogInStatus } = useContext(AppContext); + + function headerStatus() { + let token = localStorage.getItem("token"); + console.log(token); + + if (!token) { + return Log In or Sign Up Here!; + } else { + window.localStorage.removeItem("token"); + return Log Out; + } + } return ( Where's Whippy - {!logInStatus ? Log In : Log Out} + {headerStatus()} - ) + ); } diff --git a/client-app/src/components/vendor/home.js b/client-app/src/components/vendor/home.js index a2f7696..6b5a621 100644 --- a/client-app/src/components/vendor/home.js +++ b/client-app/src/components/vendor/home.js @@ -1,11 +1,15 @@ // Home page for vendor - includes current route and links to add/ change route + see heatmap -import React from "react"; + +import React, { useContext } from "react"; import { Link } from "react-router-dom"; +import { AppContext } from "../AppContext"; import { PinkButton } from "../../styles/buttons"; export default function Home() { const [routeName, setRouteName] = React.useState(""); + const { logInStatus, setLogInStatus } = useContext(AppContext); + function handleSubmit(event) { // PRINT THE SELECTED ROUTE // event.preventDefault(); @@ -24,6 +28,7 @@ export default function Home() { return (
+ {setLogInStatus(true)}

Welcome back diff --git a/client-app/src/styles/header.js b/client-app/src/styles/header.js index 7d04454..45a4823 100644 --- a/client-app/src/styles/header.js +++ b/client-app/src/styles/header.js @@ -19,15 +19,19 @@ const navy = "#1f4068"; const background = "#F7F4F0"; const Title = styled.h1` - width: 320px; - height: 80px; font-style: italic; color: ${navy}; - margin-top: 0; + font-size: 2.5rem; + margin-bottom: 0; `; const HeaderArea = styled.header` background-color: ${background}; + display: flex; + flex-direction: column; + padding-bottom: 5%; `; -export { Title, HeaderArea }; +const LogInOption = styled.a``; + +export { Title, HeaderArea, LogInOption }; From f2fac941dcc3a254c8cc359963e1318e6d098241 Mon Sep 17 00:00:00 2001 From: Hettie McConnell Date: Thu, 28 May 2020 16:14:08 +0100 Subject: [PATCH 04/13] Button styling. --- client-app/src/styles/buttons.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/client-app/src/styles/buttons.js b/client-app/src/styles/buttons.js index 24156ae..a0e9028 100644 --- a/client-app/src/styles/buttons.js +++ b/client-app/src/styles/buttons.js @@ -6,8 +6,6 @@ const lightPink = "#F7DCD5"; const background = "#F7F4F0"; const Button = ` - width: 75%; - max-width: 250px; border-radius: 5px; color: ${navy}; text-decoration: none; @@ -15,6 +13,8 @@ const Button = ` padding: 0.25em 1em; margin-top: 2.5%; display: block; + width: 75vw; + max-width: 400px; `; const BlueButton = styled.button` From 3c93391aa74f1a59a786f06b98febf4c00d4e582 Mon Sep 17 00:00:00 2001 From: Hettie McConnell Date: Thu, 28 May 2020 16:16:47 +0100 Subject: [PATCH 05/13] User page styling --- client-app/src/components/shared/header.js | 1 - client-app/src/components/shared/user.js | 16 ++++++++-------- 2 files changed, 8 insertions(+), 9 deletions(-) diff --git a/client-app/src/components/shared/header.js b/client-app/src/components/shared/header.js index c3550bf..fdc6150 100644 --- a/client-app/src/components/shared/header.js +++ b/client-app/src/components/shared/header.js @@ -7,7 +7,6 @@ export default function Header() { function headerStatus() { let token = localStorage.getItem("token"); - console.log(token); if (!token) { return Log In or Sign Up Here!; diff --git a/client-app/src/components/shared/user.js b/client-app/src/components/shared/user.js index c0980e9..87a4505 100644 --- a/client-app/src/components/shared/user.js +++ b/client-app/src/components/shared/user.js @@ -1,13 +1,13 @@ //Second page (have chosen whether customer/vendor) - choice between login + signup -import React, { useContext } from "react" -import { Link } from "react-router-dom" -import { AppContext } from "../AppContext" -import { BlueButton, PinkButton } from "../../styles/buttons" +import React, { useContext } from "react"; +import { Link } from "react-router-dom"; +import { AppContext } from "../AppContext"; +import { BlueButton, PinkButton, PageContainer } from "../../styles/buttons"; export default function User() { - const { isVendor, setIsVendor } = useContext(AppContext) + const { isVendor, setIsVendor } = useContext(AppContext); return ( -
+ {isVendor ? (

Find ice cream lovers today

@@ -35,6 +35,6 @@ export default function User() {
)} -
- ) + + ); } From f0b9c6f1815762debbb02b9df69686d528892629 Mon Sep 17 00:00:00 2001 From: Hettie McConnell Date: Thu, 28 May 2020 16:43:12 +0100 Subject: [PATCH 06/13] Change fieldset styling for vendor signup --- client-app/src/components/shared/signup.js | 16 ++++++++---- client-app/src/components/shared/user.js | 12 ++++----- client-app/src/styles/buttons.js | 2 +- client-app/src/styles/form.js | 29 ++++++++++++++-------- 4 files changed, 36 insertions(+), 23 deletions(-) diff --git a/client-app/src/components/shared/signup.js b/client-app/src/components/shared/signup.js index ca14d5b..19b21d4 100644 --- a/client-app/src/components/shared/signup.js +++ b/client-app/src/components/shared/signup.js @@ -7,7 +7,13 @@ import { import { AppContext } from "../AppContext"; import { Button, BlueButton, PinkButton } from "../../styles/buttons"; import { textStyle } from "../../styles/text"; -import { Label, Input, Legend, FormContainer } from "../../styles/form"; +import { + Label, + Input, + Legend, + FormContainer, + FieldSet, +} from "../../styles/form"; import { BrowserRouter as Router, Redirect } from "react-router-dom"; @@ -211,7 +217,7 @@ export default function SignUp() { onChange={handleOnChangeVendor} /> -
+
Do you sell alcohol? -
+
-
+
Do you offer vegan options? -
+
Sign Up diff --git a/client-app/src/components/shared/user.js b/client-app/src/components/shared/user.js index 87a4505..750df8f 100644 --- a/client-app/src/components/shared/user.js +++ b/client-app/src/components/shared/user.js @@ -7,9 +7,9 @@ import { BlueButton, PinkButton, PageContainer } from "../../styles/buttons"; export default function User() { const { isVendor, setIsVendor } = useContext(AppContext); return ( - +
{isVendor ? ( -
+

Find ice cream lovers today

@@ -20,9 +20,9 @@ export default function User() { setIsVendor(true)}> Log In -
+ ) : ( -
+

Find ice cream today

@@ -33,8 +33,8 @@ export default function User() { setIsVendor(false)}> Log In -
+ )} - +
); } diff --git a/client-app/src/styles/buttons.js b/client-app/src/styles/buttons.js index a0e9028..1eda4a6 100644 --- a/client-app/src/styles/buttons.js +++ b/client-app/src/styles/buttons.js @@ -8,7 +8,6 @@ const background = "#F7F4F0"; const Button = ` border-radius: 5px; color: ${navy}; - text-decoration: none; font-size: 2rem; padding: 0.25em 1em; margin-top: 2.5%; @@ -34,6 +33,7 @@ const PageContainer = styled.section` align-items: center; height: 90vh; `; + /* justify-content: center; position: relative; diff --git a/client-app/src/styles/form.js b/client-app/src/styles/form.js index 8e2c2c6..01c0a42 100644 --- a/client-app/src/styles/form.js +++ b/client-app/src/styles/form.js @@ -1,35 +1,42 @@ -import styled from "styled-components" +import styled from "styled-components"; -const background = "#F7F4F0" -const navy = "#1f4068" +const background = "#F7F4F0"; +const navy = "#1f4068"; const Label = styled.label` color: ${navy}; font-size: 1.25rem; text-align: left; margin-bottom: 0.45rem; -` +`; const Input = styled.input` background-color: ${background}; color: ${navy}; border-radius: 5px; margin-bottom: 0.2rem; - width: 240px; + width: 75%; + max-width: 500px; height: 31px; - justify-c: center; -` +`; const Legend = styled.legend` color: ${navy}; -` +`; const FormContainer = styled.form` display: flex; flex-direction: column; background-color: ${background}; -` + align-items: center; +`; -const radioBtnWrapper = styled.input`` +const radioBtnWrapper = styled.input``; -export { Label, Input, Legend, FormContainer } +const FieldSet = styled.fieldset` + border-radius: 5px; + width: 75%; + max-width: 250px; +`; + +export { Label, Input, Legend, FormContainer, FieldSet }; From 9da522edd2d633eeb0b88beff80bbe685a7849c6 Mon Sep 17 00:00:00 2001 From: Hettie McConnell Date: Thu, 28 May 2020 16:47:48 +0100 Subject: [PATCH 07/13] Vendor dashboard styling --- client-app/src/components/vendor/home.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/client-app/src/components/vendor/home.js b/client-app/src/components/vendor/home.js index 6b5a621..b9268c2 100644 --- a/client-app/src/components/vendor/home.js +++ b/client-app/src/components/vendor/home.js @@ -3,7 +3,7 @@ import React, { useContext } from "react"; import { Link } from "react-router-dom"; import { AppContext } from "../AppContext"; -import { PinkButton } from "../../styles/buttons"; +import { PinkButton, PageContainer } from "../../styles/buttons"; export default function Home() { const [routeName, setRouteName] = React.useState(""); @@ -27,7 +27,7 @@ export default function Home() { } return ( -
+ {setLogInStatus(true)}

Welcome back @@ -68,7 +68,7 @@ export default function Home() {

- Edit Current Schedule - + */} View Heatmap
-

+ ); } From 2f3a3d8e0400ca0607f68742583b65edfb41fed6 Mon Sep 17 00:00:00 2001 From: Hettie McConnell Date: Thu, 28 May 2020 16:53:24 +0100 Subject: [PATCH 08/13] Styling vendor timetable form --- client-app/src/components/vendor/timetable.js | 64 ++++++++++--------- 1 file changed, 33 insertions(+), 31 deletions(-) diff --git a/client-app/src/components/vendor/timetable.js b/client-app/src/components/vendor/timetable.js index a699e2d..d328519 100644 --- a/client-app/src/components/vendor/timetable.js +++ b/client-app/src/components/vendor/timetable.js @@ -1,37 +1,39 @@ import React, { useState } from "react"; +import { PinkButton, PageContainer } from "../../styles/buttons"; +import { Label, Input, FormContainer } from "../../styles/form"; export default function Timetable() { //Editing: fetch API - SELECT * FROM routes WHERE route_name == /whatever route name chosen // fill in form with data function generateNewRow(event) { event.preventDefault(); - const newRows = document.querySelector(".timetable-newRows"); + // const newRows = document.querySelector(".timetable-newRows"); return (
-
); } From 29ac5f5994a6052c1374ad4362b898bb4765e93b Mon Sep 17 00:00:00 2001 From: Hettie McConnell Date: Thu, 28 May 2020 17:01:00 +0100 Subject: [PATCH 09/13] Remove unused classes --- client-app/src/components/shared/landing.js | 8 +- client-app/src/components/shared/user.js | 12 +-- client-app/src/components/vendor/home.js | 51 +++------ client-app/src/components/vendor/timetable.js | 101 ++++-------------- client-app/src/styles/buttons.js | 7 +- 5 files changed, 48 insertions(+), 131 deletions(-) diff --git a/client-app/src/components/shared/landing.js b/client-app/src/components/shared/landing.js index 1f1b848..921962f 100644 --- a/client-app/src/components/shared/landing.js +++ b/client-app/src/components/shared/landing.js @@ -9,13 +9,13 @@ export default function Landing() { return ( -

Tired of waiting for the jingle?

- illustation +

Tired of waiting for the jingle?

+ illustation setIsVendor(true)}> - Vendors + Vendors setIsVendor(false)}> - Customers + Customers ); diff --git a/client-app/src/components/shared/user.js b/client-app/src/components/shared/user.js index 750df8f..04719da 100644 --- a/client-app/src/components/shared/user.js +++ b/client-app/src/components/shared/user.js @@ -10,28 +10,28 @@ export default function User() {
{isVendor ? ( -

Find ice cream lovers today

+

Find ice cream lovers today

setIsVendor(true)}> - Sign Up + Sign Up setIsVendor(true)}> - Log In + Log In ) : ( -

Find ice cream today

+

Find ice cream today

setIsVendor(false)}> - Sign Up + Sign Up setIsVendor(false)}> - Log In + Log In )} diff --git a/client-app/src/components/vendor/home.js b/client-app/src/components/vendor/home.js index b9268c2..78ddeed 100644 --- a/client-app/src/components/vendor/home.js +++ b/client-app/src/components/vendor/home.js @@ -29,59 +29,37 @@ export default function Home() { return ( {setLogInStatus(true)} -

+

Welcome back name !

-

Today's route is:

+

Today's route is:

-
- - {/* Run displayOptions */} - +
-
+
-
-

Turn on alerts for customers

+
+

Turn on alerts for customers

-
- {/* - - Edit Current Schedule - - */} - +
- - Create a New Schedule - + Create a New Schedule - - View Heatmap + + View Heatmap
diff --git a/client-app/src/components/vendor/timetable.js b/client-app/src/components/vendor/timetable.js index d328519..7c5d652 100644 --- a/client-app/src/components/vendor/timetable.js +++ b/client-app/src/components/vendor/timetable.js @@ -10,35 +10,14 @@ export default function Timetable() { // const newRows = document.querySelector(".timetable-newRows"); return (
- - + + - - + + - - + +
); } @@ -46,70 +25,28 @@ export default function Timetable() { return (
- - + + - - + + - - + + - - + + - - + + - - + +
- Submit + Submit
); diff --git a/client-app/src/styles/buttons.js b/client-app/src/styles/buttons.js index 1eda4a6..2c436dc 100644 --- a/client-app/src/styles/buttons.js +++ b/client-app/src/styles/buttons.js @@ -26,6 +26,11 @@ const PinkButton = styled.button` background-color: ${lightPink}; `; +const PinkSmallButton = styled.button` + ${PinkButton} + font-size: 1rem; +`; + const PageContainer = styled.section` background-color: ${background}; display: flex; @@ -41,4 +46,4 @@ const PageContainer = styled.section` //fix width of the buttons -export { BlueButton, PinkButton, PageContainer }; +export { BlueButton, PinkButton, PinkSmallButton, PageContainer }; From a1eab5590719aa7897136f4e46c2ec56e42d24ba Mon Sep 17 00:00:00 2001 From: Hettie McConnell Date: Thu, 28 May 2020 17:12:33 +0100 Subject: [PATCH 10/13] Styling --- client-app/src/components/shared/header.js | 2 ++ client-app/src/components/vendor/home.js | 8 ++++---- client-app/src/styles/buttons.js | 15 +++++++-------- 3 files changed, 13 insertions(+), 12 deletions(-) diff --git a/client-app/src/components/shared/header.js b/client-app/src/components/shared/header.js index fdc6150..7e27098 100644 --- a/client-app/src/components/shared/header.js +++ b/client-app/src/components/shared/header.js @@ -4,6 +4,7 @@ import { Title, HeaderArea, LogInOption } from "../../styles/header.js"; export default function Header() { const { logInStatus, setLogInStatus } = useContext(AppContext); + console.log(logInStatus); function headerStatus() { let token = localStorage.getItem("token"); @@ -12,6 +13,7 @@ export default function Header() { return Log In or Sign Up Here!; } else { window.localStorage.removeItem("token"); + setLogInStatus(false); return Log Out; } } diff --git a/client-app/src/components/vendor/home.js b/client-app/src/components/vendor/home.js index 78ddeed..c3d63c4 100644 --- a/client-app/src/components/vendor/home.js +++ b/client-app/src/components/vendor/home.js @@ -3,7 +3,7 @@ import React, { useContext } from "react"; import { Link } from "react-router-dom"; import { AppContext } from "../AppContext"; -import { PinkButton, PageContainer } from "../../styles/buttons"; +import { PinkSmallButton, PageContainer } from "../../styles/buttons"; export default function Home() { const [routeName, setRouteName] = React.useState(""); @@ -28,7 +28,7 @@ export default function Home() { return ( - {setLogInStatus(true)} + {/* {setLogInStatus(true)} */}

Welcome back @@ -68,11 +68,11 @@ export default function Home() { }, }} > - Create a New Schedule + Create a New Schedule - View Heatmap + View Heatmap

diff --git a/client-app/src/styles/buttons.js b/client-app/src/styles/buttons.js index 2c436dc..ba6e4e3 100644 --- a/client-app/src/styles/buttons.js +++ b/client-app/src/styles/buttons.js @@ -1,4 +1,5 @@ import styled from "styled-components"; +import { Link } from "react-router-dom"; const lightBlue = "#C3DDED"; const navy = "#1f4068"; @@ -22,12 +23,13 @@ background-color: ${lightBlue} `; const PinkButton = styled.button` - ${Button} + ${Button}; background-color: ${lightPink}; `; const PinkSmallButton = styled.button` - ${PinkButton} + ${Button}; + background-color: ${lightPink}; font-size: 1rem; `; @@ -39,11 +41,8 @@ const PageContainer = styled.section` height: 90vh; `; -/* - justify-content: center; - position: relative; - min-height: 90vh;*/ - -//fix width of the buttons +const StyledLink = styled(Link)` + text-decoration: none; +`; export { BlueButton, PinkButton, PinkSmallButton, PageContainer }; From 884aa3f98a0ac342003f4f5119821d23e538a445 Mon Sep 17 00:00:00 2001 From: Hettie McConnell Date: Thu, 28 May 2020 17:28:53 +0100 Subject: [PATCH 11/13] Amend header function - assess token and display, remove if log out clicked. --- client-app/src/components/shared/header.js | 16 ++++++++++++++-- client-app/src/components/vendor/home.js | 2 +- 2 files changed, 15 insertions(+), 3 deletions(-) diff --git a/client-app/src/components/shared/header.js b/client-app/src/components/shared/header.js index c3550bf..7622f7b 100644 --- a/client-app/src/components/shared/header.js +++ b/client-app/src/components/shared/header.js @@ -5,15 +5,27 @@ import { Title, HeaderArea, LogInOption } from "../../styles/header.js"; export default function Header() { const { logInStatus, setLogInStatus } = useContext(AppContext); + function removeToken() { + return window.localStorage.removeItem("token"); + } + function headerStatus() { let token = localStorage.getItem("token"); console.log(token); if (!token) { + setLogInStatus(false); + console.log(logInStatus); return Log In or Sign Up Here!; } else { - window.localStorage.removeItem("token"); - return Log Out; + setLogInStatus(true); + console.log(logInStatus); + // window.localStorage.removeItem("token"); + return ( + + Log Out + + ); } } diff --git a/client-app/src/components/vendor/home.js b/client-app/src/components/vendor/home.js index 6b5a621..23ee875 100644 --- a/client-app/src/components/vendor/home.js +++ b/client-app/src/components/vendor/home.js @@ -28,7 +28,7 @@ export default function Home() { return (
- {setLogInStatus(true)} + {/* {setLogInStatus(true)} */}

Welcome back From 9b354997135ef9f10edc72b72726d16f60353753 Mon Sep 17 00:00:00 2001 From: Hettie McConnell Date: Thu, 28 May 2020 17:37:34 +0100 Subject: [PATCH 12/13] Remove console.logs from dir. Co-authored-by: joepock123 --- client-app/src/components/shared/extra.js | 100 -------------------- client-app/src/components/shared/header.js | 7 +- client-app/src/components/shared/landing.js | 12 --- client-app/src/components/shared/login.js | 6 -- client-app/src/components/shared/signup.js | 5 - client-app/src/components/shared/user.js | 12 +-- client-app/src/utils/getData.js | 10 +- client-app/src/utils/postData.js | 22 ----- server-api/handlers/customer-location-h.js | 37 ++------ server-api/middleware/auth.js | 63 ++++++------ server-api/model/customers-m.js | 13 ++- server-api/model/vendors-m.js | 1 - 12 files changed, 58 insertions(+), 230 deletions(-) delete mode 100644 client-app/src/components/shared/extra.js diff --git a/client-app/src/components/shared/extra.js b/client-app/src/components/shared/extra.js deleted file mode 100644 index d25735e..0000000 --- a/client-app/src/components/shared/extra.js +++ /dev/null @@ -1,100 +0,0 @@ -// https://github.com/fac18/signpost/blob/master/client/src/components/AddNewService/AddNewService.js - -// useEffect( -// //checks to see if a user is a customer or vendor and will render the relevant form fields -// () => { -// isVendor -// ? setSignUpState({ -// name: "", -// email: "", -// password: "", -// mobile: "", -// company_name: "", -// alcohol: "", -// vegan_option: "", -// }) -// : setSignUpState({ -// name: "", -// email: "", -// password: "", -// username: "", -// age: "", -// gender: "", -// icecream_flavour: "", -// }) -// }, -// [] -// ) - -// const [submission, handleSubmission] = React.useState([]) -// React.useEffect(() => { -// const reqOptions = { -// method: "POST", -// headers: { "Content-Type": "application/json" }, -// body: JSON.stringify({ title: "React POST Request Example" }), -// } -// fetch(url goes here, reqOptions) -// .then(data =>) - -// function reducer(state, { field, value }) { -// return { -// ...state, -// [field]: value, -// } -// } - -// if (isVendor) { -// const { -// name, -// email, -// password, -// mobile, -// company_name, -// alcohol, -// vegan_option, -// } = state -// } else { -// const { -// name, -// email, -// password, -// username, -// age, -// gender, -// icecream_flavour, -// } = state -// } - -//function handleFormSubmission(event){ -//const username = document.getElementById('customerName').value -//axios.post(api url) -//.then(result =>) -//} - -// function signUp({ redirect }) { -// document.title = "Sign Up" -// app.innerHTML = html -// app.querySelector("form").addEventListener("submit", (e) => { -// e.preventDefault() -// const formData = new FormData(e.target) -// const formObject = Object.fromEntries(formData) -// fetch("https://dogs-rest.herokuapp.com/v1/users/", { -// method: "POST", -// body: JSON.stringify(formObject), - -// headers: { -// "Content-Type": "application/json", -// }, -// }) -// .then((res) => res.json()) -// .then((json) => { -// window.localStorage.setItem("id", json.id) -// window.localStorage.setItem("token", json.access_token) -// redirect("/") -// }) -// .catch((error) => { -// console.log("error in signup!") -// app.querySelector("#message").innerHTML = `

${error} haha

` -// }) -// }) -// } diff --git a/client-app/src/components/shared/header.js b/client-app/src/components/shared/header.js index 7622f7b..e72db3f 100644 --- a/client-app/src/components/shared/header.js +++ b/client-app/src/components/shared/header.js @@ -6,21 +6,16 @@ export default function Header() { const { logInStatus, setLogInStatus } = useContext(AppContext); function removeToken() { - return window.localStorage.removeItem("token"); + window.localStorage.removeItem("token"); } function headerStatus() { let token = localStorage.getItem("token"); - console.log(token); - if (!token) { setLogInStatus(false); - console.log(logInStatus); return Log In or Sign Up Here!; } else { setLogInStatus(true); - console.log(logInStatus); - // window.localStorage.removeItem("token"); return ( Log Out diff --git a/client-app/src/components/shared/landing.js b/client-app/src/components/shared/landing.js index 1f1b848..dee06f0 100644 --- a/client-app/src/components/shared/landing.js +++ b/client-app/src/components/shared/landing.js @@ -19,16 +19,4 @@ export default function Landing() { ); - - // function handleLoginLinkVendor() { - // alert("Vendor login button clicked") - // setIsVendor(true) - // } - - // function handleLoginLinkCustomer() { - // console.log(isVendor) - // setIsVendor(false) - // console.log(isVendor) - // // alert("Customer login button clicked") - // } } diff --git a/client-app/src/components/shared/login.js b/client-app/src/components/shared/login.js index 510126d..61e00ff 100644 --- a/client-app/src/components/shared/login.js +++ b/client-app/src/components/shared/login.js @@ -73,7 +73,6 @@ export default function Login() { } }) .then((body) => { - console.log(`Vendor token set in local storage: ${body.access_token}`); window.localStorage.setItem("token", body.access_token); setLogInStatus(true); }) @@ -93,9 +92,6 @@ export default function Login() { } }) .then((body) => { - console.log( - `Customer token set in local storage: ${body.access_token}` - ); window.localStorage.setItem("token", body.access_token); setLogInStatus(true); }) @@ -111,8 +107,6 @@ export default function Login() { : signUpStateCustomer.password; function loggedInStatusCheckerAndRedirect() { - // alert('You called the bigbad login checker') - // console.log("loginstatus ", logInStatus, "isvendor ", isVendor) if (logInStatus && isVendor) { return ; } diff --git a/client-app/src/components/shared/signup.js b/client-app/src/components/shared/signup.js index ca14d5b..038061f 100644 --- a/client-app/src/components/shared/signup.js +++ b/client-app/src/components/shared/signup.js @@ -89,7 +89,6 @@ export default function SignUp() { const handleSubmitVendor = (e) => { e.preventDefault(); - console.log(`Posting vendor object:`, signUpStateVendor); postVendorSignUpInformation(signUpStateVendor) .then((res) => { if (!res.ok) { @@ -101,9 +100,6 @@ export default function SignUp() { } }) .then((body) => { - console.log( - `Signup successful. Vendor token set in local storage: ${body.access_token}` - ); window.localStorage.setItem("token", body.access_token); setLogInStatus(true); }) @@ -112,7 +108,6 @@ export default function SignUp() { const handleSubmitCustomer = (e) => { e.preventDefault(); - console.log(`Posting customer object:`, signUpStateCustomer); postCustomerSignUpInformation(signUpStateCustomer) .then((res) => { if (!res.ok) { diff --git a/client-app/src/components/shared/user.js b/client-app/src/components/shared/user.js index c0980e9..e415a42 100644 --- a/client-app/src/components/shared/user.js +++ b/client-app/src/components/shared/user.js @@ -1,11 +1,11 @@ //Second page (have chosen whether customer/vendor) - choice between login + signup -import React, { useContext } from "react" -import { Link } from "react-router-dom" -import { AppContext } from "../AppContext" -import { BlueButton, PinkButton } from "../../styles/buttons" +import React, { useContext } from "react"; +import { Link } from "react-router-dom"; +import { AppContext } from "../AppContext"; +import { BlueButton, PinkButton } from "../../styles/buttons"; export default function User() { - const { isVendor, setIsVendor } = useContext(AppContext) + const { isVendor, setIsVendor } = useContext(AppContext); return (
{isVendor ? ( @@ -36,5 +36,5 @@ export default function User() {
)}

- ) + ); } diff --git a/client-app/src/utils/getData.js b/client-app/src/utils/getData.js index 557fe93..ee868f5 100644 --- a/client-app/src/utils/getData.js +++ b/client-app/src/utils/getData.js @@ -1,14 +1,14 @@ // consider window.location object in order to assign domain appropriately -const hostname = window && window.location && window.location.hostname +const hostname = window && window.location && window.location.hostname; const domain = hostname === "localhost" ? "http://localhost:8080" - : "https://where-is-whippy.herokuapp.com" + : "https://where-is-whippy.herokuapp.com"; const getRequest = (endpoint) => { return fetch(domain + endpoint) .then((res) => res.json()) - .catch(console.log) -} + .catch(console.log); +}; -export default getRequest +export default getRequest; diff --git a/client-app/src/utils/postData.js b/client-app/src/utils/postData.js index 087a251..ef54d7f 100644 --- a/client-app/src/utils/postData.js +++ b/client-app/src/utils/postData.js @@ -65,25 +65,3 @@ export { postVendorLoginInformation, postCustomerLoginInformation, }; - -// const postRequest = (endpoint) => { -// return fetch(domain + endpoint, { -// method: "post", -// data: JSON.stringify(data), -// }) -// .then((res) => res.json()) -// .catch(console.log) -// } - -// async function postVendorSignUpInformation(state) { -// const response = await fetch(domain + "/customers/signup", { -// method: "POST", -// headers: { -// "Content-Type": "application/json", -// Accept: "application/json", -// }, -// body: JSON.stringify(state), -// }) -// console.log(await response.json()) -// return await response.json() -// } diff --git a/server-api/handlers/customer-location-h.js b/server-api/handlers/customer-location-h.js index 8b3a5a3..747e079 100644 --- a/server-api/handlers/customer-location-h.js +++ b/server-api/handlers/customer-location-h.js @@ -1,47 +1,30 @@ -const model = require("../model/customer-location-m") +const model = require("../model/customer-location-m"); // const geo = navigator.geolocation maybe need to add window.navigator.geolocation? function allCustomerLocations(req, res, next) { - // console.log("In function") model .getAllCustomerLocations() .then((allLocations) => { - res.send(allLocations) + res.send(allLocations); }) - .catch(next) + .catch(next); } function addNewCustomerLocation(req, res, next) { - const customerId = req.body.customerId - const lat = req.body.latitude - const lng = req.body.longitude - const temp = req.body.temperature + const customerId = req.body.customerId; + const lat = req.body.latitude; + const lng = req.body.longitude; + const temp = req.body.temperature; model .addNewCustomerLocation(customerId, lat, lng, temp) .then((RETURNING) => { - console.log(RETURNING) - res.send(RETURNING.rows[0]) + res.send(RETURNING.rows[0]); }) - .catch(next) + .catch(next); } -// function addNewCustomerLocation(customer, req, res, next) { -// // Has the customer already entered a request in the last half an hour? -// let result = customerLocationModel.getAllCustomerLocations( -// " WHERE time >= NOW() - INTERVAL '30 minutes'" -// ) -// if (result) console.log("You have already made an entry") -// else { -// const customerId = customer || 5 // This value is taken from the request body or url using req.params -// const position = geo.getCurrentPosition // Getting coordinates will be done on the frontend -// const lat = position.coords.latitude -// const lng = position.coords.lng -// customerLocationModel.addCustomerLocation(customerId, lat, lng) -// } -// } - module.exports = { addNewCustomerLocation, allCustomerLocations, -} +}; diff --git a/server-api/middleware/auth.js b/server-api/middleware/auth.js index 58c1571..23c9150 100644 --- a/server-api/middleware/auth.js +++ b/server-api/middleware/auth.js @@ -1,60 +1,57 @@ -const jwt = require("jsonwebtoken") -const customerModel = require("../model/customers-m") -const vendorModel = require("../model/vendors-m") +const jwt = require("jsonwebtoken"); +const customerModel = require("../model/customers-m"); +const vendorModel = require("../model/vendors-m"); -require("dotenv").config() +require("dotenv").config(); -const SECRET = process.env.JWT_SECRET +const SECRET = process.env.JWT_SECRET; function verifyCustomer(req, res, next) { - const authHeader = req.headers.authorization + const authHeader = req.headers.authorization; if (!authHeader) { - const error = new Error("Authorization header required") //look into this - error.status = 400 - next(error) + const error = new Error("Authorization header required"); //look into this + error.status = 400; + next(error); } - const token = authHeader.replace("Bearer ", "") + const token = authHeader.replace("Bearer ", ""); try { - const data = jwt.verify(token, SECRET) - console.log(data) + const data = jwt.verify(token, SECRET); customerModel .getSpecificCustomer(data.user) .then((user) => { - req.user = user - next() + req.user = user; + next(); }) - .catch(next) + .catch(next); } catch (_err) { - const error = new Error("Unauthorized") - error.status = 401 - next(error) + const error = new Error("Unauthorized"); + error.status = 401; + next(error); } } function verifyVendor(req, res, next) { - const authHeader = req.headers.authorization - console.log("autheheader" + authHeader) + const authHeader = req.headers.authorization; if (!authHeader) { - const error = new Error("Authorization header required") //look into this - error.status = 400 - next(error) + const error = new Error("Authorization header required"); //look into this + error.status = 400; + next(error); } - const token = authHeader.replace("Bearer ", "") + const token = authHeader.replace("Bearer ", ""); try { - const data = jwt.verify(token, SECRET) - console.log("data" + data) + const data = jwt.verify(token, SECRET); vendorModel .getSpecificVendor(data.user) .then((user) => { - req.user = user - next() + req.user = user; + next(); }) - .catch(next) + .catch(next); } catch (_) { - const error = new Error("Unauthorized") - error.status = 401 - next(error) + const error = new Error("Unauthorized"); + error.status = 401; + next(error); } } -module.exports = { verifyCustomer, verifyVendor } +module.exports = { verifyCustomer, verifyVendor }; diff --git a/server-api/model/customers-m.js b/server-api/model/customers-m.js index 57f358f..55ee0bf 100644 --- a/server-api/model/customers-m.js +++ b/server-api/model/customers-m.js @@ -1,21 +1,20 @@ -const db = require("../db/connection") +const db = require("../db/connection"); function getAllCustomers() { - return db.query(`SELECT * FROM customers;`).then((results) => results.rows) + return db.query(`SELECT * FROM customers;`).then((results) => results.rows); } function getCustomer(email) { - console.log("getCustomer -> email", email) return db .query(`SELECT * FROM customers WHERE email=($1)`, [email]) .then((user) => user.rows[0]) - .catch((error) => error) + .catch((error) => error); } function getSpecificCustomer(id) { return db .query(`SELECT * FROM customers WHERE id=($1)`, [id]) - .then((user) => user.rows[0]) + .then((user) => user.rows[0]); } function createCustomer(newCustomer) { @@ -30,7 +29,7 @@ function createCustomer(newCustomer) { newCustomer.gender, newCustomer.icecreamFlavour, ] - ) + ); } module.exports = { @@ -38,4 +37,4 @@ module.exports = { getCustomer, getSpecificCustomer, createCustomer, -} +}; diff --git a/server-api/model/vendors-m.js b/server-api/model/vendors-m.js index bdddac9..249d078 100644 --- a/server-api/model/vendors-m.js +++ b/server-api/model/vendors-m.js @@ -17,7 +17,6 @@ function getSpecificVendor(vendorId) { } function createVendor(vendor) { - console.log("createVendor -> vendor", vendor); return db.query( `INSERT INTO vendors(name, email, password, mobile, company_name, alcohol, vegan_option) VALUES ($1,$2,$3,$4,$5,$6,$7) RETURNING id, name, password;`, [ From a50b382dca77ff0f2b9cbe13751571c8d3f1c6e2 Mon Sep 17 00:00:00 2001 From: Hettie McConnell Date: Thu, 28 May 2020 17:40:59 +0100 Subject: [PATCH 13/13] Change map information. Co-authored-by: joepock123 --- client-app/src/components/customer/map.js | 2 +- client-app/src/components/shared/signup.js | 3 --- 2 files changed, 1 insertion(+), 4 deletions(-) diff --git a/client-app/src/components/customer/map.js b/client-app/src/components/customer/map.js index f3a1f3c..b68baaa 100644 --- a/client-app/src/components/customer/map.js +++ b/client-app/src/components/customer/map.js @@ -8,7 +8,7 @@ export default function CustomerMap() { // //API post request to customer location table INSERT INTO customer_location // }; - return

hello

; + return

Customer map

; } /* //
diff --git a/client-app/src/components/shared/signup.js b/client-app/src/components/shared/signup.js index 038061f..00a5c96 100644 --- a/client-app/src/components/shared/signup.js +++ b/client-app/src/components/shared/signup.js @@ -119,9 +119,6 @@ export default function SignUp() { } }) .then((body) => { - console.log( - `Signup successful. Customer token set in local storage: ${body.access_token}` - ); window.localStorage.setItem("token", body.access_token); setLogInStatus(true); })