[#475] fixed calendars selection persistence (#479)

src/components/Calendar/Calendar.tsx

@@ -13,6 +13,7 @@ import {
 } from "@/utils/dateUtils";
 import { extractEventBaseUuid } from "@/utils/extractEventBaseUuid";
 import { setSelectedCalendars as setSelectedCalendarsToStorage } from "@/utils/storage/setSelectedCalendars";
+import { useSelectedCalendars } from "@/utils/storage/useSelectedCalendars";
 import { browserDefaultTimeZone } from "@/utils/timezone";
 import { CalendarApi, DateSelectArg } from "@fullcalendar/core";
 import frLocale from "@fullcalendar/core/locales/fr";
@@ -76,11 +77,14 @@ export default function CalendarApp({
     (state) => state.settings.hideDeclinedEvents
   );
   const calendars = useAppSelector((state) => state.calendars.list);
+  const isPending = useAppSelector((state) => state.calendars.pending);
   const displayWeekNumbers = useAppSelector(
     (state) => state.settings.displayWeekNumbers
   );
   const tempcalendars = useAppSelector((state) => state.calendars.templist);
-  const [selectedCalendars, setSelectedCalendars] = useState<string[]>([]);
+  const storedCalendars = useSelectedCalendars();
+  const [selectedCalendars, setSelectedCalendars] =
+    useState<string[]>(storedCalendars);
 
   const calendarLightSignature = useMemo(() => {
     return Object.values(calendars || {})
@@ -253,6 +257,8 @@ export default function CalendarApp({
   }, [rangeKey]);
 
   useEffect(() => {
+    if (isPending) return;
+
     if (!rangeKey || sortedSelectedCalendars.length === 0) {
       activeLoadCompletedRef.current = true;
       setActiveLoadCompleted(true);
@@ -320,8 +326,7 @@ export default function CalendarApp({
   }, [dispatch, rangeKey, sortedSelectedCalendars, rangeStart, rangeEnd]);
 
   useEffect(() => {
-    if (!rangeKey || !activeLoadCompleted) return;
-
+    if (!rangeKey || !activeLoadCompleted || isPending) return;
     const hiddenCalendars = calendarIds
       .filter((id) => !selectedCalendars.includes(id))
       .filter((id) => {
@@ -355,6 +360,7 @@ export default function CalendarApp({
     rangeStart,
     rangeEnd,
     activeLoadCompleted,
+    isPending,
   ]);
 
   const calendarsWithClearedCache = useMemo(() => {
@@ -369,6 +375,7 @@ export default function CalendarApp({
   const processedCacheClearRef = useRef<Record<string, number>>({});
 
   useEffect(() => {
+    if (isPending) return;
     calendarsWithClearedCache.forEach(({ id, cleared }) => {
       if (processedCacheClearRef.current[id] === cleared) {
         return;
@@ -397,7 +404,14 @@ export default function CalendarApp({
           prefetchedCalendarsRef.current[id] = "";
         });
     });
-  }, [calendarsWithClearedCache, dispatch, rangeKey, rangeStart, rangeEnd]);
+  }, [
+    calendarsWithClearedCache,
+    dispatch,
+    rangeKey,
+    rangeStart,
+    rangeEnd,
+    isPending,
+  ]);
 
   useEffect(() => {
     const currentIds = new Set(tempCalendarIds);