@capytale/meta-player 0.9.2 → 0.9.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@capytale/meta-player",
-  "version": "0.9.2",
+  "version": "0.9.4",
   "type": "module",
   "scripts": {
     "dev": "vite",

package/src/features/layout/layoutSlice.ts

@@ -3,7 +3,7 @@ import { createAppSlice } from "../../app/createAppSlice";
 
 export type Orientation = "horizontal" | "vertical";
 
-export type PedagoTab = "instructions" | "sharedNotes" | "pdf";
+export type PedagoTab = "instructions" | "sharedNotes" | "pdf" | null;
 
 export interface LayoutState {
   orientation: Orientation;
@@ -19,7 +19,7 @@ export const initialState: LayoutState = {
   orientation: "horizontal",
   isPedagoVisible: null,
   isGradingVisible: true,
-  pedagoTab: "instructions",
+  pedagoTab: null,
   showWorkflow: true,
   showSaveForStudents: true,
 };

package/src/features/pedago/PedagoCommands.tsx

@@ -21,9 +21,10 @@ import styles from "./style.module.scss";
 import { Button } from "primereact/button";
 import settings from "../../settings";
 import { SelectButton } from "primereact/selectbutton";
-import { FC, useCallback, useMemo } from "react";
+import { FC, useCallback, useEffect, useMemo } from "react";
 import { TabMenu } from "primereact/tabmenu";
 import { classNames } from "primereact/utils";
+import { usePedagoOptions } from "./hooks";
 
 export const PedagoCommands = () => {
   const isHorizontal = useAppSelector(selectOrientation) === "horizontal";
@@ -176,15 +177,14 @@ const DocumentSelectorItemActions: FC<{
 
 const HorizontalDocumentSelector = () => {
   const pedagoTab = useAppSelector(selectPedagoTab);
-  const instructionsType = useAppSelector(selectInstructionsType);
   const mode = useAppSelector(selectMode);
   // const pdfInstructions = useAppSelector(selectPdfInstructions);
-  const sharedNotesType = useAppSelector(selectSharedNotesType);
   const dispatch = useAppDispatch();
+  const { hasNonEmptyInstructions, hasSharedNotes } = usePedagoOptions();
 
   const items: DocumentSelectorHzItem[] = useMemo(() => {
     const allItems: DocumentSelectorHzItem[] = [];
-    if (mode === "create" || instructionsType !== "none") {
+    if (mode === "create" || hasNonEmptyInstructions) {
       allItems.push({
         name: "Consignes",
         value: "instructions",
@@ -200,7 +200,7 @@ const HorizontalDocumentSelector = () => {
       });
     }
     */
-    if (mode === "create" || sharedNotesType !== "none") {
+    if (mode === "create" || hasSharedNotes) {
       allItems.push({
         name: "Notes partagées",
         value: "sharedNotes",
@@ -208,7 +208,13 @@ const HorizontalDocumentSelector = () => {
       });
     }
     return allItems;
-  }, []);
+  }, [mode, hasNonEmptyInstructions, hasSharedNotes]);
+
+  useEffect(() => {
+    if (pedagoTab === null && items.length > 0) {
+      dispatch(setPedagoTab(items[0].value));
+    }
+  }, [pedagoTab, items, dispatch]);
 
   return (
     <div className={styles.pedagoHorizontalTabMenu}>
@@ -259,10 +265,9 @@ const VerticalPedagoCommands = () => {
 
 const VerticalDocumentSelector = () => {
   const pedagoTab = useAppSelector(selectPedagoTab);
-  const instructionsType = useAppSelector(selectInstructionsType);
   const mode = useAppSelector(selectMode);
   // const pdfInstructions = useAppSelector(selectPdfInstructions);
-  const sharedNotesType = useAppSelector(selectSharedNotesType);
+  const { hasNonEmptyInstructions, hasSharedNotes } = usePedagoOptions();
   const dispatch = useAppDispatch();
 
   const itemRenderer = useCallback(
@@ -280,7 +285,7 @@ const VerticalDocumentSelector = () => {
 
   const items: DocumentSelectorItem[] = useMemo(() => {
     const allItems: DocumentSelectorItem[] = [];
-    if (mode === "create" || instructionsType !== "none") {
+    if (mode === "create" || hasNonEmptyInstructions) {
       allItems.push({
         name: "Consignes",
         value: "instructions",
@@ -298,7 +303,7 @@ const VerticalDocumentSelector = () => {
       });
     }
     */
-    if (mode === "create" || sharedNotesType !== "none") {
+    if (mode === "create" || hasSharedNotes) {
       allItems.push({
         name: "Notes partagées",
         value: "sharedNotes",
@@ -307,9 +312,19 @@ const VerticalDocumentSelector = () => {
       });
     }
     return allItems;
-  }, []);
+  }, [mode, hasNonEmptyInstructions, hasSharedNotes]);
+
+  useEffect(() => {
+    if (pedagoTab === null && items.length > 0) {
+      dispatch(setPedagoTab(items[0].value));
+    }
+  }, [pedagoTab, items, dispatch]);
+
   const activeIndex = useMemo(() => {
     const index = items.findIndex((item) => item.value === pedagoTab);
+    if (index === -1) {
+      return undefined;
+    }
     return index;
   }, [items, pedagoTab]);
 

package/src/features/pedago/hooks.ts

@@ -84,7 +84,10 @@ export const usePedagoOptions = () => {
           : hasNonEmptyInstructions || hasSharedNotes || hasGradingOrComments;
 
   const showPedago =
-    isPedagoVisible ?? (mode === "create" ? showPedagoByDefault : hasPedago);
+    isPedagoVisible ??
+    (mode === "create"
+      ? hasNonEmptyInstructions || hasSharedNotes || showPedagoByDefault
+      : hasPedago);
 
   const showInstructions =
     mode === "create" ? true : hasNonEmptyInstructions || hasSharedNotes;

package/src/features/pedago/index.tsx

@@ -59,7 +59,9 @@ const Pedago: React.FC<DivProps> = ({ className, ...props }) => {
             ? "Consignes"
             : pedagoTab === "pdf"
               ? "PDF"
-              : "Notes partagées"
+              : pedagoTab === "sharedNotes"
+                ? "Notes partagées"
+                : ""
         }
         data-grading-visible={showGrading}
       >
@@ -68,6 +70,7 @@ const Pedago: React.FC<DivProps> = ({ className, ...props }) => {
             {pedagoTab === "instructions" && <InstructionsEditor />}
             {pedagoTab === "sharedNotes" && <SharedNotesEditor />}
             {pedagoTab === "pdf" && <PdfEditor />}
+            {pedagoTab === null && <div />}
           </>
         )}
         {showGrading && (
@@ -99,19 +102,24 @@ const Pedago: React.FC<DivProps> = ({ className, ...props }) => {
                       ? "Consignes"
                       : pedagoTab === "pdf"
                         ? "PDF"
-                        : "Notes partagées"
+                        : pedagoTab === "sharedNotes"
+                          ? "Notes partagées"
+                          : ""
                   }
                   header={
                     pedagoTab === "instructions"
                       ? "Consignes"
                       : pedagoTab === "pdf"
                         ? "PDF"
-                        : "Notes partagées"
+                        : pedagoTab === "sharedNotes"
+                          ? "Notes partagées"
+                          : ""
                   }
                 >
                   {pedagoTab === "instructions" && <InstructionsEditor />}
                   {pedagoTab === "sharedNotes" && <SharedNotesEditor />}
                   {pedagoTab === "pdf" && <PdfEditor />}
+                  {pedagoTab === null && <div />}
                 </Panel>
               </SplitterPanel>,
             ])}