Navegação entre paginas do dasheboard fica bloqueada

Bom dia a todos

Estou desenvolvendo uma aplicação em react utilizando o firebase para autenticação.

Tenho um componente RequireAuth para as Rotas que é necessario login e no componente AppRouter fica da seguinte forma nas Route
<Route element={<RequireAuth><Profile /></RequireAuth> } path="meu-perfil" exact></Route>

Meu problema é que no meu dasheboard no menu de navegação ao passar para outra pagina o aplicativo fica completamente bloqueado

No RequireAuth se retiro setLoaded(1); no AuthenticationService.observeStatus ja funciona a navegação entre paginas mas caso o usuario nao esteja logado não redireciona para /login e a pagina fica em branco

Me podem ajudar com esse problema?

Este é o codigo do componente RequireAuth

function RequireAuth({ children }) {
const location = useLocation();

const { logged } = useSelector((state) => state.authUserData);
const [loaded, setLoaded] = useState(0);

AuthenticationService.observeStatus(() => {
setLoaded(1);
});

if (logged) return children;

if (loaded)
return <Navigate to="/login" state={{ from: location }} replace />;
}

export default RequireAuth;