chore: improve typings

This commit is contained in:
Arvid Norlin
2024-06-10 11:51:22 +02:00
parent af205451e6
commit 85aab88aec
5 changed files with 45 additions and 39 deletions

View File

@@ -21,7 +21,9 @@ import styles from "./overviewTable.module.css"
import { import {
ComparisonLevel, ComparisonLevel,
overviewTableActionsEnum,
OverviewTableProps, OverviewTableProps,
OverviewTableReducerAction,
} from "@/types/components/loyalty/blocks" } from "@/types/components/loyalty/blocks"
import { User } from "@/types/user" import { User } from "@/types/user"
@@ -54,15 +56,7 @@ const titleTranslations = {
], ],
} }
enum actions { function getLevelByTier(tier: membershipLevels) {
SET_SELECTED_LEVEL_A_MOBILE = "SET_SELECTED_LEVEL_A_MOBILE",
SET_SELECTED_LEVEL_B_MOBILE = "SET_SELECTED_LEVEL_B_MOBILE",
SET_SELECTED_LEVEL_A_DESKTOP = "SET_SELECTED_LEVEL_A_DESKTOP",
SET_SELECTED_LEVEL_B_DESKTOP = "SET_SELECTED_LEVEL_B_DESKTOP",
SET_SELECTED_LEVEL_C_DESKTOP = "SET_SELECTED_LEVEL_C_DESKTOP",
}
function getLevelByTier(tier: number) {
return levelsData.levels.find( return levelsData.levels.find(
(level) => level.tier === tier (level) => level.tier === tier
) as ComparisonLevel ) as ComparisonLevel
@@ -109,29 +103,29 @@ function getInitialState(user?: User) {
} }
} }
function reducer(state: any, action: any) { function reducer(state: any, action: OverviewTableReducerAction) {
switch (action.type) { switch (action.type) {
case actions.SET_SELECTED_LEVEL_A_MOBILE: case overviewTableActionsEnum.SET_SELECTED_LEVEL_A_MOBILE:
return { return {
...state, ...state,
selectedLevelAMobile: action.payload, selectedLevelAMobile: action.payload,
} }
case actions.SET_SELECTED_LEVEL_B_MOBILE: case overviewTableActionsEnum.SET_SELECTED_LEVEL_B_MOBILE:
return { return {
...state, ...state,
selectedLevelBMobile: action.payload, selectedLevelBMobile: action.payload,
} }
case actions.SET_SELECTED_LEVEL_A_DESKTOP: case overviewTableActionsEnum.SET_SELECTED_LEVEL_A_DESKTOP:
return { return {
...state, ...state,
selectedLevelADesktop: action.payload, selectedLevelADesktop: action.payload,
} }
case actions.SET_SELECTED_LEVEL_B_DESKTOP: case overviewTableActionsEnum.SET_SELECTED_LEVEL_B_DESKTOP:
return { return {
...state, ...state,
selectedLevelBDesktop: action.payload, selectedLevelBDesktop: action.payload,
} }
case actions.SET_SELECTED_LEVEL_C_DESKTOP: case overviewTableActionsEnum.SET_SELECTED_LEVEL_C_DESKTOP:
return { return {
...state, ...state,
selectedLevelCDesktop: action.payload, selectedLevelCDesktop: action.payload,
@@ -146,10 +140,13 @@ export default function OverviewTable({ user }: OverviewTableProps) {
const [selectionState, dispatch] = useReducer(reducer, user, getInitialState) const [selectionState, dispatch] = useReducer(reducer, user, getInitialState)
function handleSelectChange(actionType: string) { function handleSelectChange(actionType: overviewTableActionsEnum) {
return (key: Key) => { return (key: Key) => {
if (typeof key === "number") { if (typeof key === "number") {
dispatch({ payload: getLevelByTier(key), type: actionType }) dispatch({
payload: getLevelByTier(key),
type: actionType,
})
} }
} }
} }
@@ -179,7 +176,9 @@ export default function OverviewTable({ user }: OverviewTableProps) {
label={intl.formatMessage({ id: "Level" })} label={intl.formatMessage({ id: "Level" })}
items={levelOptions} items={levelOptions}
value={selectionState.selectedLevelAMobile.tier} value={selectionState.selectedLevelAMobile.tier}
onSelect={handleSelectChange(actions.SET_SELECTED_LEVEL_A_MOBILE)} onSelect={handleSelectChange(
overviewTableActionsEnum.SET_SELECTED_LEVEL_A_MOBILE
)}
/> />
<Image <Image
className={styles.icon} className={styles.icon}
@@ -204,7 +203,9 @@ export default function OverviewTable({ user }: OverviewTableProps) {
label={intl.formatMessage({ id: "Level" })} label={intl.formatMessage({ id: "Level" })}
items={levelOptions} items={levelOptions}
value={selectionState.selectedLevelBMobile.tier} value={selectionState.selectedLevelBMobile.tier}
onSelect={handleSelectChange(actions.SET_SELECTED_LEVEL_B_MOBILE)} onSelect={handleSelectChange(
overviewTableActionsEnum.SET_SELECTED_LEVEL_B_MOBILE
)}
/> />
<Image <Image
className={styles.icon} className={styles.icon}
@@ -240,7 +241,7 @@ export default function OverviewTable({ user }: OverviewTableProps) {
items={levelOptions} items={levelOptions}
value={selectionState.selectedLevelADesktop.tier} value={selectionState.selectedLevelADesktop.tier}
onSelect={handleSelectChange( onSelect={handleSelectChange(
actions.SET_SELECTED_LEVEL_A_DESKTOP overviewTableActionsEnum.SET_SELECTED_LEVEL_A_DESKTOP
)} )}
/> />
<Image <Image
@@ -267,7 +268,7 @@ export default function OverviewTable({ user }: OverviewTableProps) {
items={levelOptions} items={levelOptions}
value={selectionState.selectedLevelBDesktop.tier} value={selectionState.selectedLevelBDesktop.tier}
onSelect={handleSelectChange( onSelect={handleSelectChange(
actions.SET_SELECTED_LEVEL_B_DESKTOP overviewTableActionsEnum.SET_SELECTED_LEVEL_B_DESKTOP
)} )}
/> />
<Image <Image
@@ -294,7 +295,7 @@ export default function OverviewTable({ user }: OverviewTableProps) {
items={levelOptions} items={levelOptions}
value={selectionState.selectedLevelCDesktop.tier} value={selectionState.selectedLevelCDesktop.tier}
onSelect={handleSelectChange( onSelect={handleSelectChange(
actions.SET_SELECTED_LEVEL_C_DESKTOP overviewTableActionsEnum.SET_SELECTED_LEVEL_C_DESKTOP
)} )}
/> />
<Image <Image

View File

@@ -1,3 +1,5 @@
import { serverClient } from "@/lib/trpc/server"
import Link from "@/components/TempDesignSystem/Link" import Link from "@/components/TempDesignSystem/Link"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle" import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import Title from "@/components/TempDesignSystem/Text/Title" import Title from "@/components/TempDesignSystem/Text/Title"
@@ -27,15 +29,16 @@ function DynamicComponentBlock({ component, user }: DynamicComponentProps) {
} }
} }
export default function DynamicContent({ export default async function DynamicContent({
dynamicContent, dynamicContent,
user,
}: DynamicContentProps) { }: DynamicContentProps) {
const displayHeader = !!( const displayHeader = !!(
dynamicContent.title || dynamicContent.title ||
dynamicContent.subtitle || dynamicContent.subtitle ||
dynamicContent.title dynamicContent.title
) )
const user = await serverClient().user.get()
return ( return (
<section className={styles.container}> <section className={styles.container}>
{displayHeader ? ( {displayHeader ? (

View File

@@ -1,5 +1,3 @@
import { serverClient } from "@/lib/trpc/server"
import JsonToHtml from "@/components/JsonToHtml" import JsonToHtml from "@/components/JsonToHtml"
import DynamicContentBlock from "@/components/Loyalty/Blocks/DynamicContent" import DynamicContentBlock from "@/components/Loyalty/Blocks/DynamicContent"
import Shortcuts from "@/components/MyPages/Blocks/Shortcuts" import Shortcuts from "@/components/MyPages/Blocks/Shortcuts"
@@ -10,8 +8,6 @@ import type { BlocksProps } from "@/types/components/loyalty/blocks"
import { LoyaltyBlocksTypenameEnum } from "@/types/components/loyalty/enums" import { LoyaltyBlocksTypenameEnum } from "@/types/components/loyalty/enums"
export async function Blocks({ blocks }: BlocksProps) { export async function Blocks({ blocks }: BlocksProps) {
const user = await serverClient().user.get()
console.log({ user })
return blocks.map((block) => { return blocks.map((block) => {
switch (block.__typename) { switch (block.__typename) {
case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksContent: case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksContent:
@@ -24,12 +20,7 @@ export async function Blocks({ blocks }: BlocksProps) {
</section> </section>
) )
case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksDynamicContent: case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksDynamicContent:
return ( return <DynamicContentBlock dynamicContent={block.dynamic_content} />
<DynamicContentBlock
dynamicContent={block.dynamic_content}
user={user}
/>
)
case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksShortcuts: case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksShortcuts:
return ( return (
<Shortcuts <Shortcuts

View File

@@ -1,5 +1,3 @@
import { get } from "http"
import { serverClient } from "@/lib/trpc/server" import { serverClient } from "@/lib/trpc/server"
import Header from "@/components/MyPages/Blocks/Header" import Header from "@/components/MyPages/Blocks/Header"

View File

@@ -1,4 +1,5 @@
import { Lang } from "@/constants/languages" import { Lang } from "@/constants/languages"
import { membershipLevels } from "@/constants/membershipLevels"
import { import {
Block, Block,
CardsGrid, CardsGrid,
@@ -16,7 +17,6 @@ export type BlocksProps = {
export type DynamicContentProps = { export type DynamicContentProps = {
dynamicContent: DynamicContent["dynamic_content"] dynamicContent: DynamicContent["dynamic_content"]
user?: User
} }
export type DynamicComponentProps = { export type DynamicComponentProps = {
@@ -40,7 +40,7 @@ export type OverviewTableTitleProps = { texts: OverviewTableTitleTranslation[] }
export type OverviewTableProps = { user?: User } export type OverviewTableProps = { user?: User }
export type Level = { export type Level = {
tier: number tier: membershipLevels
name: string name: string
requiredPoints: number requiredPoints: number
requiredNights?: number requiredNights?: number
@@ -55,7 +55,7 @@ export type LevelCardProps = {
} }
export type ComparisonLevel = { export type ComparisonLevel = {
tier: number tier: membershipLevels
name: string name: string
description: string description: string
requirement: string requirement: string
@@ -103,3 +103,16 @@ export type BenefitTableHeaderProps = {
name: string name: string
description: string description: string
} }
export enum overviewTableActionsEnum {
SET_SELECTED_LEVEL_A_MOBILE = "SET_SELECTED_LEVEL_A_MOBILE",
SET_SELECTED_LEVEL_B_MOBILE = "SET_SELECTED_LEVEL_B_MOBILE",
SET_SELECTED_LEVEL_A_DESKTOP = "SET_SELECTED_LEVEL_A_DESKTOP",
SET_SELECTED_LEVEL_B_DESKTOP = "SET_SELECTED_LEVEL_B_DESKTOP",
SET_SELECTED_LEVEL_C_DESKTOP = "SET_SELECTED_LEVEL_C_DESKTOP",
}
export type OverviewTableReducerAction = {
type: overviewTableActionsEnum
payload: ComparisonLevel
}