diff --git a/app/[lang]/(live)/(protected)/my-pages/[...path]/page.tsx b/app/[lang]/(live)/(protected)/my-pages/[...path]/page.tsx index ac3fec31a..528b7b211 100644 --- a/app/[lang]/(live)/(protected)/my-pages/[...path]/page.tsx +++ b/app/[lang]/(live)/(protected)/my-pages/[...path]/page.tsx @@ -18,7 +18,7 @@ export default async function MyPages({ setLang(params.lang) const accountPageRes = await serverClient().contentstack.accountPage.get() - const { formatMessage } = await getIntl() + const intl = await getIntl() if (!accountPageRes) { return null @@ -33,7 +33,7 @@ export default async function MyPages({ {accountPage.content?.length ? ( ) : ( -

{formatMessage({ id: "No content published" })}

+

{intl.formatMessage({ id: "No content published" })}

)} diff --git a/app/[lang]/(live)/(protected)/my-pages/profile/@communication/page.tsx b/app/[lang]/(live)/(protected)/my-pages/profile/@communication/page.tsx index 43f1d66ef..4341b3ed0 100644 --- a/app/[lang]/(live)/(protected)/my-pages/profile/@communication/page.tsx +++ b/app/[lang]/(live)/(protected)/my-pages/profile/@communication/page.tsx @@ -13,15 +13,15 @@ export default async function CommunicationSlot({ }: PageArgs) { setLang(params.lang) - const { formatMessage } = await getIntl() + const intl = await getIntl() return (
- {formatMessage({ id: "My communication preferences" })} + {intl.formatMessage({ id: "My communication preferences" })} - {formatMessage({ + {intl.formatMessage({ id: "Tell us what information and updates you'd like to receive, and how, by clicking the link below.", })} diff --git a/app/[lang]/(live)/(protected)/my-pages/profile/@creditCards/page.tsx b/app/[lang]/(live)/(protected)/my-pages/profile/@creditCards/page.tsx index 4dbfc1ab4..ea54e71fd 100644 --- a/app/[lang]/(live)/(protected)/my-pages/profile/@creditCards/page.tsx +++ b/app/[lang]/(live)/(protected)/my-pages/profile/@creditCards/page.tsx @@ -13,17 +13,17 @@ import { LangParams, PageArgs } from "@/types/params" export default async function CreditCardSlot({ params }: PageArgs) { setLang(params.lang) - const { formatMessage } = await getIntl() + const intl = await getIntl() const creditCards = await serverClient().user.creditCards() return (
- {formatMessage({ id: "My payment cards" })} + {intl.formatMessage({ id: "My payment cards" })} - {formatMessage({ + {intl.formatMessage({ id: "Check out the credit cards saved to your profile. Pay with a saved card when signed in for a smoother web experience.", })} diff --git a/app/[lang]/(live)/(protected)/my-pages/profile/@membershipCards/page.tsx b/app/[lang]/(live)/(protected)/my-pages/profile/@membershipCards/page.tsx index 693bdc171..913cde993 100644 --- a/app/[lang]/(live)/(protected)/my-pages/profile/@membershipCards/page.tsx +++ b/app/[lang]/(live)/(protected)/my-pages/profile/@membershipCards/page.tsx @@ -15,14 +15,14 @@ export default async function MembershipCardSlot({ params, }: PageArgs) { setLang(params.lang) - const { formatMessage } = await getIntl() + const intl = await getIntl() const membershipCards = await getMembershipCards() return (
- {formatMessage({ id: "My membership cards" })} + {intl.formatMessage({ id: "My membership cards" })}
{membershipCards && @@ -41,7 +41,7 @@ export default async function MembershipCardSlot({ - {formatMessage({ id: "Add new card" })} + {intl.formatMessage({ id: "Add new card" })}
diff --git a/app/[lang]/(live)/(protected)/my-pages/profile/@profile/page.tsx b/app/[lang]/(live)/(protected)/my-pages/profile/@profile/page.tsx index d858d5943..c12b61810 100644 --- a/app/[lang]/(live)/(protected)/my-pages/profile/@profile/page.tsx +++ b/app/[lang]/(live)/(protected)/my-pages/profile/@profile/page.tsx @@ -24,7 +24,7 @@ import { LangParams, PageArgs } from "@/types/params" export default async function Profile({ params }: PageArgs) { setLang(params.lang) - const { formatMessage } = await getIntl() + const intl = await getIntl() const user = await getProfile() if (!user || "error" in user) { return null @@ -37,7 +37,7 @@ export default async function Profile({ params }: PageArgs) {
- {formatMessage({ id: "Welcome" })} + {intl.formatMessage({ id: "Welcome" })} {user.name} @@ -45,7 +45,7 @@ export default async function Profile({ params }: PageArgs<LangParams>) { </hgroup> <Button asChild intent="primary" size="small" theme="base"> <Link prefetch={false} color="none" href={profileEdit[params.lang]}> - {formatMessage({ id: "Edit profile" })} + {intl.formatMessage({ id: "Edit profile" })} </Link> </Button> </Header> @@ -54,35 +54,35 @@ export default async function Profile({ params }: PageArgs<LangParams>) { <div className={styles.item}> <CalendarIcon color="burgundy" /> <Body color="burgundy" textTransform="bold"> - {formatMessage({ id: "Date of Birth" })} + {intl.formatMessage({ id: "Date of Birth" })} </Body> <Body color="burgundy">{user.dateOfBirth}</Body> </div> <div className={styles.item}> <PhoneIcon color="burgundy" /> <Body color="burgundy" textTransform="bold"> - {formatMessage({ id: "Phone number" })} + {intl.formatMessage({ id: "Phone number" })} </Body> <Body color="burgundy">{user.phoneNumber}</Body> </div> <div className={styles.item}> <GlobeIcon color="burgundy" /> <Body color="burgundy" textTransform="bold"> - {formatMessage({ id: "Language" })} + {intl.formatMessage({ id: "Language" })} </Body> <Body color="burgundy">{language?.label ?? defaultLanguage}</Body> </div> <div className={styles.item}> <EmailIcon color="burgundy" /> <Body color="burgundy" textTransform="bold"> - {formatMessage({ id: "Email" })} + {intl.formatMessage({ id: "Email" })} </Body> <Body color="burgundy">{user.email}</Body> </div> <div className={styles.item}> <LocationIcon color="burgundy" /> <Body color="burgundy" textTransform="bold"> - {formatMessage({ id: "Address" })} + {intl.formatMessage({ id: "Address" })} </Body> <Body color="burgundy"> {user.address.streetAddress @@ -100,7 +100,7 @@ export default async function Profile({ params }: PageArgs<LangParams>) { <div className={styles.item}> <LockIcon color="burgundy" /> <Body color="burgundy" textTransform="bold"> - {formatMessage({ id: "Password" })} + {intl.formatMessage({ id: "Password" })} </Body> <Body color="burgundy">**********</Body> </div> diff --git a/components/Blocks/DynamicContent/Overview/Friend/MembershipNumber/index.tsx b/components/Blocks/DynamicContent/Overview/Friend/MembershipNumber/index.tsx index 10114c7ac..207533a57 100644 --- a/components/Blocks/DynamicContent/Overview/Friend/MembershipNumber/index.tsx +++ b/components/Blocks/DynamicContent/Overview/Friend/MembershipNumber/index.tsx @@ -13,13 +13,13 @@ export default async function MembershipNumber({ color, membership, }: MembershipNumberProps) { - const { formatMessage } = await getIntl() + const intl = await getIntl() const classNames = membershipNumberVariants({ className, color }) return ( <div className={classNames}> <Caption color="pale"> - {formatMessage({ id: "Membership ID" })} + {intl.formatMessage({ id: "Membership ID" })} {": "} </Caption> <span className={styles.icon}> diff --git a/components/Blocks/DynamicContent/Overview/Friend/index.tsx b/components/Blocks/DynamicContent/Overview/Friend/index.tsx index 3f1b30ed1..b499870c6 100644 --- a/components/Blocks/DynamicContent/Overview/Friend/index.tsx +++ b/components/Blocks/DynamicContent/Overview/Friend/index.tsx @@ -18,7 +18,7 @@ export default async function Friend({ membership, name, }: FriendProps) { - const { formatMessage } = await getIntl() + const intl = await getIntl() if (!membership?.membershipLevel) { return null } @@ -28,7 +28,7 @@ export default async function Friend({ <section className={styles.friend}> <header className={styles.header}> <Body color="white" textTransform="bold" textAlign="center"> - {formatMessage( + {intl.formatMessage( isHighestLevel ? { id: "Highest level" } : { id: `Level ${membershipLevels[membership.membershipLevel]}` } diff --git a/components/Blocks/DynamicContent/Overview/Stats/ExpiringPoints/index.tsx b/components/Blocks/DynamicContent/Overview/Stats/ExpiringPoints/index.tsx index fa21a8c83..9f29dfef5 100644 --- a/components/Blocks/DynamicContent/Overview/Stats/ExpiringPoints/index.tsx +++ b/components/Blocks/DynamicContent/Overview/Stats/ExpiringPoints/index.tsx @@ -4,7 +4,6 @@ import { dt } from "@/lib/dt" import Body from "@/components/TempDesignSystem/Text/Body" import { getIntl } from "@/i18n" import { getLang } from "@/i18n/serverContext" -import { formatNumber } from "@/utils/format" import { getMembership } from "@/utils/user" import type { UserProps } from "@/types/components/myPages/user" @@ -27,7 +26,7 @@ export default async function ExpiringPoints({ user }: UserProps) { {intl.formatMessage( { id: "spendable points expiring by" }, { - points: formatNumber(membership.pointsToExpire), + points: intl.formatNumber(membership.pointsToExpire), date: d.format(dateFormat), } )} diff --git a/components/Blocks/DynamicContent/Overview/Stats/Points/PointsColumn/index.tsx b/components/Blocks/DynamicContent/Overview/Stats/Points/PointsColumn/index.tsx index 0d67a14e3..d8263a7fd 100644 --- a/components/Blocks/DynamicContent/Overview/Stats/Points/PointsColumn/index.tsx +++ b/components/Blocks/DynamicContent/Overview/Stats/Points/PointsColumn/index.tsx @@ -44,7 +44,14 @@ async function PointsColumn({ title, subtitle, }: PointsColumnProps) { - const { formatMessage } = await getIntl() + const intl = await getIntl() + + let number = "N/A" + if (typeof points === "number") { + number = intl.formatNumber(points) + } else if (typeof nights === "number") { + number = intl.formatNumber(nights) + } return ( <article className={styles.article}> @@ -54,16 +61,16 @@ async function PointsColumn({ textAlign="center" className={styles.firstRow} > - {formatMessage({ + {intl.formatMessage({ id: title, })} </Body> <Title color="white" level="h2" textAlign="center"> - {points ?? nights ?? "N/A"} + {number} {subtitle ? ( - {formatMessage({ id: subtitle })} + {intl.formatMessage({ id: subtitle })} ) : null}
diff --git a/components/Blocks/DynamicContent/Overview/Stats/Points/index.tsx b/components/Blocks/DynamicContent/Overview/Stats/Points/index.tsx index 1a99f8985..1da672402 100644 --- a/components/Blocks/DynamicContent/Overview/Stats/Points/index.tsx +++ b/components/Blocks/DynamicContent/Overview/Stats/Points/index.tsx @@ -10,7 +10,7 @@ import { NextLevelPointsColumn, YourPointsColumn } from "./PointsColumn" import { UserProps } from "@/types/components/myPages/user" export default async function Points({ user }: UserProps) { - const { formatMessage } = await getIntl() + const intl = await getIntl() const membership = getMembership(user.memberships) @@ -27,7 +27,7 @@ export default async function Points({ user }: UserProps) { {nextLevel && ( )} {/* TODO: Show NextLevelNightsColumn when nightsToTopTier data is correct from Antavo */} diff --git a/components/Blocks/DynamicContent/Points/EarnAndBurn/AwardPoints/index.tsx b/components/Blocks/DynamicContent/Points/EarnAndBurn/AwardPoints/index.tsx index e32c3c5ca..73c323f2c 100644 --- a/components/Blocks/DynamicContent/Points/EarnAndBurn/AwardPoints/index.tsx +++ b/components/Blocks/DynamicContent/Points/EarnAndBurn/AwardPoints/index.tsx @@ -1,7 +1,6 @@ import { useIntl } from "react-intl" import Body from "@/components/TempDesignSystem/Text/Body" -import { formatNumber } from "@/utils/format" import { awardPointsVariants } from "./awardPointsVariants" @@ -34,7 +33,7 @@ export default function AwardPoints({ return ( {isCalculated - ? formatNumber(awardPoints) + ? intl.formatNumber(awardPoints) : intl.formatMessage({ id: "Points being calculated" })} ) diff --git a/components/Blocks/DynamicContent/Points/Overview/Points/index.tsx b/components/Blocks/DynamicContent/Points/Overview/Points/index.tsx index 79e0a9164..dc42f86de 100644 --- a/components/Blocks/DynamicContent/Points/Overview/Points/index.tsx +++ b/components/Blocks/DynamicContent/Points/Overview/Points/index.tsx @@ -17,7 +17,7 @@ import { LangParams } from "@/types/params" /* TODO */ export default async function Points({ user, lang }: UserProps & LangParams) { - const { formatMessage } = await getIntl() + const intl = await getIntl() const membership = getMembership(user.memberships) if (!membership?.nextLevel || !MembershipLevelEnum[membership.nextLevel]) { @@ -34,13 +34,13 @@ export default async function Points({ user, lang }: UserProps & LangParams) { {membership?.currentPoints ? ( ) : ( <> {membership?.nightsToTopTier && ( - {formatMessage({ + {intl.formatMessage({ id: "You have no previous stays.", })} diff --git a/components/Blocks/DynamicContent/Stays/ShowMoreButton/index.tsx b/components/Blocks/DynamicContent/Stays/ShowMoreButton/index.tsx index 6e9cae7bf..e988ef1c8 100644 --- a/components/Blocks/DynamicContent/Stays/ShowMoreButton/index.tsx +++ b/components/Blocks/DynamicContent/Stays/ShowMoreButton/index.tsx @@ -13,7 +13,7 @@ export default function ShowMoreButton({ disabled, loadMoreData, }: ShowMoreButtonParams) { - const { formatMessage } = useIntl() + const intl = useIntl() return (
) diff --git a/components/Blocks/DynamicContent/Stays/Soonest/EmptyUpcomingStays/index.tsx b/components/Blocks/DynamicContent/Stays/Soonest/EmptyUpcomingStays/index.tsx index 0db81b6ce..3835ae61d 100644 --- a/components/Blocks/DynamicContent/Stays/Soonest/EmptyUpcomingStays/index.tsx +++ b/components/Blocks/DynamicContent/Stays/Soonest/EmptyUpcomingStays/index.tsx @@ -10,14 +10,14 @@ import { getLang } from "@/i18n/serverContext" import styles from "./emptyUpcomingStays.module.css" export default async function EmptyUpcomingStaysBlock() { - const { formatMessage } = await getIntl() + const intl = await getIntl() return (
- {formatMessage({ id: "You have no upcoming stays." })} + {intl.formatMessage({ id: "You have no upcoming stays." })} <span className={styles.burgundyTitle}> - {formatMessage({ id: "Where should you go next?" })} + {intl.formatMessage({ id: "Where should you go next?" })} </span>
@@ -26,7 +26,7 @@ export default async function EmptyUpcomingStaysBlock() { className={styles.link} color="peach80" > - {formatMessage({ id: "Get inspired" })} + {intl.formatMessage({ id: "Get inspired" })}
diff --git a/components/Blocks/DynamicContent/Stays/Upcoming/EmptyUpcomingStays/index.tsx b/components/Blocks/DynamicContent/Stays/Upcoming/EmptyUpcomingStays/index.tsx index 0db81b6ce..3835ae61d 100644 --- a/components/Blocks/DynamicContent/Stays/Upcoming/EmptyUpcomingStays/index.tsx +++ b/components/Blocks/DynamicContent/Stays/Upcoming/EmptyUpcomingStays/index.tsx @@ -10,14 +10,14 @@ import { getLang } from "@/i18n/serverContext" import styles from "./emptyUpcomingStays.module.css" export default async function EmptyUpcomingStaysBlock() { - const { formatMessage } = await getIntl() + const intl = await getIntl() return (
- {formatMessage({ id: "You have no upcoming stays." })} + {intl.formatMessage({ id: "You have no upcoming stays." })} <span className={styles.burgundyTitle}> - {formatMessage({ id: "Where should you go next?" })} + {intl.formatMessage({ id: "Where should you go next?" })} </span>
@@ -26,7 +26,7 @@ export default async function EmptyUpcomingStaysBlock() { className={styles.link} color="peach80" > - {formatMessage({ id: "Get inspired" })} + {intl.formatMessage({ id: "Get inspired" })}
diff --git a/components/Current/Header/BookingButton/index.tsx b/components/Current/Header/BookingButton/index.tsx index 9bb4b4a18..3ecffd534 100644 --- a/components/Current/Header/BookingButton/index.tsx +++ b/components/Current/Header/BookingButton/index.tsx @@ -7,10 +7,10 @@ import { useIntl } from "react-intl" import styles from "./bookingButton.module.css" export default function BookingButton({ href }: { href: string }) { - const { formatMessage } = useIntl() + const intl = useIntl() return ( - {formatMessage({ id: "Book" })} + {intl.formatMessage({ id: "Book" })} ) } diff --git a/components/Current/Header/MyPagesMobileDropdown/index.tsx b/components/Current/Header/MyPagesMobileDropdown/index.tsx index 49c333f34..be58e53b5 100644 --- a/components/Current/Header/MyPagesMobileDropdown/index.tsx +++ b/components/Current/Header/MyPagesMobileDropdown/index.tsx @@ -22,7 +22,7 @@ export default function MyPagesMobileDropdown({ }: { navigation: Navigation }) { - const { formatMessage } = useIntl() + const intl = useIntl() const lang = useLang() const { toggleDropdown, isMyPagesMobileMenuOpen } = useDropdownStore() @@ -69,7 +69,7 @@ export default function MyPagesMobileDropdown({ color="burgundy" variant="myPageMobileDropdown" > - {formatMessage({ id: "Log out" })} + {intl.formatMessage({ id: "Log out" })} ) : null} diff --git a/components/Current/Header/TopMenu/index.tsx b/components/Current/Header/TopMenu/index.tsx index cb7c103f7..b33c44424 100644 --- a/components/Current/Header/TopMenu/index.tsx +++ b/components/Current/Header/TopMenu/index.tsx @@ -21,7 +21,7 @@ export default async function TopMenu({ links, languageSwitcher, }: TopMenuProps) { - const { formatMessage } = await getIntl() + const intl = await getIntl() const user = await getName() return (
@@ -60,7 +60,7 @@ export default async function TopMenu({ className={styles.sessionLink} prefetch={false} > - {formatMessage({ id: "Log out" })} + {intl.formatMessage({ id: "Log out" })} ) : ( @@ -69,7 +69,7 @@ export default async function TopMenu({ trackingId="loginStartTopMenu" className={`${styles.sessionLink} ${styles.loginLink}`} > - {formatMessage({ id: "Log in" })} + {intl.formatMessage({ id: "Log in" })} )} diff --git a/components/Footer/Details/index.tsx b/components/Footer/Details/index.tsx index 59b9c2488..cb3a4eb9b 100644 --- a/components/Footer/Details/index.tsx +++ b/components/Footer/Details/index.tsx @@ -20,7 +20,7 @@ function SocialIcon({ iconName }: SocialIconsProps) { export default async function FooterDetails() { const lang = getLang() - const { formatMessage } = await getIntl() + const intl = await getIntl() // preloaded const footer = await getFooter() const languages = await getLanguageSwitcher() @@ -58,7 +58,7 @@ export default async function FooterDetails() {
© {currentYear}{" "} - {formatMessage({ id: "Copyright all rights reserved" })} + {intl.formatMessage({ id: "Copyright all rights reserved" })}
diff --git a/components/Header/MainMenu/MyPagesMenuWrapper/index.tsx b/components/Header/MainMenu/MyPagesMenuWrapper/index.tsx index 14044b248..bf9473f32 100644 --- a/components/Header/MainMenu/MyPagesMenuWrapper/index.tsx +++ b/components/Header/MainMenu/MyPagesMenuWrapper/index.tsx @@ -8,7 +8,6 @@ import { serverClient } from "@/lib/trpc/server" import LoginButton from "@/components/LoginButton" import { getIntl } from "@/i18n" -import { getLang } from "@/i18n/serverContext" import Avatar from "../Avatar" import MyPagesMenu from "../MyPagesMenu" @@ -17,7 +16,6 @@ import MyPagesMobileMenu from "../MyPagesMobileMenu" import styles from "./myPagesMenuWrapper.module.css" export default async function MyPagesMenuWrapper() { - const lang = getLang() const [intl, myPagesNavigation, user, membership] = await Promise.all([ getIntl(), getMyPagesNavigation(), diff --git a/components/HotelReservation/EnterDetails/Summary/index.tsx b/components/HotelReservation/EnterDetails/Summary/index.tsx index 752f3fd4a..b8d744baa 100644 --- a/components/HotelReservation/EnterDetails/Summary/index.tsx +++ b/components/HotelReservation/EnterDetails/Summary/index.tsx @@ -13,7 +13,6 @@ import Body from "@/components/TempDesignSystem/Text/Body" import Caption from "@/components/TempDesignSystem/Text/Caption" import Subtitle from "@/components/TempDesignSystem/Text/Subtitle" import useLang from "@/hooks/useLang" -import { formatNumber } from "@/utils/format" import styles from "./summary.module.css" @@ -106,7 +105,9 @@ export default function Summary({ {intl.formatMessage( { id: "{amount} {currency}" }, { - amount: formatNumber(parseInt(room.localPrice.price ?? "0")), + amount: intl.formatNumber( + parseInt(room.localPrice.price ?? "0") + ), currency: room.localPrice.currency, } )} @@ -202,7 +203,7 @@ export default function Summary({ {intl.formatMessage( { id: "{amount} {currency}" }, { - amount: formatNumber(totalPrice.local), + amount: intl.formatNumber(totalPrice.local), currency: room.localPrice.currency, } )} @@ -212,7 +213,7 @@ export default function Summary({ {intl.formatMessage( { id: "{amount} {currency}" }, { - amount: formatNumber(totalPrice.euro), + amount: intl.formatNumber(totalPrice.euro), currency: room.euroPrice.currency, } )} diff --git a/components/MyPages/Sidebar/index.tsx b/components/MyPages/Sidebar/index.tsx index 5c4de4d2d..8a871d253 100644 --- a/components/MyPages/Sidebar/index.tsx +++ b/components/MyPages/Sidebar/index.tsx @@ -13,7 +13,7 @@ import styles from "./sidebar.module.css" export default async function SidebarMyPages() { const navigation = await getMyPagesNavigation() - const { formatMessage } = await getIntl() + const intl = await getIntl() return (