diff --git a/client/src/App.tsx b/client/src/App.tsx index 2aa7037..186a773 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -7,6 +7,7 @@ import LandingPage from './components/LandingPage'; import Products from './components/Products/Products'; import LoginForm from './components/User/LoginForm'; import Register from './components/User/Register'; +import UserProfile from './components/User/UserProfile'; import './App.scss' @@ -21,6 +22,7 @@ function App() { } /> } /> + } /> } /> } /> diff --git a/client/src/components/Navbar.tsx b/client/src/components/Navbar.tsx index c58f564..f2a5128 100644 --- a/client/src/components/Navbar.tsx +++ b/client/src/components/Navbar.tsx @@ -5,11 +5,10 @@ import { useNavigate } from 'react-router-dom'; function NavBar() { const [loggedIn, setLoggedIn] = useState(false); - const [userID, setUserID] = useState(null); + const [profText, setProfText] = useState(null); const [searchInput, setSearchInput] = useState(''); const [state, dispatch] = useContext(AppContext); - // const { searchTerm, user, cart } = useContext(AppContext); const navigate = useNavigate(); @@ -20,24 +19,30 @@ function NavBar() { navigate(`/products?query=${searchInput}`); } - // const forceRender = () => { - // console.log(searchTerm); - // console.log(user); - // } + useEffect(() => { + if (state === initialState) return; - // useEffect(() => { - // console.log('state updated!'); - // }, [user]) + console.log(state.user); + + if (state.user && state.user.headers.authenticated) { + console.log('authenticated!'); + setProfText(state.user.email); + setLoggedIn(true); + } else if (!state.user.authenticated) { + setLoggedIn(false); + } + + }, [state]); return ( ) } diff --git a/client/src/components/User/LoginForm.tsx b/client/src/components/User/LoginForm.tsx index d0abb77..69930c1 100644 --- a/client/src/components/User/LoginForm.tsx +++ b/client/src/components/User/LoginForm.tsx @@ -25,13 +25,12 @@ function LoginForm() { const json = await response?.json(); if (json) { - console.log(json); - console.log(json.user); - + const { session, userProfile } = json; let thisUser: userInfo = { - email: json.user.email, - password: json.user.password, - headers: json + id: userProfile.id, + email: userProfile.email, + password: userProfile.password, + headers: session } setToDispatch(thisUser); @@ -39,7 +38,7 @@ function LoginForm() { } useEffect(() => { - console.log('thing?'); + if (!toDispatch) return; dispatch({ type: ActionType.USERLOGIN, payload: toDispatch }); }, [toDispatch]); diff --git a/client/src/components/User/UserProfile.tsx b/client/src/components/User/UserProfile.tsx new file mode 100644 index 0000000..5ac92e2 --- /dev/null +++ b/client/src/components/User/UserProfile.tsx @@ -0,0 +1,33 @@ +import { useContext, useEffect } from "react" +import { useNavigate } from "react-router-dom"; +import { AppContext } from "../../store/store" + +import Page from "../../util/Page"; + +export default function UserProfile(profile: any): JSX.Element { + const [state, dispatch] = useContext(AppContext); + + const navigate = useNavigate(); + + // useEffect(() => { + // if (!state.user.headers.authenticated) { + // console.log('bad'); + // } + // }, []); + + return ( + +

User Profile

+

Thanks for supporting us{`, ${state.user.name}!` || '!'}

+

{state.user.id || 'Profile not found'}

+

{state.user.email}

+ +
+ + + + +
+
+ ) +} \ No newline at end of file diff --git a/client/src/util/apiUtils.ts b/client/src/util/apiUtils.ts index 98be1c7..7d2130d 100644 --- a/client/src/util/apiUtils.ts +++ b/client/src/util/apiUtils.ts @@ -35,5 +35,5 @@ export const handleLogin = async (email: string, password: string) => { body: JSON.stringify({ email: email, password: password }) }); - if (serverCall.ok) return serverCall; + return serverCall; } diff --git a/routes/login.js b/routes/login.js index d36d671..49aa497 100644 --- a/routes/login.js +++ b/routes/login.js @@ -19,7 +19,12 @@ loginRouter.route('/').post(async (req, res) => { req.session.authenticated = true; req.session.user = { email: email, password: password } - res.send(req.session); + let fullUserProfile = await newClient.query("SELECT * FROM users WHERE email = ($1)", [email]); + + res.send({ + session: req.session, + userProfile: fullUserProfile.rows[0] + }); } } catch(e) { console.log(e);