feat: add desktop ui to calendar

2024-08-23 16:17:35 +02:00
parent a5dff7b97d
commit 99b14304d4
17 changed files with 405 additions and 177 deletions
--- a/components/BookingWidget/bookingWidget.module.css
+++ b/components/BookingWidget/bookingWidget.module.css
@@ -1,12 +1,11 @@
 .container {
-  background-color: var(--Base-Surface-Primary-light-Normal);
-  border-top: 1px solid var(--Base-Border-Subtle);
-  border-bottom: 1px solid var(--Base-Border-Subtle);
-  padding: var(--Spacing-x2) var(--Spacing-x5);
+  display: none;
 }

-@media screen and (max-width: 1367px) {
+@media screen and (min-width: 1367px) {
  .container {
-    display: none;
+    border-bottom: 1px solid var(--Base-Border-Subtle);
+    border-top: 1px solid var(--Base-Border-Subtle);
+    display: block;
  }
 }
--- a/components/DatePicker/DatePicker.tsx
+++ b/components/DatePicker/DatePicker.tsx
@@ -2,14 +2,24 @@
 import { da, de, fi, nb, sv } from "date-fns/locale"
 import { useState } from "react"
 import { type DateRange, DayPicker } from "react-day-picker"
+import { useIntl } from "react-intl"

 import { Lang } from "@/constants/languages"
 import { dt } from "@/lib/dt"

+import Button from "@/components/TempDesignSystem/Button"
+import Divider from "@/components/TempDesignSystem/Divider"
+import Caption from "@/components/TempDesignSystem/Text/Caption"
+import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import useLang from "@/hooks/useLang"

+import { ChevronLeftIcon } from "../Icons"
+
+import styles from "./date-picker.module.css"
 import classNames from "react-day-picker/style.module.css"

+import type { DatePickerProps } from "@/types/components/datepicker"
+
 const locales = {
  [Lang.da]: da,
  [Lang.de]: de,
@@ -18,12 +28,8 @@ const locales = {
  [Lang.sv]: sv,
 }

-export interface DatePickerProps {
-  handleOnSelect: (selected: DateRange) => void
-  initialSelected?: DateRange
-}
-
 export default function DatePicker({
+  close,
  handleOnSelect,
  initialSelected = {
    from: undefined,
@@ -31,6 +37,7 @@ export default function DatePicker({
  },
 }: DatePickerProps) {
  const lang = useLang()
+  const intl = useIntl()
  const [selectedDate, setSelectedDate] = useState<DateRange>(initialSelected)

  function handleSelectDate(selected: DateRange) {
@@ -40,23 +47,99 @@ export default function DatePicker({

  /** English is default language and doesn't need to be imported */
  const locale = lang === Lang.en ? undefined : locales[lang]
-
  const currentDate = dt().toDate()
  const startOfMonth = dt(currentDate).set("date", 1).toDate()
  const yesterday = dt(currentDate).subtract(1, "day").toDate()
  return (
    <DayPicker
-      classNames={classNames}
+      classNames={{
+        ...classNames,
+        caption_label: `${classNames.caption_label} ${styles.captionLabel}`,
+        day: `${classNames.day} ${styles.day}`,
+        day_button: `${classNames.day_button} ${styles.dayButton}`,
+        footer: styles.footer,
+        month_caption: `${classNames.month_caption} ${styles.monthCaption}`,
+        months: `${classNames.months} ${styles.months}`,
+        range_end: styles.rangeEnd,
+        range_middle: styles.rangeMiddle,
+        range_start: styles.rangeStart,
+        week: styles.week,
+        weekday: `${classNames.weekday} ${styles.weekDay}`,
+      }}
      disabled={{ from: startOfMonth, to: yesterday }}
      excludeDisabled
+      footer
+      formatters={{
+        formatWeekdayName(weekday) {
+          return dt(weekday).locale(lang).format("ddd")
+        },
+      }}
+      lang={lang}
      locale={locale}
      mode="range"
+      numberOfMonths={2}
      onSelect={handleSelectDate}
      pagedNavigation
      required
      selected={selectedDate}
-      showWeekNumber
      startMonth={currentDate}
+      weekStartsOn={1}
+      components={{
+        Chevron(props) {
+          return <ChevronLeftIcon {...props} height={20} width={20} />
+        },
+        Footer(props) {
+          return (
+            <>
+              <Divider className={styles.divider} color="primaryLightSubtle" />
+              <footer className={props.className}>
+                <Button
+                  intent="tertiary"
+                  onPress={close}
+                  size="small"
+                  theme="base"
+                >
+                  <Caption color="white" textTransform="bold">
+                    {intl.formatMessage({ id: "Select dates" })}
+                  </Caption>
+                </Button>
+              </footer>
+            </>
+          )
+        },
+        MonthCaption(props) {
+          return (
+            <div className={props.className}>
+              <Subtitle asChild type="two">
+                {props.children}
+              </Subtitle>
+            </div>
+          )
+        },
+        Nav(props) {
+          if (Array.isArray(props.children)) {
+            const prevButton = props.children?.[0]
+            const nextButton = props.children?.[1]
+            return (
+              <>
+                {prevButton ? (
+                  <nav
+                    className={`${props.className} ${styles.previousButton}`}
+                  >
+                    {prevButton}
+                  </nav>
+                ) : null}
+                {nextButton ? (
+                  <nav className={`${props.className} ${styles.nextButton}`}>
+                    {nextButton}
+                  </nav>
+                ) : null}
+              </>
+            )
+          }
+          return <></>
+        },
+      }}
    />
  )
 }
--- a/components/DatePicker/date-picker.module.css
+++ b/components/DatePicker/date-picker.module.css
@@ -9,12 +9,16 @@

 .hideWrapper {
  background-color: var(--Main-Grey-White);
-  border-radius: var(--Corner-radius-Medium);
-  box-shadow: 0px 16px 24px 0px rgba(0, 0, 0, 0.08);
-  padding: var(--Spacing-x-one-and-half);
+  border-radius: var(--Corner-radius-Large);
+  box-shadow: 0px 0px 14px 6px rgba(0, 0, 0, 0.1);
+  padding: var(--Spacing-x2) var(--Spacing-x3);
  position: absolute;
-  /** BookingWidget padding + border-width */
-  top: calc(100% + var(--Spacing-x2) + 1px);
+  /** 
+    BookingWidget padding + 
+    border-width + 
+    wanted space below booking widget
+   */
+  top: calc(100% + var(--Spacing-x2) + 1px + var(--Spacing-x4));
 }

 .btn {
@@ -29,3 +33,118 @@
 .body {
  opacity: 0.8;
 }
+
+div.months {
+  flex-wrap: nowrap;
+}
+
+.monthCaption {
+  justify-content: center;
+}
+
+.captionLabel {
+  text-transform: capitalize;
+}
+
+td.day,
+td.rangeEnd,
+td.rangeStart {
+  font-family: var(--typography-Body-Bold-fontFamily);
+  font-size: var(--typography-Body-Bold-fontSize);
+  font-weight: 500;
+  letter-spacing: var(--typography-Body-Bold-letterSpacing);
+  line-height: var(--typography-Body-Bold-lineHeight);
+  text-decoration: var(--typography-Body-Bold-textDecoration);
+}
+
+td.rangeEnd,
+td.rangeStart {
+  background: var(--Base-Background-Primary-Normal);
+}
+
+td.rangeEnd[aria-selected="true"]:not([data-outside="true"]) {
+  border-radius: 0 50% 50% 0;
+}
+
+td.rangeStart[aria-selected="true"] {
+  border-radius: 50% 0 0 50%;
+}
+
+td.rangeEnd[aria-selected="true"] button.dayButton:hover,
+td.rangeStart[aria-selected="true"] button.dayButton:hover {
+  background: var(--Primary-Light-On-Surface-Accent);
+  border-radius: 50%;
+}
+
+td.rangeEnd[aria-selected="true"]:not([data-outside="true"]) button.dayButton,
+td.rangeStart[aria-selected="true"]:not([data-outside="true"])
+  button.dayButton {
+  background: var(--Primary-Light-On-Surface-Accent);
+  border: none;
+  color: var(--Base-Button-Inverted-Fill-Normal);
+}
+
+td.day,
+td.day[data-today="true"] {
+  color: var(--UI-Text-High-contrast);
+  height: 40px;
+  padding: var(--Spacing-x-half);
+  width: 40px;
+}
+
+td.day button.dayButton:hover {
+  background: var(--Base-Surface-Secondary-light-Hover);
+}
+
+td.day[data-outside="true"] button.dayButton {
+  border: none;
+}
+
+td.day:not(td.rangeEnd, td.rangeStart)[aria-selected="true"],
+td.rangeMiddle[aria-selected="true"] button.dayButton {
+  background: var(--Base-Background-Primary-Normal);
+  border: none;
+  border-radius: 0;
+}
+
+td.day[data-disabled="true"],
+td.day[data-disabled="true"] button.dayButton,
+td.day[data-outside="true"] ~ td.day[data-disabled="true"],
+td.day[data-outside="true"] ~ td.day[data-disabled="true"] button.dayButton,
+.week:has(td.day[data-outside="true"] ~ td.day[data-disabled="true"])
+  td.day[data-outside="true"]
+  button.dayButton {
+  background: none;
+  color: var(--Base-Text-Disabled);
+  cursor: not-allowed;
+}
+
+.weekDay {
+  color: var(--UI-Text-Placeholder);
+  font-family: var(--typography-Footnote-Labels-fontFamily);
+  font-size: var(--typography-Footnote-Labels-fontSize);
+  font-weight: var(--typography-Footnote-Labels-fontWeight);
+  letter-spacing: var(--typography-Footnote-Labels-letterSpacing);
+  line-height: var(--typography-Footnote-Labels-lineHeight);
+  text-decoration: var(--typography-Footnote-Labels-textDecoration);
+  text-transform: uppercase;
+}
+
+.footer {
+  display: flex;
+  justify-content: flex-end;
+  margin-top: var(--Spacing-x2);
+}
+
+.divider {
+  margin-top: var(--Spacing-x2);
+}
+
+.nextButton {
+  transform: rotate(180deg);
+  right: 0;
+}
+
+.previousButton {
+  left: 0;
+}
--- a/components/DatePicker/index.tsx
+++ b/components/DatePicker/index.tsx
@@ -22,6 +22,10 @@ export default function DatePickerForm({ name = "date" }: DatePickerFormProps) {
  const { register, setValue } = useFormContext()
  const ref = useRef<HTMLDivElement | null>(null)

+  function close() {
+    setIsOpen(false)
+  }
+
  function handleOnClick() {
    setIsOpen((prevIsOpen) => !prevIsOpen)
  }
@@ -64,6 +68,7 @@ export default function DatePickerForm({ name = "date" }: DatePickerFormProps) {
      <input {...register("date.to")} type="hidden" />
      <div aria-modal className={styles.hideWrapper} role="dialog">
        <DatePicker
+          close={close}
          handleOnSelect={handleSelectDate}
          initialSelected={selectedDate}
        />
--- a/components/Forms/BookingWidget/FormContent/Search/search.module.css
+++ b/components/Forms/BookingWidget/FormContent/Search/search.module.css
@@ -30,6 +30,7 @@
  height: 24px;
  outline: none;
  position: relative;
+  width: 100%;
  z-index: 2;
 }

--- a/components/Forms/BookingWidget/FormContent/index.tsx
+++ b/components/Forms/BookingWidget/FormContent/index.tsx
@@ -33,10 +33,10 @@ export default function FormContent({
      </div>
      <div className={styles.when}>
        <Caption color="red" textTransform="bold">
-          {nights}{" "}
-          {nights > 1
-            ? intl.formatMessage({ id: "nights" })
-            : intl.formatMessage({ id: "night" })}
+          {intl.formatMessage(
+            { id: "booking.nights" },
+            { totalNights: nights }
+          )}
        </Caption>
        <DatePicker />
      </div>
--- a/components/Forms/BookingWidget/schema.ts
+++ b/components/Forms/BookingWidget/schema.ts
@@ -3,8 +3,9 @@ import { z } from "zod"
 import type { Location } from "@/types/trpc/routers/hotel/locations"

 export const bookingWidgetSchema = z.object({
-  search: z.string({ coerce: true }).min(1, "Required"),
+  bookingCode: z.string(), // Update this as required when working with booking codes component
  date: z.object({
+    // Update this as required once started working with Date picker in Nights component
    from: z.string(),
    to: z.string(),
  }),
@@ -23,9 +24,7 @@ export const bookingWidgetSchema = z.object({
    },
    { message: "Required" }
  ),
-  bookingCode: z.string(), // Update this as required when working with booking codes component
  redemption: z.boolean().default(false),
-  voucher: z.boolean().default(false),
  rooms: z.array(
    // This will be updated when working in guests component
    z.object({
@@ -38,4 +37,6 @@ export const bookingWidgetSchema = z.object({
      ),
    })
  ),
+  search: z.string({ coerce: true }).min(1, "Required"),
+  voucher: z.boolean().default(false),
 })
--- a/components/TempDesignSystem/Button/button.module.css
+++ b/components/TempDesignSystem/Button/button.module.css
@@ -69,19 +69,19 @@ a.default {
 }

 /* SIZES */
-.small {
+.btn.small {
  gap: var(--Spacing-x-quarter);
  height: 40px;
  padding: var(--Spacing-x1) var(--Spacing-x2);
 }

-.medium {
+.btn.medium {
  gap: var(--Spacing-x-half);
  height: 48px;
  padding: var(--Spacing-x-one-and-half) var(--Spacing-x2);
 }

-.large {
+.btn.large {
  gap: var(--Spacing-x-half);
  height: 56px;
  padding: var(--Spacing-x2) var(--Spacing-x3);
@@ -170,19 +170,19 @@ a.default {
  fill: var(--Base-Button-Secondary-On-Fill-Disabled);
 }

-.baseTertiary {
+.btn.baseTertiary {
  background-color: var(--Base-Button-Tertiary-Fill-Normal);
  color: var(--Base-Button-Tertiary-On-Fill-Normal);
 }

-.baseTertiary:active,
-.baseTertiary:focus,
-.baseTertiary:hover {
+.btn.baseTertiary:active,
+.btn.baseTertiary:focus,
+.btn.baseTertiary:hover {
  background-color: var(--Base-Button-Tertiary-Fill-Hover);
  color: var(--Base-Button-Tertiary-On-Fill-Hover);
 }

-.baseTertiary:disabled {
+.btn.baseTertiary:disabled {
  background-color: var(--Base-Button-Tertiary-Fill-Disabled);
  color: var(--Base-Button-Tertiary-On-Fill-Disabled);
 }
@@ -800,4 +800,4 @@ a.default {
 .icon.tertiaryLightSecondary:disabled svg,
 .icon.tertiaryLightSecondary:disabled svg * {
  fill: var(--Tertiary-Light-Button-Secondary-On-Fill-Disabled);
-}
+}
--- a/components/TempDesignSystem/Divider/divider.module.css
+++ b/components/TempDesignSystem/Divider/divider.module.css
@@ -33,6 +33,10 @@
  border-bottom-color: var(--Base-Border-Subtle);
 }

+.primaryLightSubtle {
+  border-bottom-color: var(--Primary-Light-On-Surface-Divider-subtle);
+}
+
 .opacity100 {
  opacity: 1;
 }
--- a/components/TempDesignSystem/Divider/variants.ts
+++ b/components/TempDesignSystem/Divider/variants.ts
@@ -5,12 +5,13 @@ import styles from "./divider.module.css"
 export const dividerVariants = cva(styles.divider, {
  variants: {
    color: {
-      burgundy: styles.burgundy,
-      peach: styles.peach,
      beige: styles.beige,
-      white: styles.white,
-      subtle: styles.subtle,
+      burgundy: styles.burgundy,
      pale: styles.pale,
+      peach: styles.peach,
+      primaryLightSubtle: styles.primaryLightSubtle,
+      subtle: styles.subtle,
+      white: styles.white,
    },
    opacity: {
      100: styles.opacity100,
--- a/i18n/dictionaries/da.json
+++ b/i18n/dictionaries/da.json
@@ -14,7 +14,6 @@
  "Any changes you've made will be lost.": "Alle ændringer, du har foretaget, går tabt.",
  "Are you sure you want to remove the card ending with {lastFourDigits} from your member profile?": "Er du sikker på, at du vil fjerne kortet, der slutter me {lastFourDigits} fra din medlemsprofil?",
  "Arrival date": "Ankomstdato",
-  "as of today": "fra idag",
  "As our": "Som vores {level}",
  "As our Close Friend": "Som vores nære ven",
  "At latest": "Senest",
@@ -31,9 +30,7 @@
  "Breakfast included": "Morgenmad inkluderet",
  "Bus terminal": "Busstation",
  "Business": "Forretning",
-  "by": "inden",
  "Cancel": "Afbestille",
-  "characters": "tegn",
  "Check in": "Check ind",
  "Check out": "Check ud",
  "Check out the credit cards saved to your profile. Pay with a saved card when signed in for a smoother web experience.": "Tjek de kreditkort, der er gemt på din profil. Betal med et gemt kort, når du er logget ind for en mere jævn weboplevelse.",
@@ -75,9 +72,9 @@
  "Explore all levels and benefits": "Udforsk alle niveauer og fordele",
  "Explore nearby": "Udforsk i nærheden",
  "Extras to your booking": "Tillæg til din booking",
+  "FAQ": "Ofte stillede spørgsmål",
  "Failed to delete credit card, please try again later.": "Kunne ikke slette kreditkort. Prøv venligst igen senere.",
  "Fair": "Messe",
-  "FAQ": "Ofte stillede spørgsmål",
  "Find booking": "Find booking",
  "Find hotels": "Find hotel",
  "Flexibility": "Fleksibilitet",
@@ -94,15 +91,11 @@
  "Hotel": "Hotel",
  "Hotel facilities": "Hotel faciliteter",
  "Hotel surroundings": "Hotel omgivelser",
-  "hotelPages.rooms.roomCard.person": "person",
-  "hotelPages.rooms.roomCard.persons": "personer",
-  "hotelPages.rooms.roomCard.seeRoomDetails": "Se værelsesdetaljer",
  "Hotels": "Hoteller",
  "How do you want to sleep?": "Hvordan vil du sove?",
  "How it works": "Hvordan det virker",
  "Image gallery": "Billedgalleri",
  "Join Scandic Friends": "Tilmeld dig Scandic Friends",
-  "km to city center": "km til byens centrum",
  "Language": "Sprog",
  "Latest searches": "Seneste søgninger",
  "Level": "Niveau",
@@ -129,9 +122,9 @@
  "Member price": "Medlemspris",
  "Member price from": "Medlemspris fra",
  "Members": "Medlemmer",
-  "Membership cards": "Medlemskort",
  "Membership ID": "Medlems-id",
  "Membership ID copied to clipboard": "Medlems-ID kopieret til udklipsholder",
+  "Membership cards": "Medlemskort",
  "Menu": "Menu",
  "Modify": "Ændre",
  "Month": "Måned",
@@ -146,9 +139,6 @@
  "Nearby companies": "Nærliggende virksomheder",
  "New password": "Nyt kodeord",
  "Next": "Næste",
-  "next level:": "Næste niveau:",
-  "night": "nat",
-  "nights": "nætter",
  "Nights needed to level up": "Nætter nødvendige for at komme i niveau",
  "No content published": "Intet indhold offentliggjort",
  "No matching location found": "Der blev ikke fundet nogen matchende placering",
@@ -159,13 +149,11 @@
  "Non-refundable": "Ikke-refunderbart",
  "Not found": "Ikke fundet",
  "Nr night, nr adult": "{nights, number} nat, {adults, number} voksen",
-  "number": "nummer",
  "On your journey": "På din rejse",
  "Open": "Åben",
  "Open language menu": "Åbn sprogmenuen",
  "Open menu": "Åbn menuen",
  "Open my pages menu": "Åbn mine sider menuen",
-  "or": "eller",
  "Overview": "Oversigt",
  "Parking": "Parkering",
  "Parking / Garage": "Parkering / Garage",
@@ -177,7 +165,6 @@
  "Phone is required": "Telefonnummer er påkrævet",
  "Phone number": "Telefonnummer",
  "Please enter a valid phone number": "Indtast venligst et gyldigt telefonnummer",
-  "points": "Point",
  "Points": "Point",
  "Points being calculated": "Point udregnes",
  "Points earned prior to May 1, 2021": "Point optjent inden 1. maj 2021",
@@ -220,29 +207,25 @@
  "Something went wrong and we couldn't add your card. Please try again later.": "Noget gik galt, og vi kunne ikke tilføje dit kort. Prøv venligst igen senere.",
  "Something went wrong and we couldn't remove your card. Please try again later.": "Noget gik galt, og vi kunne ikke fjerne dit kort. Prøv venligst igen senere.",
  "Something went wrong!": "Noget gik galt!",
-  "special character": "speciel karakter",
-  "spendable points expiring by": "{points} Brugbare point udløber den {date}",
  "Sports": "Sport",
  "Standard price": "Standardpris",
  "Street": "Gade",
  "Successfully updated profile!": "Profilen er opdateret med succes!",
  "Summary": "Opsummering",
+  "TUI Points": "TUI Points",
  "Tell us what information and updates you'd like to receive, and how, by clicking the link below.": "Fortæl os, hvilke oplysninger og opdateringer du gerne vil modtage, og hvordan, ved at klikke på linket nedenfor.",
  "Thank you": "Tak",
  "Theatre": "Teater",
  "There are no transactions to display": "Der er ingen transaktioner at vise",
  "Things nearby HOTEL_NAME": "Ting i nærheden af {hotelName}",
-  "to": "til",
  "Total Points": "Samlet antal point",
  "Tourist": "Turist",
  "Transaction date": "Overførselsdato",
  "Transactions": "Transaktioner",
  "Transportations": "Transport",
  "Tripadvisor reviews": "{rating} ({count} anmeldelser på Tripadvisor)",
-  "TUI Points": "TUI Points",
  "Type of bed": "Sengtype",
  "Type of room": "Værelsestype",
-  "uppercase letter": "stort bogstav",
  "Use bonus cheque": "Brug Bonus Cheque",
  "User information": "Brugeroplysninger",
  "View as list": "Vis som liste",
@@ -268,9 +251,9 @@
  "You canceled adding a new credit card.": "Du har annulleret tilføjelsen af et nyt kreditkort.",
  "You have no previous stays.": "Du har ingen tidligere ophold.",
  "You have no upcoming stays.": "Du har ingen kommende ophold.",
+  "Your Challenges Conquer & Earn!": "Dine udfordringer Overvind og tjen!",
  "Your card was successfully removed!": "Dit kort blev fjernet!",
  "Your card was successfully saved!": "Dit kort blev gemt!",
-  "Your Challenges Conquer & Earn!": "Dine udfordringer Overvind og tjen!",
  "Your current level": "Dit nuværende niveau",
  "Your details": "Dine oplysninger",
  "Your level": "Dit niveau",
@@ -278,5 +261,23 @@
  "Zip code": "Postnummer",
  "Zoo": "Zoo",
  "Zoom in": "Zoom ind",
-  "Zoom out": "Zoom ud"
-}
+  "Zoom out": "Zoom ud",
+  "as of today": "fra idag",
+  "booking.nights": "{totalNights, plural, one {# nat} other {# nætter}}",
+  "by": "inden",
+  "characters": "tegn",
+  "hotelPages.rooms.roomCard.person": "person",
+  "hotelPages.rooms.roomCard.persons": "personer",
+  "hotelPages.rooms.roomCard.seeRoomDetails": "Se værelsesdetaljer",
+  "km to city center": "km til byens centrum",
+  "next level:": "Næste niveau:",
+  "night": "nat",
+  "nights": "nætter",
+  "number": "nummer",
+  "or": "eller",
+  "points": "Point",
+  "special character": "speciel karakter",
+  "spendable points expiring by": "{points} Brugbare point udløber den {date}",
+  "to": "til",
+  "uppercase letter": "stort bogstav"
+}
--- a/i18n/dictionaries/de.json
+++ b/i18n/dictionaries/de.json
@@ -14,7 +14,6 @@
  "Any changes you've made will be lost.": "Alle Änderungen, die Sie vorgenommen haben, gehen verloren.",
  "Are you sure you want to remove the card ending with {lastFourDigits} from your member profile?": "Möchten Sie die Karte mit der Endung {lastFourDigits} wirklich aus Ihrem Mitgliedsprofil entfernen?",
  "Arrival date": "Ankunftsdatum",
-  "as of today": "Stand heute",
  "As our": "Als unser {level}",
  "As our Close Friend": "Als unser enger Freund",
  "At latest": "Spätestens",
@@ -31,9 +30,7 @@
  "Breakfast included": "Frühstück inbegriffen",
  "Bus terminal": "Busbahnhof",
  "Business": "Geschäft",
-  "by": "bis",
  "Cancel": "Stornieren",
-  "characters": "figuren",
  "Check in": "Einchecken",
  "Check out": "Auschecken",
  "Check out the credit cards saved to your profile. Pay with a saved card when signed in for a smoother web experience.": "Sehen Sie sich die in Ihrem Profil gespeicherten Kreditkarten an. Bezahlen Sie mit einer gespeicherten Karte, wenn Sie angemeldet sind, für ein reibungsloseres Web-Erlebnis.",
@@ -75,9 +72,9 @@
  "Explore all levels and benefits": "Entdecken Sie alle Levels und Vorteile",
  "Explore nearby": "Erkunden Sie die Umgebung",
  "Extras to your booking": "Extras zu Ihrer Buchung",
+  "FAQ": "Häufig gestellte Fragen",
  "Failed to delete credit card, please try again later.": "Kreditkarte konnte nicht gelöscht werden. Bitte versuchen Sie es später noch einmal.",
  "Fair": "Messe",
-  "FAQ": "Häufig gestellte Fragen",
  "Find booking": "Buchung finden",
  "Find hotels": "Hotels finden",
  "Flexibility": "Flexibilität",
@@ -94,15 +91,11 @@
  "Hotel": "Hotel",
  "Hotel facilities": "Hotel-Infos",
  "Hotel surroundings": "Umgebung des Hotels",
-  "hotelPages.rooms.roomCard.person": "person",
-  "hotelPages.rooms.roomCard.persons": "personen",
-  "hotelPages.rooms.roomCard.seeRoomDetails": "Zimmerdetails ansehen",
  "Hotels": "Hotels",
  "How do you want to sleep?": "Wie möchtest du schlafen?",
  "How it works": "Wie es funktioniert",
  "Image gallery": "Bildergalerie",
  "Join Scandic Friends": "Treten Sie Scandic Friends bei",
-  "km to city center": "km bis zum Stadtzentrum",
  "Language": "Sprache",
  "Latest searches": "Letzte Suchanfragen",
  "Level": "Level",
@@ -129,9 +122,9 @@
  "Member price": "Mitgliederpreis",
  "Member price from": "Mitgliederpreis ab",
  "Members": "Mitglieder",
-  "Membership cards": "Mitgliedskarten",
  "Membership ID": "Mitglieds-ID",
  "Membership ID copied to clipboard": "Mitglieds-ID in die Zwischenablage kopiert",
+  "Membership cards": "Mitgliedskarten",
  "Menu": "Menu",
  "Modify": "Ändern",
  "Month": "Monat",
@@ -146,9 +139,6 @@
  "Nearby companies": "Nahe gelegene Unternehmen",
  "New password": "Neues Kennwort",
  "Next": "Nächste",
-  "next level:": "Nächstes Level:",
-  "night": "nacht",
-  "nights": "Nächte",
  "Nights needed to level up": "Nächte, die zum Levelaufstieg benötigt werden",
  "No content published": "Kein Inhalt veröffentlicht",
  "No matching location found": "Kein passender Standort gefunden",
@@ -159,13 +149,11 @@
  "Non-refundable": "Nicht erstattungsfähig",
  "Not found": "Nicht gefunden",
  "Nr night, nr adult": "{nights, number} Nacht, {adults, number} Erwachsener",
-  "number": "nummer",
  "On your journey": "Auf deiner Reise",
  "Open": "Offen",
  "Open language menu": "Sprachmenü öffnen",
  "Open menu": "Menü öffnen",
  "Open my pages menu": "Meine Seiten Menü öffnen",
-  "or": "oder",
  "Overview": "Übersicht",
  "Parking": "Parken",
  "Parking / Garage": "Parken / Garage",
@@ -177,7 +165,6 @@
  "Phone number": "Telefonnummer",
  "Please enter a valid phone number": "Bitte geben Sie eine gültige Telefonnummer ein",
  "Points": "Punkte",
-  "points": "Punkte",
  "Points being calculated": "Punkte werden berechnet",
  "Points earned prior to May 1, 2021": "Zusammengeführte Punkte vor dem 1. Mai 2021",
  "Points may take up to 10 days to be displayed.": "Es kann bis zu 10 Tage dauern, bis Punkte angezeigt werden.",
@@ -219,29 +206,25 @@
  "Something went wrong and we couldn't add your card. Please try again later.": "Ein Fehler ist aufgetreten und wir konnten Ihre Karte nicht hinzufügen. Bitte versuchen Sie es später erneut.",
  "Something went wrong and we couldn't remove your card. Please try again later.": "Ein Fehler ist aufgetreten und wir konnten Ihre Karte nicht entfernen. Bitte versuchen Sie es später noch einmal.",
  "Something went wrong!": "Etwas ist schief gelaufen!",
-  "special character": "sonderzeichen",
-  "spendable points expiring by": "{points} Einlösbare punkte verfallen bis zum {date}",
  "Sports": "Sport",
  "Standard price": "Standardpreis",
  "Street": "Straße",
  "Successfully updated profile!": "Profil erfolgreich aktualisiert!",
  "Summary": "Zusammenfassung",
+  "TUI Points": "TUI Points",
  "Tell us what information and updates you'd like to receive, and how, by clicking the link below.": "Teilen Sie uns mit, welche Informationen und Updates Sie wie erhalten möchten, indem Sie auf den unten stehenden Link klicken.",
  "Thank you": "Danke",
  "Theatre": "Theater",
  "There are no transactions to display": "Es sind keine Transaktionen zum Anzeigen vorhanden",
  "Things nearby HOTEL_NAME": "Dinge in der Nähe von {hotelName}",
-  "to": "zu",
  "Total Points": "Gesamtpunktzahl",
  "Tourist": "Tourist",
  "Transaction date": "Transaktionsdatum",
  "Transactions": "Transaktionen",
  "Transportations": "Transportmittel",
  "Tripadvisor reviews": "{rating} ({count} Bewertungen auf Tripadvisor)",
-  "TUI Points": "TUI Points",
  "Type of bed": "Bettentyp",
  "Type of room": "Zimmerart",
-  "uppercase letter": "großbuchstabe",
  "Use bonus cheque": "Bonusscheck nutzen",
  "User information": "Nutzerinformation",
  "View as list": "Als Liste anzeigen",
@@ -267,9 +250,9 @@
  "You canceled adding a new credit card.": "Sie haben das Hinzufügen einer neuen Kreditkarte abgebrochen.",
  "You have no previous stays.": "Sie haben keine vorherigen Aufenthalte.",
  "You have no upcoming stays.": "Sie haben keine bevorstehenden Aufenthalte.",
+  "Your Challenges Conquer & Earn!": "Meistern Sie Ihre Herausforderungen und verdienen Sie Geld!",
  "Your card was successfully removed!": "Ihre Karte wurde erfolgreich entfernt!",
  "Your card was successfully saved!": "Ihre Karte wurde erfolgreich gespeichert!",
-  "Your Challenges Conquer & Earn!": "Meistern Sie Ihre Herausforderungen und verdienen Sie Geld!",
  "Your current level": "Ihr aktuelles Level",
  "Your details": "Ihre Angaben",
  "Your level": "Dein level",
@@ -277,5 +260,23 @@
  "Zip code": "PLZ",
  "Zoo": "Zoo",
  "Zoom in": "Vergrößern",
-  "Zoom out": "Verkleinern"
-}
+  "Zoom out": "Verkleinern",
+  "as of today": "Stand heute",
+  "booking.nights": "{totalNights, plural, one {# nacht} other {# Nächte}}",
+  "by": "bis",
+  "characters": "figuren",
+  "hotelPages.rooms.roomCard.person": "person",
+  "hotelPages.rooms.roomCard.persons": "personen",
+  "hotelPages.rooms.roomCard.seeRoomDetails": "Zimmerdetails ansehen",
+  "km to city center": "km bis zum Stadtzentrum",
+  "next level:": "Nächstes Level:",
+  "night": "nacht",
+  "nights": "Nächte",
+  "number": "nummer",
+  "or": "oder",
+  "points": "Punkte",
+  "special character": "sonderzeichen",
+  "spendable points expiring by": "{points} Einlösbare punkte verfallen bis zum {date}",
+  "to": "zu",
+  "uppercase letter": "großbuchstabe"
+}
--- a/i18n/dictionaries/en.json
+++ b/i18n/dictionaries/en.json
@@ -14,7 +14,6 @@
  "Any changes you've made will be lost.": "Any changes you've made will be lost.",
  "Are you sure you want to remove the card ending with {lastFourDigits} from your member profile?": "Are you sure you want to remove the card ending with {lastFourDigits} from your member profile?",
  "Arrival date": "Arrival date",
-  "as of today": "as of today",
  "As our": "As our {level}",
  "As our Close Friend": "As our Close Friend",
  "At latest": "At latest",
@@ -31,9 +30,7 @@
  "Breakfast included": "Breakfast included",
  "Bus terminal": "Bus terminal",
  "Business": "Business",
-  "by": "by",
  "Cancel": "Cancel",
-  "characters": "characters",
  "Check in": "Check in",
  "Check out": "Check out",
  "Check out the credit cards saved to your profile. Pay with a saved card when signed in for a smoother web experience.": "Check out the credit cards saved to your profile. Pay with a saved card when signed in for a smoother web experience.",
@@ -75,9 +72,9 @@
  "Explore all levels and benefits": "Explore all levels and benefits",
  "Explore nearby": "Explore nearby",
  "Extras to your booking": "Extras to your booking",
+  "FAQ": "FAQ",
  "Failed to delete credit card, please try again later.": "Failed to delete credit card, please try again later.",
  "Fair": "Fair",
-  "FAQ": "FAQ",
  "Find booking": "Find booking",
  "Find hotels": "Find hotels",
  "Flexibility": "Flexibility",
@@ -94,15 +91,11 @@
  "Hotel": "Hotel",
  "Hotel facilities": "Hotel facilities",
  "Hotel surroundings": "Hotel surroundings",
-  "hotelPages.rooms.roomCard.person": "person",
-  "hotelPages.rooms.roomCard.persons": "persons",
-  "hotelPages.rooms.roomCard.seeRoomDetails": "See room details",
  "Hotels": "Hotels",
  "How do you want to sleep?": "How do you want to sleep?",
  "How it works": "How it works",
  "Image gallery": "Image gallery",
  "Join Scandic Friends": "Join Scandic Friends",
-  "km to city center": "km to city center",
  "Language": "Language",
  "Latest searches": "Latest searches",
  "Level": "Level",
@@ -129,9 +122,9 @@
  "Member price": "Member price",
  "Member price from": "Member price from",
  "Members": "Members",
-  "Membership cards": "Membership cards",
  "Membership ID": "Membership ID",
  "Membership ID copied to clipboard": "Membership ID copied to clipboard",
+  "Membership cards": "Membership cards",
  "Menu": "Menu",
  "Modify": "Modify",
  "Month": "Month",
@@ -146,9 +139,6 @@
  "Nearby companies": "Nearby companies",
  "New password": "New password",
  "Next": "Next",
-  "next level:": "next level:",
-  "night": "night",
-  "nights": "nights",
  "Nights needed to level up": "Nights needed to level up",
  "No content published": "No content published",
  "No matching location found": "No matching location found",
@@ -159,13 +149,11 @@
  "Non-refundable": "Non-refundable",
  "Not found": "Not found",
  "Nr night, nr adult": "{nights, number} night, {adults, number} adult",
-  "number": "number",
  "On your journey": "On your journey",
  "Open": "Open",
  "Open language menu": "Open language menu",
  "Open menu": "Open menu",
  "Open my pages menu": "Open my pages menu",
-  "or": "or",
  "Overview": "Overview",
  "Parking": "Parking",
  "Parking / Garage": "Parking / Garage",
@@ -178,7 +166,6 @@
  "Phone number": "Phone number",
  "Please enter a valid phone number": "Please enter a valid phone number",
  "Points": "Points",
-  "points": "Points",
  "Points being calculated": "Points being calculated",
  "Points earned prior to May 1, 2021": "Points earned prior to May 1, 2021",
  "Points may take up to 10 days to be displayed.": "Points may take up to 10 days to be displayed.",
@@ -207,6 +194,7 @@
  "Select a country": "Select a country",
  "Select country of residence": "Select country of residence",
  "Select date of birth": "Select date of birth",
+  "Select dates": "Select dates",
  "Select language": "Select language",
  "Select your language": "Select your language",
  "Shopping": "Shopping",
@@ -220,29 +208,25 @@
  "Something went wrong and we couldn't add your card. Please try again later.": "Something went wrong and we couldn't add your card. Please try again later.",
  "Something went wrong and we couldn't remove your card. Please try again later.": "Something went wrong and we couldn't remove your card. Please try again later.",
  "Something went wrong!": "Something went wrong!",
-  "special character": "special character",
-  "spendable points expiring by": "{points} spendable points expiring by {date}",
  "Sports": "Sports",
  "Standard price": "Standard price",
  "Street": "Street",
  "Successfully updated profile!": "Successfully updated profile!",
  "Summary": "Summary",
+  "TUI Points": "TUI Points",
  "Tell us what information and updates you'd like to receive, and how, by clicking the link below.": "Tell us what information and updates you'd like to receive, and how, by clicking the link below.",
  "Thank you": "Thank you",
  "Theatre": "Theatre",
  "There are no transactions to display": "There are no transactions to display",
  "Things nearby HOTEL_NAME": "Things nearby {hotelName}",
-  "to": "to",
  "Total Points": "Total Points",
  "Tourist": "Tourist",
  "Transaction date": "Transaction date",
  "Transactions": "Transactions",
  "Transportations": "Transportations",
  "Tripadvisor reviews": "{rating} ({count} reviews on Tripadvisor)",
-  "TUI Points": "TUI Points",
  "Type of bed": "Type of bed",
  "Type of room": "Type of room",
-  "uppercase letter": "uppercase letter",
  "Use bonus cheque": "Use bonus cheque",
  "User information": "User information",
  "View as list": "View as list",
@@ -268,9 +252,9 @@
  "You canceled adding a new credit card.": "You canceled adding a new credit card.",
  "You have no previous stays.": "You have no previous stays.",
  "You have no upcoming stays.": "You have no upcoming stays.",
+  "Your Challenges Conquer & Earn!": "Your Challenges Conquer & Earn!",
  "Your card was successfully removed!": "Your card was successfully removed!",
  "Your card was successfully saved!": "Your card was successfully saved!",
-  "Your Challenges Conquer & Earn!": "Your Challenges Conquer & Earn!",
  "Your current level": "Your current level",
  "Your details": "Your details",
  "Your level": "Your level",
@@ -278,5 +262,23 @@
  "Zip code": "Zip code",
  "Zoo": "Zoo",
  "Zoom in": "Zoom in",
-  "Zoom out": "Zoom out"
-}
+  "Zoom out": "Zoom out",
+  "as of today": "as of today",
+  "booking.nights": "{totalNights, plural, one {# night} other {# nights}}",
+  "by": "by",
+  "characters": "characters",
+  "hotelPages.rooms.roomCard.person": "person",
+  "hotelPages.rooms.roomCard.persons": "persons",
+  "hotelPages.rooms.roomCard.seeRoomDetails": "See room details",
+  "km to city center": "km to city center",
+  "next level:": "next level:",
+  "night": "night",
+  "nights": "nights",
+  "number": "number",
+  "or": "or",
+  "points": "Points",
+  "special character": "special character",
+  "spendable points expiring by": "{points} spendable points expiring by {date}",
+  "to": "to",
+  "uppercase letter": "uppercase letter"
+}
--- a/i18n/dictionaries/fi.json
+++ b/i18n/dictionaries/fi.json
@@ -14,7 +14,6 @@
  "Any changes you've made will be lost.": "Kaikki tekemäsi muutokset menetetään.",
  "Are you sure you want to remove the card ending with {lastFourDigits} from your member profile?": "Haluatko varmasti poistaa kortin, joka päättyy numeroon {lastFourDigits} jäsenprofiilistasi?",
  "Arrival date": "Saapumispäivä",
-  "as of today": "tänään",
  "As our": "{level}-etu",
  "As our Close Friend": "Läheisenä ystävänämme",
  "At latest": "Viimeistään",
@@ -31,9 +30,7 @@
  "Breakfast included": "Aamiainen sisältyy",
  "Bus terminal": "Bussiasema",
  "Business": "Business",
-  "by": "mennessä",
  "Cancel": "Peruuttaa",
-  "characters": "hahmoja",
  "Check in": "Sisäänkirjautuminen",
  "Check out": "Uloskirjautuminen",
  "Check out the credit cards saved to your profile. Pay with a saved card when signed in for a smoother web experience.": "Tarkista profiiliisi tallennetut luottokortit. Maksa tallennetulla kortilla kirjautuneena, jotta verkkokokemus on sujuvampi.",
@@ -75,9 +72,9 @@
  "Explore all levels and benefits": "Tutustu kaikkiin tasoihin ja etuihin",
  "Explore nearby": "Tutustu lähialueeseen",
  "Extras to your booking": "Varauksessa lisäpalveluita",
+  "FAQ": "UKK",
  "Failed to delete credit card, please try again later.": "Luottokortin poistaminen epäonnistui, yritä myöhemmin uudelleen.",
  "Fair": "Messukeskus",
-  "FAQ": "UKK",
  "Find booking": "Etsi varaus",
  "Find hotels": "Etsi hotelleja",
  "Flexibility": "Joustavuus",
@@ -94,15 +91,11 @@
  "Hotel": "Hotelli",
  "Hotel facilities": "Hotellin palvelut",
  "Hotel surroundings": "Hotellin ympäristö",
-  "hotelPages.rooms.roomCard.person": "henkilö",
-  "hotelPages.rooms.roomCard.persons": "Henkilöä",
-  "hotelPages.rooms.roomCard.seeRoomDetails": "Katso huoneen tiedot",
  "Hotels": "Hotellit",
  "How do you want to sleep?": "Kuinka haluat nukkua?",
  "How it works": "Kuinka se toimii",
  "Image gallery": "Kuvagalleria",
  "Join Scandic Friends": "Liity jäseneksi",
-  "km to city center": "km keskustaan",
  "Language": "Kieli",
  "Latest searches": "Viimeisimmät haut",
  "Level": "Level",
@@ -129,9 +122,9 @@
  "Member price": "Jäsenhinta",
  "Member price from": "Jäsenhinta alkaen",
  "Members": "Jäsenet",
-  "Membership cards": "Jäsenkortit",
  "Membership ID": "Jäsentunnus",
  "Membership ID copied to clipboard": "Jäsenyystunnus kopioitu leikepöydälle",
+  "Membership cards": "Jäsenkortit",
  "Menu": "Valikko",
  "Modify": "Muokkaa",
  "Month": "Kuukausi",
@@ -146,9 +139,6 @@
  "Nearby companies": "Läheiset yritykset",
  "New password": "Uusi salasana",
  "Next": "Seuraava",
-  "next level:": "pistettä tasolle:",
-  "night": "yö",
-  "nights": "yötä",
  "Nights needed to level up": "Yöt, joita tarvitaan tasolle",
  "No content published": "Ei julkaistua sisältöä",
  "No matching location found": "Vastaavaa sijaintia ei löytynyt",
@@ -159,13 +149,11 @@
  "Non-refundable": "Ei palautettavissa",
  "Not found": "Ei löydetty",
  "Nr night, nr adult": "{nights, number} yö, {adults, number} aikuinen",
-  "number": "määrä",
  "On your journey": "Matkallasi",
  "Open": "Avata",
  "Open language menu": "Avaa kielivalikko",
  "Open menu": "Avaa valikko",
  "Open my pages menu": "Avaa omat sivut -valikko",
-  "or": "tai",
  "Overview": "Yleiskatsaus",
  "Parking": "Pysäköinti",
  "Parking / Garage": "Pysäköinti / Autotalli",
@@ -177,7 +165,6 @@
  "Phone is required": "Puhelin vaaditaan",
  "Phone number": "Puhelinnumero",
  "Please enter a valid phone number": "Ole hyvä ja näppäile voimassaoleva puhelinnumero",
-  "points": "pistettä",
  "Points": "Pisteet",
  "Points being calculated": "Pisteitä lasketaan",
  "Points earned prior to May 1, 2021": "Pisteet, jotka ansaittu ennen 1.5.2021",
@@ -221,29 +208,25 @@
  "Something went wrong and we couldn't add your card. Please try again later.": "Jotain meni pieleen, emmekä voineet lisätä korttiasi. Yritä myöhemmin uudelleen.",
  "Something went wrong and we couldn't remove your card. Please try again later.": "Jotain meni pieleen, emmekä voineet poistaa korttiasi. Yritä myöhemmin uudelleen.",
  "Something went wrong!": "Jotain meni pieleen!",
-  "special character": "erikoishahmo",
-  "spendable points expiring by": "{points} pistettä vanhenee {date} mennessä",
  "Sports": "Urheilu",
  "Standard price": "Normaali hinta",
  "Street": "Katu",
  "Successfully updated profile!": "Profiilin päivitys onnistui!",
  "Summary": "Yhteenveto",
+  "TUI Points": "TUI Points",
  "Tell us what information and updates you'd like to receive, and how, by clicking the link below.": "Kerro meille, mitä tietoja ja päivityksiä haluat saada ja miten, napsauttamalla alla olevaa linkkiä.",
  "Thank you": "Kiitos",
  "Theatre": "Teatteri",
  "There are no transactions to display": "Näytettäviä tapahtumia ei ole",
  "Things nearby HOTEL_NAME": "Lähellä olevia asioita {hotelName}",
-  "to": "to",
  "Total Points": "Kokonaispisteet",
  "Tourist": "Turisti",
  "Transaction date": "Tapahtuman päivämäärä",
  "Transactions": "Tapahtumat",
  "Transportations": "Kuljetukset",
  "Tripadvisor reviews": "{rating} ({count} arvostelua TripAdvisorissa)",
-  "TUI Points": "TUI Points",
  "Type of bed": "Vuodetyyppi",
  "Type of room": "Huonetyyppi",
-  "uppercase letter": "iso kirjain",
  "Use bonus cheque": "Käytä bonussekkiä",
  "User information": "Käyttäjän tiedot",
  "View as list": "Näytä listana",
@@ -269,9 +252,9 @@
  "You canceled adding a new credit card.": "Peruutit uuden luottokortin lisäämisen.",
  "You have no previous stays.": "Sinulla ei ole aiempia majoituksia.",
  "You have no upcoming stays.": "Sinulla ei ole tulevia majoituksia.",
+  "Your Challenges Conquer & Earn!": "Voita ja ansaitse haasteesi!",
  "Your card was successfully removed!": "Korttisi poistettiin onnistuneesti!",
  "Your card was successfully saved!": "Korttisi tallennettu onnistuneesti!",
-  "Your Challenges Conquer & Earn!": "Voita ja ansaitse haasteesi!",
  "Your current level": "Nykyinen tasosi",
  "Your details": "Tietosi",
  "Your level": "Tasosi",
@@ -279,5 +262,23 @@
  "Zip code": "Postinumero",
  "Zoo": "Eläintarha",
  "Zoom in": "Lähennä",
-  "Zoom out": "Loitonna"
-}
+  "Zoom out": "Loitonna",
+  "as of today": "tänään",
+  "booking.nights": "{totalNights, plural, one {# yö} other {# yötä}}",
+  "by": "mennessä",
+  "characters": "hahmoja",
+  "hotelPages.rooms.roomCard.person": "henkilö",
+  "hotelPages.rooms.roomCard.persons": "Henkilöä",
+  "hotelPages.rooms.roomCard.seeRoomDetails": "Katso huoneen tiedot",
+  "km to city center": "km keskustaan",
+  "next level:": "pistettä tasolle:",
+  "night": "yö",
+  "nights": "yötä",
+  "number": "määrä",
+  "or": "tai",
+  "points": "pistettä",
+  "special character": "erikoishahmo",
+  "spendable points expiring by": "{points} pistettä vanhenee {date} mennessä",
+  "to": "to",
+  "uppercase letter": "iso kirjain"
+}
--- a/i18n/dictionaries/no.json
+++ b/i18n/dictionaries/no.json
@@ -14,7 +14,6 @@
  "Any changes you've made will be lost.": "Eventuelle endringer du har gjort, går tapt.",
  "Are you sure you want to remove the card ending with {lastFourDigits} from your member profile?": "Er du sikker på at du vil fjerne kortet som slutter på {lastFourDigits} fra medlemsprofilen din?",
  "Arrival date": "Ankomstdato",
-  "as of today": "per idag",
  "As our": "Som vår {level}",
  "As our Close Friend": "Som vår nære venn",
  "At latest": "Senest",
@@ -31,9 +30,7 @@
  "Breakfast included": "Frokost inkludert",
  "Bus terminal": "Bussterminal",
  "Business": "Forretnings",
-  "by": "innen",
  "Cancel": "Avbryt",
-  "characters": "tegn",
  "Check in": "Sjekk inn",
  "Check out": "Sjekk ut",
  "Check out the credit cards saved to your profile. Pay with a saved card when signed in for a smoother web experience.": "Sjekk ut kredittkortene som er lagret på profilen din. Betal med et lagret kort når du er pålogget for en jevnere nettopplevelse.",
@@ -75,9 +72,9 @@
  "Explore all levels and benefits": "Utforsk alle nivåer og fordeler",
  "Explore nearby": "Utforsk i nærheten",
  "Extras to your booking": "Tilvalg til bestillingen din",
+  "FAQ": "FAQ",
  "Failed to delete credit card, please try again later.": "Kunne ikke slette kredittkortet, prøv igjen senere.",
  "Fair": "Messe",
-  "FAQ": "FAQ",
  "Find booking": "Finn booking",
  "Find hotels": "Finn hotell",
  "Flexibility": "Fleksibilitet",
@@ -94,15 +91,11 @@
  "Hotel": "Hotel",
  "Hotel facilities": "Hotelfaciliteter",
  "Hotel surroundings": "Hotellomgivelser",
-  "hotelPages.rooms.roomCard.person": "person",
-  "hotelPages.rooms.roomCard.persons": "personer",
-  "hotelPages.rooms.roomCard.seeRoomDetails": "Se detaljer om rommet",
  "Hotels": "Hoteller",
  "How do you want to sleep?": "Hvordan vil du sove?",
  "How it works": "Hvordan det fungerer",
  "Image gallery": "Bildegalleri",
  "Join Scandic Friends": "Bli med i Scandic Friends",
-  "km to city center": "km til sentrum",
  "Language": "Språk",
  "Latest searches": "Siste søk",
  "Level": "Nivå",
@@ -129,9 +122,9 @@
  "Member price": "Medlemspris",
  "Member price from": "Medlemspris fra",
  "Members": "Medlemmer",
-  "Membership cards": "Medlemskort",
  "Membership ID": "Medlems-ID",
  "Membership ID copied to clipboard": "Medlems-ID kopiert til utklippstavlen",
+  "Membership cards": "Medlemskort",
  "Menu": "Menu",
  "Modify": "Endre",
  "Month": "Måned",
@@ -146,9 +139,6 @@
  "Nearby companies": "Nærliggende selskaper",
  "New password": "Nytt passord",
  "Next": "Neste",
-  "next level:": "Neste nivå:",
-  "night": "natt",
-  "nights": "netter",
  "Nights needed to level up": "Netter som trengs for å komme opp i nivå",
  "No content published": "Ingen innhold publisert",
  "No matching location found": "Fant ingen samsvarende plassering",
@@ -159,13 +149,11 @@
  "Non-refundable": "Ikke-refunderbart",
  "Not found": "Ikke funnet",
  "Nr night, nr adult": "{nights, number} natt, {adults, number} voksen",
-  "number": "antall",
  "On your journey": "På reisen din",
  "Open": "Åpen",
  "Open language menu": "Åpne språkmenyen",
  "Open menu": "Åpne menyen",
  "Open my pages menu": "Åpne mine sider menyen",
-  "or": "eller",
  "Overview": "Oversikt",
  "Parking": "Parkering",
  "Parking / Garage": "Parkering / Garasje",
@@ -177,7 +165,6 @@
  "Phone is required": "Telefon kreves",
  "Phone number": "Telefonnummer",
  "Please enter a valid phone number": "Vennligst oppgi et gyldig telefonnummer",
-  "points": "poeng",
  "Points": "Poeng",
  "Points being calculated": "Poeng beregnes",
  "Points earned prior to May 1, 2021": "Opptjente poeng før 1. mai 2021",
@@ -220,29 +207,25 @@
  "Something went wrong and we couldn't add your card. Please try again later.": "Noe gikk galt, og vi kunne ikke legge til kortet ditt. Prøv igjen senere.",
  "Something went wrong and we couldn't remove your card. Please try again later.": "Noe gikk galt, og vi kunne ikke fjerne kortet ditt. Vennligst prøv igjen senere.",
  "Something went wrong!": "Noe gikk galt!",
-  "special character": "spesiell karakter",
-  "spendable points expiring by": "{points} Brukbare poeng utløper innen {date}",
  "Sports": "Sport",
  "Standard price": "Standardpris",
  "Street": "Gate",
  "Successfully updated profile!": "Vellykket oppdatert profil!",
  "Summary": "Sammendrag",
+  "TUI Points": "TUI Points",
  "Tell us what information and updates you'd like to receive, and how, by clicking the link below.": "Fortell oss hvilken informasjon og hvilke oppdateringer du ønsker å motta, og hvordan, ved å klikke på lenken nedenfor.",
  "Thank you": "Takk",
  "Theatre": "Teater",
  "There are no transactions to display": "Det er ingen transaksjoner å vise",
  "Things nearby HOTEL_NAME": "Ting i nærheten av {hotelName}",
-  "to": "til",
  "Total Points": "Totale poeng",
  "Tourist": "Turist",
  "Transaction date": "Transaksjonsdato",
  "Transactions": "Transaksjoner",
  "Transportations": "Transport",
  "Tripadvisor reviews": "{rating} ({count} anmeldelser på Tripadvisor)",
-  "TUI Points": "TUI Points",
  "Type of bed": "Sengtype",
  "Type of room": "Romtype",
-  "uppercase letter": "stor bokstav",
  "Use bonus cheque": "Bruk bonussjekk",
  "User information": "Brukerinformasjon",
  "View as list": "Vis som liste",
@@ -268,9 +251,9 @@
  "You canceled adding a new credit card.": "Du kansellerte å legge til et nytt kredittkort.",
  "You have no previous stays.": "Du har ingen tidligere opphold.",
  "You have no upcoming stays.": "Du har ingen kommende opphold.",
+  "Your Challenges Conquer & Earn!": "Dine utfordringer Erobre og tjen!",
  "Your card was successfully removed!": "Kortet ditt ble fjernet!",
  "Your card was successfully saved!": "Kortet ditt ble lagret!",
-  "Your Challenges Conquer & Earn!": "Dine utfordringer Erobre og tjen!",
  "Your current level": "Ditt nåværende nivå",
  "Your details": "Dine detaljer",
  "Your level": "Ditt nivå",
@@ -278,5 +261,23 @@
  "Zip code": "Post kode",
  "Zoo": "Dyrehage",
  "Zoom in": "Zoom inn",
-  "Zoom out": "Zoom ut"
-}
+  "Zoom out": "Zoom ut",
+  "as of today": "per idag",
+  "booking.nights": "{totalNights, plural, one {# natt} other {# netter}}",
+  "by": "innen",
+  "characters": "tegn",
+  "hotelPages.rooms.roomCard.person": "person",
+  "hotelPages.rooms.roomCard.persons": "personer",
+  "hotelPages.rooms.roomCard.seeRoomDetails": "Se detaljer om rommet",
+  "km to city center": "km til sentrum",
+  "next level:": "Neste nivå:",
+  "night": "natt",
+  "nights": "netter",
+  "number": "antall",
+  "or": "eller",
+  "points": "poeng",
+  "special character": "spesiell karakter",
+  "spendable points expiring by": "{points} Brukbare poeng utløper innen {date}",
+  "to": "til",
+  "uppercase letter": "stor bokstav"
+}
--- a/i18n/dictionaries/sv.json
+++ b/i18n/dictionaries/sv.json
@@ -14,7 +14,6 @@
  "Any changes you've made will be lost.": "Alla ändringar du har gjort kommer att gå förlorade.",
  "Are you sure you want to remove the card ending with {lastFourDigits} from your member profile?": "Är du säker på att du vill ta bort kortet som slutar med {lastFourDigits} från din medlemsprofil?",
  "Arrival date": "Ankomstdatum",
-  "as of today": "från och med idag",
  "As our": "Som vår {level}",
  "As our Close Friend": "Som vår nära vän",
  "At latest": "Senast",
@@ -31,9 +30,7 @@
  "Breakfast included": "Frukost ingår",
  "Bus terminal": "Bussterminal",
  "Business": "Business",
-  "by": "innan",
  "Cancel": "Avbryt",
-  "characters": "tecken",
  "Check in": "Checka in",
  "Check out": "Checka ut",
  "Check out the credit cards saved to your profile. Pay with a saved card when signed in for a smoother web experience.": "Kolla in kreditkorten som sparats i din profil. Betala med ett sparat kort när du är inloggad för en smidigare webbupplevelse.",
@@ -75,9 +72,9 @@
  "Explore all levels and benefits": "Utforska alla nivåer och fördelar",
  "Explore nearby": "Utforska i närheten",
  "Extras to your booking": "Extra tillval till din bokning",
+  "FAQ": "FAQ",
  "Failed to delete credit card, please try again later.": "Det gick inte att ta bort kreditkortet, försök igen senare.",
  "Fair": "Mässa",
-  "FAQ": "FAQ",
  "Find booking": "Hitta bokning",
  "Find hotels": "Hitta hotell",
  "Flexibility": "Flexibilitet",
@@ -94,15 +91,11 @@
  "Hotel": "Hotell",
  "Hotel facilities": "Hotellfaciliteter",
  "Hotel surroundings": "Hotellomgivning",
-  "hotelPages.rooms.roomCard.person": "person",
-  "hotelPages.rooms.roomCard.persons": "personer",
-  "hotelPages.rooms.roomCard.seeRoomDetails": "Se information om rummet",
  "Hotels": "Hotell",
  "How do you want to sleep?": "Hur vill du sova?",
  "How it works": "Hur det fungerar",
  "Image gallery": "Bildgalleri",
  "Join Scandic Friends": "Gå med i Scandic Friends",
-  "km to city center": "km till stadens centrum",
  "Language": "Språk",
  "Latest searches": "Senaste sökningarna",
  "Level": "Nivå",
@@ -129,9 +122,9 @@
  "Member price": "Medlemspris",
  "Member price from": "Medlemspris från",
  "Members": "Medlemmar",
-  "Membership cards": "Medlemskort",
  "Membership ID": "Medlems-ID",
  "Membership ID copied to clipboard": "Medlems-ID kopierat till urklipp",
+  "Membership cards": "Medlemskort",
  "Menu": "Meny",
  "Modify": "Ändra",
  "Month": "Månad",
@@ -146,9 +139,6 @@
  "Nearby companies": "Närliggande företag",
  "New password": "Nytt lösenord",
  "Next": "Nästa",
-  "next level:": "Nästa nivå:",
-  "night": "natt",
-  "nights": "nätter",
  "Nights needed to level up": "Nätter som behövs för att gå upp i nivå",
  "No content published": "Inget innehåll publicerat",
  "No matching location found": "Ingen matchande plats hittades",
@@ -159,13 +149,11 @@
  "Non-refundable": "Ej återbetalningsbar",
  "Not found": "Hittades inte",
  "Nr night, nr adult": "{nights, number} natt, {adults, number} vuxen",
-  "number": "nummer",
  "On your journey": "På din resa",
  "Open": "Öppna",
  "Open language menu": "Öppna språkmenyn",
  "Open menu": "Öppna menyn",
  "Open my pages menu": "Öppna mina sidor menyn",
-  "or": "eller",
  "Overview": "Översikt",
  "Parking": "Parkering",
  "Parking / Garage": "Parkering / Garage",
@@ -177,7 +165,6 @@
  "Phone is required": "Telefonnummer är obligatorisk",
  "Phone number": "Telefonnummer",
  "Please enter a valid phone number": "Var vänlig och ange ett giltigt telefonnummer",
-  "points": "poäng",
  "Points": "Poäng",
  "Points being calculated": "Poäng beräknas",
  "Points earned prior to May 1, 2021": "Intjänade poäng före den 1 maj 2021",
@@ -220,29 +207,25 @@
  "Something went wrong and we couldn't add your card. Please try again later.": "Något gick fel och vi kunde inte lägga till ditt kort. Försök igen senare.",
  "Something went wrong and we couldn't remove your card. Please try again later.": "Något gick fel och vi kunde inte ta bort ditt kort. Försök igen senare.",
  "Something went wrong!": "Något gick fel!",
-  "special character": "speciell karaktär",
-  "spendable points expiring by": "{points} poäng förfaller {date}",
  "Sports": "Sport",
  "Standard price": "Standardpris",
  "Street": "Gata",
  "Successfully updated profile!": "Profilen har uppdaterats framgångsrikt!",
  "Summary": "Sammanfattning",
+  "TUI Points": "TUI Points",
  "Tell us what information and updates you'd like to receive, and how, by clicking the link below.": "Berätta för oss vilken information och vilka uppdateringar du vill få och hur genom att klicka på länken nedan.",
  "Thank you": "Tack",
  "Theatre": "Teater",
  "There are no transactions to display": "Det finns inga transaktioner att visa",
  "Things nearby HOTEL_NAME": "Saker i närheten av {hotelName}",
-  "to": "till",
  "Total Points": "Poäng totalt",
  "Tourist": "Turist",
  "Transaction date": "Transaktionsdatum",
  "Transactions": "Transaktioner",
  "Transportations": "Transport",
  "Tripadvisor reviews": "{rating} ({count} recensioner på Tripadvisor)",
-  "TUI Points": "TUI Points",
  "Type of bed": "Sängtyp",
  "Type of room": "Rumstyp",
-  "uppercase letter": "stor bokstav",
  "Use bonus cheque": "Use bonus cheque",
  "User information": "Användarinformation",
  "View as list": "Visa som lista",
@@ -268,9 +251,9 @@
  "You canceled adding a new credit card.": "Du avbröt att lägga till ett nytt kreditkort.",
  "You have no previous stays.": "Du har inga tidigare vistelser.",
  "You have no upcoming stays.": "Du har inga planerade resor.",
+  "Your Challenges Conquer & Earn!": "Dina utmaningar Erövra och tjäna!",
  "Your card was successfully removed!": "Ditt kort har tagits bort!",
  "Your card was successfully saved!": "Ditt kort har sparats!",
-  "Your Challenges Conquer & Earn!": "Dina utmaningar Erövra och tjäna!",
  "Your current level": "Din nuvarande nivå",
  "Your details": "Dina uppgifter",
  "Your level": "Din nivå",
@@ -278,5 +261,23 @@
  "Zip code": "Postnummer",
  "Zoo": "Djurpark",
  "Zoom in": "Zooma in",
-  "Zoom out": "Zooma ut"
-}
+  "Zoom out": "Zooma ut",
+  "as of today": "från och med idag",
+  "booking.nights": "{totalNights, plural, one {# natt} other {# nätter}}",
+  "by": "innan",
+  "characters": "tecken",
+  "hotelPages.rooms.roomCard.person": "person",
+  "hotelPages.rooms.roomCard.persons": "personer",
+  "hotelPages.rooms.roomCard.seeRoomDetails": "Se information om rummet",
+  "km to city center": "km till stadens centrum",
+  "next level:": "Nästa nivå:",
+  "night": "natt",
+  "nights": "nätter",
+  "number": "nummer",
+  "or": "eller",
+  "points": "poäng",
+  "special character": "speciell karaktär",
+  "spendable points expiring by": "{points} poäng förfaller {date}",
+  "to": "till",
+  "uppercase letter": "stor bokstav"
+}
--- a/types/components/datepicker.ts
+++ b/types/components/datepicker.ts
@@ -1,3 +1,11 @@
+import type { DateRange } from "react-day-picker"
+
 export interface DatePickerFormProps {
  name?: string
 }
+
+export interface DatePickerProps {
+  close: () => void
+  handleOnSelect: (selected: DateRange) => void
+  initialSelected?: DateRange
+}