From 20b13855eabb5a1d7f57411aae5a0d10e897c1ce Mon Sep 17 00:00:00 2001
From: Mikayla Dobson <93477693+innocuous-symmetry@users.noreply.github.com>
Date: Tue, 22 Nov 2022 18:39:41 -0600
Subject: [PATCH] todo: conditional rendering on auth state change

---
 client/src/App.tsx                      | 11 +++++++++++
 client/src/components/pages/Welcome.tsx |  3 ++-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/client/src/App.tsx b/client/src/App.tsx
index cf5afe7..30607c8 100644
--- a/client/src/App.tsx
+++ b/client/src/App.tsx
@@ -9,10 +9,21 @@ import Register from './components/pages/Register';
 import Welcome from './components/pages/Welcome';
 import { useAuthContext } from './context/AuthContext';
 import './sass/App.scss'
+import { IUser } from './schemas';
+import { checkCredientials } from './util/apiUtils';
 
 function App() {
   const authContext = useAuthContext();
 
+  useEffect(() => {
+    const wrapper = async () => {
+      const result = await checkCredientials();
+      authContext.user = result;
+    }
+
+    wrapper();
+  }, [])
+
   return (
     <BrowserRouter>
       <div className="App">
diff --git a/client/src/components/pages/Welcome.tsx b/client/src/components/pages/Welcome.tsx
index e17b3e5..8a5903b 100644
--- a/client/src/components/pages/Welcome.tsx
+++ b/client/src/components/pages/Welcome.tsx
@@ -1,7 +1,7 @@
 import { useState } from "react";
 import { useNavigate } from "react-router-dom";
 import { useAuthContext } from "../../context/AuthContext";
-import { checkCredientials } from "../../util/apiUtils";
+import { attemptLogout, checkCredientials } from "../../util/apiUtils";
 import { Button, Page, Panel } from "../ui"
 import Divider from "../ui/Divider";
 
@@ -34,6 +34,7 @@ const Welcome = () => {
             <Panel extraStyles='inherit-background c-papyrus uppercase'>
                 <h1>Welcome to Recipin</h1>
                 <Button onClick={unwrap}>Check Credentials</Button>
+                <Button onClick={attemptLogout}>Log Out</Button>
             </Panel>
 
             <Divider />