diff --git a/client/package-lock.json b/client/package-lock.json
index 6684ef7..15b0245 100644
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -14043,12 +14043,6 @@
       "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.1.tgz",
       "integrity": "sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM="
     },
-    "uuid": {
-      "version": "7.0.3",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-7.0.3.tgz",
-      "integrity": "sha512-DPSke0pXhTZgoF/d+WSt2QaKMCFSfx7QegxEWT+JOuHF5aWrKEn0G+ztjuJg/gG8/ItK+rbPCD/yNv8yyih6Cg==",
-      "dev": true
-    },
     "v8-compile-cache": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.1.0.tgz",
diff --git a/client/package.json b/client/package.json
index 94f9cc7..73c2564 100644
--- a/client/package.json
+++ b/client/package.json
@@ -10,6 +10,7 @@
     "axios": "^0.19.2",
     "bootstrap": "^4.4.1",
     "firebase": "^7.14.1",
+    "prop-types": "^15.7.2",
     "react": "^16.13.1",
     "react-dom": "^16.13.1",
     "react-jss": "^10.1.1",
@@ -40,4 +41,4 @@
   },
   "proxy": "http://localhost:5000",
   "devDependencies": {}
-}
\ No newline at end of file
+}
diff --git a/client/src/components/App/index.jsx b/client/src/components/App/index.jsx
index c42e9a1..7b84727 100644
--- a/client/src/components/App/index.jsx
+++ b/client/src/components/App/index.jsx
@@ -1,15 +1,26 @@
-import React from "react";
+import React, { useState, useEffect } from "react";
 import { BrowserRouter as Router } from "react-router-dom";
+import { useFirebase } from "../../services/auth";
 import MainNavbar from "../MainNavbar";
 import MainRouter from "../Router";
 
-function App() {
+const App = () => {
+  // for testing only. Transfer Session to store.
+  const [authUser, setAuthUser] = useState(null);
+  const firebase = useFirebase();
+
+  useEffect(() => {
+    firebase.auth.onAuthStateChanged((authUser) =>
+      authUser ? setAuthUser(authUser) : setAuthUser(null)
+    );
+  }, [firebase.auth]);
+
   return (
     <Router>
-      <MainNavbar />
+      <MainNavbar authUser={authUser} />
       <MainRouter />
     </Router>
   );
-}
+};
 
 export default App;
diff --git a/client/src/components/MainNavbar/index.jsx b/client/src/components/MainNavbar/index.jsx
index e20a415..57068cc 100644
--- a/client/src/components/MainNavbar/index.jsx
+++ b/client/src/components/MainNavbar/index.jsx
@@ -1,5 +1,6 @@
 import React, { useState } from "react";
 import { Link } from "react-router-dom";
+import PropTypes from "prop-types";
 import {
   Collapse,
   Container,
@@ -13,7 +14,7 @@ import {
 import SignOutButton from "../SignOutButton";
 import * as ROUTES from "../../constants/routes";
 
-export default function MainNavbar() {
+const MainNavbar = ({ authUser }) => {
   const [isOpen, setIsOpen] = useState(false);
   const toggle = () => setIsOpen(!isOpen);
 
@@ -21,26 +22,18 @@ export default function MainNavbar() {
     <Navbar color="dark" dark expand="sm">
       <Container>
         <NavbarBrand>
-          <Link to={ROUTES.LANDING}>LandingPage</Link>
+          <Link to={authUser ? ROUTES.APP : ROUTES.LANDING}>App</Link>
         </NavbarBrand>
         <NavbarToggler onClick={toggle} />
         <Collapse isOpen={isOpen} navbar>
           <Nav className="ml-auto" navbar>
-            <NavItem>
-              <NavLink>
-                <Link to={ROUTES.SIGN_IN}>Sign In</Link>
-              </NavLink>
-            </NavItem>
-            <NavItem>
-              <NavLink>
-                <Link to={ROUTES.APP}>Home</Link>
-              </NavLink>
-            </NavItem>
-            <NavItem>
-              <NavLink>
-                <Link to={ROUTES.ACCOUNT}>Account</Link>
-              </NavLink>
-            </NavItem>
+            {authUser && (
+              <NavItem>
+                <NavLink>
+                  <Link to={ROUTES.ACCOUNT}>Account</Link>
+                </NavLink>
+              </NavItem>
+            )}
             <NavItem>
               <NavLink>
                 <Link to={ROUTES.ADMIN}>Admin</Link>
@@ -57,7 +50,11 @@ export default function MainNavbar() {
             </NavItem>
             <NavItem>
               <NavLink>
-                <SignOutButton />
+                {authUser ? (
+                  <SignOutButton />
+                ) : (
+                  <Link to={ROUTES.SIGN_IN}>Sign In</Link>
+                )}
               </NavLink>
             </NavItem>
           </Nav>
@@ -65,4 +62,10 @@ export default function MainNavbar() {
       </Container>
     </Navbar>
   );
-}
+};
+
+MainNavbar.propTypes = {
+  authUser: PropTypes.any.isRequired,
+};
+
+export default MainNavbar;