[offers][feat] integrate location for offer table and profile

apps/portal/src/components/offers/dashboard/DashboardOfferCard.tsx

@@ -33,6 +33,7 @@ export default function DashboardProfileCard({
     <div className="px-4 py-4 sm:px-6">
       <div className="flex items-end justify-between">
         <div className="col-span-1 row-span-3">
+<<<<<<< HEAD
           <h4 className="font-medium">
             {getLabelForJobTitleType(title as JobTitleType)}{' '}
             {jobType && <>({JobTypeLabel[jobType]})</>}
@@ -66,6 +67,17 @@ export default function DashboardProfileCard({
               </div>
             )}
           </div>
+=======
+          <p className="font-bold">
+            {getLabelForJobTitleType(title as JobTitleType)}
+          </p>
+          <p>
+            {location
+              ? `Company: ${company.name}, ${location.cityName}`
+              : `Company: ${company.name}`}
+          </p>
+          {level && <p>Level: {level}</p>}
+>>>>>>> ac2d047d ([offers][feat] integrate location for offer table and profile)
         </div>
         <div className="col-span-1 row-span-3">
           <p className="text-end text-lg font-medium leading-6 text-slate-900">

apps/portal/src/components/offers/profile/OfferCard.tsx

@@ -35,6 +35,7 @@ export default function OfferCard({
 }: Props) {
   function UpperSection() {
     return (
+<<<<<<< HEAD
       <div className="px-4 py-5 sm:px-6">
         <div className="flex justify-between">
           <div>
@@ -70,6 +71,17 @@ export default function OfferCard({
                 </div>
               )}
             </div>
+=======
+      <div className="flex justify-between px-8">
+        <div className="flex flex-col">
+          <div className="flex flex-row">
+            <span>
+              <BuildingOffice2Icon className="mr-3 h-5" />
+            </span>
+            <span className="font-bold">
+              {location ? `${companyName}, ${location.cityName}` : companyName}
+            </span>
+>>>>>>> ac2d047d ([offers][feat] integrate location for offer table and profile)
           </div>
           <div className="space-y-2">
             {!duration && receivedMonth && (
@@ -99,6 +111,7 @@ export default function OfferCard({
     }
 
     return (
+<<<<<<< HEAD
       <div className="border-t border-slate-200 px-4 py-5 sm:px-6">
         <dl className="grid grid-cols-2 gap-x-4 gap-y-8 sm:grid-cols-4">
           {jobType === JobType.FULLTIME
@@ -142,6 +155,34 @@ export default function OfferCard({
               <dd className="mt-1 text-sm text-slate-900">{bonus}</dd>
             </div>
           )}
+=======
+      <>
+        <HorizontalDivider />
+        <div className="px-8">
+          <div className="flex flex-col py-2">
+            {(totalCompensation || monthlySalary) && (
+              <div className="flex flex-row">
+                <span>
+                  <CurrencyDollarIcon className="mr-3 h-5" />
+                </span>
+                <span>
+                  <p>
+                    {totalCompensation && `TC: ${totalCompensation}`}
+                    {monthlySalary && `Monthly Salary: ${monthlySalary}`}
+                  </p>
+                </span>
+              </div>
+            )}
+            {(base || stocks || bonus) && totalCompensation && (
+              <div className="ml-8 flex flex-row font-light">
+                <p>
+                  Base / year: {base ?? 'N/A'} ⋅ Stocks / year:{' '}
+                  {stocks ?? 'N/A'} ⋅ Bonus / year: {bonus ?? 'N/A'}
+                </p>
+              </div>
+            )}
+          </div>
+>>>>>>> ac2d047d ([offers][feat] integrate location for offer table and profile)
           {negotiationStrategy && (
             <div className="col-span-2">
               <dt className="text-sm font-medium text-slate-500">

apps/portal/src/components/offers/table/OffersTable.tsx

@@ -25,14 +25,19 @@ import type { DashboardOffer, GetOffersResponse, Paging } from '~/types/offers';
 
 const NUMBER_OF_OFFERS_IN_PAGE = 10;
 export type OffersTableProps = Readonly<{
+  cityFilter: string;
   companyFilter: string;
   companyName?: string;
   countryFilter: string;
   jobTitleFilter: string;
 }>;
 export default function OffersTable({
+<<<<<<< HEAD
   countryFilter,
   companyName,
+=======
+  cityFilter,
+>>>>>>> ac2d047d ([offers][feat] integrate location for offer table and profile)
   companyFilter,
   jobTitleFilter,
 }: OffersTableProps) {
@@ -106,6 +111,8 @@ export default function OffersTable({
     [
       'offers.list',
       {
+        // Location: 'Singapore, Singapore', // TODO: Geolocation
+        cityId: cityFilter,
         companyId: companyFilter,
         countryId: countryFilter,
         currency,
@@ -165,11 +172,17 @@ export default function OffersTable({
             />
           ))}
         </DropdownMenu>
+<<<<<<< HEAD
         <div className="divide-x-slate-200 col-span-3 flex items-center justify-end space-x-4 divide-x">
           <div className="justify-left flex items-center space-x-2 font-medium text-slate-700">
             <span className="sr-only sm:not-sr-only sm:inline">
               Display offers in
             </span>
+=======
+        <div className="divide-x-slate-200 flex items-center space-x-4 divide-x">
+          <div className="justify-left flex items-center space-x-2 font-medium text-slate-700">
+            <span>Display offers in</span>
+>>>>>>> ac2d047d ([offers][feat] integrate location for offer table and profile)
             <CurrencySelector
               handleCurrencyChange={(value: string) => setCurrency(value)}
               selectedCurrency={currency}

apps/portal/src/components/offers/types.ts

@@ -3,6 +3,30 @@ import type { JobType } from '@prisma/client';
 import type { MonthYear } from '~/components/shared/MonthYearPicker';
 
 import type { Location } from '~/types/offers';
+<<<<<<< HEAD
+=======
+
+export const HOME_URL = '/offers';
+
+/*
+ *  Offer Profile
+ */
+
+export const JobTypeLabel = {
+  FULLTIME: 'Full-time',
+  INTERN: 'Internship',
+};
+
+export enum EducationBackgroundType {
+  Bachelor = 'Bachelor',
+  Diploma = 'Diploma',
+  Masters = 'Masters',
+  PhD = 'PhD',
+  Professional = 'Professional',
+  Secondary = 'Secondary',
+  SelfTaught = 'Self-taught',
+}
+>>>>>>> ac2d047d ([offers][feat] integrate location for offer table and profile)
 
 export type OffersProfilePostData = {
   background: BackgroundPostData;
@@ -33,6 +57,10 @@ type ExperiencePostData = {
   id?: string;
   jobType?: string | null;
   level?: string | null;
+<<<<<<< HEAD
+=======
+  location?: Location | null;
+>>>>>>> ac2d047d ([offers][feat] integrate location for offer table and profile)
   monthlySalary?: Money | null;
   title?: string | null;
   totalCompensation?: Money | null;

apps/portal/src/pages/offers/index.tsx

@@ -12,10 +12,19 @@ import type { JobTitleType } from '~/components/shared/JobTitles';
 import { JobTitleLabels } from '~/components/shared/JobTitles';
 import JobTitlesTypeahead from '~/components/shared/JobTitlesTypahead';
 
+<<<<<<< HEAD
 import { useSearchParamSingle } from '~/utils/offers/useSearchParam';
 
 export default function OffersHomePage() {
   const [countryFilter, setCountryFilter] = useState('');
+=======
+import CitiesTypeahead from '../../components/shared/CitiesTypeahead';
+
+export default function OffersHomePage() {
+  const [jobTitleFilter, setjobTitleFilter] = useState('software-engineer');
+  const [companyFilter, setCompanyFilter] = useState('');
+  const [cityFilter, setCityFilter] = useState('');
+>>>>>>> ac2d047d ([offers][feat] integrate location for offer table and profile)
   const { event: gaEvent } = useGoogleAnalytics();
 
   const [selectedCompanyName, setSelectedCompanyName] =
@@ -35,6 +44,7 @@ export default function OffersHomePage() {
         </Link>
         . ⭐
       </Banner>
+<<<<<<< HEAD
       <div className="text-primary-600 flex items-center justify-end space-x-1 bg-slate-100 px-4 pt-4 sm:text-lg">
         <span>
           <MapPinIcon className="flex h-7 w-7" />
@@ -52,6 +62,23 @@ export default function OffersHomePage() {
               });
             } else {
               setCountryFilter('');
+=======
+      <div className="text-primary-600 flex items-center justify-end space-x-1 bg-slate-100 px-4 pt-4">
+        <span>
+          <MapPinIcon className="flex h-7 w-7" />
+        </span>
+        <CitiesTypeahead
+          isLabelHidden={true}
+          placeholder="All Cities"
+          onSelect={(option) => {
+            if (option) {
+              setCityFilter(option.value);
+              gaEvent({
+                action: `offers.table_filter_city_${option.value}`,
+                category: 'engagement',
+                label: 'Filter by city',
+              });
+>>>>>>> ac2d047d ([offers][feat] integrate location for offer table and profile)
             }
           }}
         />
@@ -131,10 +158,16 @@ export default function OffersHomePage() {
       </div>
       <Container className="pb-20 pt-10">
         <OffersTable
+<<<<<<< HEAD
           companyFilter={selectedCompanyId}
           companyName={selectedCompanyName}
           countryFilter={countryFilter}
           jobTitleFilter={selectedJobTitleId ?? ''}
+=======
+          cityFilter={cityFilter}
+          companyFilter={companyFilter}
+          jobTitleFilter={jobTitleFilter}
+>>>>>>> ac2d047d ([offers][feat] integrate location for offer table and profile)
         />
       </Container>
     </main>