@capytale/meta-player 0.9.11 → 0.10.0

package/src/features/activityJS/ActivityJSProvider.tsx

@@ -1,350 +1,362 @@
-import {
-  FC,
-  PropsWithChildren,
-  ReactNode,
-  createContext,
-  useCallback,
-  useContext,
-  useEffect,
-  useMemo,
-  useState,
-} from "react";
-
-import {
-  ActivitySessionLoaderReturnValue,
-  LoadOptions,
-  useActivitySessionLoader,
-} from "./internal-hooks";
-import { getIdFromUrl } from "../../utils/activity";
-import { useAppDispatch } from "../../app/hooks";
-import ActivitySession from "@capytale/activity.js/activity/activitySession";
-import { setActivityJSData } from "../activityData/activityDataSlice";
-
-import tracker from "@capytale/activity.js/backend/capytale/tracker";
-
-const ActivityJSContext = createContext<ActivitySessionLoaderReturnValue>({
-  state: "initial",
-});
-
-export type BinaryDataMode =
-  | "json"
-  | "text"
-  | "blob"
-  | "arrayBuffer"
-  | "stream";
-
-type ActivityJSProviderProps = PropsWithChildren<{
-  options?: LoadOptions;
-  loadingFallback?: ReactNode;
-  errorFallback?:
-    | keyof JSX.IntrinsicElements
-    | React.JSXElementConstructor<{ children: ReactNode }>;
-}>;
-
-export const ActivityJSProvider: FC<ActivityJSProviderProps> = (props) => {
-  const [loaded, setLoaded] = useState(false);
-  const activityId = getIdFromUrl();
-  const dispatch = useAppDispatch();
-
-  useEffect(() => {
-    tracker.trackPageView();
-  }, []);
-
-  const callback = (data: ActivitySession) => {
-    (window as any).capy = data;
-
-    const ab = data.activityBunch;
-
-    const sharedNotesContent = ab.shared_notes.value;
-
-    dispatch(
-      setActivityJSData({
-        title: ab.title.value || "",
-        mode: data.mode,
-        returnUrl: data.returnUrl,
-        helpUrl: data.type.helpUrl,
-        nid: ab.mainNode.nid,
-        activityNid: ab.activityNode.nid,
-        code: data.code,
-        codeLink: data.codeLink,
-        accessTrMode: ab.access_tr_mode.value || "",
-        accessTimerange: ab.access_timerange.value,
-        studentInfo: data.student
-          ? {
-              firstName: data.student.prenom || "",
-              lastName: data.student.nom || "",
-              class: data.student.classe || "",
-            }
-          : null,
-        instructions: ab.instructions.value.lexical
-          ? {
-              value: ab.instructions.value.lexical,
-              htmlValue: ab.instructions.value.html,
-              format: "lexical",
-            }
-          : {
-              value: null,
-              htmlValue: ab.instructions.value.html || "",
-              format: "html",
-            },
-        loadedInstructions: ab.instructions.value.lexical
-          ? {
-              value: ab.instructions.value.lexical,
-              htmlValue: ab.instructions.value.html,
-              format: "lexical",
-            }
-          : {
-              value: null,
-              htmlValue: ab.instructions.value.html || "",
-              format: "html",
-            },
-        instructionsType:
-          ab.instructions.value.lexical ||
-          ab.instructions.value.html ||
-          (data.mode === "create" && ab.activityNode.isNew)
-            ? "rich"
-            : "none",
-        pdfInstructions: null,
-        sharedNotesContent: sharedNotesContent,
-        sharedNotesType: sharedNotesContent == null ? "none" : "rich",
-        icon: data.icon || null,
-        friendlyType: data.friendlyType,
-        comments: ab.assignmentNode?.comments.value || null,
-        grading: ab.assignmentNode?.grading.value || null,
-        workflow: ab.assignmentNode?.workflow,
-        antiCheat: ab.hasAntiCheat
-          ? {
-              passwordHash: ab.antiCheatPasswd,
-              startLocked: !ab.assignmentNode?.isNew,
-            }
-          : null,
-        hasEvaluations: ab.activityNode.has_evaluation.value,
-      }),
-    );
-    tracker.trackActivity(data);
-    setLoaded(true);
-  };
-
-  if (!activityId) {
-    throw new Error("No activity id found in the URL");
-  }
-  const value = useActivitySessionLoader(activityId, props.options, callback);
-  if (!loaded || value.state !== "loaded") {
-    if (loaded) {
-      console.warn("Should not happen: loaded but not loaded state");
-    }
-    if (value.state === "loading" || value.state === "initial") {
-      return <>{props.loadingFallback}</>;
-    } else if (value.state === "error") {
-      console.error(value.error);
-      if (props.errorFallback) {
-        return (
-          <>
-            {<props.errorFallback>{String(value.error)}</props.errorFallback>}
-          </>
-        );
-      }
-      return (
-        <div>
-          <h2>Error loading ActivityJS data</h2>
-          <p>{String(value.error)}</p>
-        </div>
-      );
-    }
-    console.error("Unknown state:", value.state);
-    return (
-      <div>
-        <h2>Unknown state</h2>
-        <p>{String(value.state)}</p>
-      </div>
-    );
-  }
-  return (
-    <ActivityJSContext.Provider value={value}>
-      {props.children}
-    </ActivityJSContext.Provider>
-  );
-};
-
-export const useActivityJS = () => {
-  const activityJs = useContext(ActivityJSContext);
-  if (!activityJs) {
-    throw new Error("useActivityJS must be used within an ActivityJSProvider");
-  }
-  if (activityJs.state === "initial") {
-    throw new Error("ActivityJS data not loaded (initial)");
-  }
-  if (activityJs.state === "loading") {
-    throw new Error("ActivityJS data not loaded (loading)");
-  }
-  if (activityJs.state === "error") {
-    throw new Error("Error loading ActivityJS data: " + activityJs.error);
-  }
-  return activityJs;
-};
-
-export const useActivitySession = () => {
-  const activityJs = useActivityJS();
-  return activityJs.activitySession;
-};
-
-export const useActivityBunch = () => {
-  const activitySession = useActivitySession();
-  const ab = activitySession.activityBunch;
-  return ab;
-};
-
-export const useActivityJsEssentials = () => {
-  const activitySession = useActivitySession();
-  const mode = activitySession.mode;
-  const ab = activitySession.activityBunch;
-  const hasAssignment = !!ab.assignmentNode;
-  const getActivityContent = useCallback(() => {
-    return ab.activityNode.content.value as string | null;
-  }, [ab.activityNode.content]);
-  const getAssignmentContent = useCallback(() => {
-    if (!ab.assignmentNode) {
-      throw new Error("No assignment node");
-    }
-    return ab.assignmentNode.content.value as string | null;
-  }, [ab.assignmentNode?.content]);
-  const getContent = useCallback(() => {
-    if (!hasAssignment) {
-      return getActivityContent();
-    }
-    const assignmentContent = getAssignmentContent();
-    if (assignmentContent != null) {
-      return assignmentContent;
-    }
-    return getActivityContent();
-  }, [getActivityContent, getAssignmentContent]);
-  const getActivityBinaryData = useCallback(() => {
-    return ab.activityNode.binaryData.value as any;
-  }, [ab.activityNode.binaryData]);
-  const getAssignmentBinaryData = useCallback(() => {
-    if (!ab.assignmentNode) {
-      throw new Error("No assignment node");
-    }
-    return ab.assignmentNode.binaryData.value as any;
-  }, [ab.assignmentNode?.binaryData]);
-  const getBinaryData = useCallback(() => {
-    if (!hasAssignment) {
-      return getActivityBinaryData();
-    }
-    const assignmentBinaryData = getAssignmentBinaryData();
-    if (assignmentBinaryData != null) {
-      return assignmentBinaryData;
-    }
-    return getActivityBinaryData();
-  }, [getActivityBinaryData, getAssignmentBinaryData]);
-
-  const retrieveAndGetActivityBinaryData = useCallback(
-    async (mode: BinaryDataMode) => {
-      await ab.activityNode.binaryData.loadAsync(mode);
-      return ab.activityNode.binaryData.value as any;
-    },
-    [ab.activityNode.binaryData],
-  );
-  const retrieveAndGetAssignmentBinaryData = useCallback(
-    async (mode: BinaryDataMode) => {
-      if (!ab.assignmentNode) {
-        throw new Error("No assignment node");
-      }
-      await ab.assignmentNode.binaryData.loadAsync(mode);
-      return ab.assignmentNode.binaryData.value as any;
-    },
-    [ab.assignmentNode?.binaryData],
-  );
-  const retrieveAndGetBinaryData = useCallback(
-    async (mode: BinaryDataMode) => {
-      if (!hasAssignment) {
-        return await retrieveAndGetActivityBinaryData(mode);
-      }
-      const assignmentBinaryData =
-        await retrieveAndGetAssignmentBinaryData(mode);
-      if (assignmentBinaryData != null) {
-        return assignmentBinaryData;
-      }
-      return await retrieveAndGetActivityBinaryData(mode);
-    },
-    [
-      hasAssignment,
-      retrieveAndGetActivityBinaryData,
-      retrieveAndGetAssignmentBinaryData,
-    ],
-  );
-
-  const setActivityContent = useCallback(
-    (content: string | null) => {
-      ab.activityNode.content.value = content;
-    },
-    [ab.activityNode.content],
-  );
-  const setAssignmentContent = useCallback(
-    (content: string | null) => {
-      if (!ab.assignmentNode) {
-        throw new Error("No assignment node");
-      }
-      ab.assignmentNode.content.value = content;
-    },
-    [ab.assignmentNode?.content],
-  );
-  const setContent = useCallback(
-    (content: string | null) => {
-      if (!hasAssignment) {
-        setActivityContent(content);
-      } else {
-        setAssignmentContent(content);
-      }
-    },
-    [hasAssignment, setActivityContent, setAssignmentContent],
-  );
-  const setActivityBinaryData = useCallback(
-    (data: any | null) => {
-      ab.activityNode.binaryData.value = data;
-    },
-    [ab.activityNode.binaryData],
-  );
-  const setAssignmentBinaryData = useCallback(
-    (data: any | null) => {
-      if (!ab.assignmentNode) {
-        throw new Error("No assignment node");
-      }
-      ab.assignmentNode.binaryData.value = data;
-    },
-    [ab.assignmentNode?.binaryData],
-  );
-  const setBinaryData = useCallback(
-    (data: any | null) => {
-      if (!hasAssignment) {
-        setActivityBinaryData(data);
-      } else {
-        setAssignmentBinaryData(data);
-      }
-    },
-    [hasAssignment, setActivityBinaryData, setAssignmentBinaryData],
-  );
-  const title = useMemo(() => ab.title.value, [ab.title.value]);
-  const nid = useMemo(() => ab.mainNode.nid, [ab.mainNode.nid]);
-  return {
-    mode,
-    title,
-    hasAssignment,
-    nid,
-    getActivityContent,
-    getAssignmentContent,
-    getContent,
-    getActivityBinaryData,
-    getAssignmentBinaryData,
-    getBinaryData,
-    retrieveAndGetActivityBinaryData,
-    retrieveAndGetAssignmentBinaryData,
-    retrieveAndGetBinaryData,
-    setActivityContent,
-    setAssignmentContent,
-    setContent,
-    setActivityBinaryData,
-    setAssignmentBinaryData,
-    setBinaryData,
-  };
-};
+import {
+  FC,
+  PropsWithChildren,
+  ReactNode,
+  createContext,
+  useCallback,
+  useContext,
+  useEffect,
+  useMemo,
+  useState,
+} from "react";
+
+import {
+  ActivitySessionLoaderReturnValue,
+  LoadOptions,
+  useActivitySessionLoader,
+} from "./internal-hooks";
+import { getIdFromUrl } from "../../utils/activity";
+import { useAppDispatch } from "../../app/hooks";
+import ActivitySession from "@capytale/activity.js/activity/activitySession";
+import { setActivityJSData } from "../activityData/activityDataSlice";
+
+import tracker from "@capytale/activity.js/backend/capytale/tracker";
+import { useZustandStore } from "../../zustandStore";
+
+const ActivityJSContext = createContext<ActivitySessionLoaderReturnValue>({
+  state: "initial",
+});
+
+export type BinaryDataMode =
+  | "json"
+  | "text"
+  | "blob"
+  | "arrayBuffer"
+  | "stream";
+
+type ActivityJSProviderProps = PropsWithChildren<{
+  options?: LoadOptions;
+  loadingFallback?: ReactNode;
+  errorFallback?:
+    | keyof JSX.IntrinsicElements
+    | React.JSXElementConstructor<{ children: ReactNode }>;
+}>;
+
+export const ActivityJSProvider: FC<ActivityJSProviderProps> = (props) => {
+  const [loaded, setLoaded] = useState(false);
+  const activityId = getIdFromUrl();
+  const dispatch = useAppDispatch();
+
+  useEffect(() => {
+    tracker.trackPageView();
+  }, []);
+
+  const callback = (data: ActivitySession) => {
+    (window as any).capy = data;
+
+    const ab = data.activityBunch;
+
+    const sharedNotesContent = ab.shared_notes.value;
+
+    dispatch(
+      setActivityJSData({
+        title: ab.title.value || "",
+        mode: data.mode,
+        returnUrl: data.returnUrl,
+        helpUrl: data.type.helpUrl,
+        nid: ab.mainNode.nid,
+        activityNid: ab.activityNode.nid,
+        code: data.code,
+        codeLink: data.codeLink,
+        accessTrMode: ab.access_tr_mode.value || "",
+        accessTimerange: ab.access_timerange.value,
+        studentInfo: data.student
+          ? {
+              firstName: data.student.prenom || "",
+              lastName: data.student.nom || "",
+              class: data.student.classe || "",
+            }
+          : null,
+        instructions: ab.instructions.value.lexical
+          ? {
+              value: ab.instructions.value.lexical,
+              htmlValue: ab.instructions.value.html,
+              format: "lexical",
+            }
+          : {
+              value: null,
+              htmlValue: ab.instructions.value.html || "",
+              format: "html",
+            },
+        loadedInstructions: ab.instructions.value.lexical
+          ? {
+              value: ab.instructions.value.lexical,
+              htmlValue: ab.instructions.value.html,
+              format: "lexical",
+            }
+          : {
+              value: null,
+              htmlValue: ab.instructions.value.html || "",
+              format: "html",
+            },
+        instructionsType:
+          ab.instructions.value.lexical ||
+          ab.instructions.value.html ||
+          (data.mode === "create" && ab.activityNode.isNew)
+            ? "rich"
+            : "none",
+        pdfInstructions: null,
+        sharedNotesContent: sharedNotesContent,
+        sharedNotesType: sharedNotesContent == null ? "none" : "rich",
+        icon: data.icon || null,
+        friendlyType: data.friendlyType,
+        comments: ab.assignmentNode?.comments.value || null,
+        grading: ab.assignmentNode?.grading.value || null,
+        workflow: ab.assignmentNode?.workflow,
+        antiCheat: ab.hasAntiCheat
+          ? {
+              passwordHash: ab.antiCheatPasswd,
+              startLocked: !ab.assignmentNode?.isNew,
+            }
+          : null,
+        hasEvaluations: ab.activityNode.has_evaluation.value,
+      }),
+    );
+    tracker.trackActivity(data);
+    setLoaded(true);
+  };
+
+  if (!activityId) {
+    throw new Error("No activity id found in the URL");
+  }
+  const value = useActivitySessionLoader(activityId, props.options, callback);
+  if (!loaded || value.state !== "loaded") {
+    if (loaded) {
+      console.warn("Should not happen: loaded but not loaded state");
+    }
+    if (value.state === "loading" || value.state === "initial") {
+      return <>{props.loadingFallback}</>;
+    } else if (value.state === "error") {
+      console.error(value.error);
+      if (props.errorFallback) {
+        return (
+          <>
+            {<props.errorFallback>{String(value.error)}</props.errorFallback>}
+          </>
+        );
+      }
+      return (
+        <div>
+          <h2>Error loading ActivityJS data</h2>
+          <p>{String(value.error)}</p>
+        </div>
+      );
+    }
+    console.error("Unknown state:", value.state);
+    return (
+      <div>
+        <h2>Unknown state</h2>
+        <p>{String(value.state)}</p>
+      </div>
+    );
+  }
+  return (
+    <ActivityJSContext.Provider value={value}>
+      {props.children}
+    </ActivityJSContext.Provider>
+  );
+};
+
+export const useActivityJS = () => {
+  const activityJs = useContext(ActivityJSContext);
+  if (!activityJs) {
+    throw new Error("useActivityJS must be used within an ActivityJSProvider");
+  }
+  if (activityJs.state === "initial") {
+    throw new Error("ActivityJS data not loaded (initial)");
+  }
+  if (activityJs.state === "loading") {
+    throw new Error("ActivityJS data not loaded (loading)");
+  }
+  if (activityJs.state === "error") {
+    throw new Error("Error loading ActivityJS data: " + activityJs.error);
+  }
+  return activityJs;
+};
+
+export const useActivitySession = () => {
+  const activityJs = useActivityJS();
+  const isPreviewing = useZustandStore((state) => state.isPreviewing);
+  const withModifiedMode = useMemo(() => {
+    if (isPreviewing !== "forced" || activityJs.activitySession.mode !== "create") {
+      return activityJs.activitySession;
+    }
+    return {
+      ...activityJs.activitySession,
+      mode: "assignment",
+      // TODO: check if we need to change isAssignment
+    };
+  }, [activityJs.activitySession, isPreviewing]);
+  return withModifiedMode;
+};
+
+export const useActivityBunch = () => {
+  const activitySession = useActivitySession();
+  const ab = activitySession.activityBunch;
+  return ab;
+};
+
+export const useActivityJsEssentials = () => {
+  const activitySession = useActivitySession();
+  const mode = activitySession.mode;
+  const ab = activitySession.activityBunch;
+  const hasAssignment = !!ab.assignmentNode;
+  const getActivityContent = useCallback(() => {
+    return ab.activityNode.content.value as string | null;
+  }, [ab.activityNode.content]);
+  const getAssignmentContent = useCallback(() => {
+    if (!ab.assignmentNode) {
+      throw new Error("No assignment node");
+    }
+    return ab.assignmentNode.content.value as string | null;
+  }, [ab.assignmentNode?.content]);
+  const getContent = useCallback(() => {
+    if (!hasAssignment) {
+      return getActivityContent();
+    }
+    const assignmentContent = getAssignmentContent();
+    if (assignmentContent != null) {
+      return assignmentContent;
+    }
+    return getActivityContent();
+  }, [getActivityContent, getAssignmentContent]);
+  const getActivityBinaryData = useCallback(() => {
+    return ab.activityNode.binaryData.value as any;
+  }, [ab.activityNode.binaryData]);
+  const getAssignmentBinaryData = useCallback(() => {
+    if (!ab.assignmentNode) {
+      throw new Error("No assignment node");
+    }
+    return ab.assignmentNode.binaryData.value as any;
+  }, [ab.assignmentNode?.binaryData]);
+  const getBinaryData = useCallback(() => {
+    if (!hasAssignment) {
+      return getActivityBinaryData();
+    }
+    const assignmentBinaryData = getAssignmentBinaryData();
+    if (assignmentBinaryData != null) {
+      return assignmentBinaryData;
+    }
+    return getActivityBinaryData();
+  }, [getActivityBinaryData, getAssignmentBinaryData]);
+
+  const retrieveAndGetActivityBinaryData = useCallback(
+    async (mode: BinaryDataMode) => {
+      await ab.activityNode.binaryData.loadAsync(mode);
+      return ab.activityNode.binaryData.value as any;
+    },
+    [ab.activityNode.binaryData],
+  );
+  const retrieveAndGetAssignmentBinaryData = useCallback(
+    async (mode: BinaryDataMode) => {
+      if (!ab.assignmentNode) {
+        throw new Error("No assignment node");
+      }
+      await ab.assignmentNode.binaryData.loadAsync(mode);
+      return ab.assignmentNode.binaryData.value as any;
+    },
+    [ab.assignmentNode?.binaryData],
+  );
+  const retrieveAndGetBinaryData = useCallback(
+    async (mode: BinaryDataMode) => {
+      if (!hasAssignment) {
+        return await retrieveAndGetActivityBinaryData(mode);
+      }
+      const assignmentBinaryData =
+        await retrieveAndGetAssignmentBinaryData(mode);
+      if (assignmentBinaryData != null) {
+        return assignmentBinaryData;
+      }
+      return await retrieveAndGetActivityBinaryData(mode);
+    },
+    [
+      hasAssignment,
+      retrieveAndGetActivityBinaryData,
+      retrieveAndGetAssignmentBinaryData,
+    ],
+  );
+
+  const setActivityContent = useCallback(
+    (content: string | null) => {
+      ab.activityNode.content.value = content;
+    },
+    [ab.activityNode.content],
+  );
+  const setAssignmentContent = useCallback(
+    (content: string | null) => {
+      if (!ab.assignmentNode) {
+        throw new Error("No assignment node");
+      }
+      ab.assignmentNode.content.value = content;
+    },
+    [ab.assignmentNode?.content],
+  );
+  const setContent = useCallback(
+    (content: string | null) => {
+      if (!hasAssignment) {
+        setActivityContent(content);
+      } else {
+        setAssignmentContent(content);
+      }
+    },
+    [hasAssignment, setActivityContent, setAssignmentContent],
+  );
+  const setActivityBinaryData = useCallback(
+    (data: any | null) => {
+      ab.activityNode.binaryData.value = data;
+    },
+    [ab.activityNode.binaryData],
+  );
+  const setAssignmentBinaryData = useCallback(
+    (data: any | null) => {
+      if (!ab.assignmentNode) {
+        throw new Error("No assignment node");
+      }
+      ab.assignmentNode.binaryData.value = data;
+    },
+    [ab.assignmentNode?.binaryData],
+  );
+  const setBinaryData = useCallback(
+    (data: any | null) => {
+      if (!hasAssignment) {
+        setActivityBinaryData(data);
+      } else {
+        setAssignmentBinaryData(data);
+      }
+    },
+    [hasAssignment, setActivityBinaryData, setAssignmentBinaryData],
+  );
+  const title = useMemo(() => ab.title.value, [ab.title.value]);
+  const nid = useMemo(() => ab.mainNode.nid, [ab.mainNode.nid]);
+  return {
+    mode,
+    title,
+    hasAssignment,
+    nid,
+    getActivityContent,
+    getAssignmentContent,
+    getContent,
+    getActivityBinaryData,
+    getAssignmentBinaryData,
+    getBinaryData,
+    retrieveAndGetActivityBinaryData,
+    retrieveAndGetAssignmentBinaryData,
+    retrieveAndGetBinaryData,
+    setActivityContent,
+    setAssignmentContent,
+    setContent,
+    setActivityBinaryData,
+    setAssignmentBinaryData,
+    setBinaryData,
+  };
+};