More modal patches and a bug in level that I'm still trying to solve

This commit is contained in:
Carlos-Mesquita
2024-11-26 16:47:26 +00:00
parent 67909c1d7c
commit 4e94773861
6 changed files with 183 additions and 34 deletions

View File

@@ -6,7 +6,10 @@ import WordUploader from './WordUploader';
import GenLoader from '../Exercises/Shared/GenLoader';
import useExamEditorStore from '@/stores/examEditor';
const ImportOrFromScratch: React.FC<{ module: Module; }> = ({ module }) => {
const ImportOrFromScratch: React.FC<{
module: Module;
setNumberOfLevelParts: React.Dispatch<React.SetStateAction<number>>
}> = ({ module, setNumberOfLevelParts }) => {
const { currentModule, dispatch } = useExamEditorStore();
const { importing } = useExamEditorStore((store) => store.modules[currentModule])
@@ -45,7 +48,7 @@ const ImportOrFromScratch: React.FC<{ module: Module; }> = ({ module }) => {
</span>
</button>
<div className='h-full'>
<WordUploader module={module} />
<WordUploader module={module} setNumberOfLevelParts={setNumberOfLevelParts} />
</div>
</div>
)}

View File

@@ -9,8 +9,9 @@ import useExamEditorStore from '@/stores/examEditor';
import { LevelPart, ListeningPart, ReadingPart } from '@/interfaces/exam';
import { defaultSectionSettings } from '@/stores/examEditor/defaults';
const WordUploader: React.FC<{ module: Module }> = ({ module }) => {
const WordUploader: React.FC<{ module: Module, setNumberOfLevelParts: React.Dispatch<React.SetStateAction<number>> }> = ({ module, setNumberOfLevelParts }) => {
const { currentModule, dispatch } = useExamEditorStore();
const {sectionLabels} = useExamEditorStore(state => state.modules[currentModule]);
const examInputRef = useRef<HTMLInputElement>(null);
const solutionsInputRef = useRef<HTMLInputElement>(null);
@@ -74,6 +75,20 @@ const WordUploader: React.FC<{ module: Module }> = ({ module }) => {
const newSectionsStates = data.parts.map(
(part: ReadingPart | ListeningPart | LevelPart, index: number) => defaultSectionSettings(module, index + 1, part)
);
if (module === "level") {
// default is 1
const newLabelCount = data.parts.length - 2;
setNumberOfLevelParts(newLabelCount);
const newLabels = Array.from({ length: newLabelCount }, (_, index) => ({
id: index + 2,
label: `Part ${index + 2}`
}));
dispatch({type: "UPDATE_MODULE", payload: { updates: { sectionLabels: [...sectionLabels, ...newLabels] }}})
}
dispatch({
type: "UPDATE_MODULE", payload: {
updates: {

View File

@@ -5,7 +5,7 @@ import Input from "../Low/Input";
import Select from "../Low/Select";
import { capitalize } from "lodash";
import { Difficulty } from "@/interfaces/exam";
import { useCallback, useEffect, useState } from "react";
import { useCallback, useEffect, useMemo, useState } from "react";
import { toast } from "react-toastify";
import { ModuleState, SectionState } from "@/stores/examEditor/types";
import { Module } from "@/interfaces";
@@ -33,7 +33,7 @@ const ExamEditor: React.FC = () => {
importModule
} = useExamEditorStore(state => state.modules[currentModule]);
const [numberOfParts, setNumberOfParts] = useState(1);
const [numberOfLevelParts, setNumberOfLevelParts] = useState(1);
useEffect(() => {
const currentSections = sections;
@@ -41,23 +41,22 @@ const ExamEditor: React.FC = () => {
let updatedSections: SectionState[];
let updatedLabels: any;
if (numberOfParts > currentSections.length) {
if (numberOfLevelParts > currentSections.length) {
const newSections = [...currentSections];
const newLabels = [...currentLabels];
for (let i = currentSections.length; i < numberOfParts; i++) {
for (let i = currentSections.length; i < numberOfLevelParts; i++) {
newSections.push(defaultSectionSettings(currentModule, i + 1));
newLabels.push({
id: i + 1,
label: `Part ${i + 1}`
});
}
updatedSections = newSections;
updatedLabels = newLabels;
} else if (numberOfParts < currentSections.length) {
updatedSections = currentSections.slice(0, numberOfParts);
updatedLabels = currentLabels.slice(0, numberOfParts);
} else if (numberOfLevelParts < currentSections.length) {
updatedSections = currentSections.slice(0, numberOfLevelParts);
updatedLabels = currentLabels.slice(0, numberOfLevelParts);
} else {
return;
}
@@ -77,7 +76,7 @@ const ExamEditor: React.FC = () => {
}
});
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [numberOfParts]);
}, [numberOfLevelParts]);
const sectionIds = sections.map((section) => section.sectionId)
@@ -103,11 +102,11 @@ const ExamEditor: React.FC = () => {
};
const Settings = ModuleSettings[currentModule];
const showImport = importModule && (currentModule === "reading" || currentModule === "listening" || currentModule === "level");
const showImport = importModule && ["reading", "listening", "level"].includes(currentModule);
return (
<>
{showImport ? <ImportOrStartFromScratch module={currentModule} /> : (
{showImport ? <ImportOrStartFromScratch module={currentModule} setNumberOfLevelParts={setNumberOfLevelParts}/> : (
<>
<div className="flex gap-4 w-full items-center">
<div className="flex flex-col gap-3">
@@ -153,7 +152,7 @@ const ExamEditor: React.FC = () => {
) : (
<div className="flex flex-col gap-3 w-1/3">
<label className="font-normal text-base text-mti-gray-dim">Number of Parts</label>
<Input type="number" name="Number of Parts" min={1} onChange={(v) => setNumberOfParts(parseInt(v))} value={numberOfParts} />
<Input type="number" name="Number of Parts" min={1} onChange={(v) => setNumberOfLevelParts(parseInt(v))} value={numberOfLevelParts} />
</div>
)}
<div className="flex flex-col gap-3 w-fit h-fit">