Merged in bug-fixing-11-jan-24 (pull request #19)

Bug fixing 11 jan 24

Approved-by: Tiago Ribeiro

src/dashboards/Admin.tsx

@@ -260,7 +260,7 @@ export default function AdminDashboard({user}: Props) {
 				/>
 				<IconCard
 					onClick={() => setPage("inactiveCorporate")}
-					Icon={BsPerson}
+					Icon={BsBank}
 					label="Inactive Corporate"
 					value={
 						users.filter((x) => x.type === "corporate" && (x.status === "disabled" || moment().isAfter(x.subscriptionExpirationDate)))

src/dashboards/Agent.tsx

@@ -40,9 +40,9 @@ export default function AgentDashboard({user}: Props) {
 	const inactiveReferredCorporateFilter = (x: User) =>
 		referredCorporateFilter(x) && (x.status === "disabled" || moment().isAfter(x.subscriptionExpirationDate));
 
-	const UserDisplay = (displayUser: User) => (
+	const UserDisplay = ({ displayUser, allowClick = true }: {displayUser: User, allowClick?: boolean}) => (
 		<div
-			onClick={() => setSelectedUser(displayUser)}
+			onClick={() => allowClick && setSelectedUser(displayUser)}
 			className="flex w-full p-4 gap-4 items-center hover:bg-mti-purple-ultralight cursor-pointer transition ease-in-out duration-300">
 			<img src={displayUser.profilePicture} alt={displayUser.name} className="rounded-full w-10 h-10" />
 			<div className="flex flex-col gap-1 items-start">
@@ -66,7 +66,7 @@ export default function AgentDashboard({user}: Props) {
 						<BsArrowLeft className="text-xl" />
 						<span>Back</span>
 					</div>
-					<h2 className="text-2xl font-semibold">Corporate ({users.filter(referredCorporateFilter).length})</h2>
+					<h2 className="text-2xl font-semibold">Referred Corporate ({users.filter(referredCorporateFilter).length})</h2>
 				</div>
 
 				<UserList user={user} filters={[referredCorporateFilter]} />
@@ -84,7 +84,7 @@ export default function AgentDashboard({user}: Props) {
 						<BsArrowLeft className="text-xl" />
 						<span>Back</span>
 					</div>
-					<h2 className="text-2xl font-semibold">Inactive Corporate ({users.filter(inactiveReferredCorporateFilter).length})</h2>
+					<h2 className="text-2xl font-semibold">Inactive Referred Corporate ({users.filter(inactiveReferredCorporateFilter).length})</h2>
 				</div>
 
 				<UserList user={user} filters={[inactiveReferredCorporateFilter]} />
@@ -117,15 +117,15 @@ export default function AgentDashboard({user}: Props) {
 			<section className="flex flex-wrap gap-2 items-center -lg:justify-center lg:gap-4 text-center">
 				<IconCard
 					onClick={() => setPage("referredCorporate")}
-					Icon={BsPersonFill}
-					label="Corporate"
+					Icon={BsBank}
+					label="Referred Corporate"
 					value={users.filter(referredCorporateFilter).length}
 					color="purple"
 				/>
 				<IconCard
 					onClick={() => setPage("inactiveReferredCorporate")}
-					Icon={BsPersonFill}
-					label="Inactive Corporate"
+					Icon={BsBank}
+					label="Inactive Referred Corporate"
 					value={users.filter(inactiveReferredCorporateFilter).length}
 					color="rose"
 				/>
@@ -140,13 +140,13 @@ export default function AgentDashboard({user}: Props) {
 
 			<section className="grid grid-cols-1 md:grid-cols-2 gap-4 w-full justify-between">
 				<div className="bg-white shadow flex flex-col rounded-xl w-full">
-					<span className="p-4">Latest Corporate</span>
+					<span className="p-4">Latest Referred Corporate</span>
 					<div className="flex flex-col items-start h-96 overflow-scroll scrollbar-hide">
 						{users
 							.filter(referredCorporateFilter)
 							.sort((a, b) => dateSorter(a, b, "desc", "registrationDate"))
 							.map((x) => (
-								<UserDisplay key={x.id} {...x} />
+								<UserDisplay key={x.id} displayUser={x} />
 							))}
 					</div>
 				</div>
@@ -157,12 +157,12 @@ export default function AgentDashboard({user}: Props) {
 							.filter(corporateFilter)
 							.sort((a, b) => dateSorter(a, b, "desc", "registrationDate"))
 							.map((x) => (
-								<UserDisplay key={x.id} {...x} />
+								<UserDisplay key={x.id} displayUser={x} allowClick={false} />
 							))}
 					</div>
 				</div>
 				<div className="bg-white shadow flex flex-col rounded-xl w-full">
-					<span className="p-4">Corporate expiring in 1 month</span>
+					<span className="p-4">Referenced corporate expiring in 1 month</span>
 					<div className="flex flex-col items-start h-96 overflow-scroll scrollbar-hide">
 						{users
 							.filter(
@@ -172,7 +172,7 @@ export default function AgentDashboard({user}: Props) {
 									moment().isBefore(moment(x.subscriptionExpirationDate)),
 							)
 							.map((x) => (
-								<UserDisplay key={x.id} {...x} />
+								<UserDisplay key={x.id} displayUser={x} />
 							))}
 					</div>
 				</div>

src/exams/pdf/group.test.report.tsx

@@ -103,13 +103,13 @@ const GroupTestReport = ({
             {title}
           </Text>
         </View>
-        <View style={styles.textPadding}>
+        <View style={styles.textMargin}>
           <Text style={defaultTextStyle}>Date of Test: {date}</Text>
         </View>
         <Text style={[styles.textFont, styles.textBold, { fontSize: 11 }]}>
           Candidate Information:
         </Text>
-        <View style={styles.textPadding}>
+        <View style={styles.textMargin}>
           <Text style={defaultTextStyle}>Name: {name}</Text>
           <Text style={defaultTextStyle}>ID: {id}</Text>
           <Text style={defaultTextStyle}>Email: {email}</Text>
@@ -193,10 +193,8 @@ const GroupTestReport = ({
                   ]}
                   key={label}
                 >
-                  <Text style={customStyles.tableCell}>
-                    {label}
-                  </Text>
-                  <View style={[customStyles.tableCell, { flex: 2}]}>
+                  <Text style={customStyles.tableCell}>{label}</Text>
+                  <View style={[customStyles.tableCell, { flex: 2 }]}>
                     <ProgressBar
                       width={200}
                       height={18}

src/exams/pdf/styles.ts

@@ -14,8 +14,8 @@ export const styles = StyleSheet.create({
   title: {
     textTransform: "uppercase",
   },
-  textPadding: {
-    margin: "8px",
+  textMargin: {
+    marginVertical: "8px",
   },
   separator: {
     width: "100%",

src/exams/pdf/test.report.footer.tsx

@@ -3,15 +3,20 @@ import { styles } from "./styles";
 import { View, Text } from "@react-pdf/renderer";
 
 const TestReportFooter = () => (
-  <View style={[{ paddingTop: 30, fontSize: 5, position: 'absolute', bottom: 30, left: 35, right: 35 }, styles.textFont,]}>
-    <View
-      style={[
-        styles.spacedRow,
-        {
-          paddingHorizontal: 10,
-        },
-      ]}
-    >
+  <View
+    style={[
+      {
+        paddingTop: 30,
+        fontSize: 5,
+        position: "absolute",
+        bottom: 30,
+        left: 35,
+        right: 35,
+      },
+      styles.textFont,
+    ]}
+  >
+    <View style={[styles.spacedRow, styles.textMargin]}>
       <View>
         <Text>Validity</Text>
         <Text>
@@ -52,4 +57,4 @@ const TestReportFooter = () => (
   </View>
 );
 
-export default TestReportFooter;
+export default TestReportFooter;

src/exams/pdf/test.report.tsx

@@ -68,19 +68,19 @@ const TestReport = ({
             {title}
           </Text>
         </View>
-        <View style={styles.textPadding}>
+        <View style={styles.textMargin}>
           <Text style={defaultTextStyle}>Date of Test: {date}</Text>
         </View>
         <Text style={[styles.textFont, styles.textBold, { fontSize: 11 }]}>
           Candidate Information:
         </Text>
-        <View style={styles.textPadding}>
+        <View style={styles.textMargin}>
           <Text style={defaultTextStyle}>Name: {name}</Text>
           <Text style={defaultTextStyle}>ID: {id}</Text>
           <Text style={defaultTextStyle}>Email: {email}</Text>
           <Text style={defaultTextStyle}>Gender: {gender}</Text>
         </View>
-        <View style={{ height: '120px' }}>
+        <View style={{ height: "120px" }}>
           <Text
             style={[
               styles.textFont,
@@ -131,7 +131,9 @@ const TestReport = ({
             }}
           >
             {testDetails
-              .filter(({ suggestions, evaluation }) => suggestions || evaluation)
+              .filter(
+                ({ suggestions, evaluation }) => suggestions || evaluation
+              )
               .map(({ module, suggestions, evaluation }) => (
                 <View key={module} style={customStyles.testDetails}>
                   <Text style={[...defaultSkillsTitleStyle, styles.textBold]}>
@@ -139,15 +141,11 @@ const TestReport = ({
                   </Text>
                   <Text style={defaultSkillsTextStyle}>{evaluation}</Text>
                   <Text style={defaultSkillsTextStyle}>{suggestions}</Text>
-
                 </View>
               ))}
           </View>
           <View style={styles.alignRightRow}>
-            <Image
-              src={qrcode}
-              style={styles.qrcode}
-            />
+            <Image src={qrcode} style={styles.qrcode} />
           </View>
         </View>
         <View style={[{ paddingBottom: 30 }, styles.separator]}></View>