Merged in feat/LOY-428-previous-stay-redesign (pull request #3142)

Feat(LOY-428): Previous Stays Redesign

* feat(LOY-428): Previous stays WIP

* fix(LOY-428): fix alignment issue

* fix(LOY-428): css fixes & imagefallback prop value

* fix(LOY-428): use css vars

* fix(LOY-428): add unit test for relative time text

* chore(LOY-428): remove else if conditions

* fix(LOY-428): named exports & remove duplicate width/height setting

* fix(LOY-428): better formatting of upcoming stays months text

* fix(LOY-428): fewer typography wrappers


Approved-by: Matilda Landström

apps/scandic-web/components/Blocks/DynamicContent/Stays/utils/getDaysUntilText.test.ts

@@ -16,7 +16,8 @@ const mockIntl = {
       "nextStay.today": "Today",
       "nextStay.tomorrow": "Tomorrow",
       "nextStay.inXDays": `In {days} days`,
-      "nextStay.inXMonths": `In {months} month{months, plural, =1 {} other {s}}`,
+      "nextStay.inXMonths":
+        "In {months, plural, one {# month} other {# months}}",
     }
 
     let message: string =
@@ -27,15 +28,21 @@ const mockIntl = {
       ""
 
     if (values) {
+      if (message.includes("{months, plural")) {
+        const months = Number(values.months)
+
+        if (months === 1) {
+          message = "In 1 month"
+        } else {
+          message = `In ${months} months`
+        }
+
+        return message
+      }
+
       Object.entries(values).forEach(([key, value]) => {
         message = message.replace(`{${key}}`, String(value))
       })
-
-      if (values.months === 1) {
-        message = message.replace("{months, plural, =1 {} other {s}}", "")
-      } else {
-        message = message.replace("{months, plural, =1 {} other {s}}", "s")
-      }
     }
 
     return message

apps/scandic-web/components/Blocks/DynamicContent/Stays/utils/getDaysUntilText.ts

@@ -48,7 +48,7 @@ export function getDaysUntilText(
   return intl.formatMessage(
     {
       id: "nextStay.inXMonths",
-      defaultMessage: "In {months} month{months, plural, =1 {} other {s}}",
+      defaultMessage: "In {months, plural, one {# month} other { # months}}",
     },
     {
       months: monthsUntil,