From c90234cefc6192e9cecaca609aed39389b959066 Mon Sep 17 00:00:00 2001 From: Tiago Ribeiro Date: Tue, 28 Nov 2023 08:21:00 +0000 Subject: [PATCH] Changed from employment to position for Corporate accounts --- .../DemographicInformationInput.tsx | 51 ++++++++------ src/components/UserCard.tsx | 61 ++++++++++------- src/interfaces/user.ts | 14 +++- src/pages/(admin)/Lists/UserList.tsx | 20 +++--- src/pages/profile.tsx | 68 ++++++++++++------- 5 files changed, 134 insertions(+), 80 deletions(-) diff --git a/src/components/DemographicInformationInput.tsx b/src/components/DemographicInformationInput.tsx index dcbe16bf..222dc546 100644 --- a/src/components/DemographicInformationInput.tsx +++ b/src/components/DemographicInformationInput.tsx @@ -21,6 +21,7 @@ export default function DemographicInformationInput({user, mutateUser}: Props) { const [phone, setPhone] = useState(); const [gender, setGender] = useState(); const [employment, setEmployment] = useState(); + const [position, setPosition] = useState(); const [isLoading, setIsLoading] = useState(false); const [companyName, setCompanyName] = useState(); @@ -36,7 +37,8 @@ export default function DemographicInformationInput({user, mutateUser}: Props) { country, phone: `+${countryCodes.findOne("countryCode" as any, country!).countryCallingCode}${phone}`, gender, - employment, + employment: user.type === "corporate" ? undefined : employment, + position: user.type === "corporate" ? position : undefined, }, agentInformation: user.type === "agent" ? {companyName, commercialRegistration} : undefined, }) @@ -116,25 +118,32 @@ export default function DemographicInformationInput({user, mutateUser}: Props) { -
- - - {EMPLOYMENT_STATUS.map(({status, label}) => ( - - {({checked}) => ( - - {label} - - )} - - ))} - -
+ {user.type === "corporate" && ( + + )} + {user.type !== "corporate" && ( +
+ + + {EMPLOYMENT_STATUS.map(({status, label}) => ( + + {({checked}) => ( + + {label} + + )} + + ))} + +
+ )}
@@ -147,7 +156,7 @@ export default function DemographicInformationInput({user, mutateUser}: Props) { !country || !phone || !gender || - !employment || + (user.type === "corporate" ? !position : !employment) || (user.type === "agent" ? !companyName || !commercialRegistration : false) }> {!isLoading && "Save information"} diff --git a/src/components/UserCard.tsx b/src/components/UserCard.tsx index e6f33ebe..931fe24a 100644 --- a/src/components/UserCard.tsx +++ b/src/components/UserCard.tsx @@ -42,6 +42,7 @@ const UserCard = ({user, loggedInUser, onClose, onViewStudents, onViewTeachers}: const [type, setType] = useState(user.type); const [status, setStatus] = useState(user.status); const [referralAgentLabel, setReferralAgentLabel] = useState(); + const [position, setPosition] = useState(user.type === "corporate" ? user.demographicInformation?.position : undefined); const [referralAgent, setReferralAgent] = useState(user.type === "corporate" ? user.corporateInformation?.referralAgent : undefined); const [companyName, setCompanyName] = useState( @@ -292,29 +293,43 @@ const UserCard = ({user, loggedInUser, onClose, onViewStudents, onViewTeachers}:
-
- - - {EMPLOYMENT_STATUS.map(({status, label}) => ( - - {({checked}) => ( - - {label} - - )} - - ))} - -
+ {user.type !== "corporate" && ( +
+ + + {EMPLOYMENT_STATUS.map(({status, label}) => ( + + {({checked}) => ( + + {label} + + )} + + ))} + +
+ )} + {user.type === "corporate" && ( + + )}
diff --git a/src/interfaces/user.ts b/src/interfaces/user.ts index 3e223fca..5594f273 100644 --- a/src/interfaces/user.ts +++ b/src/interfaces/user.ts @@ -14,7 +14,6 @@ export interface BasicUser { type: Type; bio: string; isVerified: boolean; - demographicInformation?: DemographicInformation; subscriptionExpirationDate?: null | Date; registrationDate?: Date; status: "active" | "disabled" | "paymentDue"; @@ -22,28 +21,34 @@ export interface BasicUser { export interface StudentUser extends BasicUser { type: "student"; + demographicInformation?: DemographicInformation; } export interface TeacherUser extends BasicUser { type: "teacher"; + demographicInformation?: DemographicInformation; } export interface CorporateUser extends BasicUser { type: "corporate"; corporateInformation: CorporateInformation; + demographicInformation?: DemographicCorporateInformation; } export interface AgentUser extends BasicUser { type: "agent"; agentInformation: AgentInformation; + demographicInformation?: DemographicInformation; } export interface AdminUser extends BasicUser { type: "admin"; + demographicInformation?: DemographicInformation; } export interface DeveloperUser extends BasicUser { type: "developer"; + demographicInformation?: DemographicInformation; } export interface CorporateInformation { @@ -73,6 +78,13 @@ export interface DemographicInformation { employment: EmploymentStatus; } +export interface DemographicCorporateInformation { + country: string; + phone: string; + gender: Gender; + position: string; +} + export type Gender = "male" | "female" | "other"; export type EmploymentStatus = "employed" | "student" | "self-employed" | "unemployed" | "retired" | "other"; export const EMPLOYMENT_STATUS: {status: EmploymentStatus; label: string}[] = [ diff --git a/src/pages/(admin)/Lists/UserList.tsx b/src/pages/(admin)/Lists/UserList.tsx index 790fc686..7ed40bee 100644 --- a/src/pages/(admin)/Lists/UserList.tsx +++ b/src/pages/(admin)/Lists/UserList.tsx @@ -242,14 +242,15 @@ export default function UserList({user, filter}: {user: User; filter?: (user: Us cell: (info) => info.getValue() || "Not available", enableSorting: true, }), - columnHelper.accessor("demographicInformation.employment", { + columnHelper.accessor((x) => (x.type === "corporate" ? x.demographicInformation?.position : x.demographicInformation?.employment), { + id: "employment", header: ( ) as any, - cell: (info) => capitalize(info.getValue()) || "Not available", + cell: (info) => (info.row.original.type === "corporate" ? info.getValue() : capitalize(info.getValue())) || "Not available", enableSorting: true, }), columnHelper.accessor("demographicInformation.gender", { @@ -419,13 +420,14 @@ export default function UserList({user, filter}: {user: User; filter?: (user: Us } if (sorter === "employment" || sorter === reverseString("employment")) { - if (!a.demographicInformation?.employment && b.demographicInformation?.employment) return sorter === "employment" ? -1 : 1; - if (a.demographicInformation?.employment && !b.demographicInformation?.employment) return sorter === "employment" ? 1 : -1; - if (!a.demographicInformation?.employment && !b.demographicInformation?.employment) return 0; + const aSortingItem = a.type === "corporate" ? a.demographicInformation?.position : a.demographicInformation?.employment; + const bSortingItem = b.type === "corporate" ? b.demographicInformation?.position : b.demographicInformation?.employment; - return sorter === "employment" - ? a.demographicInformation!.employment.localeCompare(b.demographicInformation!.employment) - : b.demographicInformation!.employment.localeCompare(a.demographicInformation!.employment); + if (!aSortingItem && bSortingItem) return sorter === "employment" ? -1 : 1; + if (aSortingItem && !bSortingItem) return sorter === "employment" ? 1 : -1; + if (!aSortingItem && !bSortingItem) return 0; + + return sorter === "employment" ? aSortingItem!.localeCompare(bSortingItem!) : bSortingItem!.localeCompare(aSortingItem!); } if (sorter === "gender" || sorter === reverseString("gender")) { diff --git a/src/pages/profile.tsx b/src/pages/profile.tsx index c41248d9..b9aa8289 100644 --- a/src/pages/profile.tsx +++ b/src/pages/profile.tsx @@ -63,6 +63,7 @@ export default function Home() { const [phone, setPhone] = useState(); const [gender, setGender] = useState(); const [employment, setEmployment] = useState(); + const [position, setPosition] = useState(); const profilePictureInput = useRef(null); @@ -86,7 +87,8 @@ export default function Home() { setCountry(user.demographicInformation?.country); setPhone(user.demographicInformation?.phone); setGender(user.demographicInformation?.gender); - setEmployment(user.demographicInformation?.employment); + setEmployment(user.type === "corporate" ? undefined : user.demographicInformation?.employment); + setPosition(user.type === "corporate" ? user.demographicInformation?.position : undefined); } }, [user]); @@ -135,7 +137,8 @@ export default function Home() { demographicInformation: { phone, country, - employment, + employment: user?.type === "corporate" ? undefined : employment, + position: user?.type === "corporate" ? position : undefined, gender, }, }); @@ -247,30 +250,43 @@ export default function Home() { />
-
- - - {EMPLOYMENT_STATUS.map(({status, label}) => ( - - {({checked}) => ( - - {label} - - )} - - ))} - -
+ {user.type === "corporate" && ( + + )} + {user.type !== "corporate" && ( +
+ + + {EMPLOYMENT_STATUS.map(({status, label}) => ( + + {({checked}) => ( + + {label} + + )} + + ))} + +
+ )}