From a218b3685fc7b67c3fdebe3282f604e450113b15 Mon Sep 17 00:00:00 2001 From: Pontus Dreij Date: Tue, 8 Oct 2024 13:57:57 +0200 Subject: [PATCH 001/130] feat(SW-415): Border room card --- .../SelectRate/RoomSelection/RoomCard/roomCard.module.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/components/HotelReservation/SelectRate/RoomSelection/RoomCard/roomCard.module.css b/components/HotelReservation/SelectRate/RoomSelection/RoomCard/roomCard.module.css index 3102b1c3a..f03a13252 100644 --- a/components/HotelReservation/SelectRate/RoomSelection/RoomCard/roomCard.module.css +++ b/components/HotelReservation/SelectRate/RoomSelection/RoomCard/roomCard.module.css @@ -3,8 +3,8 @@ display: flex; flex-direction: column-reverse; background-color: #fff; - border-radius: var(--Corner-radius-Small); - border: 1px solid rgba(77, 0, 27, 0.1); + border-radius: var(--Corner-radius-Large); + border: 1px solid var(--Base-Border-Subtle); } .cardBody { From 94a1aa625aa4a217ffad8f98a3731b7f53aa8a83 Mon Sep 17 00:00:00 2001 From: Pontus Dreij Date: Tue, 8 Oct 2024 15:51:07 +0200 Subject: [PATCH 002/130] feat/SW-415: Added select-rate to hotelReservation --- .env.test | 1 + .../hotelreservation/select-rate/page.module.css | 3 ++- .../RoomSelection/RoomCard/roomCard.module.css | 3 ++- constants/routes/hotelReservation.js | 11 +++++++++++ middleware.ts | 1 + 5 files changed, 17 insertions(+), 2 deletions(-) diff --git a/.env.test b/.env.test index d2d1037ac..ce2b20278 100644 --- a/.env.test +++ b/.env.test @@ -42,3 +42,4 @@ GOOGLE_STATIC_MAP_SIGNATURE_SECRET="test" GOOGLE_STATIC_MAP_ID="test" GOOGLE_DYNAMIC_MAP_ID="test" HIDE_FOR_NEXT_RELEASE="true" +SALESFORCE_PREFERENCE_BASE_URL="test" diff --git a/app/[lang]/(live)/(public)/hotelreservation/select-rate/page.module.css b/app/[lang]/(live)/(public)/hotelreservation/select-rate/page.module.css index 3266c418d..125a12aa2 100644 --- a/app/[lang]/(live)/(public)/hotelreservation/select-rate/page.module.css +++ b/app/[lang]/(live)/(public)/hotelreservation/select-rate/page.module.css @@ -7,13 +7,14 @@ } .content { - max-width: 1134px; + max-width: 1434px; margin-top: var(--Spacing-x5); margin-left: auto; margin-right: auto; display: flex; justify-content: space-between; gap: var(--Spacing-x7); + padding: var(--Spacing-x2); } .main { diff --git a/components/HotelReservation/SelectRate/RoomSelection/RoomCard/roomCard.module.css b/components/HotelReservation/SelectRate/RoomSelection/RoomCard/roomCard.module.css index f03a13252..06b04692e 100644 --- a/components/HotelReservation/SelectRate/RoomSelection/RoomCard/roomCard.module.css +++ b/components/HotelReservation/SelectRate/RoomSelection/RoomCard/roomCard.module.css @@ -31,6 +31,7 @@ .card img { max-width: 100%; - aspect-ratio: 1.5; + aspect-ratio: 16/9; object-fit: cover; + border-radius: var(--Corner-radius-Medium) var(--Corner-radius-Medium) 0 0; } diff --git a/constants/routes/hotelReservation.js b/constants/routes/hotelReservation.js index 4f37fcb6c..23e8c0354 100644 --- a/constants/routes/hotelReservation.js +++ b/constants/routes/hotelReservation.js @@ -18,6 +18,16 @@ export const selectHotel = { de: `${hotelReservation.de}/select-hotel`, } +// TODO: Translate paths +export const selectRate = { + en: `${hotelReservation.en}/select-rate`, + sv: `${hotelReservation.sv}/select-rate`, + no: `${hotelReservation.no}/select-rate`, + fi: `${hotelReservation.fi}/select-rate`, + da: `${hotelReservation.da}/select-rate`, + de: `${hotelReservation.de}/select-rate`, +} + // TODO: Translate paths export const selectBed = { en: `${hotelReservation.en}/select-bed`, @@ -95,4 +105,5 @@ export const bookingFlow = [ ...Object.values(details), ...Object.values(payments), ...Object.values(selectHotelMap), + ...Object.values(selectRate), ] diff --git a/middleware.ts b/middleware.ts index 78b73b7ed..8aaff393e 100644 --- a/middleware.ts +++ b/middleware.ts @@ -17,6 +17,7 @@ import { findLang } from "@/utils/languages" export const middleware: NextMiddleware = async (request, event) => { const headers = getDefaultRequestHeaders(request) const lang = findLang(request.nextUrl.pathname) + if (!lang) { // Lang is required for all our middleware. // Without it we shortcircuit early. From ee6a40a55354c75bc877109b0848599cd9ad3b51 Mon Sep 17 00:00:00 2001 From: Simon Emanuelsson Date: Tue, 8 Oct 2024 11:06:09 +0200 Subject: [PATCH 003/130] feat: rename form/card to form/choicecard --- .../HotelReservation/EnterDetails/BedType/index.tsx | 6 ++---- .../EnterDetails/Breakfast/index.tsx | 6 ++---- .../HotelReservation/EnterDetails/Details/index.tsx | 5 +++-- .../Form/{Card => ChoiceCard}/Checkbox.tsx | 4 ++-- .../Form/{Card => ChoiceCard}/Radio.tsx | 4 ++-- .../Form/{Card => ChoiceCard/_Card}/card.module.css | 0 .../Form/{Card => ChoiceCard/_Card}/card.ts | 13 +++++++------ .../Form/{Card => ChoiceCard/_Card}/index.tsx | 6 +++--- 8 files changed, 21 insertions(+), 23 deletions(-) rename components/TempDesignSystem/Form/{Card => ChoiceCard}/Checkbox.tsx (58%) rename components/TempDesignSystem/Form/{Card => ChoiceCard}/Radio.tsx (57%) rename components/TempDesignSystem/Form/{Card => ChoiceCard/_Card}/card.module.css (100%) rename components/TempDesignSystem/Form/{Card => ChoiceCard/_Card}/card.ts (73%) rename components/TempDesignSystem/Form/{Card => ChoiceCard/_Card}/index.tsx (94%) diff --git a/components/HotelReservation/EnterDetails/BedType/index.tsx b/components/HotelReservation/EnterDetails/BedType/index.tsx index 61633cdcf..955ce740b 100644 --- a/components/HotelReservation/EnterDetails/BedType/index.tsx +++ b/components/HotelReservation/EnterDetails/BedType/index.tsx @@ -5,7 +5,7 @@ import { FormProvider, useForm } from "react-hook-form" import { useIntl } from "react-intl" import { KingBedIcon } from "@/components/Icons" -import RadioCard from "@/components/TempDesignSystem/Form/Card/Radio" +import RadioCard from "@/components/TempDesignSystem/Form/ChoiceCard/Radio" import { bedTypeSchema } from "./schema" @@ -24,9 +24,7 @@ export default function BedType() { reValidateMode: "onChange", }) - // @ts-expect-error - Types mismatch docs as this is - // a pattern that is allowed https://formatjs.io/docs/react-intl/api#usage - const text = intl.formatMessage( + const text = intl.formatMessage( { id: "Included (based on availability)" }, { b: (str) => {str} } ) diff --git a/components/HotelReservation/EnterDetails/Breakfast/index.tsx b/components/HotelReservation/EnterDetails/Breakfast/index.tsx index b8f00ec83..8551e12dc 100644 --- a/components/HotelReservation/EnterDetails/Breakfast/index.tsx +++ b/components/HotelReservation/EnterDetails/Breakfast/index.tsx @@ -5,7 +5,7 @@ import { FormProvider, useForm } from "react-hook-form" import { useIntl } from "react-intl" import { BreakfastIcon, NoBreakfastIcon } from "@/components/Icons" -import RadioCard from "@/components/TempDesignSystem/Form/Card/Radio" +import RadioCard from "@/components/TempDesignSystem/Form/ChoiceCard/Radio" import { breakfastSchema } from "./schema" @@ -31,9 +31,7 @@ export default function Breakfast() { Icon={BreakfastIcon} id={breakfastEnum.BREAKFAST} name="breakfast" - // @ts-expect-error - Types mismatch docs as this is - // a pattern that is allowed https://formatjs.io/docs/react-intl/api#usage - subtitle={intl.formatMessage( + subtitle={intl.formatMessage( { id: "{amount} {currency}/night per adult" }, { amount: "150", diff --git a/components/HotelReservation/EnterDetails/Details/index.tsx b/components/HotelReservation/EnterDetails/Details/index.tsx index 2dd1b1cdb..15792e384 100644 --- a/components/HotelReservation/EnterDetails/Details/index.tsx +++ b/components/HotelReservation/EnterDetails/Details/index.tsx @@ -4,7 +4,7 @@ import { FormProvider, useForm } from "react-hook-form" import { useIntl } from "react-intl" import Button from "@/components/TempDesignSystem/Button" -import CheckboxCard from "@/components/TempDesignSystem/Form/Card/Checkbox" +import CheckboxCard from "@/components/TempDesignSystem/Form/ChoiceCard/Checkbox" import CountrySelect from "@/components/TempDesignSystem/Form/Country" import Input from "@/components/TempDesignSystem/Form/Input" import Phone from "@/components/TempDesignSystem/Form/Phone" @@ -88,8 +88,9 @@ export default function Details({ user }: DetailsProps) {