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

4
apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/AddToCalendarButton.tsx
View File

@@ -31,7 +31,9 @@ export default function AddToCalendarButton({
onPress={handleAddToCalendar}
disabled={disabled}
>
{intl.formatMessage({ id: "Add to calendar" })}
{intl.formatMessage({
defaultMessage: "Add to calendar",
})}
<MaterialIcon icon="calendar_add_on" color="CurrentColor" />
</Button>
)

4
apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/CancelStay/CancelStayPriceContainer/index.tsx
View File

@@ -26,7 +26,9 @@ export default function CancelStayPriceContainer({
return (
<PriceContainer
text={intl.formatMessage({ id: "Cancellation cost" })}
text={intl.formatMessage({
defaultMessage: "Cancellation cost",
})}
price={0}
currencyCode={roomDetails.currencyCode}
nightsText={stayDetails.nightsText}

15
apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/CancelStay/Confirmation/index.tsx
View File

@@ -37,7 +37,8 @@ export function CancelStayConfirmation({
<Body color="uiTextHighContrast">
{intl.formatMessage(
{
id: "Are you sure you want to cancel your stay at {hotel} from {checkInDate} to {checkOutDate}? This can't be reversed.",
defaultMessage:
"Are you sure you want to cancel your stay at {hotel} from {checkInDate} to {checkOutDate}? This can't be reversed.",
},
{
hotel: hotel.name,
@@ -47,13 +48,17 @@ export function CancelStayConfirmation({
)}
</Body>
<Caption color="uiTextHighContrast">
{intl.formatMessage({ id: "No charges were made." })}
{intl.formatMessage({
defaultMessage: "No charges were made.",
})}
</Caption>
</div>
{multiRoom && (
<>
<Body color="uiTextHighContrast" textTransform="bold">
{intl.formatMessage({ id: "Select rooms" })}
{intl.formatMessage({
defaultMessage: "Select rooms",
})}
</Body>
<div className={styles.rooms}>
@@ -80,7 +85,9 @@ export function CancelStayConfirmation({
<div className={styles.roomInfo}>
<Caption color="uiTextHighContrast">
{intl.formatMessage(
{ id: "Room {roomIndex}" },
{
defaultMessage: "Room {roomIndex}",
},
{
roomIndex: index + 1,
}

3
apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/CancelStay/FinalConfirmation/index.tsx
View File

@@ -20,7 +20,8 @@ export function FinalConfirmation({ stayDetails }: FinalConfirmationProps) {
<div className={styles.modalText}>
<Body color="uiTextHighContrast">
{intl.formatMessage({
id: "Are you sure you want to continue with the cancellation?",
defaultMessage:
"Are you sure you want to continue with the cancellation?",
})}
</Body>
</div>

12
apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/CancelStay/hooks/useCancelStay.ts
View File

@@ -51,7 +51,7 @@ export default function useCancelStay({
if (!bookedRoom.confirmationNumber) {
toast.error(
intl.formatMessage({
id: "Something went wrong. Please try again later.",
defaultMessage: "Something went wrong. Please try again later.",
})
)
return
@@ -136,7 +136,8 @@ export default function useCancelStay({
toast.success(
intl.formatMessage(
{
id: "Your stay was cancelled. Cancellation cost: 0 {currency}. We're sorry to see that the plans didn't work out",
defaultMessage:
"Your stay was cancelled. Cancellation cost: 0 {currency}. We're sorry to see that the plans didn't work out",
},
{ currency: bookedRoom.currencyCode }
)
@@ -145,14 +146,15 @@ export default function useCancelStay({
// Some rooms cancelled, some failed
toast.warning(
intl.formatMessage({
id: "Some rooms were cancelled successfully, but we encountered issues with others. Please contact customer service for assistance.",
defaultMessage:
"Some rooms were cancelled successfully, but we encountered issues with others. Please contact customer service for assistance.",
})
)
} else {
// No rooms cancelled successfully
toast.error(
intl.formatMessage({
id: "Something went wrong. Please try again later.",
defaultMessage: "Something went wrong. Please try again later.",
})
)
}
@@ -162,7 +164,7 @@ export default function useCancelStay({
console.error("Error in handleCancelStay:", error)
toast.error(
intl.formatMessage({
id: "Something went wrong. Please try again later.",
defaultMessage: "Something went wrong. Please try again later.",
})
)
} finally {

29
apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/CancelStay/index.tsx
View File

@@ -59,15 +59,27 @@ export default function CancelStay({ hotel }: CancelStayProps) {
function getModalCopy() {
if (isFirstStep) {
return {
title: intl.formatMessage({ id: "Cancel stay" }),
primaryLabel: intl.formatMessage({ id: "Cancel stay" }),
secondaryLabel: intl.formatMessage({ id: "Back" }),
title: intl.formatMessage({
defaultMessage: "Cancel stay",
}),
primaryLabel: intl.formatMessage({
defaultMessage: "Cancel stay",
}),
secondaryLabel: intl.formatMessage({
defaultMessage: "Back",
}),
}
} else {
return {
title: intl.formatMessage({ id: "Confirm cancellation" }),
primaryLabel: intl.formatMessage({ id: "Confirm cancellation" }),
secondaryLabel: intl.formatMessage({ id: "Don't cancel" }),
title: intl.formatMessage({
defaultMessage: "Confirm cancellation",
}),
primaryLabel: intl.formatMessage({
defaultMessage: "Confirm cancellation",
}),
secondaryLabel: intl.formatMessage({
defaultMessage: "Don't cancel",
}),
}
}
}
@@ -84,10 +96,11 @@ export default function CancelStay({ hotel }: CancelStayProps) {
<Alert
type={AlertTypeEnum.Info}
heading={intl.formatMessage({
id: "Contact the person who booked the stay",
defaultMessage: "Contact the person who booked the stay",
})}
text={intl.formatMessage({
id: "As this is a multiroom stay, the cancellation has to be done by the person who made the booking. Please call 08-517 517 00 to talk to our customer service if you would need further assistance.",
defaultMessage:
"As this is a multiroom stay, the cancellation has to be done by the person who made the booking. Please call 08-517 517 00 to talk to our customer service if you would need further assistance.",
})}
/>
)

22
apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/CancelStay/utils.ts
View File

@@ -62,15 +62,22 @@ export function formatStayDetails({
.diff(dt(checkInDate).startOf("day"), "days")
const nightsText = intl.formatMessage(
{ id: "{totalNights, plural, one {# night} other {# nights}}" },
{
defaultMessage: "{totalNights, plural, one {# night} other {# nights}}",
},
{ totalNights: diff }
)
const adultsText = intl.formatMessage(
{ id: "{totalAdults, plural, one {# adult} other {# adults}}" },
{
defaultMessage: "{totalAdults, plural, one {# adult} other {# adults}}",
},
{ totalAdults: totalAdults }
)
const childrenText = intl.formatMessage(
{ id: "{totalChildren, plural, one {# child} other {# children}}" },
{
defaultMessage:
"{totalChildren, plural, one {# child} other {# children}}",
},
{ totalChildren: totalChildren }
)
@@ -138,11 +145,16 @@ export const useCheckedRoomsCounts = (
const { totalAdults, totalChildren } = calculateTotals(matchedRooms)
const adultsText = intl.formatMessage(
{ id: "{totalAdults, plural, one {# adult} other {# adults}}" },
{
defaultMessage: "{totalAdults, plural, one {# adult} other {# adults}}",
},
{ totalAdults: totalAdults }
)
const childrenText = intl.formatMessage(
{ id: "{totalChildren, plural, one {# child} other {# children}}" },
{
defaultMessage:
"{totalChildren, plural, one {# child} other {# children}}",
},
{ totalChildren: totalChildren }
)

32
apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/ModifyStay/Confirmation/index.tsx
View File

@@ -55,7 +55,9 @@ export default function Confirmation({
.diff(dt(newCheckIn).startOf("day"), "days")
const nightsText = intl.formatMessage(
{ id: "{totalNights, plural, one {# night} other {# nights}}" },
{
defaultMessage: "{totalNights, plural, one {# night} other {# nights}}",
},
{ totalNights: diff }
)
@@ -69,7 +71,9 @@ export default function Confirmation({
type="bold"
textTransform="uppercase"
>
{intl.formatMessage({ id: "Old dates" })}
{intl.formatMessage({
defaultMessage: "Old dates",
})}
</Caption>
<Body color="uiTextMediumContrast">
{oldPrice} {currencyCode}
@@ -82,7 +86,9 @@ export default function Confirmation({
type="bold"
textTransform="uppercase"
>
{intl.formatMessage({ id: "Check-in" })}
{intl.formatMessage({
defaultMessage: "Check-in",
})}
</Caption>
<Body color="uiTextMediumContrast">{originalCheckIn}</Body>
</div>
@@ -92,7 +98,9 @@ export default function Confirmation({
type="bold"
textTransform="uppercase"
>
{intl.formatMessage({ id: "Check-out" })}
{intl.formatMessage({
defaultMessage: "Check-out",
})}
</Caption>
<Body color="uiTextMediumContrast">{originalCheckOut}</Body>
</div>
@@ -104,7 +112,9 @@ export default function Confirmation({
<div className={styles.dateGroup}>
<div className={styles.dateHeader}>
<Caption color="red" type="bold" textTransform="uppercase">
{intl.formatMessage({ id: "New dates" })}
{intl.formatMessage({
defaultMessage: "New dates",
})}
</Caption>
<Body color="red">
{newPrice} {currencyCode}
@@ -117,7 +127,9 @@ export default function Confirmation({
type="bold"
textTransform="uppercase"
>
{intl.formatMessage({ id: "Check-in" })}
{intl.formatMessage({
defaultMessage: "Check-in",
})}
</Caption>
<Body color="uiTextMediumContrast">{newCheckIn}</Body>
</div>
@@ -127,7 +139,9 @@ export default function Confirmation({
type="bold"
textTransform="uppercase"
>
{intl.formatMessage({ id: "Check-out" })}
{intl.formatMessage({
defaultMessage: "Check-out",
})}
</Caption>
<Body color="uiTextMediumContrast">{newCheckOut}</Body>
</div>
@@ -136,7 +150,9 @@ export default function Confirmation({
</div>
<PriceContainer
text={intl.formatMessage({ id: "To be paid" })}
text={intl.formatMessage({
defaultMessage: "To be paid",
})}
price={newPrice}
currencyCode={currencyCode}
nightsText={nightsText}

20
apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/ModifyStay/NewDates/index.tsx
View File

@@ -131,25 +131,31 @@ export default function NewDates({
{noAvailability && (
<Alert
type={AlertTypeEnum.Info}
heading={intl.formatMessage({ id: "No availability" })}
heading={intl.formatMessage({
defaultMessage: "No availability",
})}
text={intl.formatMessage({
id: "No single rooms are available on these dates",
defaultMessage: "No single rooms are available on these dates",
})}
/>
)}
{error && (
<Alert
type={AlertTypeEnum.Alarm}
heading={intl.formatMessage({ id: "Error" })}
heading={intl.formatMessage({
defaultMessage: "Error",
})}
text={intl.formatMessage({
id: "Something went wrong!",
defaultMessage: "Something went wrong!",
})}
/>
)}
<div className={styles.container}>
<div className={styles.checkInDate}>
<Caption color="uiTextHighContrast" type="bold">
{intl.formatMessage({ id: "Check-in" })}
{intl.formatMessage({
defaultMessage: "Check-in",
})}
</Caption>
<CalendarButton
@@ -161,7 +167,9 @@ export default function NewDates({
</div>
<div className={styles.checkOutDate}>
<Caption color="uiTextHighContrast" type="bold">
{intl.formatMessage({ id: "Check-out" })}
{intl.formatMessage({
defaultMessage: "Check-out",
})}
</Caption>
<CalendarButton

26
apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/ModifyStay/hooks/useModifyStay.ts
View File

@@ -40,7 +40,11 @@ export default function useModifyStay({
onMutate: () => setIsLoading(true),
onSuccess: (updatedBooking) => {
if (!updatedBooking) {
toast.error(intl.formatMessage({ id: "Failed to update your stay" }))
toast.error(
intl.formatMessage({
defaultMessage: "Failed to update your stay",
})
)
return
}
// Update room details with server response data
@@ -50,11 +54,19 @@ export default function useModifyStay({
checkOutDate: updatedBooking.checkOutDate,
})
toast.success(intl.formatMessage({ id: "Your stay was updated" }))
toast.success(
intl.formatMessage({
defaultMessage: "Your stay was updated",
})
)
handleCloseModal()
},
onError: () => {
toast.error(intl.formatMessage({ id: "Failed to update your stay" }))
toast.error(
intl.formatMessage({
defaultMessage: "Failed to update your stay",
})
)
},
onSettled: () => {
setIsLoading(false)
@@ -65,7 +77,11 @@ export default function useModifyStay({
const formValues = getFormValues()
if (!formValues.checkInDate || !formValues.checkOutDate) {
toast.error(intl.formatMessage({ id: "Please select dates" }))
toast.error(
intl.formatMessage({
defaultMessage: "Please select dates",
})
)
return { success: false }
}
@@ -146,7 +162,7 @@ export default function useModifyStay({
console.error("Error modifying stay:", error)
toast.error(
intl.formatMessage({
id: "Failed to update your stay. Please try again later.",
defaultMessage: "Failed to update your stay. Please try again later.",
})
)
setIsLoading(false)

39
apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/ModifyStay/index.tsx
View File

@@ -98,10 +98,11 @@ export default function ModifyStay({ isLoggedIn }: ModifyStayProps) {
<Alert
type={AlertTypeEnum.Info}
heading={intl.formatMessage({
id: "Contact customer service",
defaultMessage: "Contact customer service",
})}
text={intl.formatMessage({
id: "As this is a multiroom stay, any dates changes are applicable to all rooms. Please contact customer service to update the dates.",
defaultMessage:
"As this is a multiroom stay, any dates changes are applicable to all rooms. Please contact customer service to update the dates.",
})}
/>
)
@@ -111,10 +112,11 @@ export default function ModifyStay({ isLoggedIn }: ModifyStayProps) {
<Alert
type={AlertTypeEnum.Info}
heading={intl.formatMessage({
id: "Contact customer service",
defaultMessage: "Contact customer service",
})}
text={intl.formatMessage({
id: "Please contact customer service to update the dates.",
defaultMessage:
"Please contact customer service to update the dates.",
})}
/>
)
@@ -142,10 +144,11 @@ export default function ModifyStay({ isLoggedIn }: ModifyStayProps) {
<Alert
type={AlertTypeEnum.Info}
heading={intl.formatMessage({
id: "Contact the person who booked the stay",
defaultMessage: "Contact the person who booked the stay",
})}
text={intl.formatMessage({
id: "As this is a multiroom stay, any dates changes are applicable to all rooms. Please ask the person who booked the stay to contact customer service.",
defaultMessage:
"As this is a multiroom stay, any dates changes are applicable to all rooms. Please ask the person who booked the stay to contact customer service.",
})}
/>
)
@@ -156,8 +159,12 @@ export default function ModifyStay({ isLoggedIn }: ModifyStayProps) {
<ModalContentWithActions
title={
isFirstStep
? intl.formatMessage({ id: "New dates for the stay" })
: intl.formatMessage({ id: "Confirm date change" })
? intl.formatMessage({
defaultMessage: "New dates for the stay",
})
: intl.formatMessage({
defaultMessage: "Confirm date change",
})
}
content={getModalContent()}
onClose={handleCloseModal}
@@ -165,8 +172,12 @@ export default function ModifyStay({ isLoggedIn }: ModifyStayProps) {
mainRoom && !multiRoom && canChangeDate
? {
label: isFirstStep
? intl.formatMessage({ id: "Check availability" })
: intl.formatMessage({ id: "Confirm" }),
? intl.formatMessage({
defaultMessage: "Check availability",
})
: intl.formatMessage({
defaultMessage: "Confirm",
}),
onClick: isFirstStep ? onCheckAvailability : handleModifyStay,
intent: isFirstStep ? "secondary" : "primary",
isLoading: isLoading,
@@ -176,8 +187,12 @@ export default function ModifyStay({ isLoggedIn }: ModifyStayProps) {
}
secondaryAction={{
label: isFirstStep
? intl.formatMessage({ id: "Back" })
: intl.formatMessage({ id: "Cancel" }),
? intl.formatMessage({
defaultMessage: "Back",
})
: intl.formatMessage({
defaultMessage: "Cancel",
}),
onClick: isFirstStep ? handleCloseView : handleCloseModal,
intent: "text",
}}

2
apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/PriceContainer/index.tsx
View File

@@ -29,7 +29,9 @@ export default function PriceContainer({
{text}
</Caption>
<Caption color="uiTextHighContrast">
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
{nightsText}, {adultsText}
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
{totalChildren > 0 ? `, ${childrenText}` : ""}
</Caption>
</div>

30
apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/index.tsx
View File

@@ -139,7 +139,9 @@ export default function ActionPanel({ hotel }: ActionPanelProps) {
className={styles.button}
disabled={!isDateModifyable}
>
{intl.formatMessage({ id: "Modify dates" })}
{intl.formatMessage({
defaultMessage: "Modify dates",
})}
<MaterialIcon icon="calendar_month" color="CurrentColor" />
</Button>
@@ -150,7 +152,9 @@ export default function ActionPanel({ hotel }: ActionPanelProps) {
className={styles.button}
disabled={!isGuaranteeable}
>
{intl.formatMessage({ id: "Guarantee late arrival" })}
{intl.formatMessage({
defaultMessage: "Guarantee late arrival",
})}
<MaterialIcon icon="credit_card" color="CurrentColor" />
</Button>
@@ -173,13 +177,19 @@ export default function ActionPanel({ hotel }: ActionPanelProps) {
className={styles.actionLink}
onClick={handleDownloadInvoice}
>
{intl.formatMessage({ id: "Download invoice" })}
{intl.formatMessage({
defaultMessage: "Download invoice",
})}
<MaterialIcon icon="download" color="CurrentColor" />
</Link>
) : (
<div className={styles.disabledLink}>
<Typography variant="Body/Paragraph/mdBold">
<p>{intl.formatMessage({ id: "Download invoice" })}</p>
<p>
{intl.formatMessage({
defaultMessage: "Download invoice",
})}
</p>
</Typography>
<MaterialIcon icon="download" color="CurrentColor" />
@@ -193,14 +203,18 @@ export default function ActionPanel({ hotel }: ActionPanelProps) {
className={styles.button}
disabled={!isCancelable}
>
{intl.formatMessage({ id: "Cancel stay" })}
{intl.formatMessage({
defaultMessage: "Cancel stay",
})}
<MaterialIcon icon="cancel" color="CurrentColor" />
</Button>
</div>
<div className={styles.info}>
<div>
<span className={styles.tag}>
{intl.formatMessage({ id: "Reference number" })}
{intl.formatMessage({
defaultMessage: "Reference number",
})}
</span>
<Subtitle color="burgundy" textAlign="right">
{confirmationNumber}
@@ -229,7 +243,9 @@ export default function ActionPanel({ hotel }: ActionPanelProps) {
onClick={handleCustomerSupport}
>
<Caption color="burgundy">
{intl.formatMessage({ id: "Customer support" })}
{intl.formatMessage({
defaultMessage: "Customer support",
})}
</Caption>
<MaterialIcon icon="chevron_right" size={20} color="CurrentColor" />
</Link>