change to a single checkbox filter for all modules
This commit is contained in:
@@ -101,14 +101,6 @@ interface Props {
|
||||
|
||||
const SIZE = 9;
|
||||
|
||||
type ExamApprovalFilterMap = {
|
||||
writing: boolean;
|
||||
reading: boolean;
|
||||
listening: boolean;
|
||||
speaking: boolean;
|
||||
level: boolean;
|
||||
};
|
||||
|
||||
export default function AssignmentsPage({
|
||||
user,
|
||||
users,
|
||||
@@ -151,20 +143,8 @@ export default function AssignmentsPage({
|
||||
const [useRandomExams, setUseRandomExams] = useState(true);
|
||||
const [examIDs, setExamIDs] = useState<{ id: string; module: Module }[]>([]);
|
||||
|
||||
const [showExamsThatRequiredApproval, setShowExamsThatRequiredApproval] = useState<ExamApprovalFilterMap>({
|
||||
writing: true,
|
||||
reading: true,
|
||||
listening: true,
|
||||
speaking: true,
|
||||
level: true,
|
||||
});
|
||||
const [showExamsThatDidntRequireApproval, setShowExamsThatDidntRequireApproval] = useState<ExamApprovalFilterMap>({
|
||||
writing: true,
|
||||
reading: true,
|
||||
listening: true,
|
||||
speaking: true,
|
||||
level: true,
|
||||
});
|
||||
const [showApprovedExams, setShowApprovedExams] = useState<boolean>(true);
|
||||
const [showNonApprovedExams, setShowNonApprovedExams] = useState<boolean>(true);
|
||||
|
||||
const { exams } = useExams();
|
||||
const router = useRouter();
|
||||
@@ -524,69 +504,64 @@ export default function AssignmentsPage({
|
||||
Random Exams
|
||||
</Checkbox>
|
||||
{!useRandomExams && (
|
||||
<div className="grid md:grid-cols-2 w-full gap-4">
|
||||
{selectedModules.map((module) => (
|
||||
<div key={module} className="flex flex-col gap-3 w-full">
|
||||
<div className="flex flex-row gap-6">
|
||||
<>
|
||||
<Checkbox
|
||||
isChecked={showApprovedExams}
|
||||
onChange={() => {
|
||||
setShowApprovedExams((prev) => !prev)
|
||||
}}
|
||||
>
|
||||
Show approved exams
|
||||
</Checkbox>
|
||||
<Checkbox
|
||||
isChecked={showNonApprovedExams}
|
||||
onChange={() => {
|
||||
setShowNonApprovedExams((prev) => !prev)
|
||||
}}
|
||||
>
|
||||
Show non-approved exams
|
||||
</Checkbox>
|
||||
<div className="grid md:grid-cols-2 w-full gap-4">
|
||||
{selectedModules.map((module) => (
|
||||
<div key={module} className="flex flex-col gap-3 w-full">
|
||||
<label className="font-normal text-base text-mti-gray-dim">
|
||||
{capitalize(module)} Exam
|
||||
</label>
|
||||
<Checkbox
|
||||
isChecked={showExamsThatRequiredApproval[module]}
|
||||
onChange={() => {
|
||||
setShowExamsThatRequiredApproval(prev => ({
|
||||
...prev,
|
||||
[module]: !prev[module],
|
||||
}))
|
||||
<Select
|
||||
isClearable
|
||||
value={{
|
||||
value:
|
||||
examIDs.find((e) => e.module === module)?.id ||
|
||||
null,
|
||||
label:
|
||||
examIDs.find((e) => e.module === module)?.id || "",
|
||||
}}
|
||||
>
|
||||
Show exams that required approval
|
||||
</Checkbox>
|
||||
<Checkbox
|
||||
isChecked={showExamsThatDidntRequireApproval[module]}
|
||||
onChange={() => {
|
||||
setShowExamsThatDidntRequireApproval(prev => ({
|
||||
...prev,
|
||||
[module]: !prev[module],
|
||||
}))
|
||||
}}
|
||||
>
|
||||
Show exams that did not require approval
|
||||
</Checkbox>
|
||||
onChange={(value) =>
|
||||
value
|
||||
? setExamIDs((prev) => [
|
||||
...prev.filter((x) => x.module !== module),
|
||||
{ id: value.value!, module },
|
||||
])
|
||||
: setExamIDs((prev) =>
|
||||
prev.filter((x) => x.module !== module)
|
||||
)
|
||||
}
|
||||
options={exams
|
||||
.filter((x) =>
|
||||
!x.isDiagnostic &&
|
||||
x.module === module &&
|
||||
x.access !== "confidential" &&
|
||||
(
|
||||
(x.requiresApproval && showApprovedExams) ||
|
||||
(!x.requiresApproval && showNonApprovedExams)
|
||||
)
|
||||
)
|
||||
.map((x) => ({ value: x.id, label: x.id }))}
|
||||
/>
|
||||
</div>
|
||||
<Select
|
||||
isClearable
|
||||
value={{
|
||||
value:
|
||||
examIDs.find((e) => e.module === module)?.id ||
|
||||
null,
|
||||
label:
|
||||
examIDs.find((e) => e.module === module)?.id || "",
|
||||
}}
|
||||
onChange={(value) =>
|
||||
value
|
||||
? setExamIDs((prev) => [
|
||||
...prev.filter((x) => x.module !== module),
|
||||
{ id: value.value!, module },
|
||||
])
|
||||
: setExamIDs((prev) =>
|
||||
prev.filter((x) => x.module !== module)
|
||||
)
|
||||
}
|
||||
options={exams
|
||||
.filter((x) =>
|
||||
!x.isDiagnostic &&
|
||||
x.module === module &&
|
||||
(
|
||||
(x.requiresApproval && showExamsThatRequiredApproval[module]) ||
|
||||
(!x.requiresApproval && showExamsThatDidntRequireApproval[module])
|
||||
)
|
||||
)
|
||||
.map((x) => ({ value: x.id, label: x.id }))}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user