drop down fix

src/component/authorization/UserExist.jsx

@@ -1,12 +1,78 @@
 import React, { useEffect, useState } from 'react'
-import { Outlet } from 'react-router-dom'
+import { Outlet, useNavigate } from 'react-router-dom'
 import MainLoaderBS from '../loaders/MainLoaderBS'
 import Layout from '../layout/Layout'
+import siteLinks from '../../links/siteLinks'
+
+import debounceFunction from '../../utils/debounceFunction'
 
 
 export default function UserExist() {
 
+    const navigate = useNavigate()
+  
     const [loading, setLoading] = useState(true)
+    
+    const [lastActivityTime, setLastActivityTime] = useState(Date.now()); // HOLDS THE INITIAL TIME USER LOGS IN
+  
+    // Function to log the user out
+    const logoutUser = () => {
+      localStorage.clear()
+      navigate(siteLinks.login)
+    };
+  
+    // Function to reset the activity time
+    const resetTimer = () => {
+      debounceFunction(setLastActivityTime(Date.now()), 1000)
+    };
+
+    useEffect(()=>{
+      const timer = setTimeout(()=>{
+        if(Date.now() - Number(lastActivityTime) >= Number(process.env.REACT_APP_TIMEOUT)){
+          logoutUser()
+        }
+      }, Number(process.env.REACT_APP_TIMEOUT))
+
+      // Listen for activity events
+      const events = ['mousemove', 'keydown', 'click', 'scroll', 'touchstart'];
+
+      // Adding event listeners
+      events.forEach(event => {
+        window.addEventListener(event, resetTimer);
+      });
+      
+      return () => {
+        clearTimeout(timer)
+        events.forEach(event => {
+          window.removeEventListener(event, resetTimer);
+        })
+      }
+    },[lastActivityTime])
+  
+    // Setting up event listeners for user activity
+    // useEffect(() => {
+    //   // Listen for activity events
+    //   const events = ['mousemove', 'keydown', 'click', 'scroll', 'touchstart'];
+  
+    //   // Adding event listeners
+    //   events.forEach(event => {
+    //     window.addEventListener(event, resetTimer);
+    //   });
+  
+    //   // Start the timer initially
+    //   // resetTimer();
+  
+    //   // Cleanup event listeners when the component unmounts
+    //   return () => {
+    //     events.forEach(event => {
+    //       window.removeEventListener(event, resetTimer);
+    //     });
+    //     // if (timer) {
+    //     //   clearTimeout(timer);
+    //     //   setTimer(null);
+    //     // }
+    //   };
+    // }, []);
   
     useEffect(()=>{
       const timer = setTimeout(()=>{