feat(SW-706): make eslint rule 'formatjs/no-literal-string-in-jsx' pass
This commit is contained in:
Michael Zetterberg
@@ -39,7 +39,9 @@ export default function RoomDetails({
|
||||
<div className={styles.listContainer}>
|
||||
<Typography variant="Title/Subtitle/md">
|
||||
<p className={styles.text}>
|
||||
{intl.formatMessage({ id: "This room is equipped with" })}
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "This room is equipped with",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
<ul className={styles.facilityList}>
|
||||
@@ -56,12 +58,16 @@ export default function RoomDetails({
|
||||
<div className={styles.listContainer}>
|
||||
<Typography variant="Title/Subtitle/md">
|
||||
<p className={styles.text}>
|
||||
{intl.formatMessage({ id: "Bed options" })}
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Bed options",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
<Typography variant="Body/Paragraph/mdRegular">
|
||||
<p className={styles.text}>
|
||||
{intl.formatMessage({ id: "Based on availability" })}
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Based on availability",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
<ul className={styles.bedOptions}>
|
||||
|
||||
@@ -77,7 +77,9 @@ export default function BookedRoomSidePeek({
|
||||
const galleryImages = mapApiImagesToGalleryImages(room.images)
|
||||
|
||||
const adultsMsg = intl.formatMessage(
|
||||
{ id: "{adults, plural, one {# adult} other {# adults}}" },
|
||||
{
|
||||
defaultMessage: "{adults, plural, one {# adult} other {# adults}}",
|
||||
},
|
||||
{
|
||||
adults: adults,
|
||||
}
|
||||
@@ -85,7 +87,7 @@ export default function BookedRoomSidePeek({
|
||||
|
||||
const childrenMsg = intl.formatMessage(
|
||||
{
|
||||
id: "{children, plural, one {# child} other {# children}}",
|
||||
defaultMessage: "{children, plural, one {# child} other {# children}}",
|
||||
},
|
||||
{
|
||||
children: childrenInRoom.length,
|
||||
@@ -114,7 +116,11 @@ export default function BookedRoomSidePeek({
|
||||
}
|
||||
>
|
||||
<Typography variant="Body/Supporting text (caption)/smBold">
|
||||
<span>{intl.formatMessage({ id: "Cancelled" })}</span>
|
||||
<span>
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Cancelled",
|
||||
})}
|
||||
</span>
|
||||
</Typography>
|
||||
</IconChip>
|
||||
) : (
|
||||
@@ -122,7 +128,9 @@ export default function BookedRoomSidePeek({
|
||||
<Typography variant="Tag/sm">
|
||||
<span>
|
||||
{intl.formatMessage(
|
||||
{ id: "Room {roomIndex}" },
|
||||
{
|
||||
defaultMessage: "Room {roomIndex}",
|
||||
},
|
||||
{ roomIndex: roomNumber }
|
||||
)}
|
||||
</span>
|
||||
@@ -132,9 +140,21 @@ export default function BookedRoomSidePeek({
|
||||
<div className={styles.reference}>
|
||||
<Typography variant="Body/Supporting text (caption)/smBold">
|
||||
{isCancelled ? (
|
||||
<span>{intl.formatMessage({ id: "Cancellation no" })}:</span>
|
||||
<span>
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Cancellation no",
|
||||
})}
|
||||
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
|
||||
{":"}
|
||||
</span>
|
||||
) : (
|
||||
<span>{intl.formatMessage({ id: "Reference" })}:</span>
|
||||
<span>
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Reference",
|
||||
})}
|
||||
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
|
||||
{":"}
|
||||
</span>
|
||||
)}
|
||||
</Typography>
|
||||
<Typography variant="Body/Supporting text (caption)/smRegular">
|
||||
@@ -161,7 +181,11 @@ export default function BookedRoomSidePeek({
|
||||
<span className={styles.rowTitle}>
|
||||
<MaterialIcon icon="person" color="Icon/Default" size={20} />
|
||||
<Typography variant="Body/Paragraph/mdBold">
|
||||
<p>{intl.formatMessage({ id: "Guests" })}</p>
|
||||
<p>
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Guests",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
</span>
|
||||
<div className={styles.rowContent}>
|
||||
@@ -178,7 +202,11 @@ export default function BookedRoomSidePeek({
|
||||
<span className={styles.rowTitle}>
|
||||
<MaterialIcon icon="contract" color="Icon/Default" size={20} />
|
||||
<Typography variant="Body/Paragraph/mdBold">
|
||||
<p>{intl.formatMessage({ id: "Terms" })}</p>
|
||||
<p>
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Terms",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
</span>
|
||||
<div className={styles.rowContent}>
|
||||
@@ -194,14 +222,20 @@ export default function BookedRoomSidePeek({
|
||||
<span className={styles.rowTitle}>
|
||||
<MaterialIcon icon="refresh" color="Icon/Default" size={20} />
|
||||
<Typography variant="Body/Paragraph/mdBold">
|
||||
<p>{intl.formatMessage({ id: "Modify By" })}</p>
|
||||
<p>
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Modify By",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
</span>
|
||||
<div className={styles.rowContent}>
|
||||
<Typography variant="Body/Paragraph/mdRegular">
|
||||
<p color="uiTextHighContrast">
|
||||
{intl.formatMessage(
|
||||
{ id: "Until {time}, {date}" },
|
||||
{
|
||||
defaultMessage: "Until {time}, {date}",
|
||||
},
|
||||
{ time: "18:00", date: fromDate.format("dddd D MMM") }
|
||||
)}
|
||||
</p>
|
||||
@@ -213,7 +247,11 @@ export default function BookedRoomSidePeek({
|
||||
<span className={styles.rowTitle}>
|
||||
<MaterialIcon icon="coffee" color="Icon/Default" size={20} />
|
||||
<Typography variant="Body/Paragraph/mdBold">
|
||||
<p>{intl.formatMessage({ id: "Breakfast" })}</p>
|
||||
<p>
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Breakfast",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
</span>
|
||||
<div className={styles.rowContent}>
|
||||
@@ -225,8 +263,12 @@ export default function BookedRoomSidePeek({
|
||||
code: pkg.code,
|
||||
}))
|
||||
)
|
||||
? intl.formatMessage({ id: "Included" })
|
||||
: intl.formatMessage({ id: "Not included" })}
|
||||
? intl.formatMessage({
|
||||
defaultMessage: "Included",
|
||||
})
|
||||
: intl.formatMessage({
|
||||
defaultMessage: "Not included",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
</div>
|
||||
@@ -244,7 +286,11 @@ export default function BookedRoomSidePeek({
|
||||
size={20}
|
||||
/>
|
||||
<Typography variant="Body/Paragraph/mdBold">
|
||||
<p>{intl.formatMessage({ id: "Room classification" })}</p>
|
||||
<p>
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Room classification",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
</span>
|
||||
<div className={styles.rowContent}>
|
||||
@@ -267,7 +313,11 @@ export default function BookedRoomSidePeek({
|
||||
<span className={styles.rowTitle}>
|
||||
<MaterialIcon icon="bed" color="Icon/Default" size={20} />
|
||||
<Typography variant="Body/Paragraph/mdBold">
|
||||
<p>{intl.formatMessage({ id: "Bed preference" })}</p>
|
||||
<p>
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Bed preference",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
</span>
|
||||
<div className={styles.rowContent}>
|
||||
@@ -282,7 +332,9 @@ export default function BookedRoomSidePeek({
|
||||
<div className={styles.price}>
|
||||
<Typography variant="Body/Lead text">
|
||||
<p color="uiTextHighContrast">
|
||||
{intl.formatMessage({ id: "Room total" })}
|
||||
{intl.formatMessage({
|
||||
defaultMessage: "Room total",
|
||||
})}
|
||||
</p>
|
||||
</Typography>
|
||||
|
||||
@@ -300,7 +352,9 @@ export default function BookedRoomSidePeek({
|
||||
icon={<DiscountIcon color="Icon/Feedback/Information" />}
|
||||
>
|
||||
{intl.formatMessage(
|
||||
{ id: "<strong>Booking code</strong>: {value}" },
|
||||
{
|
||||
defaultMessage: "<strong>Booking code</strong>: {value}",
|
||||
},
|
||||
{
|
||||
value: bookingCode,
|
||||
strong: (text) => (
|
||||
@@ -327,7 +381,9 @@ export default function BookedRoomSidePeek({
|
||||
</div>
|
||||
<Accordion>
|
||||
<AccordionItem
|
||||
title={intl.formatMessage({ id: "Room details" })}
|
||||
title={intl.formatMessage({
|
||||
defaultMessage: "Room details",
|
||||
})}
|
||||
variant="sidepeek"
|
||||
>
|
||||
<RoomDetails
|
||||
|
||||
Reference in New Issue
Block a user