diff --git a/apps/portal/src/components/offers/dashboard/DashboardOfferCard.tsx b/apps/portal/src/components/offers/dashboard/DashboardOfferCard.tsx index 722263b6..dda493ec 100644 --- a/apps/portal/src/components/offers/dashboard/DashboardOfferCard.tsx +++ b/apps/portal/src/components/offers/dashboard/DashboardOfferCard.tsx @@ -37,28 +37,28 @@ export default function DashboardProfileCard({
{company?.name && ( -
+
)} {location && ( -
+
)} {level && ( -
+
diff --git a/apps/portal/src/components/offers/profile/EducationCard.tsx b/apps/portal/src/components/offers/profile/EducationCard.tsx index c885ef5a..9549e423 100644 --- a/apps/portal/src/components/offers/profile/EducationCard.tsx +++ b/apps/portal/src/components/offers/profile/EducationCard.tsx @@ -13,12 +13,12 @@ export default function EducationCard({ education: { type, field, startDate, endDate, school }, }: Props) { return ( -
-
-
-
+
+
+
+
- + {field ? `${type ?? 'N/A'}, ${field}` : type ?? `N/A`}
diff --git a/apps/portal/src/components/offers/profile/OfferCard.tsx b/apps/portal/src/components/offers/profile/OfferCard.tsx index 75e5735e..68f1571a 100644 --- a/apps/portal/src/components/offers/profile/OfferCard.tsx +++ b/apps/portal/src/components/offers/profile/OfferCard.tsx @@ -1,17 +1,13 @@ import { - BuildingOffice2Icon, - ChatBubbleBottomCenterTextIcon, - CurrencyDollarIcon, - ScaleIcon, -} from '@heroicons/react/24/outline'; -import { HorizontalDivider } from '@tih/ui'; + ArrowTrendingUpIcon, + BuildingOfficeIcon, + MapPinIcon, +} from '@heroicons/react/20/solid'; +import { JobTypeLabel } from '~/components/offers/constants'; import type { OfferDisplayData } from '~/components/offers/types'; -import { - getCompanyDisplayText, - getJobDisplayText, -} from '~/utils/offers/string'; +import { getLocationDisplayText } from '~/utils/offers/string'; type Props = Readonly<{ offer: OfferDisplayData; @@ -37,32 +33,55 @@ export default function OfferCard({ }: Props) { function UpperSection() { return ( -
-
- {(companyName || location) && ( -
- - - - - {getCompanyDisplayText(companyName, location)} - +
+
+
+

+ {jobTitle} {jobType && <>({JobTypeLabel[jobType]})} +

+
+ {companyName && ( +
+
+ )} + {location && ( +
+
+ )} + {jobLevel && ( +
+
+ )}
- )} -
-

{getJobDisplayText(jobTitle, jobLevel, jobType)}

-
-
- {!duration && receivedMonth && ( -
-

{receivedMonth}

- )} - {duration && ( -
-

{`${duration} months`}

+
+ {!duration && receivedMonth && ( +
+

{receivedMonth}

+
+ )} + {duration && ( +
+

{`${duration} months`}

+
+ )}
- )} +
); } @@ -78,60 +97,69 @@ export default function OfferCard({ } return ( - <> - -
-
- {(totalCompensation || monthlySalary) && ( -
- - - - -

- {totalCompensation && `TC: ${totalCompensation}`} - {monthlySalary && `Monthly Salary: ${monthlySalary}`} -

-
-
- )} - {(base || stocks || bonus) && totalCompensation && ( -
-

- Base / year: {base ?? 'N/A'} ⋅ Stocks / year:{' '} - {stocks ?? 'N/A'} ⋅ Bonus / year: {bonus ?? 'N/A'} -

-
- )} -
+
+
+ {totalCompensation && ( +
+
+ Total Compensation +
+
+ {totalCompensation} +
+
+ )} + {monthlySalary && ( +
+
+ Monthly Salary +
+
{monthlySalary}
+
+ )} + {base && ( +
+
+ Base Salary +
+
{base}
+
+ )} + {stocks && ( +
+
Stocks
+
{stocks}
+
+ )} + {bonus && ( +
+
Bonus
+
{bonus}
+
+ )} {negotiationStrategy && ( -
-
- - - - - "{negotiationStrategy}" - -
+
+
+ Negotiation Strategy +
+
+ {negotiationStrategy} +
)} {otherComment && ( -
-
- - - - "{otherComment}" -
+
+
Others
+
{otherComment}
)} -
- +
+
); } + return ( -
+
diff --git a/apps/portal/src/components/offers/profile/ProfileDetails.tsx b/apps/portal/src/components/offers/profile/ProfileDetails.tsx index 3f61060b..7bc5d10c 100644 --- a/apps/portal/src/components/offers/profile/ProfileDetails.tsx +++ b/apps/portal/src/components/offers/profile/ProfileDetails.tsx @@ -25,19 +25,19 @@ type ProfileOffersProps = Readonly<{ }>; function ProfileOffers({ offers }: ProfileOffersProps) { - if (offers.length !== 0) { + if (offers.length === 0) { return ( - <> - {offers.map((offer) => ( - - ))} - +
+

No offers are attached.

+
); } + return ( -
- - No offer is attached. +
+ {offers.map((offer) => ( + + ))}
); } @@ -49,33 +49,37 @@ type ProfileBackgroundProps = Readonly<{ function ProfileBackground({ background }: ProfileBackgroundProps) { if (!background?.experiences?.length && !background?.educations?.length) { return ( -
+

No background information available.

); } return ( - <> +
{background?.experiences?.length > 0 && ( - <> -
- - Work Experience +
+
+ +

+ Work Experience +

- +
)} {background?.educations?.length > 0 && ( - <> -
- - Education +
+
+ +

+ Education +

- +
)} - +
); } @@ -114,7 +118,7 @@ function ProfileAnalysis({ } return ( -
+
{!analysis ? (

No analysis available.

) : ( @@ -165,12 +169,15 @@ export default function ProfileDetails({
); } + if (selectedTab === ProfileDetailTab.OFFERS) { return ; } + if (selectedTab === ProfileDetailTab.BACKGROUND) { return ; } + if (selectedTab === ProfileDetailTab.ANALYSIS) { return ( -
-
-
+
+
+
+
-
+

{profileName ?? 'anonymous'}

{(experiences[0]?.companyName || experiences[0]?.jobLevel || experiences[0]?.jobTitle) && ( -
+
@@ -262,7 +262,7 @@ export default function ProfileHeader({

)} -
+

YOE: @@ -286,7 +286,7 @@ export default function ProfileHeader({

)}
-
+
-
+
) { +export function joinWithComma(...strings: Array) { return strings.filter((value) => !!value).join(', '); } -function getLocationDisplayText({ cityName, countryName }: Location) { +export function getLocationDisplayText({ cityName, countryName }: Location) { return cityName === countryName ? cityName : joinWithComma(cityName, countryName);