Merged in feature/refactor-lang (pull request #387)

feat: SW-238 Avoid prop drilling of lang

Approved-by: Michael Zetterberg

components/MyPages/Blocks/Points/EarnAndBurn/Desktop/Row/index.tsx

@@ -1,6 +1,7 @@
 import { dt } from "@/lib/dt"
 
 import { getIntl } from "@/i18n"
+import { getLang } from "@/i18n/serverContext"
 
 import AwardPoints from "./AwardPoints"
 
@@ -8,15 +9,17 @@ import styles from "./row.module.css"
 
 import type { RowProps } from "@/types/components/myPages/myPage/earnAndBurn"
 
-export default async function Row({ transaction, lang }: RowProps) {
+export default async function Row({ transaction }: RowProps) {
   const { formatMessage } = await getIntl()
   const description =
     transaction.hotelName && transaction.city
       ? `${transaction.hotelName}, ${transaction.city} ${transaction.nights} ${formatMessage({ id: "nights" })}`
       : `${transaction.nights} ${formatMessage({ id: "nights" })}`
-  const arrival = dt(transaction.checkinDate).locale(lang).format("DD MMM YYYY")
+  const arrival = dt(transaction.checkinDate)
+    .locale(getLang())
+    .format("DD MMM YYYY")
   const departure = dt(transaction.checkoutDate)
-    .locale(lang)
+    .locale(getLang())
     .format("DD MMM YYYY")
   return (
     <tr className={styles.tr}>

components/MyPages/Blocks/Points/EarnAndBurn/Desktop/index.tsx

@@ -15,7 +15,7 @@ const tableHeadings = [
   "Points",
 ]
 
-export default async function DesktopTable({ lang, transactions }: TableProps) {
+export default async function DesktopTable({ transactions }: TableProps) {
   const { formatMessage } = await getIntl()
   return (
     <div className={styles.container}>
@@ -35,7 +35,6 @@ export default async function DesktopTable({ lang, transactions }: TableProps) {
           <tbody>
             {transactions.map((transaction) => (
               <Row
-                lang={lang}
                 key={transaction.confirmationNumber}
                 transaction={transaction}
               />

components/MyPages/Blocks/Points/EarnAndBurn/Mobile/index.tsx

@@ -3,12 +3,13 @@ import { dt } from "@/lib/dt"
 import AwardPoints from "@/components/MyPages/Blocks/Points/EarnAndBurn/Desktop/Row/AwardPoints"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import { getIntl } from "@/i18n"
+import { getLang } from "@/i18n/serverContext"
 
 import styles from "./mobile.module.css"
 
 import type { TableProps } from "@/types/components/myPages/myPage/earnAndBurn"
 
-export default async function MobileTable({ lang, transactions }: TableProps) {
+export default async function MobileTable({ transactions }: TableProps) {
   const { formatMessage } = await getIntl()
   return (
     <div className={styles.container}>
@@ -32,7 +33,7 @@ export default async function MobileTable({ lang, transactions }: TableProps) {
                 <td className={`${styles.td} ${styles.transactionDetails}`}>
                   <span className={styles.transactionDate}>
                     {dt(transaction.checkinDate)
-                      .locale(lang)
+                      .locale(getLang())
                       .format("DD MMM YYYY")}
                   </span>
                   {transaction.hotelName && transaction.city ? (

components/MyPages/Blocks/Points/EarnAndBurn/index.tsx

@@ -10,7 +10,6 @@ import MobileTable from "./Mobile"
 import type { AccountPageComponentProps } from "@/types/components/myPages/myPage/accountPage"
 
 export default async function EarnAndBurn({
-  lang,
   link,
   subtitle,
   title,
@@ -23,8 +22,8 @@ export default async function EarnAndBurn({
   return (
     <SectionContainer>
       <SectionHeader title={title} link={link} subtitle={subtitle} />
-      <MobileTable lang={lang} transactions={transactions.data} />
-      <DesktopTable lang={lang} transactions={transactions.data} />
+      <MobileTable transactions={transactions.data} />
+      <DesktopTable transactions={transactions.data} />
       <SectionLink link={link} variant="mobile" />
     </SectionContainer>
   )

components/MyPages/Blocks/Points/Overview/index.tsx

@@ -12,14 +12,12 @@ import Stats from "../../Overview/Stats"
 import styles from "./overview.module.css"
 
 import type { AccountPageComponentProps } from "@/types/components/myPages/myPage/accountPage"
-import type { LangParams } from "@/types/params"
 
 export default async function PointsOverview({
   link,
   subtitle,
   title,
-  lang,
-}: AccountPageComponentProps & LangParams) {
+}: AccountPageComponentProps) {
   const user = await serverClient().user.get()
   if (!user || "error" in user) {
     return null
@@ -31,7 +29,7 @@ export default async function PointsOverview({
       <Hero color="burgundy">
         <Friend user={user} color="red" />
         <Divider className={styles.divider} color="peach" />
-        <Stats user={user} lang={lang} />
+        <Stats user={user} />
       </Hero>
       <SectionLink link={link} variant="mobile" />
     </SectionContainer>