scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged in fix/cleanup-2 (pull request #261)

Browse Source 
Bug fixes

Approved-by: Michael Zetterberg
This commit is contained in:
Christel Westerberg
2024-06-19 14:54:41 +00:00
committed by Michael Zetterberg
parent d28cbf10c7 b0b9ac15cc
commit 8d1d929f3e
13 changed files with 46 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
components/Loyalty/Blocks/DynamicContent/index.tsx
View File

@@ -20,9 +20,6 @@ async function DynamicComponentBlock({ component }: DynamicComponentProps) {
const session = await auth() const session = await auth()
const user = session ? await serverClient().user.get() : null const user = session ? await serverClient().user.get() : null
if (!user) {
return null
}
switch (component) { switch (component) {
case LoyaltyComponentEnum.how_it_works: case LoyaltyComponentEnum.how_it_works:

1
components/MyPages/Blocks/Benefits/NextLevel/index.tsx
View File

@@ -4,7 +4,6 @@ import { serverClient } from "@/lib/trpc/server"
import SectionContainer from "@/components/Section/Container" import SectionContainer from "@/components/Section/Container"
import Header from "@/components/Section/Header" import Header from "@/components/Section/Header"
import Button from "@/components/TempDesignSystem/Button"
import Chip from "@/components/TempDesignSystem/Chip" import Chip from "@/components/TempDesignSystem/Chip"
import Grids from "@/components/TempDesignSystem/Grids" import Grids from "@/components/TempDesignSystem/Grids"
import BiroScript from "@/components/TempDesignSystem/Text/BiroScript" import BiroScript from "@/components/TempDesignSystem/Text/BiroScript"

13
components/MyPages/Blocks/Overview/Friend/friend.module.css
View File

@@ -9,11 +9,13 @@
.header { .header {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: var(--Spacing-x1);
} }
.levelLabel { .levelLabel {
position: relative; position: relative;
transform: rotate(-13deg) translate(0px, -15px); transform: rotate(-13deg) translate(0px, -15px);
margin-left: -35px;
} }
.name { .name {
@@ -39,17 +41,6 @@
padding: var(--Spacing-x1) var(--Spacing-x2); padding: var(--Spacing-x1) var(--Spacing-x2);
} }
.membershipId {
color: var(--Scandic-Brand-Pale-Peach);
/* TODO: Not yet exported by the design team, change to variable l8r */
font-family: var(--ff-fira-mono, "fira mono");
font-size: 14px;
font-weight: 400;
letter-spacing: 0.168px;
line-height: 140%;
margin: 0;
}
@media screen and (min-width: 768px) { @media screen and (min-width: 768px) {
.membershipContainer { .membershipContainer {
grid-template-columns: auto auto; grid-template-columns: auto auto;

9
components/MyPages/Blocks/Overview/Friend/index.tsx
View File

@@ -1,6 +1,7 @@
import { membershipLevels } from "@/constants/membershipLevels" import { membershipLevels } from "@/constants/membershipLevels"
import BiroScript from "@/components/TempDesignSystem/Text/BiroScript" import BiroScript from "@/components/TempDesignSystem/Text/BiroScript"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Title from "@/components/TempDesignSystem/Text/Title" import Title from "@/components/TempDesignSystem/Text/Title"
import { getIntl } from "@/i18n" import { getIntl } from "@/i18n"
import { getMembership } from "@/utils/user" import { getMembership } from "@/utils/user"
@@ -35,12 +36,10 @@ export default async function Friend({ user }: UserProps) {
{user.name} {user.name}
</Title> </Title>
<div className={styles.membershipContainer}> <div className={styles.membershipContainer}>
<p className={styles.membershipId}> <Caption color="pale">
{formatMessage({ id: "Membership ID" })}: {formatMessage({ id: "Membership ID" })}:{" "}
</p>
<p className={styles.membershipId}>
{membership ? membership.membershipNumber : "N/A"} {membership ? membership.membershipNumber : "N/A"}
</p> </Caption>
</div> </div>
</div> </div>
</section> </section>

11
components/MyPages/Blocks/Overview/Stats/NextLevel/index.tsx
View File

@@ -33,8 +33,15 @@ export default async function NextLevel({
} }
return ( return (
<section> <section>
<Body color="pale">{formatMessage({ id: "Next level" })}:</Body> <Body color="pale" textAlign="center">
<Title className={styles.nextLevel} color="pale" level="h3"> {formatMessage({ id: "Next level" })}:
</Body>
<Title
className={styles.nextLevel}
color="pale"
level="h3"
textAlign="center"
>
{nextLevel?.name || "N/A"} {nextLevel?.name || "N/A"}
<BiroScript>{formatMessage({ id: "Coming up" })}!</BiroScript> <BiroScript>{formatMessage({ id: "Coming up" })}!</BiroScript>
</Title> </Title>

2
components/MyPages/Blocks/Overview/Stats/NextLevel/nextLevel.module.css
View File

@@ -8,6 +8,6 @@
.nextLevel { .nextLevel {
gap: var(--Spacing-x1); gap: var(--Spacing-x1);
grid-template-columns: auto auto; grid-template-columns: auto auto;
justify-content: flex-start; justify-content: center;
} }
} }

10
components/MyPages/Blocks/Overview/Stats/Points/index.tsx
View File

@@ -13,17 +13,19 @@ export default async function Points({ user }: UserProps) {
return ( return (
<section className={styles.points}> <section className={styles.points}>
<article> <article>
<Body color="pale">{formatMessage({ id: "Total Points" })}</Body> <Body color="pale" textAlign="center">
<Title color="pale" level="h2"> {formatMessage({ id: "Total Points" })}
</Body>
<Title color="pale" level="h2" textAlign="center">
{membership ? membership.currentPoints : "N/A"} {membership ? membership.currentPoints : "N/A"}
</Title> </Title>
</article> </article>
<article> <article>
<Body color="pale"> <Body color="pale" textAlign="center">
{formatMessage({ id: "Points until next level" })} {formatMessage({ id: "Points until next level" })}
{/* TODO */} {/* TODO */}
</Body> </Body>
<Title color="pale" level="h2"> <Title color="pale" level="h2" textAlign="center">
{membership ? membership.currentPoints : "N/A"} {membership ? membership.currentPoints : "N/A"}
</Title> </Title>
</article> </article>

2
components/MyPages/Blocks/Overview/Stats/index.tsx
View File

@@ -12,7 +12,7 @@ export default function Stats({ user, lang }: UserProps & LangParams) {
return ( return (
<section className={styles.stats}> <section className={styles.stats}>
<Points user={user} /> <Points user={user} />
<Divider variant="default" /> <Divider variant="default" color="peach" />
<NextLevel user={user} lang={lang} /> <NextLevel user={user} lang={lang} />
</section> </section>
) )

2
components/MyPages/Blocks/Overview/index.tsx
View File

@@ -27,7 +27,7 @@ export default async function Overview({
<Header link={link} subtitle={subtitle} title={title} topTitle /> <Header link={link} subtitle={subtitle} title={title} topTitle />
<section className={styles.overview}> <section className={styles.overview}>
<Friend user={user} /> <Friend user={user} />
<Divider className={styles.divider} /> <Divider className={styles.divider} color="peach" />
<Stats user={user} lang={lang} /> <Stats user={user} lang={lang} />
</section> </section>
</SectionContainer> </SectionContainer>

4
components/MyPages/Blocks/Stays/StayCard/stay.module.css
View File

@@ -1,7 +1,7 @@
.stay { .stay {
background-color: var(--Main-Grey-White); background-color: var(--Main-Grey-White);
border: 1px solid var(--Scandic-Brand-Burgundy); border: 1px solid var(--Base-Border-Subtle);
border-radius: var(--Corner-radius-Small); border-radius: var(--Corner-radius-Medium);
display: grid; display: grid;
overflow: hidden; overflow: hidden;
} }

5
components/MyPages/Blocks/Stays/Upcoming/Client.tsx
View File

@@ -8,7 +8,6 @@ import Grids from "@/components/TempDesignSystem/Grids"
import ListContainer from "../ListContainer" import ListContainer from "../ListContainer"
import ShowMoreButton from "../ShowMoreButton" import ShowMoreButton from "../ShowMoreButton"
import StayCard from "../StayCard" import StayCard from "../StayCard"
import EmptyUpcomingStaysBlock from "./EmptyUpcomingStays"
import type { import type {
UpcomingStaysClientProps, UpcomingStaysClientProps,
@@ -61,7 +60,5 @@ export default function ClientUpcomingStays({
<ShowMoreButton disabled={isFetching} loadMoreData={loadMoreData} /> <ShowMoreButton disabled={isFetching} loadMoreData={loadMoreData} />
) : null} ) : null}
</ListContainer> </ListContainer>
) : ( ) : null
<EmptyUpcomingStaysBlock />
)
} }

14
components/MyPages/Blocks/Stays/Upcoming/EmptyUpcomingStays/index.tsx
View File

@@ -1,13 +1,17 @@
import { useIntl } from "react-intl" import { homeHrefs } from "@/constants/homeHrefs"
import { env } from "@/env/server"
import Button from "@/components/TempDesignSystem/Button" import Button from "@/components/TempDesignSystem/Button"
import Link from "@/components/TempDesignSystem/Link" import Link from "@/components/TempDesignSystem/Link"
import Title from "@/components/TempDesignSystem/Text/Title" import Title from "@/components/TempDesignSystem/Text/Title"
import { getIntl } from "@/i18n"
import styles from "./emptyUpcomingStays.module.css" import styles from "./emptyUpcomingStays.module.css"
export default function EmptyUpcomingStaysBlock() { import { LangParams } from "@/types/params"
const { formatMessage } = useIntl()
export default async function EmptyUpcomingStaysBlock({ lang }: LangParams) {
const { formatMessage } = await getIntl()
return ( return (
<section className={styles.container}> <section className={styles.container}>
<Title as="h5" level="h3"> <Title as="h5" level="h3">
@@ -18,7 +22,9 @@ export default function EmptyUpcomingStaysBlock() {
</span> </span>
</Title> </Title>
<Button asChild intent="primary" type="button"> <Button asChild intent="primary" type="button">
<Link href="#">{formatMessage({ id: "Get inspired" })}</Link> <Link href={homeHrefs[env.NODE_ENV][lang]}>
{formatMessage({ id: "Get inspired" })}
</Link>
</Button> </Button>
</section> </section>
) )

13
components/MyPages/Blocks/Stays/Upcoming/index.tsx
View File

@@ -4,6 +4,7 @@ import SectionContainer from "@/components/Section/Container"
import SectionHeader from "@/components/Section/Header" import SectionHeader from "@/components/Section/Header"
import ClientUpcomingStays from "./Client" import ClientUpcomingStays from "./Client"
import EmptyUpcomingStaysBlock from "./EmptyUpcomingStays"
import type { AccountPageComponentProps } from "@/types/components/myPages/myPage/accountPage" import type { AccountPageComponentProps } from "@/types/components/myPages/myPage/accountPage"
@@ -20,10 +21,14 @@ export default async function UpcomingStays({
return ( return (
<SectionContainer> <SectionContainer>
<SectionHeader title={title} subtitle={subtitle} link={link} /> <SectionHeader title={title} subtitle={subtitle} link={link} />
<ClientUpcomingStays {initialUpcomingStays.data.length ? (
initialUpcomingStays={initialUpcomingStays} <ClientUpcomingStays
lang={lang} initialUpcomingStays={initialUpcomingStays}
/> lang={lang}
/>
) : (
<EmptyUpcomingStaysBlock lang={lang} />
)}
</SectionContainer> </SectionContainer>
) )
} }