ENCOA-272

This commit is contained in:
Tiago Ribeiro
2024-12-11 11:58:52 +00:00
parent 6a6c4661c4
commit d074ec390c
46 changed files with 1940 additions and 6423 deletions

View File

@@ -1,16 +1,16 @@
/* eslint-disable @next/next/no-img-element */
import Head from "next/head";
import {withIronSessionSsr} from "iron-session/next";
import {sessionOptions} from "@/lib/session";
import {ChangeEvent, Dispatch, ReactNode, SetStateAction, useEffect, useRef, useState} from "react";
import { withIronSessionSsr } from "iron-session/next";
import { sessionOptions } from "@/lib/session";
import { ChangeEvent, Dispatch, ReactNode, SetStateAction, useEffect, useRef, useState } from "react";
import useUser from "@/hooks/useUser";
import {toast, ToastContainer} from "react-toastify";
import { toast, ToastContainer } from "react-toastify";
import Layout from "@/components/High/Layout";
import Input from "@/components/Low/Input";
import Button from "@/components/Low/Button";
import Link from "next/link";
import axios from "axios";
import {ErrorMessage} from "@/constants/errors";
import { ErrorMessage } from "@/constants/errors";
import clsx from "clsx";
import {
CorporateUser,
@@ -23,32 +23,32 @@ import {
Group,
} from "@/interfaces/user";
import CountrySelect from "@/components/Low/CountrySelect";
import {shouldRedirectHome} from "@/utils/navigation.disabled";
import { shouldRedirectHome } from "@/utils/navigation.disabled";
import moment from "moment";
import {BsCamera, BsQuestionCircleFill} from "react-icons/bs";
import {USER_TYPE_LABELS} from "@/resources/user";
import { BsCamera, BsQuestionCircleFill } from "react-icons/bs";
import { USER_TYPE_LABELS } from "@/resources/user";
import useGroups from "@/hooks/useGroups";
import useUsers from "@/hooks/useUsers";
import {convertBase64, redirect} from "@/utils";
import {Divider} from "primereact/divider";
import { convertBase64, redirect } from "@/utils";
import { Divider } from "primereact/divider";
import GenderInput from "@/components/High/GenderInput";
import EmploymentStatusInput from "@/components/High/EmploymentStatusInput";
import TimezoneSelect from "@/components/Low/TImezoneSelect";
import Modal from "@/components/Modal";
import {Module} from "@/interfaces";
import { Module } from "@/interfaces";
import ModuleLevelSelector from "@/components/Medium/ModuleLevelSelector";
import Select from "@/components/Low/Select";
import {InstructorGender} from "@/interfaces/exam";
import {capitalize} from "lodash";
import { InstructorGender } from "@/interfaces/exam";
import { capitalize } from "lodash";
import TopicModal from "@/components/Medium/TopicModal";
import {v4} from "uuid";
import {checkAccess, getTypesOfUser} from "@/utils/permissions";
import {getParticipantGroups, getUserCorporate} from "@/utils/groups.be";
import {InferGetServerSidePropsType} from "next";
import {getUsers} from "@/utils/users.be";
import { v4 } from "uuid";
import { checkAccess, getTypesOfUser } from "@/utils/permissions";
import { getParticipantGroups, getUserCorporate } from "@/utils/groups.be";
import { InferGetServerSidePropsType } from "next";
import { getUsers } from "@/utils/users.be";
import { requestUser } from "@/utils/api";
export const getServerSideProps = withIronSessionSsr(async ({req, res}) => {
export const getServerSideProps = withIronSessionSsr(async ({ req, res }) => {
const user = await requestUser(req, res)
if (!user) return redirect("/login")
@@ -72,9 +72,9 @@ interface Props {
linkedCorporate?: CorporateUser | MasterCorporateUser;
}
const DoubleColumnRow = ({children}: {children: ReactNode}) => <div className="flex flex-col lg:flex-row gap-8 w-full">{children}</div>;
const DoubleColumnRow = ({ children }: { children: ReactNode }) => <div className="flex flex-col lg:flex-row gap-8 w-full">{children}</div>;
function UserProfile({user, mutateUser, linkedCorporate, groups, users}: Props) {
function UserProfile({ user, mutateUser, linkedCorporate, groups, users }: Props) {
const [bio, setBio] = useState(user.bio || "");
const [name, setName] = useState(user.name || "");
const [email, setEmail] = useState(user.email || "");
@@ -182,21 +182,21 @@ function UserProfile({user, mutateUser, linkedCorporate, groups, users}: Props)
passport_id,
timezone,
},
...(user.type === "corporate" ? {corporateInformation} : {}),
...(user.type === "corporate" ? { corporateInformation } : {}),
...(user.type === "agent"
? {
agentInformation: {
companyName,
commercialRegistration,
arabName,
},
}
agentInformation: {
companyName,
commercialRegistration,
arabName,
},
}
: {}),
})
.then((response) => {
if (response.status === 200) {
toast.success("Your profile has been updated!");
mutateUser((response.data as {user: User}).user);
mutateUser((response.data as { user: User }).user);
setIsLoading(false);
return;
}
@@ -247,7 +247,7 @@ function UserProfile({user, mutateUser, linkedCorporate, groups, users}: Props)
<h1 className="text-4xl font-bold mb-6 -md:hidden">Edit Profile</h1>
<form className="flex flex-col items-center gap-6 w-full" onSubmit={(e) => e.preventDefault()}>
<DoubleColumnRow>
{user.type !== "corporate" && user.type !== "mastercorporate" ? (
{user.type !== "corporate" && user.type !== "mastercorporate" && (
<Input
label={user.type === "agent" ? "English name" : "Name"}
type="text"
@@ -257,25 +257,6 @@ function UserProfile({user, mutateUser, linkedCorporate, groups, users}: Props)
defaultValue={name}
required
/>
) : (
<Input
label="Company name"
type="text"
name="name"
disabled={!!linkedCorporate}
onChange={(e) =>
setCorporateInformation((prev) => ({
...prev!,
companyInformation: {
...prev!.companyInformation,
name: e,
},
}))
}
placeholder="Enter your company's name"
defaultValue={corporateInformation?.companyInformation?.name}
required
/>
)}
{user.type === "agent" && (
@@ -381,7 +362,7 @@ function UserProfile({user, mutateUser, linkedCorporate, groups, users}: Props)
<label className="font-normal text-base text-mti-gray-dim">Desired Levels</label>
<ModuleLevelSelector
levels={desiredLevels}
setLevels={setDesiredLevels as Dispatch<SetStateAction<{[key in Module]: number}>>}
setLevels={setDesiredLevels as Dispatch<SetStateAction<{ [key in Module]: number }>>}
/>
</div>
<div className="flex flex-col gap-3 w-full">
@@ -425,9 +406,9 @@ function UserProfile({user, mutateUser, linkedCorporate, groups, users}: Props)
}}
onChange={(value) => (value ? setPreferredGender(value.value as InstructorGender) : null)}
options={[
{value: "male", label: "Male"},
{value: "female", label: "Female"},
{value: "varied", label: "Varied"},
{ value: "male", label: "Male" },
{ value: "female", label: "Female" },
{ value: "varied", label: "Varied" },
]}
/>
</div>
@@ -461,15 +442,6 @@ function UserProfile({user, mutateUser, linkedCorporate, groups, users}: Props)
{user.type === "corporate" && (
<>
<DoubleColumnRow>
<Input
type="number"
name="companyUsers"
onChange={() => null}
label="Number of users"
defaultValue={user.corporateInformation?.companyInformation.userAmount}
disabled
required
/>
<Input
type="text"
name="pricing"
@@ -642,8 +614,8 @@ function UserProfile({user, mutateUser, linkedCorporate, groups, users}: Props)
);
}
export default function Home(props: {linkedCorporate?: CorporateUser | MasterCorporateUser; groups: Group[]; users: User[]}) {
const {user, mutateUser} = useUser({redirectTo: "/login"});
export default function Home(props: { linkedCorporate?: CorporateUser | MasterCorporateUser; groups: Group[]; users: User[] }) {
const { user, mutateUser } = useUser({ redirectTo: "/login" });
return (
<>