feat(SW-706): make eslint rule 'formatjs/no-literal-string-in-jsx' pass

apps/scandic-web/components/Blocks/DynamicContent/JobylonFeed/JobList/Filter/index.tsx

@@ -33,8 +33,12 @@ export default function Filter({
       <Select
         items={countryFilters}
         defaultSelectedKey={""}
-        label={intl.formatMessage({ id: "Country" })}
-        aria-label={intl.formatMessage({ id: "Country" })}
+        label={intl.formatMessage({
+          defaultMessage: "Country",
+        })}
+        aria-label={intl.formatMessage({
+          defaultMessage: "Country",
+        })}
         name="country"
         onSelect={(value) => onFilterChange(JobylonFilterKey.country, value)}
       />
@@ -42,10 +46,10 @@ export default function Filter({
         items={cityFilters}
         defaultSelectedKey={""}
         label={intl.formatMessage({
-          id: "Location (shown in local language)",
+          defaultMessage: "Location (shown in local language)",
         })}
         aria-label={intl.formatMessage({
-          id: "Location (shown in local language)",
+          defaultMessage: "Location (shown in local language)",
         })}
         name="city"
         onSelect={(value) => onFilterChange(JobylonFilterKey.city, value)}
@@ -53,16 +57,24 @@ export default function Filter({
       <Select
         items={departmentFilters}
         defaultSelectedKey={""}
-        label={intl.formatMessage({ id: "Hotel or office" })}
-        aria-label={intl.formatMessage({ id: "Hotel or office" })}
+        label={intl.formatMessage({
+          defaultMessage: "Hotel or office",
+        })}
+        aria-label={intl.formatMessage({
+          defaultMessage: "Hotel or office",
+        })}
         name="department"
         onSelect={(value) => onFilterChange(JobylonFilterKey.department, value)}
       />
       <Select
         items={categoryFilters}
         defaultSelectedKey={""}
-        label={intl.formatMessage({ id: "Category" })}
-        aria-label={intl.formatMessage({ id: "Category" })}
+        label={intl.formatMessage({
+          defaultMessage: "Category",
+        })}
+        aria-label={intl.formatMessage({
+          defaultMessage: "Category",
+        })}
         name="category"
         onSelect={(value) => onFilterChange(JobylonFilterKey.category, value)}
       />

apps/scandic-web/components/Blocks/DynamicContent/JobylonFeed/JobList/index.tsx

@@ -31,19 +31,39 @@ export default function JobList({ allJobs }: JobListProps) {
   }
 
   const countryFilters = [
-    { label: intl.formatMessage({ id: "All countries" }), value: "" },
+    {
+      label: intl.formatMessage({
+        defaultMessage: "All countries",
+      }),
+      value: "",
+    },
     ...state.countryFilters,
   ]
   const cityFilters = [
-    { label: intl.formatMessage({ id: "All locations" }), value: "" },
+    {
+      label: intl.formatMessage({
+        defaultMessage: "All locations",
+      }),
+      value: "",
+    },
     ...state.cityFilters,
   ]
   const departmentFilters = [
-    { label: intl.formatMessage({ id: "All hotels and offices" }), value: "" },
+    {
+      label: intl.formatMessage({
+        defaultMessage: "All hotels and offices",
+      }),
+      value: "",
+    },
     ...state.departmentFilters,
   ]
   const categoryFilters = [
-    { label: intl.formatMessage({ id: "All categories" }), value: "" },
+    {
+      label: intl.formatMessage({
+        defaultMessage: "All categories",
+      }),
+      value: "",
+    },
     ...state.categoryFilters,
   ]
 
@@ -59,7 +79,7 @@ export default function JobList({ allJobs }: JobListProps) {
       <Subtitle type="two">
         {intl.formatMessage(
           {
-            id: "{count, plural, one {# Result} other {# Results}}",
+            defaultMessage: "{count, plural, one {# Result} other {# Results}}",
           },
           { count: state.jobs.length }
         )}

apps/scandic-web/components/Blocks/DynamicContent/JobylonFeed/JobylonCard/index.tsx

@@ -24,10 +24,14 @@ export default function JobylonCard({ job }: JobylonCardProps) {
   const lang = useLang()
   const deadlineText = job.toDate
     ? intl.formatMessage(
-        { id: "Deadline: {date}" },
+        {
+          defaultMessage: "Deadline: {date}",
+        },
         { date: dt(job.toDate).locale(lang).format("Do MMMM") }
       )
-    : intl.formatMessage({ id: "Open for application" })
+    : intl.formatMessage({
+        defaultMessage: "Open for application",
+      })
 
   return (
     <div className={styles.jobylonCard}>
@@ -53,7 +57,9 @@ export default function JobylonCard({ job }: JobylonCardProps) {
           asChild
         >
           <a href={job.url} target="_blank" rel="noopener noreferrer">
-            {intl.formatMessage({ id: "View & apply" })}
+            {intl.formatMessage({
+              defaultMessage: "View & apply",
+            })}
             <MaterialIcon icon="open_in_new" size={20} />
           </a>
         </Button>