Issue #58 - Premature session timeouts - Kazakh feedback

src/App.jsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useState, useCallback } from "react";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { ToastContainer } from "react-toastify";
 import { Root } from "./routes";
@@ -35,16 +35,6 @@ function App() {
     once: false,
   });
 
-  useEffect(() => {
-    window.addEventListener("beforeunload", (e) => {
-      if (!(performance.getEntriesByType("navigation")[0].type === "reload")) {
-        // If the page is being refreshed, do nothing
-        e.preventDefault();
-        userSvc.logout();
-      }
-    });
-  }, []);
-
   const getDefaultTheme = () => {
     const localStorageTheme = localStorage.getItem("default-theme");
     return localStorageTheme || "light";
@@ -56,6 +46,18 @@ function App() {
     localStorage.setItem("default-theme", theme);
   }, [theme]);
 
+  const logoutFunction = useCallback(() => {
+    userSvc.logout();
+  }, []);
+
+  useEffect(() => {
+    const existingSession = sessionStorage.getItem("userSession");
+
+    if (!existingSession) {
+      logoutFunction();
+    }
+  }, []);
+
   return (
     <ThemeContext.Provider value={{ theme, setTheme }}>
       <div className={`theme-${theme}`}>

src/pages/Login/Login.jsx

@@ -113,6 +113,7 @@ export const Login = () => {
       localStorage.setItem("token", token);
       localStorage.setItem("token-expires-in", expiresIn);
       localStorage.setItem("refresh-token", refreshToken);
+      sessionStorage.setItem("userSession", true);
 
       queryClient.invalidateQueries({ queryKey: ["provider-data"] });