Merged in bug-fixing-140223 (pull request #7)

Bug fixing 140223

src/components/Navbar.tsx

@@ -9,6 +9,7 @@ import moment from "moment";
 import MobileMenu from "./MobileMenu";
 import {useState} from "react";
 import {Type} from "@/interfaces/user";
+import {USER_TYPE_LABELS} from "@/resources/user";
 
 interface Props {
 	user: User;
@@ -43,8 +44,6 @@ export default function Navbar({user, path, navDisabled = false, focusMode = fal
 		return today.add(7, "days").isAfter(momentDate);
 	};
 
-	const uppercaseFirstLetter = (string: Type) => string.charAt(0).toUpperCase() + string.slice(1);
-
 	return (
 		<>
 			{user && <MobileMenu path={path} isOpen={isMenuOpen} onClose={() => setIsMenuOpen(false)} user={user} />}
@@ -72,7 +71,9 @@ export default function Navbar({user, path, navDisabled = false, focusMode = fal
 					)}
 					<Link href={disableNavigation ? "" : "/profile"} className="flex gap-6 items-center justify-end -md:hidden">
 						<img src={user.profilePicture} alt={user.name} className="w-10 h-10 rounded-full object-cover" />
-						<span className="text-right -md:hidden">{user.name} | {uppercaseFirstLetter(user.type)}</span>
+						<span className="text-right -md:hidden">
+							{user.name} | {USER_TYPE_LABELS[user.type]}
+						</span>
 					</Link>
 					<div className="cursor-pointer md:hidden" onClick={() => setIsMenuOpen(true)}>
 						<BsList className="text-mti-purple-light w-8 h-8" />

src/components/UserCard.tsx

@@ -90,7 +90,7 @@ const UserCard = ({user, loggedInUser, onClose, onViewStudents, onViewTeachers,
 				agentInformation:
 					type === "agent"
 						? {
-								companyName,
+								name: companyName,
 								commercialRegistration,
 						  }
 						: undefined,
@@ -100,13 +100,13 @@ const UserCard = ({user, loggedInUser, onClose, onViewStudents, onViewTeachers,
 								referralAgent,
 								monthlyDuration,
 								companyInformation: {
-									companyName,
+									name: companyName,
 									userAmount,
 								},
 								payment: {
 									value: paymentValue,
 									currency: paymentCurrency,
-									...referralAgent === '' ? {} : { commission: commissionValue }
+									...(referralAgent === "" ? {} : {commission: commissionValue}),
 								},
 						  }
 						: undefined,
@@ -253,7 +253,7 @@ const UserCard = ({user, loggedInUser, onClose, onViewStudents, onViewTeachers,
 							)}
 						</div>
 						<div className="flex flex-col gap-3 w-4/12">
-								{referralAgent !== '' ? (
+							{referralAgent !== "" ? (
 								<>
 									<label className="font-normal text-base text-mti-gray-dim">Commission</label>
 									<Input
@@ -264,7 +264,9 @@ const UserCard = ({user, loggedInUser, onClose, onViewStudents, onViewTeachers,
 										className="col-span-3"
 									/>
 								</>
-								) : <div />}
+							) : (
+								<div />
+							)}
 						</div>
 					</div>
 					<Divider className="w-full !m-0" />

src/dashboards/Agent.tsx

@@ -7,11 +7,7 @@ import UserList from "@/pages/(admin)/Lists/UserList";
 import {dateSorter} from "@/utils";
 import moment from "moment";
 import {useEffect, useState} from "react";
-import {
-	BsArrowLeft,
-	BsPersonFill,
-	BsBank
-} from "react-icons/bs";
+import {BsArrowLeft, BsPersonFill, BsBank} from "react-icons/bs";
 import UserCard from "@/components/UserCard";
 import useGroups from "@/hooks/useGroups";
 import {calculateAverageLevel, calculateBandScore} from "@/utils/score";
@@ -41,7 +37,8 @@ export default function AgentDashboard({user}: Props) {
 	const corporateFilter = (user: User) => user.type === "corporate";
 	const referredCorporateFilter = (x: User) =>
 		x.type === "corporate" && !!x.corporateInformation && x.corporateInformation.referralAgent === user.id;
-	const inactiveReferredCorporateFilter = (x: User) => referredCorporateFilter(x)  && (x.status === "disabled" || moment().isAfter(x.subscriptionExpirationDate));
+	const inactiveReferredCorporateFilter = (x: User) =>
+		referredCorporateFilter(x) && (x.status === "disabled" || moment().isAfter(x.subscriptionExpirationDate));
 
 	const UserDisplay = (displayUser: User) => (
 		<div

src/pages/payment-record.tsx

@@ -59,7 +59,7 @@ export const getServerSideProps = withIronSessionSsr(({req, res}) => {
 
 const columnHelper = createColumnHelper<Payment>();
 
-const PaymentCreator = ({onClose, reload}: {onClose: () => void; reload: () => void}) => {
+const PaymentCreator = ({onClose, reload, showComission = false}: {onClose: () => void; reload: () => void; showComission: boolean}) => {
 	const [corporate, setCorporate] = useState<CorporateUser>();
 	const [price, setPrice] = useState<number>(0);
 	const [currency, setCurrency] = useState<string>("EUR");
@@ -175,7 +175,7 @@ const PaymentCreator = ({onClose, reload}: {onClose: () => void; reload: () => v
 						/>
 					</div>
 				</div>
-
+				{showComission && (
 					<div className="flex gap-4 w-full">
 						<div className="flex flex-col w-full gap-3">
 							<label className="font-normal text-base text-mti-gray-dim">Commission *</label>
@@ -193,6 +193,7 @@ const PaymentCreator = ({onClose, reload}: {onClose: () => void; reload: () => v
 							/>
 						</div>
 					</div>
+				)}
 
 				<div className="flex gap-4">
 					<div className="flex flex-col w-full gap-3">
@@ -244,8 +245,13 @@ export default function PaymentRecord() {
 	const [agent, setAgent] = useState<User>();
 
 	const {user} = useUser({redirectTo: "/login"});
-	const {users} = useUsers();
-	const {payments, reload} = usePayments();
+	const {users, reload: reloadUsers} = useUsers();
+	const {payments, reload: reloadPayment} = usePayments();
+
+	const reload = () => {
+		reloadUsers();
+		reloadPayment();
+	};
 
 	useEffect(() => {
 		setDisplayPayments(
@@ -415,14 +421,18 @@ export default function PaymentRecord() {
 		}),
 		columnHelper.accessor("corporate", {
 			header: "Corporate",
-			cell: (info) => (
+			cell: (info) => {
+				const user = users.find((x) => x.id === info.row.original.corporate) as CorporateUser;
+				return (
 					<div
-					className={clsx("underline text-mti-purple-light hover:text-mti-purple-dark transition ease-in-out duration-300 cursor-pointer")}
-					onClick={() => setSelectedUser(users.find((x) => x.id === info.row.original.corporate))}>
-					{(users.find((x) => x.id === info.row.original.corporate) as CorporateUser)?.corporateInformation.companyInformation.name ||
-						(users.find((x) => x.id === info.row.original.corporate) as CorporateUser)?.name}
+						className={clsx(
+							"underline text-mti-purple-light hover:text-mti-purple-dark transition ease-in-out duration-300 cursor-pointer",
+						)}
+						onClick={() => setSelectedUser(user)}>
+						{user?.corporateInformation.companyInformation.name || user?.name}
 					</div>
-			),
+				);
+			},
 		}),
 		columnHelper.accessor("date", {
 			header: "Date",
@@ -524,7 +534,11 @@ export default function PaymentRecord() {
 					</Modal>
 
 					<Modal isOpen={isCreatingPayment} onClose={() => setIsCreatingPayment(false)}>
-						<PaymentCreator onClose={() => setIsCreatingPayment(false)} reload={reload} />
+						<PaymentCreator
+							onClose={() => setIsCreatingPayment(false)}
+							reload={reload}
+							showComission={user.type === "developer" || user.type === "admin"}
+						/>
 					</Modal>
 
 					<div className="w-full flex flex-end justify-between p-2">

src/pages/profile.tsx

@@ -64,6 +64,8 @@ export default function Home() {
 	const [gender, setGender] = useState<Gender>();
 	const [employment, setEmployment] = useState<EmploymentStatus>();
 	const [position, setPosition] = useState<string>();
+	const [companyName, setCompanyName] = useState<string>("");
+	const [commercialRegistration, setCommercialRegistration] = useState<string>("");
 
 	const profilePictureInput = useRef(null);
 
@@ -89,6 +91,10 @@ export default function Home() {
 			setGender(user.demographicInformation?.gender);
 			setEmployment(user.type === "corporate" ? undefined : user.demographicInformation?.employment);
 			setPosition(user.type === "corporate" ? user.demographicInformation?.position : undefined);
+			if(user.type === 'agent') {
+				setCompanyName(user.agentInformation?.companyName)
+				setCommercialRegistration(user.agentInformation?.commercialRegistration)
+			}
 		}
 	}, [user]);
 
@@ -219,7 +225,7 @@ export default function Home() {
 												name="companyName"
 												onChange={() => null}
 												placeholder="Enter corporate name"
-												defaultValue={user.agentInformation.companyName}
+												defaultValue={companyName}
 												disabled
 											/>
 											<Input
@@ -228,7 +234,7 @@ export default function Home() {
 												name="commercialRegistration"
 												onChange={() => null}
 												placeholder="Enter commercial registration"
-												defaultValue={user.agentInformation.commercialRegistration}
+												defaultValue={commercialRegistration}
 												disabled
 											/>
 										</div>