Merge pull request #911 from bluewave-labs/feat/logout-user-on-jwt-expire

Feat/logout user on jwt expire

Client/src/Utils/NetworkService.js

@@ -1,10 +1,14 @@
 import axios from "axios";
 const BASE_URL = import.meta.env.VITE_APP_API_BASE_URL;
 const FALLBACK_BASE_URL = "http://localhost:5000/api/v1";
+import { clearAuthState } from "../Features/Auth/authSlice";
+import { clearUptimeMonitorState } from "../Features/UptimeMonitors/uptimeMonitorsSlice";
 import { logger } from "./Logger";
 class NetworkService {
-  constructor(store) {
+  constructor(store, dispatch, navigate) {
     this.store = store;
+    this.dispatch = dispatch;
+    this.navigate = navigate;
     let baseURL = BASE_URL;
     this.axiosInstance = axios.create();
     this.setBaseUrl(baseURL);
@@ -22,9 +26,10 @@ class NetworkService {
     this.axiosInstance.interceptors.response.use(
       (response) => response,
       (error) => {
-        logger.error(error);
         if (error.response && error.response.status === 401) {
-          logger.error("Invalid token received");
+          dispatch(clearAuthState());
+          dispatch(clearUptimeMonitorState());
+          navigate("/login");
         }
         return Promise.reject(error);
       }
@@ -688,3 +693,10 @@ class NetworkService {
 }
 
 export default NetworkService;
+
+let networkService;
+
+export const setNetworkService = (service) => {
+  networkService = service;
+};
+export { networkService };

Client/src/Utils/NetworkServiceProvider.jsx

@@ -0,0 +1,15 @@
+import { useDispatch } from "react-redux";
+import { useNavigate } from "react-router";
+import { setNetworkService } from "./NetworkService";
+import NetworkService from "./NetworkService";
+import { store } from "../store";
+
+const NetworkServiceProvider = ({ children }) => {
+  const dispatch = useDispatch();
+  const navigate = useNavigate();
+  const networkService = new NetworkService(store, dispatch, navigate);
+  setNetworkService(networkService);
+  return children;
+};
+
+export default NetworkServiceProvider;

Client/src/main.jsx

@@ -1,18 +1,21 @@
-import React from "react";
 import ReactDOM from "react-dom/client";
 import App from "./App.jsx";
 import "./index.css";
-import { BrowserRouter as Router, HashRouter } from "react-router-dom";
+import { BrowserRouter as Router } from "react-router-dom";
 import { Provider } from "react-redux";
 import { persistor, store } from "./store";
 import { PersistGate } from "redux-persist/integration/react";
-import NetworkService from "./Utils/NetworkService.js";
-export const networkService = new NetworkService(store);
+import NetworkServiceProvider from "./Utils/NetworkServiceProvider.jsx";
+import { networkService } from "./Utils/NetworkService";
+export { networkService };
+
 ReactDOM.createRoot(document.getElementById("root")).render(
   <Provider store={store}>
     <PersistGate loading={null} persistor={persistor}>
       <Router>
-        <App />
+        <NetworkServiceProvider>
+          <App />
+        </NetworkServiceProvider>
       </Router>
     </PersistGate>
   </Provider>

Server/middleware/verifyJWT.js

@@ -38,6 +38,11 @@ const verifyJWT = (req, res, next) => {
   const { jwtSecret } = req.settingsService.getSettings();
   jwt.verify(parsedToken, jwtSecret, (err, decoded) => {
     if (err) {
+      if (err.name === "TokenExpiredError") {
+        res
+          .status(401)
+          .json({ success: false, msg: errorMessages.EXPIRED_AUTH_TOKEN });
+      }
       return res
         .status(401)
         .json({ success: false, msg: errorMessages.INVALID_AUTH_TOKEN });

Server/utils/messages.js

@@ -12,6 +12,7 @@ const errorMessages = {
   UNKNOWN_SERVICE: "Unknown service",
   NO_AUTH_TOKEN: "No auth token provided",
   INVALID_AUTH_TOKEN: "Invalid auth token",
+  EXPIRED_AUTH_TOKEN: "Token expired",
 
   //Ownership Middleware
   VERIFY_OWNER_NOT_FOUND: "Document not found",
@@ -93,7 +94,8 @@ const successMessages = {
 
   //Maintenance Window Controller
   MAINTENANCE_WINDOW_CREATE: "Maintenance Window created successfully",
-  MAINTENANCE_WINDOW_GET_BY_USER: "Got Maintenance Windows by User successfully",
+  MAINTENANCE_WINDOW_GET_BY_USER:
+    "Got Maintenance Windows by User successfully",
 
   //Ping Operations
   PING_SUCCESS: "Success",