@wasto/cms-components 1.5.10 → 1.5.11

package/src/contexts/ChallengesContext.tsx

@@ -1,182 +1,182 @@
-import {
-    createContext,
-    PropsWithChildren,
-    useCallback,
-    useContext,
-    useEffect,
-    useMemo,
-    useState,
-    type ReactNode,
-} from "react";
-import { useLocal } from "./LocalContext";
-import { useWastoClient } from "../hooks/useWastoClient";
-import type {
-    AcquiredBadge,
-    Challenge,
-    ChallengeWithProgress,
-    UseChallengesResult,
-    UserProgress,
-} from "../hooks/useChallenges";
-
-const ChallengesContext = createContext<UseChallengesResult | undefined>(undefined);
-
-export type ChallengesProviderProps = PropsWithChildren & {
-    pageSize?: number;
-};
-
-/**
- * Shared challenges + progress store so Challenge, ChallengeVignette and QuizModal
- * all see the same data after a quiz completion refetch.
- */
-export function ChallengesProvider({
-    children,
-    pageSize = 100,
-}: ChallengesProviderProps): ReactNode {
-    const { selectedCityId, deviceId } = useLocal();
-    const client = useWastoClient();
-
-    const [rawChallenges, setRawChallenges] = useState<Challenge[]>([]);
-    const [userProgress, setUserProgress] = useState<UserProgress[]>([]);
-    const [isLoading, setIsLoading] = useState(false);
-    const [error, setError] = useState<string | null>(null);
-
-    const fetchChallenges = useCallback(async () => {
-        if (!selectedCityId) {
-            setRawChallenges([]);
-            setUserProgress([]);
-            setIsLoading(false);
-            setError(null);
-            return;
-        }
-
-        try {
-            setIsLoading(true);
-            setError(null);
-            const [challengesRes, progressRes] = await Promise.all([
-                client.public.cities.getChallenges(selectedCityId, { pageSize }),
-                deviceId ? client.public.challenges.getProgress(deviceId) : Promise.resolve(null),
-            ]);
-
-            const data = (challengesRes as { data?: unknown })?.data;
-            setRawChallenges(Array.isArray(data) ? (data as Challenge[]) : []);
-
-            if (deviceId) {
-                setUserProgress(Array.isArray(progressRes) ? (progressRes as UserProgress[]) : []);
-            } else {
-                setUserProgress([]);
-            }
-        } catch (err) {
-            const message =
-                err instanceof Error
-                    ? err.message
-                    : typeof err === "string"
-                      ? err
-                      : "Impossible de charger les challenges";
-            setError(message);
-            setRawChallenges([]);
-            setUserProgress([]);
-        } finally {
-            setIsLoading(false);
-        }
-    }, [client.public.challenges, client.public.cities, deviceId, pageSize, selectedCityId]);
-
-    useEffect(() => {
-        void fetchChallenges();
-    }, [fetchChallenges]);
-
-    const acquiredBadges = useMemo<AcquiredBadge[]>(() => {
-        const list: AcquiredBadge[] = [];
-        for (const p of userProgress) {
-            const badge = p.badge ?? undefined;
-            const badgeId = (badge as { id?: string } | undefined)?.id;
-            if (typeof badgeId !== "string" || !badgeId.trim()) continue;
-            list.push({
-                badgeId,
-                challengeId: p.challengeId,
-                earnedAt: p.completedAt,
-                badge,
-            });
-        }
-        return list;
-    }, [userProgress]);
-
-    const progressByChallengeId = useMemo<Record<string, UserProgress>>(() => {
-        const map: Record<string, UserProgress> = {};
-        for (const p of userProgress) {
-            if (p?.challengeId) {
-                map[p.challengeId] = p;
-            }
-        }
-        return map;
-    }, [userProgress]);
-
-    const getProgressByChallengeId = useCallback(
-        (challengeId: string) => progressByChallengeId[challengeId],
-        [progressByChallengeId],
-    );
-
-    const challenges = useMemo<ChallengeWithProgress[]>(() => {
-        return rawChallenges.map((c) => {
-            const progression = progressByChallengeId[c.id];
-            const seriesProgress = Array.isArray(progression?.series)
-                ? progression.series
-                : [];
-            const seriesById = new Map(
-                seriesProgress.map((s) => [s.seriesId, s]),
-            );
-            const series = c.series?.map((s) => ({
-                ...s,
-                progression: seriesById.get(s.id),
-            }));
-            return {
-                ...c,
-                progression,
-                series,
-            };
-        });
-    }, [progressByChallengeId, rawChallenges]);
-
-    const getChallengeById = useCallback(
-        (id: string) => challenges.find((c) => c.id === id),
-        [challenges],
-    );
-
-    const value = useMemo<UseChallengesResult>(
-        () => ({
-            cityId: selectedCityId,
-            challenges,
-            userProgress,
-            progressByChallengeId,
-            getProgressByChallengeId,
-            acquiredBadges,
-            isLoading,
-            error,
-            refetch: fetchChallenges,
-            getChallengeById,
-        }),
-        [
-            acquiredBadges,
-            challenges,
-            error,
-            fetchChallenges,
-            getChallengeById,
-            getProgressByChallengeId,
-            isLoading,
-            progressByChallengeId,
-            selectedCityId,
-            userProgress,
-        ],
-    );
-
-    return (
-        <ChallengesContext.Provider value={value}>{children}</ChallengesContext.Provider>
-    );
-}
-
-export function useChallengesContext(): UseChallengesResult {
-    const context = useContext(ChallengesContext);
-    if (!context) {
-        throw new Error("useChallenges must be used within a ChallengesProvider.");
-    }
-    return context;
-}
+import {
+    createContext,
+    PropsWithChildren,
+    useCallback,
+    useContext,
+    useEffect,
+    useMemo,
+    useState,
+    type ReactNode,
+} from "react";
+import { useLocal } from "./LocalContext";
+import { useWastoClient } from "../hooks/useWastoClient";
+import type {
+    AcquiredBadge,
+    Challenge,
+    ChallengeWithProgress,
+    UseChallengesResult,
+    UserProgress,
+} from "../hooks/useChallenges";
+
+const ChallengesContext = createContext<UseChallengesResult | undefined>(undefined);
+
+export type ChallengesProviderProps = PropsWithChildren & {
+    pageSize?: number;
+};
+
+/**
+ * Shared challenges + progress store so Challenge, ChallengeVignette and QuizModal
+ * all see the same data after a quiz completion refetch.
+ */
+export function ChallengesProvider({
+    children,
+    pageSize = 100,
+}: ChallengesProviderProps): ReactNode {
+    const { selectedCityId, deviceId } = useLocal();
+    const client = useWastoClient();
+
+    const [rawChallenges, setRawChallenges] = useState<Challenge[]>([]);
+    const [userProgress, setUserProgress] = useState<UserProgress[]>([]);
+    const [isLoading, setIsLoading] = useState(false);
+    const [error, setError] = useState<string | null>(null);
+
+    const fetchChallenges = useCallback(async () => {
+        if (!selectedCityId) {
+            setRawChallenges([]);
+            setUserProgress([]);
+            setIsLoading(false);
+            setError(null);
+            return;
+        }
+
+        try {
+            setIsLoading(true);
+            setError(null);
+            const [challengesRes, progressRes] = await Promise.all([
+                client.public.cities.getChallenges(selectedCityId, { pageSize }),
+                deviceId ? client.public.challenges.getProgress(deviceId) : Promise.resolve(null),
+            ]);
+
+            const data = (challengesRes as { data?: unknown })?.data;
+            setRawChallenges(Array.isArray(data) ? (data as Challenge[]) : []);
+
+            if (deviceId) {
+                setUserProgress(Array.isArray(progressRes) ? (progressRes as UserProgress[]) : []);
+            } else {
+                setUserProgress([]);
+            }
+        } catch (err) {
+            const message =
+                err instanceof Error
+                    ? err.message
+                    : typeof err === "string"
+                      ? err
+                      : "Impossible de charger les challenges";
+            setError(message);
+            setRawChallenges([]);
+            setUserProgress([]);
+        } finally {
+            setIsLoading(false);
+        }
+    }, [client.public.challenges, client.public.cities, deviceId, pageSize, selectedCityId]);
+
+    useEffect(() => {
+        void fetchChallenges();
+    }, [fetchChallenges]);
+
+    const acquiredBadges = useMemo<AcquiredBadge[]>(() => {
+        const list: AcquiredBadge[] = [];
+        for (const p of userProgress) {
+            const badge = p.badge ?? undefined;
+            const badgeId = (badge as { id?: string } | undefined)?.id;
+            if (typeof badgeId !== "string" || !badgeId.trim()) continue;
+            list.push({
+                badgeId,
+                challengeId: p.challengeId,
+                earnedAt: p.completedAt,
+                badge,
+            });
+        }
+        return list;
+    }, [userProgress]);
+
+    const progressByChallengeId = useMemo<Record<string, UserProgress>>(() => {
+        const map: Record<string, UserProgress> = {};
+        for (const p of userProgress) {
+            if (p?.challengeId) {
+                map[p.challengeId] = p;
+            }
+        }
+        return map;
+    }, [userProgress]);
+
+    const getProgressByChallengeId = useCallback(
+        (challengeId: string) => progressByChallengeId[challengeId],
+        [progressByChallengeId],
+    );
+
+    const challenges = useMemo<ChallengeWithProgress[]>(() => {
+        return rawChallenges.map((c) => {
+            const progression = progressByChallengeId[c.id];
+            const seriesProgress = Array.isArray(progression?.series)
+                ? progression.series
+                : [];
+            const seriesById = new Map(
+                seriesProgress.map((s) => [s.seriesId, s]),
+            );
+            const series = c.series?.map((s) => ({
+                ...s,
+                progression: seriesById.get(s.id),
+            }));
+            return {
+                ...c,
+                progression,
+                series,
+            };
+        });
+    }, [progressByChallengeId, rawChallenges]);
+
+    const getChallengeById = useCallback(
+        (id: string) => challenges.find((c) => c.id === id),
+        [challenges],
+    );
+
+    const value = useMemo<UseChallengesResult>(
+        () => ({
+            cityId: selectedCityId,
+            challenges,
+            userProgress,
+            progressByChallengeId,
+            getProgressByChallengeId,
+            acquiredBadges,
+            isLoading,
+            error,
+            refetch: fetchChallenges,
+            getChallengeById,
+        }),
+        [
+            acquiredBadges,
+            challenges,
+            error,
+            fetchChallenges,
+            getChallengeById,
+            getProgressByChallengeId,
+            isLoading,
+            progressByChallengeId,
+            selectedCityId,
+            userProgress,
+        ],
+    );
+
+    return (
+        <ChallengesContext.Provider value={value}>{children}</ChallengesContext.Provider>
+    );
+}
+
+export function useChallengesContext(): UseChallengesResult {
+    const context = useContext(ChallengesContext);
+    if (!context) {
+        throw new Error("useChallenges must be used within a ChallengesProvider.");
+    }
+    return context;
+}