change to a single checkbox filter for all modules

src/pages/assignments/creator/index.tsx

@@ -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,36 +504,29 @@ export default function AssignmentsPage({
                 Random Exams
               </Checkbox>
               {!useRandomExams && (
+                <>
+                  <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">
-                      <div className="flex flex-row gap-6">
                         <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],
-                            }))
-                          }}
-                        >
-                          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>
-                      </div>
                         <Select
                           isClearable
                           value={{
@@ -577,9 +550,10 @@ export default function AssignmentsPage({
                             .filter((x) =>
                               !x.isDiagnostic &&
                               x.module === module &&
+                              x.access !== "confidential" &&
                               (
-                              (x.requiresApproval && showExamsThatRequiredApproval[module]) ||
-                              (!x.requiresApproval && showExamsThatDidntRequireApproval[module])
+                                (x.requiresApproval && showApprovedExams) ||
+                                (!x.requiresApproval && showNonApprovedExams)
                               )
                             )
                             .map((x) => ({ value: x.id, label: x.id }))}
@@ -587,6 +561,7 @@ export default function AssignmentsPage({
                       </div>
                     ))}
                   </div>
+                </>
               )}
             </div>
           )}