Exam generation rework, batch user tables, fastapi endpoint switch
This commit is contained in:
139
src/components/ExamEditor/SettingsEditor/writing.tsx
Normal file
139
src/components/ExamEditor/SettingsEditor/writing.tsx
Normal file
@@ -0,0 +1,139 @@
|
||||
import React, { useCallback, useEffect, useState } from "react";
|
||||
import SettingsEditor from ".";
|
||||
import Option from "@/interfaces/option";
|
||||
import Dropdown from "./Shared/SettingsDropdown";
|
||||
import Input from "@/components/Low/Input";
|
||||
import { generate } from "./Shared/Generate";
|
||||
import useSettingsState from "../Hooks/useSettingsState";
|
||||
import GenerateBtn from "./Shared/GenerateBtn";
|
||||
import { SectionSettings } from "@/stores/examEditor/types";
|
||||
import useExamEditorStore from "@/stores/examEditor";
|
||||
import { useRouter } from "next/router";
|
||||
import { usePersistentExamStore } from "@/stores/examStore";
|
||||
import openDetachedTab from "@/utils/popout";
|
||||
import { WritingExercise } from "@/interfaces/exam";
|
||||
import { v4 } from "uuid";
|
||||
|
||||
const WritingSettings: React.FC = () => {
|
||||
const router = useRouter();
|
||||
const [preview, setPreview] = useState({canPreview: false, openTab: () => {}});
|
||||
const { currentModule } = useExamEditorStore();
|
||||
const {
|
||||
minTimer,
|
||||
difficulty,
|
||||
isPrivate,
|
||||
sections,
|
||||
focusedSection,
|
||||
} = useExamEditorStore((store) => store.modules["writing"]);
|
||||
|
||||
const states = sections.flatMap((s)=> s.state) as WritingExercise[];
|
||||
|
||||
const {
|
||||
setExam,
|
||||
setExerciseIndex,
|
||||
} = usePersistentExamStore();
|
||||
|
||||
const { localSettings, updateLocalAndScheduleGlobal } = useSettingsState<SectionSettings>(
|
||||
currentModule,
|
||||
focusedSection,
|
||||
);
|
||||
|
||||
const defaultPresets: Option[] = [
|
||||
{
|
||||
label: "Preset: Writing Task 1",
|
||||
value: "Welcome to {part} of the {label}. You will write a letter of at least 150 words in response to a given situation. Your letter may be personal, semi-formal, or formal. You have 20 minutes for this task."
|
||||
},
|
||||
{
|
||||
label: "Preset: Writing Task 2",
|
||||
value: "Welcome to {part} of the {label}. You will write a semi-formal/neutral essay of at least 250 words on a topic of general interest. Discuss the given opinion, argument, or problem. Organize your ideas clearly and support them with relevant examples. You have 40 minutes for this task."
|
||||
}
|
||||
];
|
||||
|
||||
const generatePassage = useCallback((sectionId: number) => {
|
||||
generate(
|
||||
sectionId,
|
||||
currentModule,
|
||||
"context",
|
||||
{
|
||||
method: 'GET',
|
||||
queryParams: {
|
||||
difficulty,
|
||||
...(localSettings.topic && { topic: localSettings.topic })
|
||||
}
|
||||
},
|
||||
(data: any) => [{
|
||||
prompt: data.question
|
||||
}]
|
||||
);
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [localSettings.topic, difficulty]);
|
||||
|
||||
const onTopicChange = useCallback((topic: string) => {
|
||||
updateLocalAndScheduleGlobal({ topic });
|
||||
}, [updateLocalAndScheduleGlobal]);
|
||||
|
||||
useEffect(() => {
|
||||
const openTab = () => {
|
||||
setExam({
|
||||
isDiagnostic: false,
|
||||
minTimer,
|
||||
module: "writing",
|
||||
exercises: states.filter((s) => s.prompt && s.prompt !== ""),
|
||||
id: v4(),
|
||||
variant: undefined,
|
||||
difficulty,
|
||||
private: isPrivate,
|
||||
});
|
||||
setExerciseIndex(0);
|
||||
openDetachedTab("popout?type=Exam&module=writing", router)
|
||||
}
|
||||
setPreview({
|
||||
canPreview: states.some((s) => s.prompt && s.prompt !== ""),
|
||||
openTab
|
||||
})
|
||||
}, [states.some((s) => s.prompt !== "")])
|
||||
|
||||
return (
|
||||
<SettingsEditor
|
||||
sectionLabel={`Task ${focusedSection}`}
|
||||
sectionId={focusedSection}
|
||||
module="writing"
|
||||
introPresets={[defaultPresets[focusedSection - 1]]}
|
||||
preview={preview.openTab}
|
||||
canPreview={preview.canPreview}
|
||||
>
|
||||
<Dropdown
|
||||
title="Generate Instructions"
|
||||
module={currentModule}
|
||||
open={localSettings.isExerciseDropdownOpen}
|
||||
setIsOpen={(isOpen: boolean) => updateLocalAndScheduleGlobal({ isExerciseDropdownOpen: isOpen })}
|
||||
>
|
||||
|
||||
<div className="flex flex-row gap-2 items-center px-2 pb-4">
|
||||
<div className="flex flex-col flex-grow gap-4 px-2">
|
||||
<label className="font-normal text-base text-mti-gray-dim">Topic (Optional)</label>
|
||||
<Input
|
||||
key={`section-${focusedSection}`}
|
||||
type="text"
|
||||
placeholder="Topic"
|
||||
name="category"
|
||||
onChange={onTopicChange}
|
||||
roundness="full"
|
||||
value={localSettings.topic}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex self-end h-16 mb-1">
|
||||
<GenerateBtn
|
||||
genType="context"
|
||||
module={currentModule}
|
||||
sectionId={focusedSection}
|
||||
generateFnc={generatePassage}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</Dropdown>
|
||||
</SettingsEditor>
|
||||
);
|
||||
};
|
||||
|
||||
export default WritingSettings;
|
||||
Reference in New Issue
Block a user