Fix logout with hard redirect -- dump state (#174)

src/api/index.ts

@@ -21,7 +21,7 @@ import {
 } from "./constants";
 import { ROUTE_LOGIN } from "src/router/routes";
 import {
-  SESS_UNAUTHORIZED,
+  SESS_FLASH_MSG,
   MSG_SESS_EXPIRED,
   MSG_SERVER_DOWN,
   MSG_SOMETHING_WRONG,
@@ -163,7 +163,7 @@ const handleBadRequest = (msg: string) => {
   sessionStorage.clear();
 
   if (window.location.pathname !== ROUTE_LOGIN) {
-    sessionStorage.setItem(SESS_UNAUTHORIZED, msg);
+    sessionStorage.setItem(SESS_FLASH_MSG, msg);
     window.location.href = ROUTE_LOGIN;
   }
 };

src/constants/index.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 
 export const TOAST_TIME = 3000;
-export const SESS_UNAUTHORIZED = "SESS_UNAUTHORIZED";
+export const SESS_FLASH_MSG = "SESS_FLASH_MSG";
 export const SESS_USER_SID = "SESS_USER_SID";
 export const SESS_OLD_PASSWORD = "SESS_OLD_PASSWORD";
 export const MSG_SESS_EXPIRED =

src/containers/internal/layout.tsx

@@ -5,10 +5,8 @@ import { Button, Icon, classNames } from "jambonz-ui";
 import { UserMe } from "./user-me";
 import { Navi } from "./navi";
 import { Icons } from "src/components";
-import { toastSuccess } from "src/store";
 import { useAuth } from "src/router/auth";
 import { useMobileMedia } from "src/utils";
-import { MSG_LOGGED_OUT } from "src/constants";
 
 import "./styles.scss";
 
@@ -19,7 +17,6 @@ export const Layout = () => {
 
   const handleLogout = () => {
     signout();
-    toastSuccess(MSG_LOGGED_OUT);
   };
 
   const handleMenu = () => {

src/containers/login/login.tsx

@@ -2,9 +2,13 @@ import React, { useEffect, useState } from "react";
 import { Button, H1 } from "jambonz-ui";
 import { useLocation, Navigate } from "react-router-dom";
 
-import { toastError, useSelectState } from "src/store";
+import { toastError, toastSuccess, useSelectState } from "src/store";
 import { useAuth } from "src/router/auth";
-import { SESS_UNAUTHORIZED, SESS_OLD_PASSWORD } from "src/constants";
+import {
+  SESS_FLASH_MSG,
+  SESS_OLD_PASSWORD,
+  MSG_LOGGED_OUT,
+} from "src/constants";
 import { Passwd, Message } from "src/components/forms";
 import {
   ROUTE_INTERNAL_ACCOUNTS,
@@ -31,10 +35,12 @@ export const Login = () => {
 
   /** "Flash" a session message when booted from the app */
   useEffect(() => {
-    const unauthorized = sessionStorage.getItem(SESS_UNAUTHORIZED);
+    const flashMsg = sessionStorage.getItem(SESS_FLASH_MSG);
 
-    if (unauthorized) {
-      toastError(unauthorized);
+    if (flashMsg) {
+      const toastMethod =
+        flashMsg === MSG_LOGGED_OUT ? toastSuccess : toastError;
+      toastMethod(flashMsg);
       sessionStorage.clear();
     }
   }, []);

src/router/auth.tsx

@@ -15,6 +15,8 @@ import {
 import {
   SESS_OLD_PASSWORD,
   SESS_USER_SID,
+  SESS_FLASH_MSG,
+  MSG_LOGGED_OUT,
   MSG_INCORRECT_CREDS,
   MSG_SOMETHING_WRONG,
   MSG_SERVER_DOWN,
@@ -136,7 +138,8 @@ export const useProvideAuth = (): AuthStateContext => {
   const signout = () => {
     localStorage.clear();
     sessionStorage.clear();
-    navigate(ROUTE_LOGIN);
+    sessionStorage.setItem(SESS_FLASH_MSG, MSG_LOGGED_OUT);
+    window.location.href = ROUTE_LOGIN;
   };
 
   return {