scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(SW-706): make eslint rule 'formatjs/no-literal-string-in-jsx' pass

Browse Source
This commit is contained in:
Michael Zetterberg
2025-02-07 06:51:36 +01:00
parent e22fc1f3c8
commit 440e1f92df
393 changed files with 4839 additions and 1554 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
apps/scandic-web/components/HotelReservation/SelectRate/HotelInfoCard/index.tsx
View File

@@ -44,7 +44,8 @@ export default async function HotelInfoCard({ hotel }: HotelInfoCardProps) {
<Caption color="uiTextMediumContrast">
{intl.formatMessage(
{
id: "{address}, {city} ∙ {distanceToCityCenterInKm} km to city center",
defaultMessage:
"{address}, {city} ∙ {distanceToCityCenterInKm} km to city center",
},
{
address: hotel.address.streetAddress,
@@ -64,7 +65,9 @@ export default async function HotelInfoCard({ hotel }: HotelInfoCardProps) {
<div className={styles.facilities}>
<div className={styles.facilityList}>
<Body textTransform="bold" className={styles.facilityTitle}>
{intl.formatMessage({ id: "At the hotel" })}
{intl.formatMessage({
defaultMessage: "At the hotel",
})}
</Body>
{sortedFacilities?.map((facility) => {
const Icon = (
@@ -79,7 +82,9 @@ export default async function HotelInfoCard({ hotel }: HotelInfoCardProps) {
})}
</div>
<ReadMore
label={intl.formatMessage({ id: "See all amenities" })}
label={intl.formatMessage({
defaultMessage: "See all amenities",
})}
hotelId={hotel.operaId}
hotel={hotel}
showCTA={false}

39
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/RateSummary/MobileSummary/PriceDetailsTable/index.tsx
View File

@@ -83,7 +83,9 @@ export default function PriceDetailsTable({
const diff = dt(toDate).diff(fromDate, "days")
const nights = intl.formatMessage(
{ id: "{totalNights, plural, one {# night} other {# nights}}" },
{
defaultMessage: "{totalNights, plural, one {# night} other {# nights}}",
},
{ totalNights: diff }
)
const vatPercentage = vat / 100
@@ -122,12 +124,18 @@ export default function PriceDetailsTable({
<TableSection>
{rooms.length > 1 && (
<Body textTransform="bold">
{intl.formatMessage({ id: "Room" })} {idx + 1}
{intl.formatMessage({
defaultMessage: "Room",
})}
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
{` ${idx + 1}`}
</Body>
)}
<TableSectionHeader title={room.roomType} subtitle={duration} />
<Row
label={intl.formatMessage({ id: "Average price per night" })}
label={intl.formatMessage({
defaultMessage: "Average price per night",
})}
value={formatPrice(
intl,
price.localPrice.pricePerNight,
@@ -147,7 +155,9 @@ export default function PriceDetailsTable({
))}
<Row
bold
label={intl.formatMessage({ id: "Room charge" })}
label={intl.formatMessage({
defaultMessage: "Room charge",
})}
value={formatPrice(
intl,
price.localPrice.pricePerStay,
@@ -159,19 +169,32 @@ export default function PriceDetailsTable({
)
})}
<TableSection>
<TableSectionHeader title={intl.formatMessage({ id: "Total" })} />
<TableSectionHeader
title={intl.formatMessage({
defaultMessage: "Total",
})}
/>
<Row
label={intl.formatMessage({ id: "Price excluding VAT" })}
label={intl.formatMessage({
defaultMessage: "Price excluding VAT",
})}
value={formatPrice(intl, priceExclVat, totalPrice.local.currency)}
/>
<Row
label={intl.formatMessage({ id: "VAT {vat}%" }, { vat })}
label={intl.formatMessage(
{
defaultMessage: "VAT {vat}%",
},
{ vat }
)}
value={formatPrice(intl, vatAmount, totalPrice.local.currency)}
/>
<tr className={styles.row}>
<td>
<Body textTransform="bold">
{intl.formatMessage({ id: "Price including VAT" })}
{intl.formatMessage({
defaultMessage: "Price including VAT",
})}
</Body>
</td>
<td className={styles.price}>

45
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/RateSummary/MobileSummary/Summary.tsx
View File

@@ -40,7 +40,9 @@ export default function Summary({
const diff = dt(booking.toDate).diff(booking.fromDate, "days")
const nights = intl.formatMessage(
{ id: "{totalNights, plural, one {# night} other {# nights}}" },
{
defaultMessage: "{totalNights, plural, one {# night} other {# nights}}",
},
{ totalNights: diff }
)
@@ -68,7 +70,9 @@ export default function Summary({
<section className={styles.summary}>
<header className={styles.header}>
<Subtitle className={styles.title} type="two">
{intl.formatMessage({ id: "Booking summary" })}
{intl.formatMessage({
defaultMessage: "Booking summary",
})}
</Subtitle>
<Body className={styles.date} color="baseTextMediumContrast">
{dt(booking.fromDate).locale(lang).format("ddd, D MMM")}
@@ -77,6 +81,7 @@ export default function Summary({
size={15}
color="Icon/Interactive/Secondary"
/>
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
{dt(booking.toDate).locale(lang).format("ddd, D MMM")} ({nights})
</Body>
<Button onPress={toggleSummaryOpen} variant="Icon">
@@ -122,7 +127,10 @@ export default function Summary({
isBookingCodeRate(room.roomRate) || showMemberPrice
const adultsMsg = intl.formatMessage(
{ id: "{totalAdults, plural, one {# adult} other {# adults}}" },
{
defaultMessage:
"{totalAdults, plural, one {# adult} other {# adults}}",
},
{ totalAdults: adults }
)
@@ -130,7 +138,8 @@ export default function Summary({
if (childrenInRoom?.length) {
const childrenMsg = intl.formatMessage(
{
id: "{totalChildren, plural, one {# child} other {# children}}",
defaultMessage:
"{totalChildren, plural, one {# child} other {# children}}",
},
{ totalChildren: childrenInRoom.length }
)
@@ -149,7 +158,9 @@ export default function Summary({
{rooms.length > 1 ? (
<Body textTransform="bold">
{intl.formatMessage(
{ id: "Room {roomIndex}" },
{
defaultMessage: "Room {roomIndex}",
},
{
roomIndex: roomNumber,
}
@@ -181,7 +192,9 @@ export default function Summary({
typography="Body/Supporting text (caption)/smBold"
wrapping={false}
>
{intl.formatMessage({ id: "Rate details" })}
{intl.formatMessage({
defaultMessage: "Rate details",
})}
<MaterialIcon
icon="chevron_right"
size={20}
@@ -216,12 +229,16 @@ export default function Summary({
<div>
<Body color="uiTextHighContrast">
{intl.formatMessage(
{ id: "Crib (child) × {count}" },
{
defaultMessage: "Crib (child) × {count}",
},
{ count: childBedCrib }
)}
</Body>
<Caption color="uiTextMediumContrast">
{intl.formatMessage({ id: "Based on availability" })}
{intl.formatMessage({
defaultMessage: "Based on availability",
})}
</Caption>
</div>
<Body color="uiTextHighContrast">
@@ -238,7 +255,9 @@ export default function Summary({
<div>
<Body color="uiTextHighContrast">
{intl.formatMessage(
{ id: "Extra bed (child) × {count}" },
{
defaultMessage: "Extra bed (child) × {count}",
},
{
count: childBedExtraBed,
}
@@ -279,7 +298,9 @@ export default function Summary({
<div>
<Body>
{intl.formatMessage(
{ id: "<b>Total price</b> (incl VAT)" },
{
defaultMessage: "<b>Total price</b> (incl VAT)",
},
{ b: (str) => <b>{str}</b> }
)}
</Body>
@@ -321,7 +342,9 @@ export default function Summary({
{totalPrice.requested && (
<Caption color="uiTextMediumContrast">
{intl.formatMessage(
{ id: "Approx. {value}" },
{
defaultMessage: "Approx. {value}",
},
{
value: formatPrice(
intl,

14
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/RateSummary/MobileSummary/index.tsx
View File

@@ -102,7 +102,11 @@ export default function MobileSummary({
}}
className={styles.priceDetailsButton}
>
<Caption>{intl.formatMessage({ id: "Total price" })}</Caption>
<Caption>
{intl.formatMessage({
defaultMessage: "Total price",
})}
</Caption>
<Subtitle
color={showDiscounted ? "red" : "uiTextHighContrast"}
className={styles.wrappedText}
@@ -116,7 +120,9 @@ export default function MobileSummary({
)}
</Subtitle>
<Caption color="baseTextHighContrast" type="underline">
{intl.formatMessage({ id: "See details" })}
{intl.formatMessage({
defaultMessage: "See details",
})}
</Caption>
</button>
<Button
@@ -127,7 +133,9 @@ export default function MobileSummary({
fullWidth
disabled={!isAllRoomsSelected}
>
{intl.formatMessage({ id: "Continue" })}
{intl.formatMessage({
defaultMessage: "Continue",
})}
</Button>
</div>
</div>

73
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/RateSummary/index.tsx
View File

@@ -61,18 +61,25 @@ export default function RateSummary({ isUserLoggedIn }: RateSummaryProps) {
const nights = dt(checkOutDate).diff(dt(checkInDate), "days")
const totalNights = intl.formatMessage(
{ id: "{totalNights, plural, one {# night} other {# nights}}" },
{
defaultMessage: "{totalNights, plural, one {# night} other {# nights}}",
},
{ totalNights: nights }
)
const totalAdults = intl.formatMessage(
{ id: "{totalAdults, plural, one {# adult} other {# adults}}" },
{
defaultMessage: "{totalAdults, plural, one {# adult} other {# adults}}",
},
{ totalAdults: bookingRooms.reduce((acc, room) => acc + room.adults, 0) }
)
const childrenInOneOrMoreRooms = bookingRooms.some(
(room) => room.childrenInRoom?.length
)
const childrenInroom = intl.formatMessage(
{ id: "{totalChildren, plural, one {# child} other {# children}}" },
{
defaultMessage:
"{totalChildren, plural, one {# child} other {# children}}",
},
{
totalChildren: bookingRooms.reduce(
(acc, room) => acc + (room.childrenInRoom?.length ?? 0),
@@ -82,7 +89,9 @@ export default function RateSummary({ isUserLoggedIn }: RateSummaryProps) {
)
const totalChildren = childrenInOneOrMoreRooms ? `, ${childrenInroom}` : ""
const totalRooms = intl.formatMessage(
{ id: "{totalRooms, plural, one {# room} other {# rooms}}" },
{
defaultMessage: "{totalRooms, plural, one {# room} other {# rooms}}",
},
{ totalRooms: bookingRooms.length }
)
@@ -96,11 +105,21 @@ export default function RateSummary({ isUserLoggedIn }: RateSummaryProps) {
)
const showMemberDiscountBanner = hasMemberRates && !isUserLoggedIn
const freeCancelation = intl.formatMessage({ id: "Free cancellation" })
const nonRefundable = intl.formatMessage({ id: "Non-refundable" })
const freeBooking = intl.formatMessage({ id: "Free rebooking" })
const payLater = intl.formatMessage({ id: "Pay later" })
const payNow = intl.formatMessage({ id: "Pay now" })
const freeCancelation = intl.formatMessage({
defaultMessage: "Free cancellation",
})
const nonRefundable = intl.formatMessage({
defaultMessage: "Non-refundable",
})
const freeBooking = intl.formatMessage({
defaultMessage: "Free rebooking",
})
const payLater = intl.formatMessage({
defaultMessage: "Pay later",
})
const payNow = intl.formatMessage({
defaultMessage: "Pay now",
})
function getRateDetails(rate: RateEnum) {
switch (rate) {
@@ -180,12 +199,16 @@ export default function RateSummary({ isUserLoggedIn }: RateSummaryProps) {
<div key={`unselected-${index}`}>
<Subtitle color="uiTextPlaceholder">
{intl.formatMessage(
{ id: "Room {roomIndex}" },
{
defaultMessage: "Room {roomIndex}",
},
{ roomIndex: index + 1 }
)}
</Subtitle>
<Body color="uiTextPlaceholder">
{intl.formatMessage({ id: "Select room" })}
{intl.formatMessage({
defaultMessage: "Select room",
})}
</Body>
</div>
)
@@ -197,7 +220,9 @@ export default function RateSummary({ isUserLoggedIn }: RateSummaryProps) {
<>
<Subtitle color="uiTextHighContrast">
{intl.formatMessage(
{ id: "Room {roomIndex}" },
{
defaultMessage: "Room {roomIndex}",
},
{ roomIndex: index + 1 }
)}
</Subtitle>
@@ -226,12 +251,16 @@ export default function RateSummary({ isUserLoggedIn }: RateSummaryProps) {
<div key={`unselected-${index}`}>
<Subtitle color="uiTextPlaceholder">
{intl.formatMessage(
{ id: "Room {roomIndex}" },
{
defaultMessage: "Room {roomIndex}",
},
{ roomIndex: rateSummary.length + index + 1 }
)}
</Subtitle>
<Body color="uiTextPlaceholder">
{intl.formatMessage({ id: "Select room" })}
{intl.formatMessage({
defaultMessage: "Select room",
})}
</Body>
</div>
))}
@@ -279,7 +308,9 @@ export default function RateSummary({ isUserLoggedIn }: RateSummaryProps) {
<div className={styles.summaryPriceTextDesktop}>
<Body>
{intl.formatMessage(
{ id: "<b>Total price</b> (incl VAT)" },
{
defaultMessage: "<b>Total price</b> (incl VAT)",
},
{ b: (str) => <b>{str}</b> }
)}
</Body>
@@ -315,7 +346,9 @@ export default function RateSummary({ isUserLoggedIn }: RateSummaryProps) {
{totalPriceToShow.requested ? (
<Body color="uiTextMediumContrast">
{intl.formatMessage(
{ id: "Approx. {value}" },
{
defaultMessage: "Approx. {value}",
},
{
value: formatPrice(
intl,
@@ -331,7 +364,9 @@ export default function RateSummary({ isUserLoggedIn }: RateSummaryProps) {
</div>
<div className={styles.summaryPriceTextMobile}>
<Caption color="uiTextHighContrast">
{intl.formatMessage({ id: "Total price" })}
{intl.formatMessage({
defaultMessage: "Total price",
})}
</Caption>
<Subtitle color={showDiscounted ? "red" : "uiTextHighContrast"}>
{formatPrice(
@@ -355,7 +390,9 @@ export default function RateSummary({ isUserLoggedIn }: RateSummaryProps) {
theme="base"
type="submit"
>
{intl.formatMessage({ id: "Continue" })}
{intl.formatMessage({
defaultMessage: "Continue",
})}
</Button>
</div>
</div>

32
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/SelectedRoomPanel/index.tsx
View File

@@ -47,11 +47,21 @@ export default function SelectedRoomPanel() {
)
)?.images
const freeCancelation = intl.formatMessage({ id: "Free cancellation" })
const nonRefundable = intl.formatMessage({ id: "Non-refundable" })
const freeBooking = intl.formatMessage({ id: "Free rebooking" })
const payLater = intl.formatMessage({ id: "Pay later" })
const payNow = intl.formatMessage({ id: "Pay now" })
const freeCancelation = intl.formatMessage({
defaultMessage: "Free cancellation",
})
const nonRefundable = intl.formatMessage({
defaultMessage: "Non-refundable",
})
const freeBooking = intl.formatMessage({
defaultMessage: "Free rebooking",
})
const payLater = intl.formatMessage({
defaultMessage: "Pay later",
})
const payNow = intl.formatMessage({
defaultMessage: "Pay now",
})
function getRateTitle(rate: RateEnum) {
switch (rate) {
@@ -75,7 +85,9 @@ export default function SelectedRoomPanel() {
)
const selectedPackagesPricePerNight = selectedPackagesPrice / nights
const night = intl.formatMessage({ id: "night" })
const night = intl.formatMessage({
defaultMessage: "night",
})
let selectedProduct
if (
isUserLoggedIn &&
@@ -112,7 +124,9 @@ export default function SelectedRoomPanel() {
<div className={styles.content}>
<Caption color="uiTextHighContrast">
{intl.formatMessage(
{ id: "Room {roomIndex}" },
{
defaultMessage: "Room {roomIndex}",
},
{ roomIndex: roomNr }
)}
</Caption>
@@ -139,7 +153,9 @@ export default function SelectedRoomPanel() {
<Button clean onClick={modifyRate}>
<Chip size="small" variant="uiTextHighContrast">
<MaterialIcon icon="edit_square" />
{intl.formatMessage({ id: "Modify" })}
{intl.formatMessage({
defaultMessage: "Modify",
})}
</Chip>
</Button>
</div>

14
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/index.tsx
View File

@@ -29,18 +29,22 @@ export default function MultiRoomWrapper({
} = useRoomContext()
const roomMsg = intl.formatMessage(
{ id: "Room {roomIndex}" },
{
defaultMessage: "Room {roomIndex}",
},
{ roomIndex: roomNr }
)
const adultsMsg = intl.formatMessage(
{ id: "{adults, plural, one {# adult} other {# adults}}" },
{
defaultMessage: "{adults, plural, one {# adult} other {# adults}}",
},
{ adults: bookingRoom.adults }
)
const childrenMsg = intl.formatMessage(
{
id: "{children, plural, one {# child} other {# children}}",
defaultMessage: "{children, plural, one {# child} other {# children}}",
},
{
children: bookingRoom.childrenInRoom?.length,
@@ -93,7 +97,9 @@ export default function MultiRoomWrapper({
theme="base"
variant="icon"
>
{intl.formatMessage({ id: "Close" })}
{intl.formatMessage({
defaultMessage: "Close",
})}
<MaterialIcon
icon="keyboard_arrow_up"
size={20}

21
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/NoAvailabilityAlert/index.tsx
View File

@@ -29,16 +29,20 @@ export default function NoAvailabilityAlert() {
if (noAvailableRooms) {
const text = intl.formatMessage({
id: "There are no rooms available that match your request.",
defaultMessage: "There are no rooms available that match your request.",
})
return (
<div className={styles.hotelAlert}>
<Alert
type={AlertTypeEnum.Info}
heading={intl.formatMessage({ id: "No availability" })}
heading={intl.formatMessage({
defaultMessage: "No availability",
})}
text={text}
link={{
title: intl.formatMessage({ id: "See alternative hotels" }),
title: intl.formatMessage({
defaultMessage: "See alternative hotels",
}),
url: `${alternativeHotels(lang)}`,
keepSearchParams: true,
}}
@@ -66,7 +70,8 @@ export default function NoAvailabilityAlert() {
if (bookingCode && noAvailableBookingCodeRooms) {
const bookingCodeText = intl.formatMessage(
{
id: "We found no available rooms using this booking code ({bookingCode}). See available rates below.",
defaultMessage:
"We found no available rooms using this booking code ({bookingCode}). See available rates below.",
},
{ bookingCode }
)
@@ -74,10 +79,14 @@ export default function NoAvailabilityAlert() {
<div className={styles.hotelAlert}>
<Alert
type={AlertTypeEnum.Info}
heading={intl.formatMessage({ id: "No availability" })}
heading={intl.formatMessage({
defaultMessage: "No availability",
})}
text={bookingCodeText}
link={{
title: intl.formatMessage({ id: "See alternative hotels" }),
title: intl.formatMessage({
defaultMessage: "See alternative hotels",
}),
url: `${alternativeHotels(lang)}`,
keepSearchParams: true,
}}

16
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsHeader/BookingCodeFilter/index.tsx
View File

@@ -31,15 +31,21 @@ export default function BookingCodeFilter() {
const bookingCodeFilterItems = [
{
label: intl.formatMessage({ id: "Discounted rooms" }),
label: intl.formatMessage({
defaultMessage: "Discounted rooms",
}),
value: BookingCodeFilterEnum.Discounted,
},
{
label: intl.formatMessage({ id: "Full-priced rooms" }),
label: intl.formatMessage({
defaultMessage: "Full-priced rooms",
}),
value: BookingCodeFilterEnum.Regular,
},
{
label: intl.formatMessage({ id: "All rooms" }),
label: intl.formatMessage({
defaultMessage: "All rooms",
}),
value: BookingCodeFilterEnum.All,
},
]
@@ -88,7 +94,9 @@ export default function BookingCodeFilter() {
return (
<div className={styles.bookingCodeFilter}>
<Select
aria-label={intl.formatMessage({ id: "Booking Code filter" })}
aria-label={intl.formatMessage({
defaultMessage: "Booking Code filter",
})}
className={styles.bookingCodeFilterSelect}
name="bookingCodeFilter"
onSelect={handleChangeFilter}

3
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsHeader/RoomPackageFilter/Form/Checkboxes/PetRoomMessage/index.tsx
View File

@@ -19,7 +19,8 @@ export default function PetRoomMessage() {
<p className={styles.additionalInformation}>
{intl.formatMessage(
{
id: "Pet-friendly rooms include a charge of approx. <b>{price}/stay</b>",
defaultMessage:
"Pet-friendly rooms include a charge of approx. <b>{price}/stay</b>",
},
{
b: (str) => (

8
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsHeader/RoomPackageFilter/Form/index.tsx
View File

@@ -82,12 +82,16 @@ export default function Form({ close }: { close: VoidFunction }) {
size="Small"
variant="Text"
>
{intl.formatMessage({ id: "Clear" })}
{intl.formatMessage({
defaultMessage: "Clear",
})}
</Button>
</Typography>
<Typography variant="Body/Supporting text (caption)/smBold">
<Button variant="Tertiary" size="Small" type="submit">
{intl.formatMessage({ id: "Apply" })}
{intl.formatMessage({
defaultMessage: "Apply",
})}
</Button>
</Typography>
</div>

4
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsHeader/RoomPackageFilter/index.tsx
View File

@@ -83,7 +83,9 @@ export default function RoomPackageFilter() {
))}
<DialogTrigger isOpen={isOpen} onOpenChange={setIsOpen}>
<ChipButton variant="Outlined">
{intl.formatMessage({ id: "Room preferences" })}
{intl.formatMessage({
defaultMessage: "Room preferences",
})}
<MaterialIcon
icon="keyboard_arrow_down"
size={20}

6
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsHeader/index.tsx
View File

@@ -22,7 +22,8 @@ export default function RoomsHeader() {
const notAllRoomsAvailableText = intl.formatMessage(
{
id: "{availableRooms}/{numberOfRooms, plural, one {# room type} other {# room types}} available",
defaultMessage:
"{availableRooms}/{numberOfRooms, plural, one {# room type} other {# room types}} available",
},
{
availableRooms,
@@ -32,7 +33,8 @@ export default function RoomsHeader() {
const allRoomsAvailableText = intl.formatMessage(
{
id: "{numberOfRooms, plural, one {# room type} other {# room types}} available",
defaultMessage:
"{numberOfRooms, plural, one {# room type} other {# room types}} available",
},
{
numberOfRooms: totalRooms,

10
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsList/RoomListItem/Details/RoomSize.tsx
View File

@@ -15,10 +15,13 @@ export default function RoomSize({ roomSize }: RoomSizeProps) {
if (roomSize.min === roomSize.max) {
return (
<>
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
<Caption color="uiTextMediumContrast">∙</Caption>
<Caption color="uiTextMediumContrast">
{intl.formatMessage(
{ id: "{roomSize} m²" },
{
defaultMessage: "{roomSize} m²",
},
{ roomSize: roomSize.min }
)}
</Caption>
@@ -27,10 +30,13 @@ export default function RoomSize({ roomSize }: RoomSizeProps) {
}
return (
<>
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
<Caption color="uiTextMediumContrast">∙</Caption>
<Caption color="uiTextMediumContrast">
{intl.formatMessage(
{ id: "{roomSizeMin} - {roomSizeMax} m²" },
{
defaultMessage: "{roomSizeMin} - {roomSizeMax} m²",
},
{
roomSizeMin: roomSize.min,
roomSizeMax: roomSize.max,

6
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsList/RoomListItem/Details/ToggleSidePeek.tsx
View File

@@ -30,7 +30,11 @@ export default function ToggleSidePeek({
intent={intent}
wrapping
>
{title ? title : intl.formatMessage({ id: "See room details" })}
{title
? title
: intl.formatMessage({
defaultMessage: "See room details",
})}
<MaterialIcon icon="chevron_right" size={14} />
</Button>
)

13
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsList/RoomListItem/Details/index.tsx
View File

@@ -31,11 +31,16 @@ export default function Details({ roomTypeCode }: { roomTypeCode: string }) {
<Caption color="uiTextMediumContrast">
{occupancy.max === occupancy.min
? intl.formatMessage(
{ id: "{guests, plural, one {# guest} other {# guests}}" },
{
defaultMessage:
"{guests, plural, one {# guest} other {# guests}}",
},
{ guests: occupancy.max }
)
: intl.formatMessage(
{ id: "{min}-{max} guests" },
{
defaultMessage: "{min}-{max} guests",
},
{
min: occupancy.min,
max: occupancy.max,
@@ -49,7 +54,9 @@ export default function Details({ roomTypeCode }: { roomTypeCode: string }) {
<ToggleSidePeek
hotelId={hotelId}
roomTypeCode={roomTypeCode}
title={intl.formatMessage({ id: "Room details" })}
title={intl.formatMessage({
defaultMessage: "Room details",
})}
intent="text"
/>
)}

14
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsList/RoomListItem/Rates/BreakfastMessage/index.tsx
View File

@@ -28,13 +28,17 @@ export default function BreakfastMessage({
}))
const breakfastMessages = {
included: intl.formatMessage({ id: "Breakfast is included." }),
notIncluded: intl.formatMessage({
id: "Breakfast selection in next step.",
included: intl.formatMessage({
defaultMessage: "Breakfast is included.",
}),
notIncluded: intl.formatMessage({
defaultMessage: "Breakfast selection in next step.",
}),
noSelection: intl.formatMessage({
defaultMessage: "Select a rate",
}),
noSelection: intl.formatMessage({ id: "Select a rate" }),
scandicgo: intl.formatMessage({
id: "Breakfast deal can be purchased at the hotel.",
defaultMessage: "Breakfast deal can be purchased at the hotel.",
}),
}

26
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsList/RoomListItem/Rates/Campaign.tsx
View File

@@ -42,7 +42,11 @@ export default function Campaign({
return null
}
const night = intl.formatMessage({ id: "night" }).toUpperCase()
const night = intl
.formatMessage({
defaultMessage: "night",
})
.toUpperCase()
if (selectedFilter === BookingCodeFilterEnum.Discounted) {
campaign = campaign.filter((product) => product.bookingCode)
@@ -89,15 +93,21 @@ export default function Campaign({
roomTypeCode
)
let bannerText = intl.formatMessage({ id: "Campaign" })
let bannerText = intl.formatMessage({
defaultMessage: "Campaign",
})
if (product.bookingCode) {
bannerText = product.bookingCode
}
if (product.rateDefinition.breakfastIncluded) {
bannerText = `${bannerText} ∙ ${intl.formatMessage({ id: "Breakfast included" })}`
bannerText = `${bannerText} ∙ ${intl.formatMessage({
defaultMessage: "Breakfast included",
})}`
} else {
bannerText = `${bannerText} ∙ ${intl.formatMessage({ id: "Breakfast excluded" })}`
bannerText = `${bannerText} ∙ ${intl.formatMessage({
defaultMessage: "Breakfast excluded",
})}`
}
const pricePerNight = calculatePricePerNightPriceProduct(
@@ -129,7 +139,9 @@ export default function Campaign({
const approximateRate =
approximateRatePrice && product.public.requestedPrice
? {
label: intl.formatMessage({ id: "Approx." }),
label: intl.formatMessage({
defaultMessage: "Approx.",
}),
price: approximateRatePrice,
unit: product.public.requestedPrice.currency,
}
@@ -146,7 +158,9 @@ export default function Campaign({
memberRate={
pricePerNightMember
? {
label: intl.formatMessage({ id: "Member price" }),
label: intl.formatMessage({
defaultMessage: "Member price",
}),
price: pricePerNightMember.totalPrice,
unit: `${product.member!.localPrice.currency}/${night}`,
}

24
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsList/RoomListItem/Rates/Code.tsx
View File

@@ -35,7 +35,11 @@ export default function Code({
const { roomNr, selectedFilter, selectedRate } = useRoomContext()
const bookingCode = useRatesStore((state) => state.booking.bookingCode)
const rateTitles = useRateTitles()
const night = intl.formatMessage({ id: "night" }).toUpperCase()
const night = intl
.formatMessage({
defaultMessage: "night",
})
.toUpperCase()
if (selectedFilter === BookingCodeFilterEnum.Regular) {
return null
@@ -44,9 +48,13 @@ export default function Code({
return code.map((product) => {
let bannerText = ""
if (product.rateDefinition.breakfastIncluded) {
bannerText = `${bookingCode} ∙ ${intl.formatMessage({ id: "Breakfast included" })}`
bannerText = `${bookingCode} ∙ ${intl.formatMessage({
defaultMessage: "Breakfast included",
})}`
} else {
bannerText = `${bookingCode} ∙ ${intl.formatMessage({ id: "Breakfast excluded" })}`
bannerText = `${bookingCode} ∙ ${intl.formatMessage({
defaultMessage: "Breakfast excluded",
})}`
}
const rateTermDetails = product.rateDefinitionMember
? [
@@ -113,7 +121,11 @@ export default function Code({
rate={{
label: product.rateDefinition?.title,
price: numberOfVouchers.toString(),
unit: intl.formatMessage({ id: "Voucher" }).toUpperCase(),
unit: intl
.formatMessage({
defaultMessage: "Voucher",
})
.toUpperCase(),
}}
rateTitle={rateTitles[product.rate].title}
rateTermDetails={rateTermDetails}
@@ -133,7 +145,9 @@ export default function Code({
const approximateRate = pricePerNight.totalRequestedPrice
? {
label: intl.formatMessage({ id: "Approx." }),
label: intl.formatMessage({
defaultMessage: "Approx.",
}),
price: pricePerNight.totalRequestedPrice,
unit: localPrice.currency,
}

12
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsList/RoomListItem/Rates/Redemptions.tsx
View File

@@ -31,12 +31,14 @@ export default function Redemptions({
return null
}
const rewardNight = intl.formatMessage({ id: "Reward night" })
const rewardNight = intl.formatMessage({
defaultMessage: "Reward night",
})
const breakfastIncluded = intl.formatMessage({
id: "Breakfast included",
defaultMessage: "Breakfast included",
})
const breakfastExcluded = intl.formatMessage({
id: "Breakfast excluded",
defaultMessage: "Breakfast excluded",
})
let selectedRateCode = ""
@@ -95,7 +97,9 @@ export default function Redemptions({
rateTermDetails={rateTermDetails}
selectedRate={selectedRateCode}
isNotEnoughPoints={notEnoughPoints}
notEnoughPointsText={intl.formatMessage({ id: "Not enough points" })}
notEnoughPointsText={intl.formatMessage({
defaultMessage: "Not enough points",
})}
/>
)
}

18
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsList/RoomListItem/Rates/Regular.tsx
View File

@@ -47,7 +47,11 @@ export default function Regular({
return null
}
const night = intl.formatMessage({ id: "night" }).toUpperCase()
const night = intl
.formatMessage({
defaultMessage: "night",
})
.toUpperCase()
return regular.map((product) => {
const { member, public: standard } = product
@@ -96,7 +100,9 @@ export default function Regular({
const rates: Rates = {}
if (memberPricePerNight) {
rates.memberRate = {
label: intl.formatMessage({ id: "Member price" }),
label: intl.formatMessage({
defaultMessage: "Member price",
}),
price: memberPricePerNight.totalPrice,
unit: `${member!.localPrice.currency}/${night}`,
}
@@ -109,7 +115,9 @@ export default function Regular({
let approximateStandardRatePrice = null
if (standardPricePerNight) {
rates.rate = {
label: intl.formatMessage({ id: "Standard price" }),
label: intl.formatMessage({
defaultMessage: "Standard price",
}),
price: standardPricePerNight.totalPrice,
unit: `${standard!.localPrice.currency}/${night}`,
}
@@ -133,7 +141,9 @@ export default function Regular({
const approximateRate =
approximatePrice && requestedCurrency
? {
label: intl.formatMessage({ id: "Approx." }),
label: intl.formatMessage({
defaultMessage: "Approx.",
}),
price: approximatePrice,
unit: requestedCurrency,
}

4
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsList/RoomListItem/RoomImage/index.tsx
View File

@@ -38,7 +38,9 @@ export default function RoomImage({
<span className={styles.chip}>
<Footnote color="burgundy" textTransform="uppercase">
{intl.formatMessage(
{ id: "{amount, number} left" },
{
defaultMessage: "{amount, number} left",
},
{ amount: roomsLeft }
)}
</Footnote>

2
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsList/RoomListItem/RoomNotAvailable/index.tsx
View File

@@ -19,7 +19,7 @@ export default function RoomNotAvailable() {
/>
<Caption color="uiTextHighContrast" type="bold">
{intl.formatMessage({
id: "This room is not available",
defaultMessage: "This room is not available",
})}
</Caption>
</div>