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

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

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>

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}

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,
}}

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}

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) => (

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>

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}

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,

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,

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>
)

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"
/>
)}

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.",
}),
}

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}`,
}

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,
}

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",
})}
/>
)
}

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,
}

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>

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>