From a33ccddeb2ad49610e55083ded81877509fc30d6 Mon Sep 17 00:00:00 2001
From: bytesparallel <jason.ross841@gmail.com>
Date: Sun, 12 Dec 2021 19:11:55 -0600
Subject: [PATCH 1/3] GBT home is now displaying as the default page

---
 src/components/ApplicationViews.js            |  5 +++++
 src/components/home/GraphicsBayTrackerHome.js | 15 ++++++++-------
 2 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/src/components/ApplicationViews.js b/src/components/ApplicationViews.js
index 32486ed..12bfc58 100644
--- a/src/components/ApplicationViews.js
+++ b/src/components/ApplicationViews.js
@@ -7,6 +7,11 @@ import { Profile } from "./profile/Profile"
 export const ApplicationViews = () => {
     return (
         <>
+
+            <Route exact path="/">
+                <GraphicsBayTrackerHome />
+            </Route>
+
             <Route path="/GraphicsBayTrackerHome">
                 <GraphicsBayTrackerHome />
             </Route>
diff --git a/src/components/home/GraphicsBayTrackerHome.js b/src/components/home/GraphicsBayTrackerHome.js
index 9148378..ad4e68d 100644
--- a/src/components/home/GraphicsBayTrackerHome.js
+++ b/src/components/home/GraphicsBayTrackerHome.js
@@ -1,15 +1,16 @@
 import React from "react"
+import { Route } from "react-router-dom/cjs/react-router-dom.min"
 import { useState, useEffect } from "react"
 import { NewsStories } from "./NewsStories"
 
 
 export const GraphicsBayTrackerHome = () => {
-    const [ keyprices, setkeyprices] = useState({})
+    // const [ keyprices, setkeyprices] = useState({})
     return (
-    <>
-    
-    <div>
-         
-    </div>
-    </>)
+        <>
+    {/* <Route path="NewsStories"><NewsStories /></Route> */}
+ <h1>Display</h1>
+
+    </>
+    )
 }
\ No newline at end of file
-- 
2.47.3


From 80033a15dd9d995b7b37da17a88bb51965ca6e02 Mon Sep 17 00:00:00 2001
From: bytesparallel <jason.ross841@gmail.com>
Date: Mon, 13 Dec 2021 21:18:24 -0600
Subject: [PATCH 2/3] Homepage content completeexcept for logout button and CSS

---
 src/components/ApplicationViews.js            |  4 ++
 src/components/auth/Logout.js                 |  8 ++-
 src/components/home/GraphicsBayTrackerHome.js | 56 ++++++++++++++++---
 src/components/home/NewsStories.js            | 34 ++++++++++-
 src/components/nav/NavBar.js                  | 19 ++-----
 src/components/pricing/GPUDataInterface.js    | 25 +++++++++
 6 files changed, 120 insertions(+), 26 deletions(-)

diff --git a/src/components/ApplicationViews.js b/src/components/ApplicationViews.js
index 12bfc58..b8ebf48 100644
--- a/src/components/ApplicationViews.js
+++ b/src/components/ApplicationViews.js
@@ -2,6 +2,7 @@ import React from "react"
 import { Route } from "react-router-dom"
 import { GraphicsBayTrackerHome } from "./home/GraphicsBayTrackerHome"
 import { Profile } from "./profile/Profile"
+import { GPUDataInterface } from "./pricing/GPUDataInterface"
 
 
 export const ApplicationViews = () => {
@@ -18,6 +19,9 @@ export const ApplicationViews = () => {
             <Route path="profile/Profile" >
                 <Profile />
             </Route>
+            <Route path="pricing/GPUDataInterface" >
+                <GPUDataInterface />
+            </Route>
         </>
     )
 }
diff --git a/src/components/auth/Logout.js b/src/components/auth/Logout.js
index 1a3f6dd..3738f08 100644
--- a/src/components/auth/Logout.js
+++ b/src/components/auth/Logout.js
@@ -3,11 +3,15 @@ import {useState, useEffect} from "react"
 import { useHistory } from "react-router-dom"
 
 export const Logout = () => {
-    const [loggedincustomer, setloggedincustomer] = useState(localStorage.graphicsbaytracker_customer)
+    const [loggedincustomer, setloggedincustomer] = useState(localStorage.getItem("graphicsbaytracker_customer"))
+
+    const setItemFromLocalStorage = () => {
+         setloggedincustomer()
+    }
     return (
         <>
         <div>
-        <button onClick={() => setloggedincustomer(localStorage.removeItem("graphicsbaytracker_customer"))}>Log Out</button>
+        <button onClick={() => setItemFromLocalStorage(localStorage.removeItem("graphicsbaytracker_customer"))}>Log Out</button>
         </div>
         </>
     ) 
diff --git a/src/components/home/GraphicsBayTrackerHome.js b/src/components/home/GraphicsBayTrackerHome.js
index ad4e68d..70358ae 100644
--- a/src/components/home/GraphicsBayTrackerHome.js
+++ b/src/components/home/GraphicsBayTrackerHome.js
@@ -1,16 +1,54 @@
 import React from "react"
-import { Route } from "react-router-dom/cjs/react-router-dom.min"
-import { useState, useEffect } from "react"
-import { NewsStories } from "./NewsStories"
+import { Link } from "react-router-dom"
+import {
+    Route
+} from "react-router-dom/cjs/react-router-dom.min"
+import {
+    useState,
+    useEffect
+} from "react"
+import {
+    NewsStories
+} from "./NewsStories"
 
 
 export const GraphicsBayTrackerHome = () => {
-    // const [ keyprices, setkeyprices] = useState({})
-    return (
-        <>
-    {/* <Route path="NewsStories"><NewsStories /></Route> */}
- <h1>Display</h1>
+    const [keyprices, fetchkeyprices] = useState([])
+
+    useEffect(
+        () => {
+            fetch("http://localhost:8088/cardData")
+                .then(res => res.json())
+                .then(fetchkeyprices)
+        },[])
+                            
+     
+    
+    return ( <>
+
+        <h1><Link to="/GraphicsBayTrackerHome">GraphicsBay Tracker</Link></h1>  <div> 
+            <button><Link to="/GPUDataInterface">Graphics Card Pricing Tool</Link></button>
+            {NewsStories()} 
+        </div>  
+        <aside>
+        <p>Key Prices</p>  
+        <div>
+
+        {
+            keyprices.map(
+                (cardDataObject) => {
+                    if (cardDataObject.keyPrice === true)
+                    return( 
+                    <div> 
+                        <p key = {`cardDataObject--${cardDataObject.id}`} > {cardDataObject.oem} {cardDataObject.brand} {cardDataObject.model} </p> 
+                        <p key = {`cardDataObject--${cardDataObject.id}`}> Card Price - {cardDataObject.price.toLocaleString('en-US', { style: 'currency', currency: 'USD' })} </p> 
+                        </div>)
+                }
+                )
+        }
+        </div>
+</aside>
+</>
 
-    </>
     )
 }
\ No newline at end of file
diff --git a/src/components/home/NewsStories.js b/src/components/home/NewsStories.js
index 18ee440..b94a3f1 100644
--- a/src/components/home/NewsStories.js
+++ b/src/components/home/NewsStories.js
@@ -1,4 +1,34 @@
-
+import {
+    useEffect,
+    useState
+} from "react"
 export const NewsStories = () => {
-    return <h1> This is a news story </h1>
+    const [newsstories, setNewsStories] = useState([])
+
+
+     
+        useEffect(
+            () => {
+                fetch("http://localhost:8088/newsstories")
+                    .then(res => res.json())
+                    .then((data) => {
+                        setNewsStories(data)
+                    })
+            },
+            []
+        )
+    
+        
+    return ( <>
+        <div>{newsstories.map( 
+            (newsOBJ) => {
+                 return <div><p key={`newsOBJ--${newsOBJ.id}`}>{newsOBJ.storyText} </p>
+                    <a href={newsOBJ.link} >{newsOBJ.link}</a>
+                 </div>
+            }
+        )}
+            </div>
+        </>
+        
+    )
 }
\ No newline at end of file
diff --git a/src/components/nav/NavBar.js b/src/components/nav/NavBar.js
index 3c1468c..59a636d 100644
--- a/src/components/nav/NavBar.js
+++ b/src/components/nav/NavBar.js
@@ -2,44 +2,37 @@ import React, { useEffect, useState } from "react"
 import { Link, useHistory } from "react-router-dom"
 import { Login } from "../auth/Login"
 import { Logout } from "../auth/Logout"
+import { Profile } from "../profile/Profile"
+import { GPUDataInterface } from "../pricing/GPUDataInterface"
 import "./NavBar.css"
 
 
 
 export const NavBar = () => {
-    const history = useHistory()
 
     
 
     return (
         <div className="container">
             <nav className="navbar navbar-expand-sm navbar-light bg-light fixed-top onTop">
-                <button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
-                    <span className="navbar-toggler-icon"></span>
-                </button>
                 <div id="navbarNavDropdown" className="navbar-collapse collapse">
                     <ul className="navbar-nav mr-auto">
                         <li className="nav-item active">
-                            <Link className="nav-link" to="/PricingData">Pricing Data<span className="sr-only"></span></Link>
+                        <button onClick={ GPUDataInterface }> Pricing Data</button>
                         </li>
                         <li className="nav-item">
-                            <Link className="nav-link" to="/Profile">My Profile and Tracked Cards<span className="sr-only"></span></Link>
+                            <button onClick={ Profile }> Profile and Tracked Cards</button>
                         </li>
                     </ul>
                     <ul className="navbar-nav">
                         <li className="nav-item">
                             {
-                            localStorage.graphicsbaytracker_customer !== 1 ? <Link className="nav-Link" to="/Logout">Logout</Link> :  <Link className="nav-link" to="/Login">Login</Link>
+                            localStorage.graphicsbaytracker_customer !== 1 ? <button onClick={ Logout }> Log Out </button> :  <Link className="nav-link" to="/Login">Log In</Link>
                                
                                    
                             }
                         </li>
-                        <li className="nav-item">
-                            {
-                            
-                                 
-                            }
-                        </li>
+        
                     </ul>
                 </div>
             </nav>
diff --git a/src/components/pricing/GPUDataInterface.js b/src/components/pricing/GPUDataInterface.js
index e69de29..d87dca5 100644
--- a/src/components/pricing/GPUDataInterface.js
+++ b/src/components/pricing/GPUDataInterface.js
@@ -0,0 +1,25 @@
+import { React } from "react"
+import { useState,useEffect } from "react"
+import { Link } from "react-router-dom"
+export const GPUDataInterface = () => {
+    const [gpucarddata, fetchgpucarddata] = useState([])
+    useEffect(
+        () => {
+            fetch("http://localhost:8088/cardData")
+                .then(res => res.json())
+                .then((data) => {
+                    fetchgpucarddata(data)
+                })
+        },
+        []
+    )
+    return (
+        <>
+        <h1>GPUDataInterface</h1>
+        <div>
+        <table>
+
+        </table>
+    </div>
+        </>
+    )}
\ No newline at end of file
-- 
2.47.3


From 2ea3c951cd51441b4e5c478b5b4c53cd68c35472 Mon Sep 17 00:00:00 2001
From: bytesparallel <jason.ross841@gmail.com>
Date: Wed, 15 Dec 2021 11:22:30 -0600
Subject: [PATCH 3/3] Completed Home page, some progress done on main
 priciingview

---
 src/components/ApplicationViews.js            | 10 +++---
 src/components/auth/Login.js                  | 10 ++----
 src/components/auth/Logout.js                 | 29 ++++++++-------
 src/components/home/GraphicsBayTrackerHome.js | 22 +++++-------
 src/components/nav/NavBar.js                  | 36 +++++++++++--------
 src/components/pricing/GPUDataInterface.js    | 12 +++++--
 6 files changed, 63 insertions(+), 56 deletions(-)

diff --git a/src/components/ApplicationViews.js b/src/components/ApplicationViews.js
index b8ebf48..f89353c 100644
--- a/src/components/ApplicationViews.js
+++ b/src/components/ApplicationViews.js
@@ -5,6 +5,7 @@ import { Profile } from "./profile/Profile"
 import { GPUDataInterface } from "./pricing/GPUDataInterface"
 
 
+
 export const ApplicationViews = () => {
     return (
         <>
@@ -12,16 +13,13 @@ export const ApplicationViews = () => {
             <Route exact path="/">
                 <GraphicsBayTrackerHome />
             </Route>
-
-            <Route path="/GraphicsBayTrackerHome">
-                <GraphicsBayTrackerHome />
-            </Route>
-            <Route path="profile/Profile" >
+            <Route path="/profile/Profile" >
                 <Profile />
             </Route>
-            <Route path="pricing/GPUDataInterface" >
+            <Route path="/pricing/GPUDataInterface" >
                 <GPUDataInterface />
             </Route>
+            
         </>
     )
 }
diff --git a/src/components/auth/Login.js b/src/components/auth/Login.js
index 49538a0..d584ebf 100644
--- a/src/components/auth/Login.js
+++ b/src/components/auth/Login.js
@@ -42,7 +42,7 @@ const redirectToRegister = () => {
 }
 
     return (
-        
+        <>
         <main className="container--login">
             <dialog className="dialog dialog--auth" ref={existDialog}>
                 <div>User does not exist</div>
@@ -68,13 +68,9 @@ const redirectToRegister = () => {
                     </fieldset>
                 </form>
             </section>
-            <section className="link--register">
                 <button onClick={ redirectToRegister}>Not a member yet?</button>
-            </section>
-            <button onClick={ skipLogin }>Skip Login</button>
-            
-    
-        </main>
+           </main>
+        </>
     )
 }
 
diff --git a/src/components/auth/Logout.js b/src/components/auth/Logout.js
index 3738f08..d3229c4 100644
--- a/src/components/auth/Logout.js
+++ b/src/components/auth/Logout.js
@@ -1,20 +1,25 @@
 import React from "react"
 import {useState, useEffect} from "react"
 import { useHistory } from "react-router-dom"
+import { props } from "react"
 
-export const Logout = () => {
-    const [loggedincustomer, setloggedincustomer] = useState(localStorage.getItem("graphicsbaytracker_customer"))
+export const Logout = (props) => {
+     const [loggedIn, setLoggedIn] = useState(true)
 
-    const setItemFromLocalStorage = () => {
-         setloggedincustomer()
-    }
-    return (
-        <>
-        <div>
-        <button onClick={() => setItemFromLocalStorage(localStorage.removeItem("graphicsbaytracker_customer"))}>Log Out</button>
-        </div>
-        </>
-    ) 
+ 
+
+    useEffect(() => {
+      if (localStorage.getItem("graphicsbaytracker_customer") !== "1") {
+          setLoggedIn(true)
+          }
+    }, []);
+  
+  const logOutCustomer = () => {
+        localStorage.removeItem("graphicsbaytracker_customer");
+        setLoggedIn(false)
+  
     
+  }
+
     
 }
\ No newline at end of file
diff --git a/src/components/home/GraphicsBayTrackerHome.js b/src/components/home/GraphicsBayTrackerHome.js
index 70358ae..6cdeb24 100644
--- a/src/components/home/GraphicsBayTrackerHome.js
+++ b/src/components/home/GraphicsBayTrackerHome.js
@@ -1,19 +1,15 @@
 import React from "react"
 import { Link } from "react-router-dom"
-import {
-    Route
-} from "react-router-dom/cjs/react-router-dom.min"
-import {
-    useState,
-    useEffect
-} from "react"
-import {
-    NewsStories
-} from "./NewsStories"
+import {Route} from "react-router-dom/cjs/react-router-dom.min"
+import {useState,useEffect } from "react"
+import {NewsStories} from "./NewsStories"
+import { GPUDataInterface } from "../pricing/GPUDataInterface"
+import { useHistory } from "react-router-dom/cjs/react-router-dom.min"
 
 
 export const GraphicsBayTrackerHome = () => {
     const [keyprices, fetchkeyprices] = useState([])
+    const history = useHistory()
 
     useEffect(
         () => {
@@ -26,8 +22,8 @@ export const GraphicsBayTrackerHome = () => {
     
     return ( <>
 
-        <h1><Link to="/GraphicsBayTrackerHome">GraphicsBay Tracker</Link></h1>  <div> 
-            <button><Link to="/GPUDataInterface">Graphics Card Pricing Tool</Link></button>
+        <h1><Link to="/">GraphicsBay Tracker</Link></h1>  <div> 
+            <button onClick={() => history.push("/pricing/GPUDataInterface")}>Graphics Card Pricing Tool</button>
             {NewsStories()} 
         </div>  
         <aside>
@@ -36,7 +32,7 @@ export const GraphicsBayTrackerHome = () => {
 
         {
             keyprices.map(
-                (cardDataObject) => {
+                cardDataObject => {
                     if (cardDataObject.keyPrice === true)
                     return( 
                     <div> 
diff --git a/src/components/nav/NavBar.js b/src/components/nav/NavBar.js
index 59a636d..c84527c 100644
--- a/src/components/nav/NavBar.js
+++ b/src/components/nav/NavBar.js
@@ -1,18 +1,24 @@
 import React, { useEffect, useState } from "react"
 import { Link, useHistory } from "react-router-dom"
 import { Login } from "../auth/Login"
-import { Logout } from "../auth/Logout"
+
 import { Profile } from "../profile/Profile"
 import { GPUDataInterface } from "../pricing/GPUDataInterface"
+import { Props } from "react"
 import "./NavBar.css"
 
 
 
-export const NavBar = () => {
-
+export const NavBar = (props) => {
+    
+  
+   
+        
+    
     
 
     return (
+        <>
         <div className="container">
             <nav className="navbar navbar-expand-sm navbar-light bg-light fixed-top onTop">
                 <div id="navbarNavDropdown" className="navbar-collapse collapse">
@@ -25,17 +31,17 @@ export const NavBar = () => {
                         </li>
                     </ul>
                     <ul className="navbar-nav">
-                        <li className="nav-item">
-                            {
-                            localStorage.graphicsbaytracker_customer !== 1 ? <button onClick={ Logout }> Log Out </button> :  <Link className="nav-link" to="/Login">Log In</Link>
-                               
-                                   
-                            }
-                        </li>
-        
-                    </ul>
-                </div>
-            </nav>
-        </div>
+                        < li className = "nav-item" > {
+                                                <button onClick = {
+                                                    () => {localStorage.removeItem("graphicsbaytracker_customer")}}> Log Out </button>
+
+    }
+                            </li>
+
+</ul>
+</div>
+</nav>
+</div>
+</>
     )
 }
diff --git a/src/components/pricing/GPUDataInterface.js b/src/components/pricing/GPUDataInterface.js
index d87dca5..af8f2b4 100644
--- a/src/components/pricing/GPUDataInterface.js
+++ b/src/components/pricing/GPUDataInterface.js
@@ -16,10 +16,16 @@ export const GPUDataInterface = () => {
     return (
         <>
         <h1>GPUDataInterface</h1>
-        <div>
+        
         <table>
-
+            <tr> 
+            <th>Brand</th>
+            <th>Model</th>
+            <th>Price</th>
+            </tr>
+        <tr>{gpucarddata.map(gpudataobj => {return ( <p key ={`gpucardobj--${gpudataobj.id}`}> {gpudataobj.brand} {gpudataobj.model} {gpudataobj.price.toLocaleString('en-US', { style: 'currency', currency: 'USD' })}</p>)})}
+        </tr>
         </table>
-    </div>
+          
         </>
     )}
\ No newline at end of file
-- 
2.47.3