feat(SW-706): make eslint rule 'formatjs/no-literal-string-in-jsx' pass
This commit is contained in:
Michael Zetterberg
@@ -120,7 +120,9 @@ export function ReferenceCard({
|
||||
const allRoomsCancelled = allRooms.every((room) => room.isCancelled)
|
||||
|
||||
const adultsMsg = intl.formatMessage(
|
||||
{ id: "{adults, plural, one {# adult} other {# adults}}" },
|
||||
{
|
||||
defaultMessage: "{adults, plural, one {# adult} other {# adults}}",
|
||||
},
|
||||
{
|
||||
adults: adults,
|
||||
}
|
||||
@@ -128,7 +130,7 @@ export function ReferenceCard({
|
||||
|
||||
const childrenMsg = intl.formatMessage(
|
||||
{
|
||||
id: "{children, plural, one {# child} other {# children}}",
|
||||
defaultMessage: "{children, plural, one {# child} other {# children}}",
|
||||
},
|
||||
{
|
||||
children: children,
|
||||
@@ -136,16 +138,22 @@ export function ReferenceCard({
|
||||
)
|
||||
|
||||
const cancelledRoomsMsg = intl.formatMessage(
|
||||
{ id: "{rooms, plural, one {# room} other {# rooms}}" },
|
||||
{
|
||||
defaultMessage: "{rooms, plural, one {# room} other {# rooms}}",
|
||||
},
|
||||
{
|
||||
rooms: cancelledRooms,
|
||||
}
|
||||
)
|
||||
|
||||
const roomCancelledRoomsMsg = intl.formatMessage({ id: "Room cancelled" })
|
||||
const roomCancelledRoomsMsg = intl.formatMessage({
|
||||
defaultMessage: "Room cancelled",
|
||||
})
|
||||
|
||||
const roomsMsg = intl.formatMessage(
|
||||
{ id: "{rooms, plural, one {# room} other {# rooms}}" },
|
||||
{
|
||||
defaultMessage: "{rooms, plural, one {# room} other {# rooms}}",
|
||||
},
|
||||
{
|
||||
rooms: allRooms.filter((room) => !room.isCancelled).length,
|
||||
}
|
||||
@@ -163,15 +171,21 @@ export function ReferenceCard({
|
||||
<>
|
||||
<div className={styles.referenceRow}>
|
||||
<Subtitle color="uiTextHighContrast" className={styles.titleMobile}>
|
||||
{intl.formatMessage({ id: "Reference" })}
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Reference",
|
||||
})}
|
||||
</Subtitle>
|
||||
<Subtitle
|
||||
color="uiTextHighContrast"
|
||||
className={styles.titleDesktop}
|
||||
>
|
||||
{isCancelled && !isMultiRoom
|
||||
? intl.formatMessage({ id: "Cancellation number" })
|
||||
: intl.formatMessage({ id: "Reference number" })}
|
||||
? intl.formatMessage({
|
||||
defaultMessage: "Cancellation number",
|
||||
})
|
||||
: intl.formatMessage({
|
||||
defaultMessage: "Reference number",
|
||||
})}
|
||||
</Subtitle>
|
||||
<Subtitle color="uiTextHighContrast">
|
||||
{isCancelled && !isMultiRoom
|
||||
@@ -187,7 +201,11 @@ export function ReferenceCard({
|
||||
{!allRoomsCancelled && (
|
||||
<div className={styles.referenceRow}>
|
||||
<Typography variant="Title/Overline/sm">
|
||||
<p>{intl.formatMessage({ id: "Guests" })}</p>
|
||||
<p>
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Guests",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
<Typography variant="Body/Paragraph/mdBold">
|
||||
<p>
|
||||
@@ -205,12 +223,19 @@ export function ReferenceCard({
|
||||
{allRooms.some((room) => room.isCancelled) && (
|
||||
<div className={styles.referenceRow}>
|
||||
<Typography variant="Title/Overline/sm">
|
||||
<p>{intl.formatMessage({ id: "Cancellation" })}</p>
|
||||
<p>
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Cancellation",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
<Typography variant="Body/Paragraph/mdBold">
|
||||
<p className={styles.cancelledRooms}>
|
||||
{isMultiRoom
|
||||
? `${cancelledRoomsMsg} ${intl.formatMessage({ id: "cancelled" })}`
|
||||
? // eslint-disable-next-line formatjs/no-literal-string-in-jsx
|
||||
`${cancelledRoomsMsg} ${intl.formatMessage({
|
||||
defaultMessage: "cancelled",
|
||||
})}`
|
||||
: roomCancelledRoomsMsg}
|
||||
</p>
|
||||
</Typography>
|
||||
@@ -220,21 +245,39 @@ export function ReferenceCard({
|
||||
<>
|
||||
<div className={styles.referenceRow}>
|
||||
<Typography variant="Title/Overline/sm">
|
||||
<p>{intl.formatMessage({ id: "Check-in" })}</p>
|
||||
<p>
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Check-in",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
<Typography variant="Body/Paragraph/mdBold">
|
||||
<p>
|
||||
{`${dt(checkInDate).locale(lang).format("dddd, D MMMM")} ${intl.formatMessage({ id: "from" })} ${hotel.hotelFacts.checkin.checkInTime}`}
|
||||
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
|
||||
{`${dt(checkInDate).locale(lang).format("dddd, D MMMM")} ${intl.formatMessage(
|
||||
{
|
||||
defaultMessage: "from",
|
||||
}
|
||||
)} ${hotel.hotelFacts.checkin.checkInTime}`}
|
||||
</p>
|
||||
</Typography>
|
||||
</div>
|
||||
<div className={styles.referenceRow}>
|
||||
<Typography variant="Title/Overline/sm">
|
||||
<p>{intl.formatMessage({ id: "Check-out" })}</p>
|
||||
<p>
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Check-out",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
<Typography variant="Body/Paragraph/mdBold">
|
||||
<p>
|
||||
{`${dt(checkOutDate).locale(lang).format("dddd, D MMMM")} ${intl.formatMessage({ id: "until" })} ${hotel.hotelFacts.checkin.checkOutTime}`}
|
||||
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
|
||||
{`${dt(checkOutDate).locale(lang).format("dddd, D MMMM")} ${intl.formatMessage(
|
||||
{
|
||||
defaultMessage: "until",
|
||||
}
|
||||
)} ${hotel.hotelFacts.checkin.checkOutTime}`}
|
||||
</p>
|
||||
</Typography>
|
||||
</div>
|
||||
@@ -252,10 +295,15 @@ export function ReferenceCard({
|
||||
<Typography variant="Body/Supporting text (caption)/smRegular">
|
||||
<p className={styles.guaranteedText}>
|
||||
<strong>
|
||||
{intl.formatMessage({ id: "Booking guaranteed." })}
|
||||
</strong>{" "}
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Booking guaranteed.",
|
||||
})}
|
||||
</strong>
|
||||
{/* eslint-disable formatjs/no-literal-string-in-jsx */}{" "}
|
||||
{/* eslint-enable formatjs/no-literal-string-in-jsx */}
|
||||
{intl.formatMessage({
|
||||
id: "Your stay remains available for check-in after 18:00.",
|
||||
defaultMessage:
|
||||
"Your stay remains available for check-in after 18:00.",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
@@ -266,14 +314,22 @@ export function ReferenceCard({
|
||||
|
||||
<div className={styles.referenceRow}>
|
||||
<Typography variant="Title/Overline/sm">
|
||||
<p>{intl.formatMessage({ id: "Total" })}</p>
|
||||
<p>
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Total",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
<TotalPrice variant="Title/Subtitle/md" type={priceType} />
|
||||
</div>
|
||||
{bookingCode && (
|
||||
<div className={styles.referenceRow}>
|
||||
<Typography variant="Title/Overline/sm">
|
||||
<p>{intl.formatMessage({ id: "Booking code" })}</p>
|
||||
<p>
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Booking code",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
<Typography variant="Body/Supporting text (caption)/smBold">
|
||||
<IconChip
|
||||
@@ -281,11 +337,14 @@ export function ReferenceCard({
|
||||
icon={<DiscountIcon color="Icon/Feedback/Information" />}
|
||||
>
|
||||
{intl.formatMessage(
|
||||
{ id: "<strong>Booking code</strong>: {value}" },
|
||||
{
|
||||
defaultMessage: "<strong>Booking code</strong>: {value}",
|
||||
},
|
||||
{
|
||||
value: bookingCode,
|
||||
strong: (text) => (
|
||||
<Typography variant="Body/Supporting text (caption)/smBold">
|
||||
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
|
||||
<strong>{text}</strong>
|
||||
</Typography>
|
||||
),
|
||||
@@ -304,14 +363,18 @@ export function ReferenceCard({
|
||||
/>
|
||||
<Button fullWidth intent="secondary" asChild size="small">
|
||||
<Link href={directionsUrl} target="_blank">
|
||||
{intl.formatMessage({ id: "Get directions" })}
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Get directions",
|
||||
})}
|
||||
</Link>
|
||||
</Button>
|
||||
</div>
|
||||
{isMultiRoom && (
|
||||
<Typography variant="Body/Supporting text (caption)/smBold">
|
||||
<p className={styles.note}>
|
||||
{intl.formatMessage({ id: "Multi-room stay" })}
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Multi-room stay",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
)}
|
||||
@@ -323,6 +386,7 @@ export function ReferenceCard({
|
||||
{rateDefinition.generalTerms.map((term) => (
|
||||
<span key={term}>
|
||||
{term}
|
||||
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
|
||||
{term.endsWith(".") ? " " : ". "}
|
||||
</span>
|
||||
))}
|
||||
|
||||
Reference in New Issue
Block a user