session timeout after 7 minutes of inactivity

src/_digifi/partials/layout/header-menus/HeaderUserMenu.tsx

@@ -1,4 +1,4 @@
-import { FC } from 'react';
+import { FC, useEffect } from 'react';
 import { Link } from 'react-router-dom';
 import { useAuth } from '../../../../app/modules/auth';
 import { Languages } from './Languages';
@@ -6,6 +6,43 @@ import { toAbsoluteUrl } from '../../../helpers';
 
 const HeaderUserMenu: FC = () => {
   const { currentUser, logout } = useAuth();
+
+  // Listen for user activity and trigger logout
+  useEffect(() => {
+    let timeout: number;
+    const inactiveTime: number = 7 * 60 * 1000; //default inactive period (milliseconds)
+    // Logout user after inactiveTime minutes of inactivity
+    const resetTimeout = () => {
+      clearTimeout(timeout);
+      // Set logout timeout
+      timeout = window.setTimeout(() => {
+        logout();
+      }, inactiveTime);
+      // console.log('===> Current time: ' + timeout);
+    };
+
+    const handleUserActivity: any = () => {
+      resetTimeout(); // Extend session on user activity
+    };
+
+    document.addEventListener('mousemove', handleUserActivity);
+    document.addEventListener('keydown', handleUserActivity);
+    document.addEventListener('click', handleUserActivity);
+    document.addEventListener('focus', handleUserActivity);
+
+    // Initialize timeout
+    resetTimeout();
+
+    // Remove event listeners on unmount
+    return () => {
+      clearTimeout(timeout);
+      document.removeEventListener('mousemove', handleUserActivity);
+      document.removeEventListener('keydown', handleUserActivity);
+      document.removeEventListener('click', handleUserActivity);
+      document.removeEventListener('focus', handleUserActivity);
+    };
+  }, [logout]);
+
   return (
     <div
       className="menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-600 menu-state-bg menu-state-primary fw-bold py-4 fs-6 w-275px"