drop down fix

This commit is contained in:
victorAnumudu
2024-12-07 07:10:08 +01:00
parent 73ca831e1a
commit 943818aafa
8 changed files with 111 additions and 19 deletions
+67 -1
View File
@@ -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(()=>{
+9 -10
View File
@@ -37,10 +37,10 @@ export default function UserHeader(){
{/* ul className="navbar-nav nav-right ml-auto dropdown" */}
<ul className="navbar-nav nav-right ml-auto">
{/* <li className="nav-item dropdown">
<a className="nav-link dropdown-toggle" href="#" id="navbarDropdown2" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<a href="#" className="nav-link dropdown-toggle" role="button" id="dropdownMenuLink" data-bs-toggle="dropdown" aria-expanded="false">
<i className="ti ti-email"></i>
</a>
<div className="dropdown-menu extended animated fadeIn" aria-labelledby="navbarDropdown">
<div className="dropdown-menu extended animated fadeIn" aria-labelledby="dropdownMenuLink">
<ul>
<li className="dropdown-header bg-gradient p-4 text-white text-left">Messages
<label className="label label-info label-round">6</label>
@@ -134,16 +134,16 @@ export default function UserHeader(){
</li>
</ul>
</div>
</li>
<li className="nav-item dropdown">
<a className="nav-link dropdown-toggle" href="#" id="navbarDropdown3" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
</li> */}
{/* <li className="nav-item dropdown">
<a href="#" className="nav-link dropdown-toggle" role="button" id="dropdownMenuLink" data-bs-toggle="dropdown" aria-expanded="false">
<i className="fe fe-bell"></i>
<span className="notify">
<span className="blink"></span>
<span className="dot"></span>
</span>
</a>
<div className="dropdown-menu extended animated fadeIn" aria-labelledby="navbarDropdown">
<div className="dropdown-menu extended animated fadeIn" aria-labelledby="dropdownMenuLink">
<ul>
<li className="dropdown-header bg-gradient p-4 text-white text-left">Notifications
<a href="#" className="float-right btn btn-square btn-inverse-light btn-xs m-0">
@@ -234,8 +234,8 @@ export default function UserHeader(){
</li>
</ul>
</div>
</li>
<li className="nav-item">
</li> */}
{/* <li className="nav-item">
<a className="nav-link search" href="#">
<i className="ti ti-search"></i>
</a>
@@ -254,8 +254,7 @@ export default function UserHeader(){
</div>
</div>
</li> */}
<li className="nav-item user-profile dropdown">
<li className="nav-item user-profile">
<a href="#" className="nav-link dropdown-toggle" role="button" id="dropdownMenuLink" data-bs-toggle="dropdown" aria-expanded="false">
<img src={getImage('avtar/02.jpg')} alt="avtar-img" />
<span className="bg-success user-status"></span>