ENCOA-274

This commit is contained in:
Carlos-Mesquita
2024-12-11 15:28:38 +00:00
parent 7538392e44
commit efba1939e5
12 changed files with 344 additions and 130 deletions

View File

@@ -20,6 +20,9 @@ interface Props {
const Writing: React.FC<Props> = ({ sectionId, exercise, module, index }) => {
const { currentModule, dispatch } = useExamEditorStore();
const { type, academic_url } = useExamEditorStore(
(state) => state.modules[currentModule]
);
const { generating, genResult, state } = useExamEditorStore(
(state) => state.modules[currentModule].sections.find((section) => section.sectionId === sectionId)!
);
@@ -64,11 +67,11 @@ const Writing: React.FC<Props> = ({ sectionId, exercise, module, index }) => {
}
},
onPractice: () => {
const newState = {
...state,
const newState = {
...state,
isPractice: !local.isPractice
};
setLocal((prev) => ({...prev, isPractice: !local.isPractice}))
setLocal((prev) => ({ ...prev, isPractice: !local.isPractice }))
dispatch({ type: 'UPDATE_SECTION_STATE', payload: { sectionId, update: newState, module: currentModule } });
}
});
@@ -96,7 +99,7 @@ const Writing: React.FC<Props> = ({ sectionId, exercise, module, index }) => {
<>
<div className={clsx('relative', level ? "px-4 mt-2" : "pb-2")}>
<Header
title={`${sectionId === 1 ? "Letter" : "Essay"} Instructions`}
title={`${sectionId === 1 ? (type === "academic" ? "Visual Information" : "Letter") : "Essay"} Instructions`}
description='Generate or edit the instructions for the task'
editing={editing}
handleSave={handleSave}
@@ -112,25 +115,36 @@ const Writing: React.FC<Props> = ({ sectionId, exercise, module, index }) => {
<div className={clsx(level ? "mt-2 px-4" : "mt-4")}>
{loading ?
<GenLoader module={currentModule} /> :
(
editing ? (
<div className="text-gray-600 p-4">
<AutoExpandingTextArea
value={prompt}
onChange={(text) => setPrompt(text)}
placeholder="Instructions ..."
/>
<>
{
editing ? (
<div className="text-gray-600 p-4">
<AutoExpandingTextArea
value={prompt}
onChange={(text) => setPrompt(text)}
placeholder="Instructions ..."
/>
</div>
) : (
<p className={
clsx("w-full px-7 py-8 border-2 bg-white rounded-3xl whitespace-pre-line",
prompt === "" ? "text-gray-600/50" : "text-gray-600"
)
}>
{prompt === "" ? "Instructions ..." : prompt}
</p>
)
}
{academic_url && sectionId == 1 && (
<div className="flex items-center justify-center mt-8">
<div className="max-w-lg self-center rounded-xl cursor-pointer">
{/* eslint-disable-next-line @next/next/no-img-element */}
<img src={academic_url} alt="Visual Information" />
</div>
</div>
) : (
<p className={
clsx("w-full px-7 py-8 border-2 bg-white rounded-3xl whitespace-pre-line",
prompt === "" ? "text-gray-600/50" : "text-gray-600"
)
}>
{prompt === "" ? "Instructions ..." : prompt}
</p>
)
)}
)}
</>
}
</div>
</>
);