Merged in fix/translation-hotelpage-header (pull request #934)

Fix/SW-932-translation hotelpage header

* fix: add translation for hotel page header

* fix: add hotel translation

* fix: add translation where to when loading

* fix: update hotel(s) count if filtered

* fix(SW-932): update hotel(s) count


Approved-by: Pontus Dreij
Approved-by: Niclas Edenvin

app/[lang]/(live)/(public)/hotelreservation/(standard)/select-hotel/page.tsx

@@ -8,6 +8,7 @@ import {
   getFiltersFromHotels,
 } from "@/app/[lang]/(live)/(public)/hotelreservation/(standard)/select-hotel/utils"
 import HotelCardListing from "@/components/HotelReservation/HotelCardListing"
+import HotelCount from "@/components/HotelReservation/SelectHotel/HotelCount"
 import HotelFilter from "@/components/HotelReservation/SelectHotel/HotelFilter"
 import HotelSorter from "@/components/HotelReservation/SelectHotel/HotelSorter"
 import MobileMapButtonContainer from "@/components/HotelReservation/SelectHotel/MobileMapButtonContainer"
@@ -20,7 +21,6 @@ import StaticMap from "@/components/Maps/StaticMap"
 import Alert from "@/components/TempDesignSystem/Alert"
 import Button from "@/components/TempDesignSystem/Button"
 import Link from "@/components/TempDesignSystem/Link"
-import Preamble from "@/components/TempDesignSystem/Text/Preamble"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import { getIntl } from "@/i18n"
 import { setLang } from "@/i18n/serverContext"
@@ -72,7 +72,7 @@ export default async function SelectHotelPage({
         <div className={styles.title}>
           <div className={styles.cityInformation}>
             <Subtitle>{city.name}</Subtitle>
-            <Preamble>{hotels.length} hotels</Preamble>
+            <HotelCount />
           </div>
           <div className={styles.sorter}>
             <HotelSorter discreet />

components/Forms/BookingWidget/FormContent/Search/index.tsx

@@ -206,11 +206,12 @@ export default function Search({ locations }: SearchProps) {
 }
 
 export function SearchSkeleton() {
+  const intl = useIntl()
   return (
     <div className={styles.container}>
       <div className={styles.label}>
         <Caption type="bold" color="red" asChild>
-          <span>Where to</span>
+          <span>{intl.formatMessage({ id: "Where to" })}</span>
         </Caption>
       </div>
       <div className={styles.input}>

components/HotelReservation/SelectHotel/HotelCount/index.tsx

@@ -0,0 +1,22 @@
+"use client"
+import { useIntl } from "react-intl"
+
+import { useHotelFilterStore } from "@/stores/hotel-filters"
+
+import Preamble from "@/components/TempDesignSystem/Text/Preamble"
+
+export default function HotelCount() {
+  const intl = useIntl()
+  const resultCount = useHotelFilterStore((state) => state.resultCount)
+
+  return (
+    <Preamble>
+      {intl.formatMessage(
+        {
+          id: "Hotel(s)",
+        },
+        { amount: resultCount }
+      )}
+    </Preamble>
+  )
+}

i18n/dictionaries/da.json

@@ -154,6 +154,7 @@
   "Hotel": "Hotel",
   "Hotel facilities": "Hotel faciliteter",
   "Hotel surroundings": "Hotel omgivelser",
+  "Hotel(s)": "{amount} {amount, plural, one {hotel} other {hoteller}}",
   "Hotels": "Hoteller",
   "How do you want to sleep?": "Hvordan vil du sove?",
   "How it works": "Hvordan det virker",

i18n/dictionaries/de.json

@@ -154,6 +154,7 @@
   "Hotel": "Hotel",
   "Hotel facilities": "Hotel-Infos",
   "Hotel surroundings": "Umgebung des Hotels",
+  "Hotel(s)": "{amount} {amount, plural, one {hotel} other {hotels}}",
   "Hotels": "Hotels",
   "How do you want to sleep?": "Wie möchtest du schlafen?",
   "How it works": "Wie es funktioniert",

i18n/dictionaries/en.json

@@ -166,6 +166,7 @@
   "Hotel": "Hotel",
   "Hotel facilities": "Hotel facilities",
   "Hotel surroundings": "Hotel surroundings",
+  "Hotel(s)": "{amount} {amount, plural, one {hotel} other {hotels}}",
   "Hotels": "Hotels",
   "How do you want to sleep?": "How do you want to sleep?",
   "How it works": "How it works",

i18n/dictionaries/fi.json

@@ -154,6 +154,7 @@
   "Hotel": "Hotelli",
   "Hotel facilities": "Hotellin palvelut",
   "Hotel surroundings": "Hotellin ympäristö",
+  "Hotel(s)": "{amount} {amount, plural, one {hotelli} other {hotellit}}",
   "Hotels": "Hotellit",
   "How do you want to sleep?": "Kuinka haluat nukkua?",
   "How it works": "Kuinka se toimii",

i18n/dictionaries/no.json

@@ -153,6 +153,7 @@
   "Hotel": "Hotel",
   "Hotel facilities": "Hotelfaciliteter",
   "Hotel surroundings": "Hotellomgivelser",
+  "Hotel(s)": "{amount} {amount, plural, one {hotell} other {hoteller}}",
   "Hotels": "Hoteller",
   "How do you want to sleep?": "Hvordan vil du sove?",
   "How it works": "Hvordan det fungerer",

i18n/dictionaries/sv.json

@@ -153,6 +153,7 @@
   "Hotel": "Hotell",
   "Hotel facilities": "Hotellfaciliteter",
   "Hotel surroundings": "Hotellomgivning",
+  "Hotel(s)": "{amount} hotell",
   "Hotels": "Hotell",
   "How do you want to sleep?": "Hur vill du sova?",
   "How it works": "Hur det fungerar",