login component edited to show based on status

a-straus · May 1, 2020 · 6a9080a · 6a9080a
1 parent bb637fa
commit 6a9080a
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 21 deletions.
diff --git a/client/App.jsx b/client/App.jsx
@@ -14,8 +14,7 @@ const App = () => {
 
   useEffect(() => {
     const token = Cookies.get('token'); //undefined if not logged in
-    // const showCluster;
-    if(token) {
+    if(token) { //if token exists, render cluster page paths
       setMainCont(
         <Route
           path='/'
@@ -24,10 +23,13 @@ const App = () => {
           )}
         /> 
       );
-      console.log('token verified, setMainCont')
     }
-    console.log('useEffect called')
-    console.log('token in app', token)
+    else { //else login path 
+      setMainCont(
+        <Route exact path='/login' component={Login} />
+      );
+    }
+
   }, [])
 
 
@@ -39,14 +41,8 @@ const App = () => {
       <div className='appContainer' id='app'>
         <Switch>
           <Route exact path='/' component={Home} />
-          <Route exact path='/login' component={Login} />
+          {/* <Route exact path='/login' component={Login} /> */}
           <Route exact path='/eks' component={Eks} />
-          {/* <Route
-            path='/'
-            children={(routeProps) => (
-              <Main_Container {...routeProps} path={path} />
-            )}
-          /> */}
           {mainCont}
         </Switch>
       </div>

diff --git a/client/components/Dashboard.jsx b/client/components/Dashboard.jsx
@@ -5,20 +5,26 @@ import white from '../assets/whiteLogo.png';
 import Cookies from 'js-cookie';
 
 const Dashboard = () => {
-  let [clusterNav, setClusterNav] = useState([]);
+  let [navOption, setNavOption] = useState([]);
 
   useEffect(() => {
     const token = Cookies.get('token'); //undefined if not logged in
-    // const showCluster;
-    if(token) {
-      setClusterNav(
-        <NavDropdown title='My Cluster' className='navLink'>
+    if(token) { //if logged in, show cluster option in dashboard
+      setNavOption(
+        <NavDropdown title='My Cluster' className='ml-auto navLink'>
           <Nav.Link href='/cluster'>Cluster</Nav.Link>
           <Nav.Link href='/visualizer'>Visualizer</Nav.Link>
           <Nav.Link href='/alerts'>Alerts</Nav.Link>
         </NavDropdown>
       );
     }
+    else {
+      setNavOption ( //login option shows only if not logged in - for now, since no logout in backend
+        <Nav.Link href='/login' className='ml-auto'>
+          Login
+        </Nav.Link>
+      )
+    }
   }, [])
 
   return (
@@ -42,10 +48,7 @@ const Dashboard = () => {
         <Nav.Link href='/#team' className='navLink'>
           Team
         </Nav.Link>
-        <Nav.Link href='/login' className='ml-auto'>
-          Login
-        </Nav.Link>
-        {clusterNav}
+        {navOption}
       </Nav>
     </div>
   );