fix(SW-556): now fetching surprises separately in component.

also showing surprises on any account page
This commit is contained in:
Christian Andolf
2024-10-21 17:11:15 +02:00
parent 3508253afe
commit e6db1b17c6
11 changed files with 209 additions and 73 deletions
@@ -1,7 +1,10 @@
"use client"
import { trpc } from "@/lib/trpc/client"
import { ApiReward, Reward } from "@/server/routers/contentstack/reward/output"
import {
Reward,
SurpriseReward,
} from "@/server/routers/contentstack/reward/output"
import LoadingSpinner from "@/components/LoadingSpinner"
import Grids from "@/components/TempDesignSystem/Grids"
@@ -9,15 +12,12 @@ import ShowMoreButton from "@/components/TempDesignSystem/ShowMoreButton"
import Title from "@/components/TempDesignSystem/Text/Title"
import useLang from "@/hooks/useLang"
import Surprises from "../Surprises"
import styles from "./current.module.css"
import type { CurrentRewardsClientProps } from "@/types/components/blocks/currentRewards"
export default function ClientCurrentRewards({
initialCurrentRewards,
membershipNumber,
}: CurrentRewardsClientProps) {
const lang = useLang()
const { data, isFetching, fetchNextPage, hasNextPage, isLoading } =
@@ -39,18 +39,12 @@ export default function ClientCurrentRewards({
return <LoadingSpinner />
}
const rewards =
const cmsRewards =
data?.pages
.flatMap((page) => page?.rewards)
.filter((reward): reward is Reward => !!reward) ?? []
const surprises =
data?.pages
.flatMap((page) => page?.apiRewards)
.filter((reward): reward is ApiReward => reward?.type === "surprise") ??
[]
if (!rewards.length && !surprises.length) {
if (!cmsRewards.length) {
return null
}
@@ -63,7 +57,7 @@ export default function ClientCurrentRewards({
return (
<>
<Grids.Stackable>
{rewards.map((reward, idx) => (
{cmsRewards.map((reward, idx) => (
<article className={styles.card} key={`${reward.reward_id}-${idx}`}>
<Title
as="h4"
@@ -82,7 +76,6 @@ export default function ClientCurrentRewards({
) : (
<ShowMoreButton loadMoreData={loadMoreData} />
))}
<Surprises surprises={surprises} membershipNumber={membershipNumber} />
</>
)
}
@@ -1,4 +1,3 @@
import { getProfile } from "@/lib/trpc/memoizedRequests"
import { serverClient } from "@/lib/trpc/server"
import SectionContainer from "@/components/Section/Container"
@@ -23,19 +22,10 @@ export default async function CurrentRewardsBlock({
return null
}
const user = await getProfile()
if (!user || "error" in user) {
return null
}
return (
<SectionContainer>
<SectionHeader title={title} link={link} preamble={subtitle} />
<ClientCurrentRewards
initialCurrentRewards={initialCurrentRewards}
membershipNumber={user.membership?.membershipNumber}
/>
<ClientCurrentRewards initialCurrentRewards={initialCurrentRewards} />
<SectionLink link={link} variant="mobile" />
</SectionContainer>
)