Merged in fix/SW-2801-correct-date-formats (pull request #2400)

fix(SW-2801): Added lang specific date formats

* fix(SW-2801): Added lang specific date formats

* fix: wrong type import


Approved-by: Michael Zetterberg

apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/CancelStay/Steps/Confirmation/index.tsx

@@ -4,6 +4,7 @@ import { useIntl } from "react-intl"
 
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
+import { longDateWithYearFormat } from "@/constants/dateFormats"
 import { dt } from "@/lib/dt"
 import { useMyStayStore } from "@/stores/my-stay"
 
@@ -41,8 +42,12 @@ export default function CancelStayConfirmation({
     })
   )
 
-  const checkInDate = dt(fromDate).locale(lang).format("dddd D MMM YYYY")
-  const checkOutDate = dt(toDate).locale(lang).format("dddd D MMM YYYY")
+  const checkInDate = dt(fromDate)
+    .locale(lang)
+    .format(longDateWithYearFormat[lang])
+  const checkOutDate = dt(toDate)
+    .locale(lang)
+    .format(longDateWithYearFormat[lang])
 
   const title = intl.formatMessage({ defaultMessage: "Cancel booking" })
   const primaryLabel = intl.formatMessage({

apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/ChangeDates/Steps/Confirmation/index.tsx

@@ -3,6 +3,7 @@ import { useIntl } from "react-intl"
 
 import { Divider } from "@scandic-hotels/design-system/Divider"
 
+import { longDateWithYearFormat } from "@/constants/dateFormats"
 import { dt } from "@/lib/dt"
 import { trpc } from "@/lib/trpc/client"
 import { useMyStayStore } from "@/stores/my-stay"
@@ -26,7 +27,7 @@ interface ConfirmationProps {
 }
 
 function formatDate(date: Date | string, lang: Lang) {
-  return dt(date).locale(lang).format("dddd, DD MMM, YYYY")
+  return dt(date).locale(lang).format(longDateWithYearFormat[lang])
 }
 
 export default function Confirmation({

apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/ChangeDates/Steps/Form/NewDates/index.tsx

@@ -10,6 +10,7 @@ import { useIntl } from "react-intl"
 import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
+import { longDateWithYearFormat } from "@/constants/dateFormats"
 import { dt } from "@/lib/dt"
 
 import DatePickerSingleDesktop from "@/components/DatePicker/Single/Desktop"
@@ -65,8 +66,12 @@ export default function NewDates({ checkInDate, checkOutDate }: NewDatesProps) {
   const checkInLabel = intl.formatMessage({ defaultMessage: "Check-in" })
   const checkOutLabel = intl.formatMessage({ defaultMessage: "Check-out" })
 
-  const checkInText = dt(fromDate).locale(lang).format("dddd, DD MMM, YYYY")
-  const checkOutText = dt(toDate).locale(lang).format("dddd, DD MMM, YYYY")
+  const checkInText = dt(fromDate)
+    .locale(lang)
+    .format(longDateWithYearFormat[lang])
+  const checkOutText = dt(toDate)
+    .locale(lang)
+    .format(longDateWithYearFormat[lang])
   return (
     <>
       <div className={styles.container}>

apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Dates/index.tsx

@@ -4,6 +4,7 @@ import { useIntl } from "react-intl"
 import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
+import { shortDateFormat } from "@/constants/dateFormats"
 import { dt } from "@/lib/dt"
 import { useMyStayStore } from "@/stores/my-stay"
 
@@ -19,9 +20,9 @@ export default function Dates() {
     checkOutDate: state.bookedRoom.checkOutDate,
   }))
 
-  const from = dt(checkInDate).locale(lang).format("D MMM")
+  const from = dt(checkInDate).locale(lang).format(shortDateFormat[lang])
   const fromYear = dt(checkInDate).year()
-  const to = dt(checkOutDate).locale(lang).format("D MMM")
+  const to = dt(checkOutDate).locale(lang).format(shortDateFormat[lang])
   const toYear = dt(checkOutDate).year()
 
   const isSameYear = fromYear === toYear