From 6f6c5a42097f1a18a0a0a206ef9e48f266c22fa7 Mon Sep 17 00:00:00 2001
From: Joao Correia <joao.correia@ecrop.dev>
Date: Sun, 9 Feb 2025 15:44:37 +0000
Subject: [PATCH 1/4] make first step approved by default

---
 src/lib/createWorkflowsOnExamCreation.ts | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/lib/createWorkflowsOnExamCreation.ts b/src/lib/createWorkflowsOnExamCreation.ts
index f72d9db7..e2a791af 100644
--- a/src/lib/createWorkflowsOnExamCreation.ts
+++ b/src/lib/createWorkflowsOnExamCreation.ts
@@ -55,6 +55,9 @@ export async function createApprovalWorkflowOnExamCreation(examAuthor: string, e
         configuredWorkflow.examId = examId;
         configuredWorkflow.entityId = entity;
         configuredWorkflow.startDate = Date.now();
+        configuredWorkflow.steps[0].completed = true;
+        configuredWorkflow.steps[0].completedBy = examAuthor;
+        configuredWorkflow.steps[0].completedDate = Date.now();
 
         try {
             await createApprovalWorkflow("active-workflows", configuredWorkflow);

From 9ae6b8e8941a7eb0ba62435f8ae03312008a9944 Mon Sep 17 00:00:00 2001
From: Joao Correia <joao.correia@ecrop.dev>
Date: Sun, 9 Feb 2025 16:55:50 +0000
Subject: [PATCH 2/4] make sure admin id is passed to step component if the
 admin is not assigned to the workflow but approved a step.

---
 src/pages/approval-workflows/[id]/index.tsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/pages/approval-workflows/[id]/index.tsx b/src/pages/approval-workflows/[id]/index.tsx
index 6cdaec9a..64a8026e 100644
--- a/src/pages/approval-workflows/[id]/index.tsx
+++ b/src/pages/approval-workflows/[id]/index.tsx
@@ -58,7 +58,13 @@ export const getServerSideProps = withIronSessionSsr(async ({ req, res, params }
     const allAssigneeIds: string[] = [
         ...new Set(
             workflow.steps
-                .map(step => step.assignees)
+                .map((step) => {
+                    const assignees = step.assignees;
+                    if (step.completedBy) {
+                        assignees.push(step.completedBy);
+                    }
+                    return assignees;
+                })
                 .flat()
         )
     ];

From 75b4643918a2b2da113b92a6e43019943e2a7047 Mon Sep 17 00:00:00 2001
From: Joao Correia <joao.correia@ecrop.dev>
Date: Sun, 9 Feb 2025 17:37:19 +0000
Subject: [PATCH 3/4] Add button to submit exam without approval process

---
 .../ExamEditor/SettingsEditor/index.tsx       | 18 ++++++++++--
 .../ExamEditor/SettingsEditor/level.tsx       |  5 ++--
 .../SettingsEditor/listening/index.tsx        |  5 ++--
 .../SettingsEditor/reading/index.tsx          |  5 ++--
 .../SettingsEditor/speaking/index.tsx         |  5 ++--
 .../SettingsEditor/writing/index.tsx          |  5 ++--
 src/interfaces/exam.ts                        |  1 +
 src/pages/api/exam/[module]/index.ts          | 28 +++++++++++--------
 8 files changed, 47 insertions(+), 25 deletions(-)

diff --git a/src/components/ExamEditor/SettingsEditor/index.tsx b/src/components/ExamEditor/SettingsEditor/index.tsx
index faf6bcbc..be98e4b4 100644
--- a/src/components/ExamEditor/SettingsEditor/index.tsx
+++ b/src/components/ExamEditor/SettingsEditor/index.tsx
@@ -19,7 +19,7 @@ interface SettingsEditorProps {
     children?: ReactNode;
     canPreview: boolean;
     canSubmit: boolean;
-    submitModule: () => void;
+    submitModule: (requiresApproval: boolean) => void;
     preview: () => void;
 }
 
@@ -148,19 +148,31 @@ const SettingsEditor: React.FC<SettingsEditorProps> = ({
                     </div>
                 </Dropdown>
                 {children}
-                <div className="flex flex-row justify-between mt-4">
+                <div className="flex flex-col gap-3 mt-4">
                     <button
                         className={clsx(
                             "flex items-center justify-center px-4 py-2 text-white rounded-xl transition-colors duration-300",
                             `bg-ielts-${module}/70 border border-ielts-${module} hover:bg-ielts-${module} disabled:bg-ielts-${module}/30`,
                             "disabled:cursor-not-allowed disabled:text-gray-200"
                         )}
-                        onClick={submitModule}
+                        onClick={() => submitModule(true)}
                         disabled={!canSubmit}
                     >
                         <FaFileUpload className="mr-2" size={18} />
                         Submit Module as Exam
                     </button>
+                    <button
+                        className={clsx(
+                            "flex items-center justify-center px-4 py-2 text-white rounded-xl transition-colors duration-300",
+                            `bg-ielts-${module}/70 border border-ielts-${module} hover:bg-ielts-${module} disabled:bg-ielts-${module}/30`,
+                            "disabled:cursor-not-allowed disabled:text-gray-200"
+                        )}
+                        onClick={() => submitModule(false)}
+                        disabled={!canSubmit}
+                    >
+                        <FaFileUpload className="mr-2" size={18} />
+                        Submit Module as Exam Without Approval Process
+                    </button>
                     <button
                         className={clsx(
                             "flex items-center justify-center px-4 py-2 text-white rounded-xl transition-colors duration-300",
diff --git a/src/components/ExamEditor/SettingsEditor/level.tsx b/src/components/ExamEditor/SettingsEditor/level.tsx
index 02e97fd6..76b82bb6 100644
--- a/src/components/ExamEditor/SettingsEditor/level.tsx
+++ b/src/components/ExamEditor/SettingsEditor/level.tsx
@@ -76,7 +76,7 @@ const LevelSettings: React.FC = () => {
         });
     });
 
-    const submitLevel = async () => {
+    const submitLevel = async (requiresApproval: boolean) => {
         if (title === "") {
             toast.error("Enter a title for the exam!");
             return;
@@ -195,7 +195,8 @@ const LevelSettings: React.FC = () => {
                         category: s.settings.category
                     };
                 }).filter(part => part.exercises.length > 0),
-                isDiagnostic: true, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed.
+                requiresApproval: requiresApproval,
+                isDiagnostic: requiresApproval ? true : false, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed.
                 minTimer,
                 module: "level",
                 id: title,
diff --git a/src/components/ExamEditor/SettingsEditor/listening/index.tsx b/src/components/ExamEditor/SettingsEditor/listening/index.tsx
index c1a5fa7c..c2a862d3 100644
--- a/src/components/ExamEditor/SettingsEditor/listening/index.tsx
+++ b/src/components/ExamEditor/SettingsEditor/listening/index.tsx
@@ -65,7 +65,7 @@ const ListeningSettings: React.FC = () => {
         }
     ];
 
-    const submitListening = async () => {
+    const submitListening = async (requiresApproval: boolean) => {
         if (title === "") {
             toast.error("Enter a title for the exam!");
             return;
@@ -138,7 +138,8 @@ const ListeningSettings: React.FC = () => {
                             category: s.settings.category
                         };
                     }),
-                    isDiagnostic: true, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed.
+                    requiresApproval: requiresApproval,
+                    isDiagnostic: requiresApproval ? true : false, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed.
                     minTimer,
                     module: "listening",
                     id: title,
diff --git a/src/components/ExamEditor/SettingsEditor/reading/index.tsx b/src/components/ExamEditor/SettingsEditor/reading/index.tsx
index 30424552..15615a8b 100644
--- a/src/components/ExamEditor/SettingsEditor/reading/index.tsx
+++ b/src/components/ExamEditor/SettingsEditor/reading/index.tsx
@@ -60,7 +60,7 @@ const ReadingSettings: React.FC = () => {
       (s.state as ReadingPart).exercises.length > 0
   );
 
-  const submitReading = () => {
+  const submitReading = (requiresApproval: boolean) => {
     if (title === "") {
       toast.error("Enter a title for the exam!");
       return;
@@ -74,7 +74,8 @@ const ReadingSettings: React.FC = () => {
           category: localSettings.category,
         };
       }),
-      isDiagnostic: true, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed.
+      requiresApproval: requiresApproval,
+      isDiagnostic: requiresApproval ? true : false, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed.
       minTimer,
       module: "reading",
       id: title,
diff --git a/src/components/ExamEditor/SettingsEditor/speaking/index.tsx b/src/components/ExamEditor/SettingsEditor/speaking/index.tsx
index 297e864c..6d2be4df 100644
--- a/src/components/ExamEditor/SettingsEditor/speaking/index.tsx
+++ b/src/components/ExamEditor/SettingsEditor/speaking/index.tsx
@@ -84,7 +84,7 @@ const SpeakingSettings: React.FC = () => {
         });
     })();
 
-    const submitSpeaking = async () => {
+    const submitSpeaking = async (requiresApproval: boolean) => {
         if (title === "") {
           toast.error("Enter a title for the exam!");
           return;
@@ -181,7 +181,8 @@ const SpeakingSettings: React.FC = () => {
             minTimer,
             module: "speaking",
             id: title,
-            isDiagnostic: true, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed.
+            requiresApproval: requiresApproval,
+            isDiagnostic: requiresApproval ? true : false, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed.
             variant: undefined,
             difficulty,
             instructorGender: "varied",
diff --git a/src/components/ExamEditor/SettingsEditor/writing/index.tsx b/src/components/ExamEditor/SettingsEditor/writing/index.tsx
index 8f077d2f..8c6b79c1 100644
--- a/src/components/ExamEditor/SettingsEditor/writing/index.tsx
+++ b/src/components/ExamEditor/SettingsEditor/writing/index.tsx
@@ -88,7 +88,7 @@ const WritingSettings: React.FC = () => {
         openDetachedTab("popout?type=Exam&module=writing", router)
     }
 
-    const submitWriting = async () => {
+    const submitWriting = async (requiresApproval: boolean) => {
         if (title === "") {
             toast.error("Enter a title for the exam!");
             return;
@@ -131,7 +131,8 @@ const WritingSettings: React.FC = () => {
                 minTimer,
                 module: "writing",
                 id: title,
-                isDiagnostic: true, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed.
+                requiresApproval: requiresApproval,
+                isDiagnostic: requiresApproval ? true : false, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed.
                 variant: undefined,
                 difficulty,
                 access,
diff --git a/src/interfaces/exam.ts b/src/interfaces/exam.ts
index 201ce888..3fc363cc 100644
--- a/src/interfaces/exam.ts
+++ b/src/interfaces/exam.ts
@@ -28,6 +28,7 @@ export interface ExamBase {
 	createdAt?: string; // option as it has been added later
 	access: AccessType;
 	label?: string;
+	requiresApproval?: boolean;
 }
 export interface ReadingExam extends ExamBase {
 	module: "reading";
diff --git a/src/pages/api/exam/[module]/index.ts b/src/pages/api/exam/[module]/index.ts
index cedda8f1..966bf502 100644
--- a/src/pages/api/exam/[module]/index.ts
+++ b/src/pages/api/exam/[module]/index.ts
@@ -98,21 +98,25 @@ async function POST(req: NextApiRequest, res: NextApiResponse) {
 			// create workflow only if exam is being created for the first time
 			if (docSnap === null) {
 				try {
-					const { successCount, totalCount } = await createApprovalWorkflowOnExamCreation(exam.createdBy, exam.entities, exam.id, module);
-
-					if (isAdmin(user)) {
+					if (exam.requiresApproval === false) {
+						responseStatus = 200;
+						responseMessage = `Successfully created exam "${exam.id}" and skipped Approval Workflow due to user request.`;
+					} else if (isAdmin(user)) {
 						responseStatus = 200;
 						responseMessage = `Successfully created exam "${exam.id}" and skipped Approval Workflow due to admin rights.`;
-					} else if (successCount === totalCount) {
-						responseStatus = 200;
-						responseMessage = `Successfully created exam "${exam.id}" and started its Approval Workflow.`;
-						/* responseMessage = `Successfully created exam "${exam.id}" and started its Approval Workflow(s).`; */
-					} else if (successCount > 0) {
-						responseStatus = 207;
-						responseMessage = `Successfully created exam with ID: "${exam.id}" but was not able to start/find an Approval Workflow for all the author's entities.`;
 					} else {
-						responseStatus = 207;
-						responseMessage = `Successfully created exam with ID: "${exam.id}" but skipping approval process because no approval workflow was found configured for the exam author.`;
+						const { successCount, totalCount } = await createApprovalWorkflowOnExamCreation(exam.createdBy, exam.entities, exam.id, module);
+	
+						if (successCount === totalCount) {
+							responseStatus = 200;
+							responseMessage = `Successfully created exam "${exam.id}" and started its Approval Workflow.`;
+						} else if (successCount > 0) {
+							responseStatus = 207;
+							responseMessage = `Successfully created exam with ID: "${exam.id}" but was not able to start/find an Approval Workflow for all the author's entities.`;
+						} else {
+							responseStatus = 207;
+							responseMessage = `Successfully created exam with ID: "${exam.id}" but skipping approval process because no approval workflow was found configured for the exam author.`;
+						}
 					}
 				} catch (error) {
 					console.error("Workflow creation error:", error);

From d5bffc9baddb4fa5efbadf2979e500e95ce3ab68 Mon Sep 17 00:00:00 2001
From: Joao Correia <joao.correia@ecrop.dev>
Date: Sun, 9 Feb 2025 18:10:59 +0000
Subject: [PATCH 4/4] Add pagination to approval workflows table and change
 module styling to match project colors.

---
 src/pages/approval-workflows/index.tsx | 65 +++++++++++++++++++++++---
 1 file changed, 59 insertions(+), 6 deletions(-)

diff --git a/src/pages/approval-workflows/index.tsx b/src/pages/approval-workflows/index.tsx
index 58d4e54e..07bfc513 100644
--- a/src/pages/approval-workflows/index.tsx
+++ b/src/pages/approval-workflows/index.tsx
@@ -1,24 +1,22 @@
 import Tip from "@/components/ApprovalWorkflows/Tip";
-import Layout from "@/components/High/Layout";
 import Button from "@/components/Low/Button";
 import Input from "@/components/Low/Input";
 import Select from "@/components/Low/Select";
 import useApprovalWorkflows from "@/hooks/useApprovalWorkflows";
-import { useAllowedEntities, useAllowedEntitiesSomePermissions, useEntityPermission } from "@/hooks/useEntityPermissions";
 import { Module, ModuleTypeLabels } from "@/interfaces";
 import { ApprovalWorkflow, ApprovalWorkflowStatus, ApprovalWorkflowStatusLabel, StepTypeLabel } from "@/interfaces/approval.workflow";
-import { Entity, EntityWithRoles } from "@/interfaces/entity";
+import { EntityWithRoles } from "@/interfaces/entity";
 import { User } from "@/interfaces/user";
 import { sessionOptions } from "@/lib/session";
 import { mapBy, redirect, serialize } from "@/utils";
 import { requestUser } from "@/utils/api";
 import { getApprovalWorkflows } from "@/utils/approval.workflows.be";
-import { getEntities, getEntitiesWithRoles } from "@/utils/entities.be";
+import { getEntitiesWithRoles } from "@/utils/entities.be";
 import { shouldRedirectHome } from "@/utils/navigation.disabled";
 import { doesEntityAllow, findAllowedEntities } from "@/utils/permissions";
 import { isAdmin } from "@/utils/users";
 import { getSpecificUsers } from "@/utils/users.be";
-import { createColumnHelper, flexRender, getCoreRowModel, useReactTable } from "@tanstack/react-table";
+import { createColumnHelper, flexRender, getCoreRowModel, useReactTable, getPaginationRowModel } from "@tanstack/react-table";
 import axios from "axios";
 import clsx from "clsx";
 import { withIronSessionSsr } from "iron-session/next";
@@ -192,7 +190,15 @@ export default function ApprovalWorkflows({ user, initialWorkflows, workflowsAss
 					{info.getValue().map((module: Module, index: number) => (
 						<span
 							key={index}
-							className="inline-block rounded-full px-3 py-1 text-sm font-medium bg-indigo-100 border border-indigo-300 text-indigo-900">
+							/* className="inline-block rounded-full px-3 py-1 text-sm font-medium bg-indigo-100 border border-indigo-300 text-indigo-900"> */
+							className={clsx("inline-block rounded-full px-3 py-1 text-sm font-medium text-white",
+								module === "speaking" ? "bg-ielts-speaking" :
+									module === "reading" ? "bg-ielts-reading" :
+										module === "writing" ? "bg-ielts-writing" :
+											module === "listening" ? "bg-ielts-listening" :
+												module === "level" ? "bg-ielts-level" :
+													"bg-slate-700"
+							)}>
 							{ModuleTypeLabels[module]}
 						</span>
 					))}
@@ -297,10 +303,20 @@ export default function ApprovalWorkflows({ user, initialWorkflows, workflowsAss
 		}),
 	];
 
+	const [pagination, setPagination] = useState({
+		pageIndex: 0,
+		pageSize: 10,
+	});
+
 	const table = useReactTable({
 		data: filteredWorkflows,
 		columns: columns,
+		state: {
+			pagination,
+		},
+		onPaginationChange: setPagination,
 		getCoreRowModel: getCoreRowModel(),
+		getPaginationRowModel: getPaginationRowModel(),
 	});
 
 	return (
@@ -396,6 +412,43 @@ export default function ApprovalWorkflows({ user, initialWorkflows, workflowsAss
 						))}
 					</tbody>
 				</table>
+				<div className="mt-2 flex flex-row gap-2 w-full justify-end items-center">
+					<button
+						onClick={() => table.setPageIndex(0)}
+						disabled={!table.getCanPreviousPage()}
+						className="px-3 py-2 rounded-md text-sm font-semibold text-mti-purple-ultradark border border-mti-purple-light 
+        bg-white hover:bg-mti-purple-light hover:text-white transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+					>
+						{"<<"}
+					</button>
+					<button
+						onClick={() => table.previousPage()}
+						disabled={!table.getCanPreviousPage()}
+						className="px-3 py-2 rounded-md text-sm font-semibold text-mti-purple-ultradark border border-mti-purple-light 
+        bg-white hover:bg-mti-purple-light hover:text-white transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+					>
+						{"<"}
+					</button>
+					<span className="px-4 text-sm font-medium">
+						Page {table.getState().pagination.pageIndex + 1} of {table.getPageCount()}
+					</span>
+					<button
+						onClick={() => table.nextPage()}
+						disabled={!table.getCanNextPage()}
+						className="px-3 py-2 rounded-md text-sm font-semibold text-mti-purple-ultradark border border-mti-purple-light 
+        bg-white hover:bg-mti-purple-light hover:text-white transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+					>
+						{">"}
+					</button>
+					<button
+						onClick={() => table.setPageIndex(table.getPageCount() - 1)}
+						disabled={!table.getCanNextPage()}
+						className="px-3 py-2 rounded-md text-sm font-semibold text-mti-purple-ultradark border border-mti-purple-light 
+        bg-white hover:bg-mti-purple-light hover:text-white transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+					>
+						{">>"}
+					</button>
+				</div>
 			</div>
 		</>
 	);