MERMS/MermsPanelReactJS
1
0
Fork 0
Code Issues Pull Requests 1 Releases Activity

user header name added

Browse Source
This commit is contained in:
victorAnumudu
2024-12-11 21:56:41 +01:00
parent b3dab25fa9
commit ff7e1d9b3e
4 changed files with 80 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/component/auth/Login2.jsx
+2 -2
View File
@@ -38,8 +38,8 @@ export default function Login() {
const {token} = res?.data?.data
if(token){
localStorage.setItem('token', token)
const data = {token}
dispatch(updateUserDetails({ ...data }));
// const data = {token}
// dispatch(updateUserDetails({ ...data }));
navigate('/dash') // later add redux to dispatch state
}
}
src/component/authorization/UserExist.jsx
+34 -18
View File
@@ -7,6 +7,7 @@ import Layout from '../layout/Layout'
import siteLinks from '../../links/siteLinks'
import debounceFunction from '../../utils/debounceFunction'
import { accountDashboard } from '../../services/services';
export default function UserExist() {
@@ -19,9 +20,9 @@ export default function UserExist() {
const [lastActivityTime, setLastActivityTime] = useState(Date.now()); // HOLDS THE INITIAL TIME USER LOGS IN
const { userDetails: { token }} = useSelector((state) => state?.userDetails); // CHECKS IF USER Details are avaliable, to determine if user is active
const { userDetails: { lastname }} = useSelector((state) => state?.userDetails); // CHECKS IF USER Details are avaliable, to determine if user is active
let loggedIn = token ? true : false; // variable to determine if user is logged in
let loggedIn = lastname ? true : false; // variable to determine if user is logged in
// console.log('loggedIn', loggedIn)
// Function to log the user out
@@ -57,25 +58,40 @@ export default function UserExist() {
})
}
},[lastActivityTime])
useEffect(()=>{
let token = localStorage.getItem('token')
const timer = setTimeout(()=>{
if(token && loggedIn){
setLoading(false)
}else if(token && !loggedIn){
const data = {token}
dispatch(updateUserDetails({ ...data }));
setLoading(false)
// dispatch(updateUserDetails({ ...res.data }));
}else{
navigate('auth/login')
}
},1000)
return () => clearTimeout(timer)
if(!token){
return navigate(siteLinks.login)
}
accountDashboard().then(res => {
const {dash_data} = res?.data
setLoading(false)
dispatch(updateUserDetails({ ...dash_data }));
}).catch(err => {
navigate(siteLinks.login)
})
},[])
// useEffect(()=>{
// let token = localStorage.getItem('token')
// const timer = setTimeout(()=>{
// if(token && loggedIn){
// setLoading(false)
// }else if(token && !loggedIn){
// const data = {token}
// dispatch(updateUserDetails({ ...data }));
// setLoading(false)
// // dispatch(updateUserDetails({ ...res.data }));
// }else{
// navigate('auth/login')
// }
// },1000)
// return () => clearTimeout(timer)
// },[])
return (
<>
src/component/home/HomeSections.jsx
+29 -29
View File
@@ -1,40 +1,40 @@
import React from "react";
import BreadcrumbComBS from "../breadcrumb/BreadcrumbComBS";
import { useQuery } from "@tanstack/react-query";
import { accountDashboard } from "../../services/services";
import queryKeys from "../../services/queryKeys";
import MainLoaderBS from "../loaders/MainLoaderBS";
// import { useQuery } from "@tanstack/react-query";
// import { accountDashboard } from "../../services/services";
// import queryKeys from "../../services/queryKeys";
// import MainLoaderBS from "../loaders/MainLoaderBS";
export default function HomeSections(){
const {data:dashData, isFetching, isError} = useQuery({
queryKey: queryKeys.dashboard,
queryFn: async () => await accountDashboard()
})
// const {data:dashData, isFetching, isError} = useQuery({
// queryKey: queryKeys.dashboard,
// queryFn: async () => await accountDashboard()
// })
if(isFetching){
return(
<>
{/* <MainLoaderBS /> */}
<div className="row">
<div className="col-12">
<p className='text-success'>Loading...</p>
</div>
</div>
</>
)
}
// if(isFetching){
// return(
// <>
// {/* <MainLoaderBS /> */}
// <div className="row">
// <div className="col-12">
// <p className='text-success'>Loading...</p>
// </div>
// </div>
// </>
// )
// }
if(isError){
return (
<div className="row">
<div className="col-12">
<p className='text-danger'>Error occured! Please refresh to continue</p>
</div>
</div>
)
}
// if(isError){
// return (
// <div className="row">
// <div className="col-12">
// <p className='text-danger'>Error occured! Please refresh to continue</p>
// </div>
// </div>
// )
// }
return <>
{/* <div className="row">
src/component/layout/layoutcom/UserHeader.jsx
+15 -10
View File
@@ -1,10 +1,14 @@
import React from "react";
import getImage from "../../../utils/getImage";
import { useNavigate } from "react-router-dom";
import { useSelector } from "react-redux";
import siteLinks from "../../../links/siteLinks";
export default function UserHeader(){
const { userDetails } = useSelector((state) => state?.userDetails); // CHECKS IF USER Details are avaliable, to determine if user is active
const toggleSidebar = (e) => {
e.preventDefault()
document.body.classList.toggle('sidebar-toggled')
@@ -23,7 +27,7 @@ export default function UserHeader(){
const logout = () => {
localStorage.clear()
navigate('/login', {replace: true})
navigate(siteLinks.login, {replace: true})
}
return (
@@ -42,20 +46,21 @@ export default function UserHeader(){
<i className="ti ti-align-left"></i>
</button>
<div className="collapse navbar-collapse" id="navbarSupportedContent">
<div className="navigation d-flex">
{/* <ul className="navbar-nav nav-left">
<li className="nav-item">
<div className="navigation d-flex align-items-center">
<ul className="navbar-nav nav-left">
<h4 className="text-info pt-1">{userDetails?.account_name}</h4>
{/* <li className="nav-item">
<a href="#" className="nav-link sidebar-toggle">
<i className="ti ti-align-right"></i>
</a>
</li>
</li> */}
<li className="nav-item full-screen d-none d-lg-block" id="btnFullscreen">
{/* <li className="nav-item full-screen d-none d-lg-block" id="btnFullscreen">
<a href="#" className="nav-link expand">
<i className="icon-size-fullscreen"></i>
</a>
</li>
</ul> */}
</li> */}
</ul>
<ul className="navbar-nav nav-right ml-auto">
{/* <li className="nav-item dropdown">
@@ -285,8 +290,8 @@ export default function UserHeader(){
<div className="bg-gradient px-4 py-3">
<div className="d-flex align-items-center justify-content-between">
<div className="mr-1">
<h4 className="text-white mb-0">Alice Williams</h4>
<small className="text-white">Henry@example.com</small>
<h5 className="text-white mb-0">{userDetails?.firstname} {userDetails?.lastname}</h5>
<small className="text-white">{userDetails.email}</small>
</div>
<a href="#" onClick={logout} className="text-white font-20 tooltip-wrapper" data-toggle="tooltip"
data-placement="top" title="" data-original-title="Logout"> <i