fix: allow adding continent to opportunity (#5024)

Co-authored-by: Chris Bongers <chrisbongers@gmail.com>

Author: omBratteng

packages/shared/src/components/opportunity/OpportunityEditModal/OpportunityEditInfoModal.tsx

@@ -211,12 +211,18 @@ export const OpportunityEditInfoModal = ({
           <Typography bold type={TypographyType.Caption1} className="-mb-2">
             Role location*
           </Typography>
-          <div className="flex gap-4">
+          {!!errors.location?.[0] &&
+            errors.location?.[0]?.type === 'custom' && (
+              <Typography
+                type={TypographyType.Caption2}
+                color={TypographyColor.StatusError}
+              >
+                {errors.location?.[0]?.message}
+              </Typography>
+            )}
+          <div className="grid grid-cols-2 gap-4">
             <TextField
               {...register('location.0.country')}
-              className={{
-                container: 'flex-1',
-              }}
               defaultValue={opportunity.location[0]?.country}
               type="text"
               inputId="opportunityCountry"
@@ -226,9 +232,6 @@ export const OpportunityEditInfoModal = ({
             />
             <TextField
               {...register('location.0.city')}
-              className={{
-                container: 'flex-1',
-              }}
               defaultValue={opportunity.location[0]?.city}
               type="text"
               label="City"
@@ -238,16 +241,22 @@ export const OpportunityEditInfoModal = ({
             />
             <TextField
               {...register('location.0.subdivision')}
-              className={{
-                container: 'flex-1',
-              }}
               defaultValue={opportunity.location[0]?.subdivision}
               type="text"
               label="Subdivision"
               inputId="opportunitySubdivision"
               valid={!errors.location?.[0]?.subdivision}
               hint={errors.location?.[0]?.subdivision?.message}
             />
+            <TextField
+              {...register('location.0.continent')}
+              defaultValue={opportunity.location[0]?.continent}
+              type="text"
+              label="Continent"
+              inputId="opportunityContinent"
+              valid={!errors.location?.[0]?.continent}
+              hint={errors.location?.[0]?.continent?.message}
+            />
           </div>
           <Controller
             name="location.0.type"
@@ -271,7 +280,7 @@ export const OpportunityEditInfoModal = ({
                   onChange={(value) => {
                     field.onChange(value);
                   }}
-                  valid={!errors.location?.[0]?.type}
+                  valid={typeof errors.location?.[0]?.type !== 'object'}
                 />
               );
             }}

packages/shared/src/lib/schema/opportunity.ts

@@ -11,6 +11,19 @@ const processSalaryValue = (val: unknown) => {
   return val;
 };
 
+const capitalize = (s: string) => {
+  if (s == null || typeof s !== 'string') {
+    return s;
+  }
+
+  return s.trim().length === 0
+    ? ''
+    : s
+        .trim()
+        .toLowerCase()
+        .replace(/\b\w/g, (c) => c.toUpperCase());
+};
+
 export const opportunityEditInfoSchema = z.object({
   title: z.string().nonempty(labels.form.required).max(240),
   tldr: z.string().nonempty(labels.form.required).max(480),
@@ -23,16 +36,37 @@ export const opportunityEditInfoSchema = z.object({
     .min(1, labels.form.required)
     .max(100),
   location: z.array(
-    z.object({
-      country: z.string().nonempty(labels.form.required).max(240),
-      city: z.string().nonempty(labels.form.required).max(240).optional(),
-      subdivision: z
-        .string()
-        .nonempty(labels.form.required)
-        .max(240)
-        .optional(),
-      type: z.coerce.number(labels.form.required).min(1),
-    }),
+    z
+      .object({
+        country: z.string().max(240),
+        city: z.string().max(240).optional(),
+        subdivision: z.string().max(240).optional(),
+        continent: z
+          .preprocess(
+            capitalize,
+            z.union([z.literal('Europe'), z.literal(''), z.undefined()]),
+          )
+          .optional(),
+        type: z.coerce.number().min(1),
+      })
+      .superRefine((val, ctx) => {
+        const present = [
+          val.country && val.country.trim() !== '',
+          val.city && val.city.trim() !== '',
+          val.subdivision && val.subdivision.trim() !== '',
+          // continent counts only if it is "Europe" (empty string should not count)
+          val.continent === 'Europe',
+        ].some(Boolean);
+
+        if (!present) {
+          ctx.addIssue({
+            code: 'custom',
+            message:
+              'At least one of country, city, subdivision, or continent must be provided.',
+            path: [''], // form-level error
+          });
+        }
+      }),
   ),
   meta: z.object({
     employmentType: z.coerce.number().min(1, {

packages/webapp/pages/opportunity/[id]/index.tsx

@@ -216,11 +216,16 @@ const metaMap = {
         return 'N/A';
       }
 
-      const output = `${location.city ? `${location.city}` : ''}${
-        location.subdivision ? `, ${location.subdivision}` : ''
-      }${location.country ? `, ${location.country}` : ''}`;
-
-      return output || 'N/A';
+      return (
+        [
+          location.city,
+          location.subdivision,
+          location.country,
+          location.continent,
+        ]
+          .filter(Boolean)
+          .join(', ') || 'N/A'
+      );
     },
   },
   salary: {