Merged in feat/use-translations-overview-table (pull request #342)

fix: use translations for overview table

Approved-by: Christel Westerberg

components/ContentType/LoyaltyPage/LoyaltyPage.tsx

@@ -22,7 +22,9 @@ export default async function LoyaltyPage({ lang }: LangParams) {
 
       <MaxWidth className={styles.blocks} tag="main">
         <Title>{loyaltyPage.heading}</Title>
-        {loyaltyPage.blocks ? <Blocks blocks={loyaltyPage.blocks} /> : null}
+        {loyaltyPage.blocks ? (
+          <Blocks blocks={loyaltyPage.blocks} lang={lang} />
+        ) : null}
       </MaxWidth>
     </section>
   )

components/Loyalty/Blocks/DynamicContent/OverviewTable/index.tsx

@@ -33,6 +33,7 @@ import {
   OverviewTableProps,
   OverviewTableReducerAction,
 } from "@/types/components/loyalty/blocks"
+import { LangParams } from "@/types/params"
 import type { User } from "@/types/user"
 
 const levelsTranslations = {
@@ -126,9 +127,9 @@ function reducer(state: any, action: OverviewTableReducerAction) {
 
 export default function OverviewTable({
   activeMembership,
-}: OverviewTableProps) {
+  lang,
+}: OverviewTableProps & LangParams) {
   const intl = useIntl()
-  const lang = Lang.en
   const levelsData = levelsTranslations[lang]
   const [selectionState, dispatch] = useReducer(
     reducer,

components/Loyalty/Blocks/DynamicContent/index.tsx

@@ -1,7 +1,5 @@
-import { Lang } from "@/constants/languages"
 import { serverClient } from "@/lib/trpc/server"
 
-import { auth } from "@/auth"
 import SectionContainer from "@/components/Section/Container"
 import SectionHeader from "@/components/Section/Header"
 import SectionLink from "@/components/Section/Link"
@@ -19,17 +17,20 @@ import type {
   DynamicContentProps,
 } from "@/types/components/loyalty/blocks"
 import { LoyaltyComponentEnum } from "@/types/components/loyalty/enums"
+import { LangParams } from "@/types/params"
 
-async function DynamicComponentBlock({ component }: DynamicComponentProps) {
+async function DynamicComponentBlock({
+  component,
+  lang,
+}: DynamicComponentProps & LangParams) {
   const membershipLevel = await serverClient().user.membershipLevel()
-
   switch (component) {
     case LoyaltyComponentEnum.how_it_works:
       return <HowItWorks />
     case LoyaltyComponentEnum.loyalty_levels:
       return <LoyaltyLevels />
     case LoyaltyComponentEnum.overview_table:
-      return <OverviewTable activeMembership={membershipLevel} />
+      return <OverviewTable activeMembership={membershipLevel} lang={lang} />
     default:
       return null
   }
@@ -38,13 +39,13 @@ async function DynamicComponentBlock({ component }: DynamicComponentProps) {
 export default function DynamicContent({
   dynamicContent,
   firstItem,
-}: DynamicContentProps) {
+  lang,
+}: DynamicContentProps & LangParams) {
   const displayHeader = !!(
     dynamicContent.link ||
     dynamicContent.subtitle ||
     dynamicContent.title
   )
-
   const isOverviewTable =
     dynamicContent.component === LoyaltyComponentEnum.overview_table
   return (
@@ -62,7 +63,7 @@ export default function DynamicContent({
           topTitle={firstItem}
         />
       ) : null}
-      <DynamicComponentBlock component={dynamicContent.component} />
+      <DynamicComponentBlock component={dynamicContent.component} lang={lang} />
       {displayHeader && (
         <SectionLink link={dynamicContent.link} variant="mobile" />
       )}

components/Loyalty/Blocks/WebView/index.tsx

@@ -45,6 +45,7 @@ export function Blocks({ lang, blocks }: BlocksProps & LangParams) {
             dynamicContent={dynamicContent}
             firstItem={firstItem}
             key={`${block.dynamic_content.title}-${idx}`}
+            lang={lang}
           />
         )
       case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksShortcuts:

components/Loyalty/Blocks/index.tsx

@@ -6,8 +6,9 @@ import CardsGrid from "./CardsGrid"
 
 import type { BlocksProps } from "@/types/components/loyalty/blocks"
 import { LoyaltyBlocksTypenameEnum } from "@/types/components/loyalty/enums"
+import { LangParams } from "@/types/params"
 
-export function Blocks({ blocks }: BlocksProps) {
+export function Blocks({ blocks, lang }: BlocksProps & LangParams) {
   return blocks.map((block, idx) => {
     const firstItem = idx === 0
     switch (block.__typename) {
@@ -26,6 +27,7 @@ export function Blocks({ blocks }: BlocksProps) {
             dynamicContent={block.dynamic_content}
             firstItem={firstItem}
             key={`${block.dynamic_content.title}-${idx}`}
+            lang={lang}
           />
         )
       case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksShortcuts: