Archived
Home Page nav bar will display now #3
@@ -5,10 +5,11 @@ import { NavBar } from "./nav/NavBar";
|
|||||||
import { Login } from "./auth/Login";
|
import { Login } from "./auth/Login";
|
||||||
import { Register } from "./auth/Register";
|
import { Register } from "./auth/Register";
|
||||||
|
|
||||||
export const GraphicsBayTracker = () => (
|
export const GraphicsBayTracker = () => {
|
||||||
<>
|
return ( <>
|
||||||
<Route
|
<Route
|
||||||
render={() => {
|
render={() => {
|
||||||
|
|
||||||
if (localStorage.getItem("graphicsbaytracker_customer")) {
|
if (localStorage.getItem("graphicsbaytracker_customer")) {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
@@ -17,10 +18,10 @@ export const GraphicsBayTracker = () => (
|
|||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
return <Redirect to="/login" />;
|
return( <Redirect to="/login" />
|
||||||
}
|
);
|
||||||
}}
|
}}}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<Route path="/login">
|
<Route path="/login">
|
||||||
<Login />
|
<Login />
|
||||||
@@ -29,4 +30,4 @@ export const GraphicsBayTracker = () => (
|
|||||||
<Register />
|
<Register />
|
||||||
</Route>
|
</Route>
|
||||||
</>
|
</>
|
||||||
);
|
)};
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
import React, { useRef, useState } from "react"
|
import React, { useCallback, useRef, useState } from "react"
|
||||||
import { Link } from "react-router-dom";
|
import { Link } from "react-router-dom";
|
||||||
import { useHistory } from "react-router-dom"
|
import { useHistory } from "react-router-dom"
|
||||||
import "./Login.css"
|
import "./Login.css"
|
||||||
@@ -7,6 +7,10 @@ export const Login = () => {
|
|||||||
const [email, set] = useState("")
|
const [email, set] = useState("")
|
||||||
const existDialog = useRef()
|
const existDialog = useRef()
|
||||||
const history = useHistory()
|
const history = useHistory()
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const existingUserCheck = () => {
|
const existingUserCheck = () => {
|
||||||
return fetch(`http://localhost:8088/users?email=${email}`)
|
return fetch(`http://localhost:8088/users?email=${email}`)
|
||||||
@@ -17,7 +21,7 @@ export const Login = () => {
|
|||||||
const handleLogin = (e) => {
|
const handleLogin = (e) => {
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
existingUserCheck()
|
existingUserCheck()
|
||||||
.then(exists => {
|
.then (exists => {
|
||||||
if (exists) {
|
if (exists) {
|
||||||
localStorage.setItem("graphicsbaytracker_customer", exists.id)
|
localStorage.setItem("graphicsbaytracker_customer", exists.id)
|
||||||
history.push("")
|
history.push("")
|
||||||
@@ -27,7 +31,18 @@ export const Login = () => {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const skipLogin = () => {
|
||||||
|
const setLocalStorageUser = () => localStorage.setItem("graphicsbaytracker_customer", 1)
|
||||||
|
const skipToHome = () => history.replace('./GraphicsBayTrackerHome')
|
||||||
|
return (setLocalStorageUser(), skipToHome())
|
||||||
|
}
|
||||||
|
|
||||||
|
const redirectToRegister = () => {
|
||||||
|
history.replace("./Register")
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
||||||
<main className="container--login">
|
<main className="container--login">
|
||||||
<dialog className="dialog dialog--auth" ref={existDialog}>
|
<dialog className="dialog dialog--auth" ref={existDialog}>
|
||||||
<div>User does not exist</div>
|
<div>User does not exist</div>
|
||||||
@@ -54,11 +69,11 @@ export const Login = () => {
|
|||||||
</form>
|
</form>
|
||||||
</section>
|
</section>
|
||||||
<section className="link--register">
|
<section className="link--register">
|
||||||
<Link to="/register">Not a member yet?</Link>
|
<button onClick={ redirectToRegister}>Not a member yet?</button>
|
||||||
</section>
|
|
||||||
<section className="link-skiplogin">
|
|
||||||
<Link to="/GraphicsBayTrackerHome">Skip Login</Link>
|
|
||||||
</section>
|
</section>
|
||||||
|
<button onClick={ skipLogin }>Skip Login</button>
|
||||||
|
|
||||||
|
|
||||||
</main>
|
</main>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,10 +1,15 @@
|
|||||||
import React from "react"
|
import React from "react"
|
||||||
import { NavBar } from "../nav/NavBar"
|
import { useState, useEffect } from "react"
|
||||||
|
import { NewsStories } from "./NewsStories"
|
||||||
|
|
||||||
export const GraphicsBayTrackerHome =()=>{
|
|
||||||
const displayNavBar = NavBar()
|
|
||||||
|
|
||||||
return <div>
|
export const GraphicsBayTrackerHome = () => {
|
||||||
{displayNavBar}
|
const [ keyprices, setkeyprices] = useState({})
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
</>)
|
||||||
}
|
}
|
||||||
@@ -1,4 +1,4 @@
|
|||||||
|
|
||||||
export const NewsStories = () => {
|
export const NewsStories = () => {
|
||||||
return <div></div>
|
return <h1> This is a news story </h1>
|
||||||
}
|
}
|
||||||
@@ -29,7 +29,7 @@ export const NavBar = () => {
|
|||||||
<ul className="navbar-nav">
|
<ul className="navbar-nav">
|
||||||
<li className="nav-item">
|
<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 ? <Link className="nav-Link" to="/Logout">Logout</Link> : <Link className="nav-link" to="/Login">Login</Link>
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user