mirror of
https://github.com/alexmickelson/canvasManagement.git
synced 2026-03-25 23:28:33 -06:00
will work on help later
This commit is contained in:
@@ -30,6 +30,7 @@ export default function EditQuiz({
|
|||||||
const updateQuizMutation = useUpdateQuizMutation();
|
const updateQuizMutation = useUpdateQuizMutation();
|
||||||
const [quizText, setQuizText] = useState(quizMarkdownUtils.toMarkdown(quiz));
|
const [quizText, setQuizText] = useState(quizMarkdownUtils.toMarkdown(quiz));
|
||||||
const [error, setError] = useState("");
|
const [error, setError] = useState("");
|
||||||
|
const [showHelp, setShowHelp] = useState(false);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const delay = 500;
|
const delay = 500;
|
||||||
@@ -60,6 +61,8 @@ export default function EditQuiz({
|
|||||||
}, [moduleName, quiz, quizName, quizText, updateQuizMutation]);
|
}, [moduleName, quiz, quizName, quizText, updateQuizMutation]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
<>
|
||||||
|
{showHelp && <div className="w-72"> help here</div>}
|
||||||
<div className="h-full flex flex-col">
|
<div className="h-full flex flex-col">
|
||||||
<div className="columns-2 min-h-0 flex-1">
|
<div className="columns-2 min-h-0 flex-1">
|
||||||
<div className="flex-1 h-full">
|
<div className="flex-1 h-full">
|
||||||
@@ -70,17 +73,24 @@ export default function EditQuiz({
|
|||||||
<QuizPreview quiz={quiz} />
|
<QuizPreview quiz={quiz} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<QuizButtons moduleName={moduleName} quizName={quizName} />
|
<QuizButtons
|
||||||
|
moduleName={moduleName}
|
||||||
|
quizName={quizName}
|
||||||
|
toggleHelp={() => setShowHelp((h) => !h)}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function QuizButtons({
|
function QuizButtons({
|
||||||
moduleName,
|
moduleName,
|
||||||
quizName,
|
quizName,
|
||||||
|
toggleHelp,
|
||||||
}: {
|
}: {
|
||||||
quizName: string;
|
quizName: string;
|
||||||
moduleName: string;
|
moduleName: string;
|
||||||
|
toggleHelp: () => void;
|
||||||
}) {
|
}) {
|
||||||
const { data: canvasQuizzes } = useCanvasQuizzesQuery();
|
const { data: canvasQuizzes } = useCanvasQuizzesQuery();
|
||||||
const { data: quiz } = useQuizQuery(moduleName, quizName);
|
const { data: quiz } = useQuizQuery(moduleName, quizName);
|
||||||
@@ -92,7 +102,11 @@ function QuizButtons({
|
|||||||
const quizInCanvas = canvasQuizzes.find((c) => c.title === quizName);
|
const quizInCanvas = canvasQuizzes.find((c) => c.title === quizName);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="p-5 flex flex-row gap-3 justify-end">
|
<div className="p-5 flex flex-row justify-between">
|
||||||
|
<div>
|
||||||
|
<button onClick={toggleHelp}>Toggle Help</button>
|
||||||
|
</div>
|
||||||
|
<div className="flex flex-row gap-3 justify-end">
|
||||||
{(addToCanvas.isPending || deleteFromCanvas.isPending) && <Spinner />}
|
{(addToCanvas.isPending || deleteFromCanvas.isPending) && <Spinner />}
|
||||||
{quizInCanvas && !quizInCanvas.published && (
|
{quizInCanvas && !quizInCanvas.published && (
|
||||||
<div className="text-rose-300 my-auto">Not Published</div>
|
<div className="text-rose-300 my-auto">Not Published</div>
|
||||||
@@ -128,5 +142,6 @@ function QuizButtons({
|
|||||||
Go Back
|
Go Back
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user