From 7b771a4859927d19594bc641b96b275d3a3d2bb0 Mon Sep 17 00:00:00 2001 From: Jose Date: Fri, 25 Jun 2021 06:22:40 -0700 Subject: [PATCH 01/43] style: reformated home page code --- application/public/index.html | 59 ++++++++++++++--------------------- 1 file changed, 24 insertions(+), 35 deletions(-) diff --git a/application/public/index.html b/application/public/index.html index dd1ccfd4..db887f8d 100644 --- a/application/public/index.html +++ b/application/public/index.html @@ -1,38 +1,27 @@ - - - - - - - - - React App - - - -
- - + + + + + + + + + React App + + + +
+ + From bcdc9aaeee7374d5d577ad55775f0bc40c4f2b0e Mon Sep 17 00:00:00 2001 From: Jose Date: Fri, 25 Jun 2021 06:25:38 -0700 Subject: [PATCH 02/43] style: manifest.json --- application/public/manifest.json | 26 +++++++++++++------------- 1 file changed, 13 insertions(+), 13 deletions(-) diff --git a/application/public/manifest.json b/application/public/manifest.json index 1f2f141f..952449d9 100644 --- a/application/public/manifest.json +++ b/application/public/manifest.json @@ -1,15 +1,15 @@ { - "short_name": "React App", - "name": "Create React App Sample", - "icons": [ - { - "src": "favicon.ico", - "sizes": "64x64 32x32 24x24 16x16", - "type": "image/x-icon" - } - ], - "start_url": ".", - "display": "standalone", - "theme_color": "#000000", - "background_color": "#ffffff" + "short_name": "React App", + "name": "Create React App Sample", + "icons": [ + { + "src": "favicon.ico", + "sizes": "64x64 32x32 24x24 16x16", + "type": "image/x-icon" + } + ], + "start_url": ".", + "display": "standalone", + "theme_color": "#000000", + "background_color": "#ffffff" } From 0eb293099fdc68715c5c87ae00073d66d77ad5ec Mon Sep 17 00:00:00 2001 From: Jose Date: Fri, 25 Jun 2021 06:31:37 -0700 Subject: [PATCH 03/43] style: formated code tab 4 size template.css, temlate.js --- .../src/components/common/template.css | 32 +++++++++---------- application/src/components/common/template.js | 25 ++++++++------- 2 files changed, 29 insertions(+), 28 deletions(-) diff --git a/application/src/components/common/template.css b/application/src/components/common/template.css index fe0b4b90..49970fe9 100644 --- a/application/src/components/common/template.css +++ b/application/src/components/common/template.css @@ -1,24 +1,24 @@ .bg-layer { - background: #7A5114; - min-height: 100vh; - width: 100%; + background: #7A5114; + min-height: 100vh; + width: 100%; } .fg-layer { - background: #ECEAEA; - min-height: 100vh; - margin-left: 20%; - margin-right: 20%; + background: #ECEAEA; + min-height: 100vh; + margin-left: 20%; + margin-right: 20%; } .logo { - display: block; - font-family: "Optima"; - font-size: 4em; - padding-left: 20%; - padding-right: 20%; - padding-top: 5%; - text-align: center; - text-decoration: underline; - text-decoration-color: #A43F3F; + display: block; + font-family: "Optima"; + font-size: 4em; + padding-left: 20%; + padding-right: 20%; + padding-top: 5%; + text-align: center; + text-decoration: underline; + text-decoration-color: #A43F3F; } \ No newline at end of file diff --git a/application/src/components/common/template.js b/application/src/components/common/template.js index 02d6e6ed..bbedc9ed 100644 --- a/application/src/components/common/template.js +++ b/application/src/components/common/template.js @@ -1,17 +1,18 @@ -import React from 'react'; -import { Nav } from '../../components'; -import './template.css'; +import React from 'react'; +import { Nav } from '../../components'; +import './template.css'; const Template = props => { - return ( -
-
- -
-
- ); + return ( +
+
+ + {/* display nav component */} +
+
+ ); } export default Template; \ No newline at end of file From eb78ff0c2b88fd88167dc9ee2d1f2cf890860ba8 Mon Sep 17 00:00:00 2001 From: Jose Date: Fri, 25 Jun 2021 06:38:03 -0700 Subject: [PATCH 04/43] style: formated code and removed react-router-dom because it was never used --- .../src/components/dashboard/dashboard.js | 25 +++++++++---------- 1 file changed, 12 insertions(+), 13 deletions(-) diff --git a/application/src/components/dashboard/dashboard.js b/application/src/components/dashboard/dashboard.js index f1cd44bc..38b8a555 100644 --- a/application/src/components/dashboard/dashboard.js +++ b/application/src/components/dashboard/dashboard.js @@ -1,21 +1,20 @@ -import React, { Component } from 'react'; -import { connect } from 'react-redux'; -import { Link } from 'react-router-dom'; -import './Dasboard.css'; +import React, { Component } from 'react'; +import { connect } from 'react-redux'; +import './Dasboard.css'; const mapStateToProps = state => ({ - temp: state.temp + temp: state.temp }); class Dashboard extends Component { - render() { - console.log('props', this.props); - return ( -
-

Dashboard

-
- ) - } + render() { + console.log('props from the dashboard', this.props); + return ( +
+

Dashboard

+
+ ) + } } export default connect(mapStateToProps, null)(Dashboard); From ea7fbc3d8330758603c064ed3021574bf23fc652 Mon Sep 17 00:00:00 2001 From: Jose Date: Fri, 25 Jun 2021 06:42:22 -0700 Subject: [PATCH 05/43] style: formated code and removed react-router-dom because it was never used --- application/src/components/dashboard/dashboard.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/application/src/components/dashboard/dashboard.js b/application/src/components/dashboard/dashboard.js index 38b8a555..9b70d218 100644 --- a/application/src/components/dashboard/dashboard.js +++ b/application/src/components/dashboard/dashboard.js @@ -1,6 +1,6 @@ -import React, { Component } from 'react'; -import { connect } from 'react-redux'; -import './Dasboard.css'; +import React, { Component } from 'react'; +import { connect } from 'react-redux'; +import './Dasboard.css'; const mapStateToProps = state => ({ temp: state.temp From 91c256eaa537813fdd0d14bbfcf313a926307db4 Mon Sep 17 00:00:00 2001 From: Jose Date: Fri, 25 Jun 2021 06:43:23 -0700 Subject: [PATCH 06/43] style: formated code and removed react-router-dom because it was never used --- application/src/components/dashboard/dashboard.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/application/src/components/dashboard/dashboard.js b/application/src/components/dashboard/dashboard.js index 9b70d218..9c1f2477 100644 --- a/application/src/components/dashboard/dashboard.js +++ b/application/src/components/dashboard/dashboard.js @@ -1,6 +1,6 @@ -import React, { Component } from 'react'; -import { connect } from 'react-redux'; -import './Dasboard.css'; +import React, { Component } from 'react'; +import { connect } from 'react-redux'; +import './Dasboard.css'; const mapStateToProps = state => ({ temp: state.temp From 61febecbbc91ac2f936647a4b57a1c6192c02e44 Mon Sep 17 00:00:00 2001 From: Jose Date: Fri, 25 Jun 2021 06:58:50 -0700 Subject: [PATCH 07/43] style: formated code for login user --- .../components/login/login-form/loginForm.js | 80 +++++++++++-------- 1 file changed, 45 insertions(+), 35 deletions(-) diff --git a/application/src/components/login/login-form/loginForm.js b/application/src/components/login/login-form/loginForm.js index 73aba471..e99cc9af 100644 --- a/application/src/components/login/login-form/loginForm.js +++ b/application/src/components/login/login-form/loginForm.js @@ -1,46 +1,56 @@ -import React, { Component } from 'react'; -import { connect } from 'react-redux'; -import { loginUser } from '../../../redux/actions/authActions' +import React, { Component } from 'react'; +import { connect } from 'react-redux'; +import { loginUser } from '../../../redux/actions/authActions' const mapActionsToProps = dispatch => ({ - commenceLogin(email, password) { - dispatch(loginUser(email, password)) - } + commenceLogin(email, password) { + dispatch(loginUser(email, password)) + } }) class LoginForm extends Component { - state = { - email: "", - password: "", - } + state = { + email: "", + password: "", + } - login(e) { - e.preventDefault(); - this.props.commenceLogin(this.state.email, this.state.password); - this.props.onLogin(); - } + login(e) { + e.preventDefault(); + this.props.commenceLogin(this.state.email, this.state.password); + this.props.onLogin(); + } - onChange(key, val) { - this.setState({ [key]: val }); - } + onChange(key, val) { + this.setState({ [key]: val }); + } - render() { - return ( -
-
- - this.onChange('email', e.target.value)}> -
-
- - this.onChange('password', e.target.value)}> -
-
- -
-
- ); - } + render() { + return ( + // need form validation form email and password to let user know if they typed in a correct email or if there account exist in the database +
+
+ + this.onChange('email', e.target.value)}> +
+
+ + this.onChange('password', e.target.value)}> +
+
+ +
+
+ ); + } } export default connect(null, mapActionsToProps)(LoginForm); \ No newline at end of file From 413a418c563c347695ce6bd7c0932e9bc472d6bb Mon Sep 17 00:00:00 2001 From: Jose Date: Fri, 25 Jun 2021 07:06:16 -0700 Subject: [PATCH 08/43] style: formated code for login --- application/src/components/login/login.js | 27 +++++++++++------------ 1 file changed, 13 insertions(+), 14 deletions(-) diff --git a/application/src/components/login/login.js b/application/src/components/login/login.js index 0172c5b6..063ff1f4 100644 --- a/application/src/components/login/login.js +++ b/application/src/components/login/login.js @@ -1,19 +1,18 @@ -import React, { Component } from 'react'; -import LoginForm from './login-form/loginForm'; -import './login.css'; +import React, { Component } from 'react'; +import LoginForm from './login-form/loginForm'; +import './login.css'; class Login extends Component { - - render() { - return ( -
-

Login Screen

-
- {this.props.history.push('/view-orders')}}/> -
-
- ) - } + render() { + return ( +
+

Login Screen

+
+ {this.props.history.push('/view-orders')}}/> +
+
+ ) + } } export default Login; \ No newline at end of file From 8ff66f1f23202e2a1d70ee8f0d8b078406e819dd Mon Sep 17 00:00:00 2001 From: Jose Date: Fri, 25 Jun 2021 07:08:24 -0700 Subject: [PATCH 09/43] style: formated template.js --- application/src/components/common/template.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/application/src/components/common/template.js b/application/src/components/common/template.js index bbedc9ed..030d5687 100644 --- a/application/src/components/common/template.js +++ b/application/src/components/common/template.js @@ -1,6 +1,6 @@ -import React from 'react'; -import { Nav } from '../../components'; -import './template.css'; +import React from 'react'; +import { Nav } from '../../components'; +import './template.css'; const Template = props => { return ( From c056e8757145b066661331707c778b23ebd0db9e Mon Sep 17 00:00:00 2001 From: Jose Date: Fri, 25 Jun 2021 07:12:21 -0700 Subject: [PATCH 10/43] style: formated main code --- application/src/components/main/main.js | 34 ++++++++++++------------- 1 file changed, 17 insertions(+), 17 deletions(-) diff --git a/application/src/components/main/main.js b/application/src/components/main/main.js index cadae1cd..f004d720 100644 --- a/application/src/components/main/main.js +++ b/application/src/components/main/main.js @@ -1,25 +1,25 @@ -import React, { Component } from 'react'; -import { connect } from 'react-redux'; -import { Link } from 'react-router-dom'; -import './main.css'; +import React, { Component } from 'react'; +import { connect } from 'react-redux'; +import { Link } from 'react-router-dom'; +import './main.css'; const mapStateToProps = state => ({ - temp: state.temp + temp: state.temp }); class Main extends Component { - render() { - console.log('props', this.props); - return ( -
-

Bruce's Diner Ordering Application

-

Please login to continue

- - - -
- ) - } + render() { + console.log('props from main.js', this.props); + return ( +
+

Bruce's Diner Ordering Application

+

Please login to continue

+ + + +
+ ) + } } export default connect(mapStateToProps, null)(Main); From 64c622e8499e6b94b0103640522356badfb7fd1c Mon Sep 17 00:00:00 2001 From: Jose Date: Fri, 25 Jun 2021 07:16:00 -0700 Subject: [PATCH 11/43] style: formated nav code --- application/src/components/nav/nav.js | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/application/src/components/nav/nav.js b/application/src/components/nav/nav.js index 51c5992d..fd73e50e 100644 --- a/application/src/components/nav/nav.js +++ b/application/src/components/nav/nav.js @@ -1,16 +1,19 @@ -import React from "react"; -import { Link } from "react-router-dom"; -import "./nav.css"; +import React from "react"; +import { Link } from "react-router-dom"; +import "./nav.css"; const Nav = (props) => { return (
- +
- +
From 1c27d5ecaad8e2bcf15a0e2096343952560f7f64 Mon Sep 17 00:00:00 2001 From: Jose Date: Fri, 25 Jun 2021 07:37:27 -0700 Subject: [PATCH 12/43] style: formated orderForm.js --- .../src/components/order-form/orderForm.js | 72 ++++++++++--------- 1 file changed, 39 insertions(+), 33 deletions(-) diff --git a/application/src/components/order-form/orderForm.js b/application/src/components/order-form/orderForm.js index 29258203..d7d487f3 100644 --- a/application/src/components/order-form/orderForm.js +++ b/application/src/components/order-form/orderForm.js @@ -1,10 +1,10 @@ -import React, { Component } from 'react'; -import { Template } from '../../components'; -import { connect } from 'react-redux'; -import { SERVER_IP } from '../../private'; -import './orderForm.css'; +import React, { Component } from 'react'; +import { Template } from '../../components'; +import { connect } from 'react-redux'; +import { SERVER_IP } from '../../private'; +import './orderForm.css'; -const ADD_ORDER_URL = `${SERVER_IP}/api/add-order` +const ADD_ORDER_URL = `${SERVER_IP}/api/add-order`; const mapStateToProps = (state) => ({ auth: state.auth, @@ -19,31 +19,34 @@ class OrderForm extends Component { } } + // set the item the user selected in the menu menuItemChosen(event) { this.setState({ item: event.target.value }); } + // set the quantity the user selected in the menu menuQuantityChosen(event) { this.setState({ quantity: event.target.value }); } + // when the user clicks on submit button this function will post there order submitOrder(event) { event.preventDefault(); - if (this.state.order_item === "") return; - fetch(ADD_ORDER_URL, { - method: 'POST', - body: JSON.stringify({ - order_item: this.state.order_item, - quantity: this.state.quantity, - ordered_by: this.props.auth.email || 'Unknown!', - }), - headers: { - 'Content-Type': 'application/json' - } - }) - .then(res => res.json()) - .then(response => console.log("Success", JSON.stringify(response))) - .catch(error => console.error(error)); + if (this.state.order_item === "") return; + fetch(ADD_ORDER_URL, { + method: 'POST', + body: JSON.stringify({ + order_item: this.state.order_item, + quantity: this.state.quantity, + ordered_by: this.props.auth.email || 'Unknown!' + }), + headers: { + 'Content-Type': 'application/json' + } + }) + .then(res => res.json()) + .then(response => console.log("Success", JSON.stringify(response))) + .catch(error => console.error(error)); } render() { @@ -51,19 +54,20 @@ class OrderForm extends Component { From 3b4af9ad007d001e6aba04657bc30087ea4e85ff Mon Sep 17 00:00:00 2001 From: Jose Date: Fri, 25 Jun 2021 07:43:48 -0700 Subject: [PATCH 13/43] style: formated viewOrders.js --- .../src/components/view-orders/viewOrders.js | 21 ++++++++++--------- 1 file changed, 11 insertions(+), 10 deletions(-) diff --git a/application/src/components/view-orders/viewOrders.js b/application/src/components/view-orders/viewOrders.js index 86e67113..f61756d6 100644 --- a/application/src/components/view-orders/viewOrders.js +++ b/application/src/components/view-orders/viewOrders.js @@ -1,13 +1,14 @@ -import React, { Component } from 'react'; -import { Template } from '../../components'; -import { SERVER_IP } from '../../private'; -import './viewOrders.css'; +import React, { Component } from 'react'; +import { Template } from '../../components'; +import { SERVER_IP } from '../../private'; +import './viewOrders.css'; class ViewOrders extends Component { state = { orders: [] } + // componentDidMount() { fetch(`${SERVER_IP}/api/current-orders`) .then(response => response.json()) @@ -24,7 +25,7 @@ class ViewOrders extends Component { return (