fix: remove username and logout button when logged out

sasjs · Aug 25, 2022 · e047f53 · e047f53
1 parent c56fb3c
commit e047f53
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 18 deletions.
diff --git a/src/context/sasContext.tsx b/src/context/sasContext.tsx
@@ -100,14 +100,11 @@ const SASProvider = (props: { children: ReactNode }) => {
   }, [])
 
   const login = useCallback(async (username, password) => {
-    const clientId =
-      sasjsConfig.serverType === ServerType.Sasjs
-        ? process.env.REACT_APP_CLIENT_ID
-        : undefined
     return sasService
-      .logIn(username, password, clientId)
+      .logIn(username, password)
       .then(
         (res: LoginResult) => {
+          setUserName(res.userName)
           setIsUserLoggedIn(res.isLoggedIn)
           return true
         },
@@ -128,6 +125,8 @@ const SASProvider = (props: { children: ReactNode }) => {
   const logout = useCallback(() => {
     sasService.logOut().then(() => {
       setIsUserLoggedIn(false)
+      setFullName('')
+      setUserName('')
     })
   }, [])
 
@@ -137,10 +136,16 @@ const SASProvider = (props: { children: ReactNode }) => {
 
   useEffect(() => {
     setCheckingSession(true)
-    sasService.checkSession().then((response) => {
-      setCheckingSession(false)
-      setIsUserLoggedIn(response.isLoggedIn)
-    })
+    sasService
+      .checkSession()
+      .then((response) => {
+        setCheckingSession(false)
+        setIsUserLoggedIn(response.isLoggedIn)
+      })
+      .catch((_) => {
+        setCheckingSession(false)
+        setIsUserLoggedIn(false)
+      })
   }, [])
 
   useEffect(() => {

diff --git a/src/layouts/Main.jsx b/src/layouts/Main.jsx
@@ -124,7 +124,7 @@ const Main = (props) => {
               }}
             >
               <UserName
-                userName={sasContext.fullName}
+                userName={sasContext.fullName || sasContext.userName}
                 avatarContent={sasContext.avatarContent}
                 onClickHandler={handleMenu}
                 className={classes.title}
@@ -170,14 +170,16 @@ const Main = (props) => {
                   Documentation
                 </MenuItem>
                 <Divider variant="middle" />
-                <MenuItem
-                  onClick={sasContext.logout}
-                  className={classes.logoutButton}
-                >
-                  <Button variant="contained" color="primary">
-                    Logout
-                  </Button>
-                </MenuItem>
+                {sasContext.isUserLoggedIn && (
+                  <MenuItem
+                    onClick={sasContext.logout}
+                    className={classes.logoutButton}
+                  >
+                    <Button variant="contained" color="primary">
+                      Logout
+                    </Button>
+                  </MenuItem>
+                )}
               </Menu>
             </div>
           </Toolbar>