Resolve conflict
This commit is contained in:
+248
-145
@@ -1,166 +1,269 @@
|
||||
import { useEffect, useState, useCallback, useMemo } from "react";
|
||||
import { Navigate, Outlet, useLocation, useNavigate } from "react-router-dom";
|
||||
import usersService from "../services/UsersService";
|
||||
import LoadingSpinner from "../components/Spinners/LoadingSpinner";
|
||||
import { useCallback, useEffect, useMemo, useState } from "react";
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
import { Navigate, Outlet, useNavigate } from "react-router-dom";
|
||||
import LoadingSpinner from "../components/Spinners/LoadingSpinner";
|
||||
import formattedDate from "../lib/fomattedDate";
|
||||
import usersService from "../services/UsersService";
|
||||
import { commonHeadBanner } from "../store/CommonHeadBanner";
|
||||
import { updateUserDetails } from "../store/UserDetails";
|
||||
import { updateJobs } from "../store/jobLists";
|
||||
import { updateNotifications } from "../store/notifications";
|
||||
import { updateUserJobList } from "../store/userJobList";
|
||||
import { commonHeadBanner } from "../store/CommonHeadBanner";
|
||||
import { recentActivitiesData } from "../store/RecentActivitiesData";
|
||||
|
||||
const AuthRoute = ({ redirectPath = "/login", children }) => {
|
||||
const apiCall = useMemo(() => new usersService(), []);
|
||||
const dispatch = useDispatch();
|
||||
const [lastActivityTime, setLastActivityTime] = useState(Date.now());
|
||||
const [isLogin, setIsLogin] = useState({ loading: true, status: false });
|
||||
const [loadProfileDetails, setLoadProfileDetails] = useState([]);
|
||||
const navigate = useNavigate();
|
||||
const apiCall = useMemo(() => new usersService(), []);
|
||||
const dispatch = useDispatch();
|
||||
const [lastActivityTime, setLastActivityTime] = useState(Date.now());
|
||||
const [isLogin, setIsLogin] = useState({ loading: true, status: false });
|
||||
const [loadProfileDetails, setLoadProfileDetails] = useState([]);
|
||||
const navigate = useNavigate();
|
||||
|
||||
const { jobListTable } = useSelector((state) => state.tableReload);
|
||||
const { jobListTable } = useSelector((state) => state.tableReload);
|
||||
|
||||
const { userDetails:{username, uid} } = useSelector((state) => state?.userDetails); // CHECKS IF USER Details are avaliable, to determine if user is active
|
||||
const {
|
||||
userDetails: { username, uid },
|
||||
} = useSelector((state) => state?.userDetails); // CHECKS IF USER Details are avaliable, to determine if user is active
|
||||
|
||||
let loggedIn = username && uid ? true : false // variable to determine if user is logged in
|
||||
let loggedIn = username && uid ? true : false; // variable to determine if user is logged in
|
||||
|
||||
useEffect(() => {
|
||||
//Removing Data stored at localStorage after session expires
|
||||
const expireSession = () => {
|
||||
localStorage.removeItem("uid");
|
||||
localStorage.removeItem("member_id");
|
||||
localStorage.removeItem("session_token");
|
||||
navigate("/login", { replace: true }); // redirects user to login page after session expires
|
||||
};
|
||||
useEffect(() => {
|
||||
//Removing Data stored at localStorage after session expires
|
||||
const expireSession = () => {
|
||||
localStorage.removeItem("uid");
|
||||
localStorage.removeItem("member_id");
|
||||
localStorage.removeItem("session_token");
|
||||
navigate("/login", { replace: true }); // redirects user to login page after session expires
|
||||
};
|
||||
|
||||
const checkInactivity = setInterval(() => {
|
||||
let { account_type } = loadProfileDetails;
|
||||
if (account_type === "FAMILY") {
|
||||
if (
|
||||
Date.now() - lastActivityTime >
|
||||
process.env.REACT_APP_SESSION_EXPIRE_MINUTES_FAMILY
|
||||
) {
|
||||
expireSession();
|
||||
}
|
||||
} else {
|
||||
if (
|
||||
Date.now() - lastActivityTime >
|
||||
process.env.REACT_APP_SESSION_EXPIRE_MINUTES
|
||||
) {
|
||||
expireSession();
|
||||
}
|
||||
}
|
||||
}, process.env.REACT_APP_SESSION_EXPIRE_CHECKER); // Checks for inactivity every minute
|
||||
|
||||
// cleaning up listeners
|
||||
return () => {
|
||||
clearInterval(checkInactivity);
|
||||
};
|
||||
}, [lastActivityTime, navigate]);
|
||||
|
||||
// Reset last activity time on user input
|
||||
const resetTime = useCallback(() => {
|
||||
setLastActivityTime(Date.now());
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
window.addEventListener("mousemove", resetTime);
|
||||
window.addEventListener("keydown", resetTime);
|
||||
|
||||
return () => {
|
||||
window.removeEventListener("mousemove", resetTime);
|
||||
window.removeEventListener("keydown", resetTime);
|
||||
};
|
||||
}, [resetTime]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!loggedIn) {
|
||||
const loadProfile = () => {
|
||||
// function to load user profile
|
||||
setIsLogin({ loading: true, status: false });
|
||||
apiCall
|
||||
.loadProfile()
|
||||
.then((res) => {
|
||||
if (res.data.internal_return < 0) {
|
||||
setIsLogin({ loading: false, status: false });
|
||||
return;
|
||||
const checkInactivity = setInterval(() => {
|
||||
let { account_type } = loadProfileDetails;
|
||||
if (account_type === "FAMILY") {
|
||||
if (
|
||||
Date.now() - lastActivityTime >
|
||||
process.env.REACT_APP_SESSION_EXPIRE_MINUTES_FAMILY
|
||||
) {
|
||||
expireSession();
|
||||
}
|
||||
} else {
|
||||
if (
|
||||
Date.now() - lastActivityTime >
|
||||
process.env.REACT_APP_SESSION_EXPIRE_MINUTES
|
||||
) {
|
||||
expireSession();
|
||||
}
|
||||
}
|
||||
setLoadProfileDetails(res.data);
|
||||
dispatch(updateUserDetails({...res.data, loggedIn:true}));
|
||||
setIsLogin({ loading: false, status: true });
|
||||
})
|
||||
.catch((error) => {
|
||||
setIsLogin({ loading: false, status: false });
|
||||
});
|
||||
};
|
||||
loadProfile();
|
||||
}
|
||||
}, []);
|
||||
}, process.env.REACT_APP_SESSION_EXPIRE_CHECKER); // Checks for inactivity every minute
|
||||
|
||||
useEffect(() => {
|
||||
const getMyJobList = async () => {
|
||||
dispatch(updateUserJobList({ loading: true, data: [] }));
|
||||
try {
|
||||
const res = await apiCall.getMyJobList();
|
||||
// setMyJobList({loading: false, data:res.data})
|
||||
// setMyJobList(res.data);
|
||||
dispatch(updateUserJobList({ loading: false, data: res.data }));
|
||||
} catch (error) {
|
||||
dispatch(updateUserJobList({ loading: false, data: [] }));
|
||||
// setMyJobList({loading: false, data:[]})
|
||||
console.log("Error getting mode");
|
||||
}
|
||||
};
|
||||
getMyJobList();
|
||||
}, [jobListTable]);
|
||||
// cleaning up listeners
|
||||
return () => {
|
||||
clearInterval(checkInactivity);
|
||||
};
|
||||
}, [lastActivityTime, navigate]);
|
||||
|
||||
useEffect(() => {
|
||||
// Getting market data
|
||||
const getMarketActiveJobList = async () => {
|
||||
try {
|
||||
const res = await apiCall.getActiveJobList();
|
||||
dispatch(updateJobs(res.data));
|
||||
} catch (error) {
|
||||
console.log("Error getting mode");
|
||||
}
|
||||
};
|
||||
getMarketActiveJobList();
|
||||
}, [apiCall, dispatch]);
|
||||
// Reset last activity time on user input
|
||||
const resetTime = useCallback(() => {
|
||||
setLastActivityTime(Date.now());
|
||||
}, []);
|
||||
|
||||
//FUNCTION TO GET COMMON HEAD DATA
|
||||
useEffect(()=>{
|
||||
apiCall.getHeroJBanners().then((res) => {
|
||||
if (res.data.internal_return < 0) {
|
||||
return;
|
||||
}
|
||||
dispatch(commonHeadBanner(res.data));
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log('ERROR ', error)
|
||||
});
|
||||
},[])
|
||||
useEffect(() => {
|
||||
window.addEventListener("mousemove", resetTime);
|
||||
window.addEventListener("keydown", resetTime);
|
||||
|
||||
return () => {
|
||||
window.removeEventListener("mousemove", resetTime);
|
||||
window.removeEventListener("keydown", resetTime);
|
||||
};
|
||||
}, [resetTime]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!loggedIn) {
|
||||
const loadProfile = () => {
|
||||
// function to load user profile
|
||||
setIsLogin({ loading: true, status: false });
|
||||
apiCall
|
||||
.loadProfile()
|
||||
.then((res) => {
|
||||
if (res.data.internal_return < 0) {
|
||||
setIsLogin({ loading: false, status: false });
|
||||
return;
|
||||
}
|
||||
setLoadProfileDetails(res.data);
|
||||
dispatch(updateUserDetails({ ...res.data, loggedIn: true }));
|
||||
setIsLogin({ loading: false, status: true });
|
||||
})
|
||||
.catch((error) => {
|
||||
setIsLogin({ loading: false, status: false });
|
||||
});
|
||||
};
|
||||
loadProfile();
|
||||
}
|
||||
}, []);
|
||||
|
||||
// const filterNotifications = (notifications, filterType) => {
|
||||
// const currentDate = new Date();
|
||||
// if (filterType === "today") {
|
||||
// return notifications?.filter((notification) => {
|
||||
// const notificationDate = new Date(notification?.date);
|
||||
// console.log(notificationDate)
|
||||
// // return (
|
||||
// // notificationDate.getDate() === currentDate.getDate() &&
|
||||
// // notificationDate.getMonth() === currentDate.getMonth() &&
|
||||
// // notificationDate.getFullYear() === currentDate.getFullYear()
|
||||
// // );
|
||||
// });
|
||||
// } else if (filterType === "days") {
|
||||
// const sevenDaysAgo = new Date(currentDate);
|
||||
// sevenDaysAgo.setDate(currentDate.getDate() - 7);
|
||||
// return notifications?.filter((notification) => {
|
||||
// const notificationDate = new Date(notification?.date);
|
||||
// return notificationDate >= sevenDaysAgo;
|
||||
// });
|
||||
// } else {
|
||||
// return notifications;
|
||||
// }
|
||||
// };
|
||||
|
||||
useEffect(() => {
|
||||
if (!loggedIn) {
|
||||
const getNotifications = () => {
|
||||
// function to load user notification
|
||||
dispatch(updateNotifications({ loading: true }));
|
||||
apiCall
|
||||
.getMyNotifications()
|
||||
.then((res) => {
|
||||
if (res.data.internal_return < 0) {
|
||||
dispatch(updateNotifications({ loading: false }));
|
||||
return;
|
||||
}
|
||||
setLoadProfileDetails(res.data);
|
||||
|
||||
const _raw = res.data?.result_list;
|
||||
|
||||
//Sort the notifications in ascending order based on the API time
|
||||
const _sorted = _raw?.sort((a, b) => {
|
||||
const timeA = new Date(a?.date)?.getTime();
|
||||
const timeB = new Date(b?.date)?.getTime();
|
||||
return timeA - timeB;
|
||||
});
|
||||
|
||||
// header component
|
||||
const _header = _sorted?.slice(0, 5);
|
||||
// Notification Layout
|
||||
const _today = _sorted?.slice(0, 7);
|
||||
|
||||
const _days = () => {
|
||||
const sevenDaysAgo = new Date();
|
||||
sevenDaysAgo.setDate(new Date() - 7);
|
||||
return _sorted?.filter((notification) => {
|
||||
const notificationDate = new Date(
|
||||
formattedDate(notification?.date)
|
||||
);
|
||||
return notificationDate >= sevenDaysAgo;
|
||||
});
|
||||
};
|
||||
|
||||
// Dispatch all notifications, sorted, and recent based on their filter type
|
||||
dispatch(
|
||||
updateNotifications({
|
||||
loading: false,
|
||||
data: {
|
||||
raw: _raw,
|
||||
today: _today,
|
||||
// days: _days(),
|
||||
sort: _sorted,
|
||||
header: _header,
|
||||
},
|
||||
})
|
||||
);
|
||||
})
|
||||
.catch((error) => {
|
||||
dispatch(updateNotifications({ loading: false }));
|
||||
});
|
||||
};
|
||||
getNotifications();
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
const getMyJobList = async () => {
|
||||
dispatch(updateUserJobList({ loading: true, data: [] }));
|
||||
try {
|
||||
const res = await apiCall.getMyJobList();
|
||||
// setMyJobList({loading: false, data:res.data})
|
||||
// setMyJobList(res.data);
|
||||
dispatch(updateUserJobList({ loading: false, data: res.data }));
|
||||
} catch (error) {
|
||||
dispatch(updateUserJobList({ loading: false, data: [] }));
|
||||
// setMyJobList({loading: false, data:[]})
|
||||
console.log("Error getting mode");
|
||||
}
|
||||
};
|
||||
getMyJobList();
|
||||
}, [jobListTable]);
|
||||
|
||||
useEffect(() => {
|
||||
// Getting market data
|
||||
const getMarketActiveJobList = async () => {
|
||||
try {
|
||||
const res = await apiCall.getActiveJobList();
|
||||
dispatch(updateJobs(res.data));
|
||||
} catch (error) {
|
||||
console.log("Error getting mode");
|
||||
}
|
||||
};
|
||||
getMarketActiveJobList();
|
||||
}, [apiCall, dispatch]);
|
||||
|
||||
//FUNCTION TO GET COMMON HEAD DATA
|
||||
useEffect(()=>{
|
||||
apiCall.getHeroJBanners().then((res) => {
|
||||
if (res.data.internal_return < 0) {
|
||||
return;
|
||||
}
|
||||
dispatch(commonHeadBanner(res.data));
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log('ERROR ', error)
|
||||
});
|
||||
},[])
|
||||
//
|
||||
//FUNCTION TO GET COMMON HEAD DATA
|
||||
useEffect(()=>{
|
||||
apiCall.getRecentActivitiedData().then((res) => {
|
||||
// debugger;
|
||||
if (res.data?.internal_return < 0) {
|
||||
return;
|
||||
}
|
||||
dispatch(recentActivitiesData(res.data));
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log('ERROR ', error)
|
||||
});
|
||||
},[])
|
||||
//FUNCTION TO GET COMMON HEAD DATA
|
||||
useEffect(()=>{
|
||||
apiCall.getRecentActivitiedData().then((res) => {
|
||||
// debugger;
|
||||
if (res.data?.internal_return < 0) {
|
||||
return;
|
||||
}
|
||||
dispatch(recentActivitiesData(res.data));
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log('ERROR ', error)
|
||||
});
|
||||
},[])
|
||||
|
||||
return isLogin.loading && !loggedIn ? (
|
||||
<LoadingSpinner size="32" color="sky-blue" height="h-screen" />
|
||||
) :
|
||||
!isLogin.status && !loggedIn ? (
|
||||
<Navigate to={redirectPath} replace />
|
||||
) : (
|
||||
children || <Outlet />
|
||||
);
|
||||
// useEffect(() => {
|
||||
// apiCall
|
||||
// .getHeroJBanners()
|
||||
// .then((res) => {
|
||||
// if (res.data.internal_return < 0) {
|
||||
// return;
|
||||
// }
|
||||
// dispatch(commonHeadBanner(res.data));
|
||||
// })
|
||||
// .catch((error) => {
|
||||
// console.log("ERROR ", error);
|
||||
// });
|
||||
// }, []);
|
||||
//
|
||||
|
||||
return isLogin.loading && !loggedIn ? (
|
||||
<LoadingSpinner size="32" color="sky-blue" height="h-screen" />
|
||||
) : !isLogin.status && !loggedIn ? (
|
||||
<Navigate to={redirectPath} replace />
|
||||
) : (
|
||||
children || <Outlet />
|
||||
);
|
||||
};
|
||||
|
||||
export default AuthRoute;
|
||||
|
||||
@@ -0,0 +1,20 @@
|
||||
import { createSlice } from "@reduxjs/toolkit";
|
||||
|
||||
const initialState = {
|
||||
recentActivitiesData: {}
|
||||
};
|
||||
|
||||
export const recentActivitiesDataSlice = createSlice({
|
||||
name: "recentActivitiesData",
|
||||
initialState,
|
||||
reducers: {
|
||||
recentActivitiesData: (state,action) => {
|
||||
state.recentActivitiesData = {...action.payload}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
// Action creators are generated for each case reducer function
|
||||
export const { recentActivitiesData } = recentActivitiesDataSlice.actions;
|
||||
|
||||
export default recentActivitiesDataSlice.reducer;
|
||||
Reference in New Issue
Block a user