refactor: stabilize calendar loading effects and menubar redirect
- Memoize calendar range strings and stabilize effect deps - Guard updateDarkColor to avoid dispatch loops - Add resilient cache-clear handling with refs - Memoize calendar/temp ids to prevent rerenders - Update event handler hooks with missing deps - Add guards and dependency fixes across Calendar effects
This commit is contained in:
committed by
Benoit TELLIER
parent
990e290066
commit
ffe204d60b
@@ -1,4 +1,4 @@
|
||||
import React, { useEffect } from "react";
|
||||
import React, { useEffect, useRef } from "react";
|
||||
import { useAppDispatch, useAppSelector } from "../../app/hooks";
|
||||
import { Auth } from "./oidcAuth";
|
||||
import { Loading } from "../../components/Loading/Loading";
|
||||
@@ -11,41 +11,50 @@ export function HandleLogin() {
|
||||
const userData = useAppSelector((state) => state.user);
|
||||
const calendars = useAppSelector((state) => state.calendars);
|
||||
const dispatch = useAppDispatch();
|
||||
const hasInitiatedRef = useRef(false);
|
||||
const calendarsLoadingRef = useRef(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (hasInitiatedRef.current) return;
|
||||
if (userData.userData) return;
|
||||
if (Object.keys(calendars.list).length > 0) return;
|
||||
if (calendarsLoadingRef.current) return;
|
||||
|
||||
hasInitiatedRef.current = true;
|
||||
const initiateLogin = async () => {
|
||||
if (!userData.userData) {
|
||||
const savedToken = sessionStorage.getItem("tokenSet")
|
||||
? JSON.parse(sessionStorage.getItem("tokenSet")!)
|
||||
: null;
|
||||
const savedUser = sessionStorage.getItem("userData")
|
||||
? JSON.parse(sessionStorage.getItem("userData")!)
|
||||
: null;
|
||||
const savedToken = sessionStorage.getItem("tokenSet")
|
||||
? JSON.parse(sessionStorage.getItem("tokenSet")!)
|
||||
: null;
|
||||
const savedUser = sessionStorage.getItem("userData")
|
||||
? JSON.parse(sessionStorage.getItem("userData")!)
|
||||
: null;
|
||||
|
||||
if (savedToken && savedUser) {
|
||||
dispatch(setTokens(savedToken));
|
||||
dispatch(setUserData(savedUser));
|
||||
await dispatch(getOpenPaasUserDataAsync());
|
||||
await dispatch(getCalendarsListAsync());
|
||||
dispatch(push("/calendar"));
|
||||
return;
|
||||
}
|
||||
|
||||
const loginurl = await Auth();
|
||||
|
||||
sessionStorage.setItem(
|
||||
"redirectState",
|
||||
JSON.stringify({
|
||||
code_verifier: loginurl.code_verifier,
|
||||
state: loginurl.state,
|
||||
})
|
||||
);
|
||||
|
||||
redirectTo(loginurl.redirectTo);
|
||||
if (savedToken && savedUser) {
|
||||
dispatch(setTokens(savedToken));
|
||||
dispatch(setUserData(savedUser));
|
||||
await dispatch(getOpenPaasUserDataAsync());
|
||||
calendarsLoadingRef.current = true;
|
||||
await dispatch(getCalendarsListAsync());
|
||||
calendarsLoadingRef.current = false;
|
||||
dispatch(push("/calendar"));
|
||||
return;
|
||||
}
|
||||
|
||||
const loginurl = await Auth();
|
||||
|
||||
sessionStorage.setItem(
|
||||
"redirectState",
|
||||
JSON.stringify({
|
||||
code_verifier: loginurl.code_verifier,
|
||||
state: loginurl.state,
|
||||
})
|
||||
);
|
||||
|
||||
redirectTo(loginurl.redirectTo);
|
||||
};
|
||||
|
||||
initiateLogin();
|
||||
}, [userData, dispatch]);
|
||||
}, [userData.userData, calendars.list, dispatch]);
|
||||
useEffect(() => {
|
||||
if (userData.error) {
|
||||
dispatch(push("/error"));
|
||||
@@ -53,7 +62,7 @@ export function HandleLogin() {
|
||||
if (!calendars.pending && !userData.loading && !userData.error) {
|
||||
dispatch(push("/calendar"));
|
||||
}
|
||||
}, [calendars.pending, userData.loading]);
|
||||
}, [calendars.pending, userData.loading, userData.error, dispatch]);
|
||||
return <Loading />;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { useEffect, useRef } from "react";
|
||||
import { Callback } from "./oidcAuth";
|
||||
import { useAppDispatch } from "../../app/hooks";
|
||||
import { useAppDispatch, useAppSelector } from "../../app/hooks";
|
||||
import { push } from "redux-first-history";
|
||||
import { getOpenPaasUserDataAsync, setTokens, setUserData } from "./userSlice";
|
||||
import { Loading } from "../../components/Loading/Loading";
|
||||
@@ -9,6 +9,7 @@ import { getCalendarsListAsync } from "../Calendars/CalendarSlice";
|
||||
export function CallbackResume() {
|
||||
const dispatch = useAppDispatch();
|
||||
const hasRun = useRef(false);
|
||||
const calendarsLoadingRef = useRef(false);
|
||||
const saved = sessionStorage.getItem("redirectState")
|
||||
? JSON.parse(sessionStorage.getItem("redirectState")!)
|
||||
: null;
|
||||
@@ -23,7 +24,11 @@ export function CallbackResume() {
|
||||
dispatch(setUserData(data?.userinfo));
|
||||
dispatch(setTokens(data?.tokenSet));
|
||||
await dispatch(getOpenPaasUserDataAsync());
|
||||
await dispatch(getCalendarsListAsync());
|
||||
if (!calendarsLoadingRef.current) {
|
||||
calendarsLoadingRef.current = true;
|
||||
await dispatch(getCalendarsListAsync());
|
||||
calendarsLoadingRef.current = false;
|
||||
}
|
||||
|
||||
sessionStorage.removeItem("redirectState");
|
||||
sessionStorage.setItem("tokenSet", JSON.stringify(data?.tokenSet));
|
||||
|
||||
Reference in New Issue
Block a user