20 lines
663 B
TypeScript
20 lines
663 B
TypeScript
import { JSX, useLayoutEffect } from 'react';
|
|
import { useDispatch, useSelector } from "react-redux";
|
|
import { fetchUserDetails } from '../../store/slices/userSlice';
|
|
import { AppDispatch, RootState } from '../../store/store';
|
|
|
|
const ProtectedRoute = ({ children }: { children: JSX.Element }) => {
|
|
const dispatch = useDispatch<AppDispatch>();
|
|
const user = useSelector((state: RootState) => state.user);
|
|
|
|
useLayoutEffect(() => {
|
|
// Fetch only if we don't have user data yet
|
|
if (user.id == null && user.loading == false) {
|
|
dispatch(fetchUserDetails());
|
|
}
|
|
}, [dispatch, user, status]);
|
|
|
|
return children;
|
|
};
|
|
|
|
export default ProtectedRoute; |