chore: improve typings
This commit is contained in:
@@ -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
|
||||||
|
|||||||
@@ -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 ? (
|
||||||
|
|||||||
@@ -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
|
||||||
|
|||||||
@@ -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"
|
||||||
|
|||||||
@@ -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
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user