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

Merged in chore(LOY-531)-cleanup-old-stays (pull request #3498)

Browse Source 
chore(LOY-531): cleanup old stays

* chore(LOY-531): cleanup old stays


Approved-by: Emma Zettervall
Approved-by: Anton Gunnarsson
This commit is contained in:
Matilda Landström
2026-01-28 07:45:05 +00:00
parent 5fc93472f4
commit 22b0f71c16
12 changed files with 16 additions and 351 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
apps/scandic-web/.env.local.example
View File

@@ -52,4 +52,3 @@ DTMC_ENTRA_ID_CLIENT=""
DTMC_ENTRA_ID_ISSUER=""
DTMC_ENTRA_ID_SECRET=""
NEW_STAYS_ON_MY_PAGES="true"

3
apps/scandic-web/components/Blocks/DynamicContent/Stays/NextStay/index.tsx
View File

@@ -1,4 +1,3 @@
import { env } from "@/env/server"
import { serverClient } from "@/lib/trpc/server"
import { Section } from "@/components/Section"
@@ -17,7 +16,7 @@ export default async function NextStay({ title, link }: NextStayProps) {
const nextStay = await caller.user.stays.next()
if (!nextStay) {
return env.NEW_STAYS_ON_MY_PAGES ? <EmptyUpcomingStays /> : null
return <EmptyUpcomingStays />
}
return (

76
apps/scandic-web/components/Blocks/DynamicContent/Stays/OldStayCard/index.tsx
View File

@@ -1,76 +0,0 @@
"use client"
import { dt } from "@scandic-hotels/common/dt"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Image from "@scandic-hotels/design-system/Image"
import Link from "@scandic-hotels/design-system/OldDSLink"
import { Typography } from "@scandic-hotels/design-system/Typography"
import useLang from "@/hooks/useLang"
import styles from "./stay.module.css"
import type { StayCardProps } from "@/types/components/myPages/stays/stayCard"
export default function OldStayCard({ stay }: StayCardProps) {
const { bookingUrl, isWebAppOrigin } = stay.attributes
const shouldLinkToMyStay = isWebAppOrigin
if (!shouldLinkToMyStay) {
return <CardContent stay={stay} />
}
return (
<Link href={bookingUrl} className={styles.link}>
<CardContent stay={stay} />
</Link>
)
}
function CardContent({ stay }: StayCardProps) {
const lang = useLang()
const { checkinDate, checkoutDate, hotelInformation } = stay.attributes
const arrival = dt(checkinDate).locale(lang)
const arrivalDate = arrival.format("DD MMM")
const arrivalDateTime = arrival.format("YYYY-MM-DD")
const depart = dt(checkoutDate).locale(lang)
const departDate = depart.format("DD MMM YYYY")
const departDateTime = depart.format("YYYY-MM-DD")
return (
<article className={styles.stay}>
<Image
className={styles.image}
alt={
hotelInformation.hotelContent.images.altText ||
hotelInformation.hotelContent.images.altText_En
}
src={hotelInformation.hotelContent.images.src}
width={420}
height={240}
/>
<footer className={styles.footer}>
<Typography variant="Title/xs" className={styles.hotel}>
<h3>{hotelInformation.hotelName}</h3>
</Typography>
<div className={styles.date}>
<MaterialIcon
icon="calendar_month"
color="Icon/Interactive/Default"
/>
<Typography variant="Body/Supporting text (caption)/smRegular">
<p>
<time dateTime={arrivalDateTime}>{arrivalDate}</time>
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
{" - "}
<time dateTime={departDateTime}>{departDate}</time>
</p>
</Typography>
</div>
</footer>
</article>
)
}

44
apps/scandic-web/components/Blocks/DynamicContent/Stays/OldStayCard/stay.module.css
View File

@@ -1,44 +0,0 @@
.link {
outline: 1px solid var(--Base-Border-Subtle);
border-radius: var(--Corner-Radius-md);
overflow: hidden;
&:focus,
&:hover {
outline-offset: 0;
outline: 1.5px solid var(--Base-Border-Hover);
}
}
.stay {
background-color: var(--Main-Grey-White);
}
.image {
min-height: 220px;
object-fit: cover;
overflow: hidden;
width: 100%;
}
.footer {
color: var(--Scandic-Brand-Burgundy);
display: grid;
gap: var(--Space-x2);
margin-top: auto;
overflow: hidden;
padding: var(--Space-x2);
width: 100%;
}
.hotel {
overflow: hidden;
text-overflow: ellipsis;
text-wrap: nowrap;
}
.date {
align-items: center;
display: flex;
gap: var(--Space-x05);
}

65
apps/scandic-web/components/Blocks/DynamicContent/Stays/Previous/OldClient.tsx
View File

@@ -1,65 +0,0 @@
"use client"
import { LoadingSpinner } from "@scandic-hotels/design-system/LoadingSpinner"
import { ShowMoreButton } from "@scandic-hotels/design-system/ShowMoreButton"
import { trpc } from "@scandic-hotels/trpc/client"
import Grids from "@/components/TempDesignSystem/Grids"
import useLang from "@/hooks/useLang"
import ListContainer from "../ListContainer"
import OldStayCard from "../OldStayCard"
import type {
PreviousStaysClientProps,
PreviousStaysNonNullResponseObject,
} from "@/types/components/myPages/stays/previous"
export function ClientPreviousStays({
initialPreviousStays,
}: PreviousStaysClientProps) {
const lang = useLang()
const { data, isFetching, fetchNextPage, hasNextPage, isLoading } =
trpc.user.stays.previous.useInfiniteQuery(
{
limit: 6,
lang,
},
{
getNextPageParam: (lastPage) => {
return lastPage?.nextCursor
},
initialData: {
pageParams: [undefined, 1],
pages: [initialPreviousStays],
},
}
)
if (isLoading) {
return <LoadingSpinner />
}
function loadMoreData() {
if (hasNextPage) {
fetchNextPage()
}
}
const stays = data.pages
.filter((page): page is PreviousStaysNonNullResponseObject => !!page?.data)
.flatMap((page) => page.data)
return (
<ListContainer>
<Grids.Stackable>
{stays.map((stay) => (
<OldStayCard key={stay.attributes.confirmationNumber} stay={stay} />
))}
</Grids.Stackable>
{hasNextPage ? (
<ShowMoreButton isPending={isFetching} loadMoreData={loadMoreData} />
) : null}
</ListContainer>
)
}

8
apps/scandic-web/components/Blocks/DynamicContent/Stays/Previous/index.tsx
View File

@@ -1,4 +1,3 @@
import { env } from "@/env/server"
import { serverClient } from "@/lib/trpc/server"
import ClaimPoints from "@/components/Blocks/DynamicContent/Points/ClaimPoints"
@@ -9,7 +8,6 @@ import SectionLink from "@/components/Section/Link"
import { Cards } from "./Cards"
import { INITIAL_STAYS_FETCH_LIMIT } from "./data"
import { L6Progress } from "./L6Progress"
import { ClientPreviousStays } from "./OldClient"
import styles from "./previous.module.css"
@@ -28,16 +26,14 @@ export default async function PreviousStays({
return null
}
const StaysComponent = env.NEW_STAYS_ON_MY_PAGES ? Cards : ClientPreviousStays
return (
<Section>
<div className={styles.header}>
<SectionHeader heading={title ?? undefined} link={link} />
<ClaimPoints />
</div>
{env.NEW_STAYS_ON_MY_PAGES ? <L6Progress /> : null}
<StaysComponent initialPreviousStays={initialPreviousStays} />
<L6Progress />
<Cards initialPreviousStays={initialPreviousStays} />
<SectionLink link={link} variant="mobile" />
</Section>
)

38
apps/scandic-web/components/Blocks/DynamicContent/Stays/Upcoming/EmptyUpcomingStays/index.tsx
View File

@@ -1,10 +1,6 @@
import ButtonLink from "@scandic-hotels/design-system/ButtonLink"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Link from "@scandic-hotels/design-system/OldDSLink"
import { Typography } from "@scandic-hotels/design-system/Typography"
import { env } from "@/env/server"
import { getIntl } from "@/i18n"
import { getLang } from "@/i18n/serverContext"
@@ -16,40 +12,6 @@ export default async function EmptyUpcomingStays() {
const href = `/${lang}`
if (!env.NEW_STAYS_ON_MY_PAGES) {
return (
<section className={styles.container}>
<div className={styles.titleContainer}>
<Typography variant="Title/sm" className={styles.title}>
<h3>
{intl.formatMessage({
id: "stays.noUpcomingStays",
defaultMessage: "You have no upcoming stays.",
})}
<span className={styles.burgundyTitle}>
{intl.formatMessage({
id: "stays.whereToGoNext",
defaultMessage: "Where should you go next?",
})}
</span>
</h3>
</Typography>
</div>
<Link
href={href}
className={styles.link}
color="Text/Interactive/Secondary"
>
{intl.formatMessage({
id: "stays.getInspired",
defaultMessage: "Get inspired",
})}
<MaterialIcon icon="arrow_forward" color="CurrentColor" />
</Link>
</section>
)
}
return (
<section className={styles.emptyUpcomingStaysContainer}>
<Typography variant="Title/Subtitle/md">

65
apps/scandic-web/components/Blocks/DynamicContent/Stays/Upcoming/OldClient.tsx
View File

@@ -1,65 +0,0 @@
"use client"
import { LoadingSpinner } from "@scandic-hotels/design-system/LoadingSpinner"
import { ShowMoreButton } from "@scandic-hotels/design-system/ShowMoreButton"
import { trpc } from "@scandic-hotels/trpc/client"
import Grids from "@/components/TempDesignSystem/Grids"
import useLang from "@/hooks/useLang"
import ListContainer from "../ListContainer"
import OldStayCard from "../OldStayCard"
import type {
UpcomingStaysClientProps,
UpcomingStaysNonNullResponseObject,
} from "@/types/components/myPages/stays/upcoming"
export default function ClientUpcomingStays({
initialUpcomingStays,
}: UpcomingStaysClientProps) {
const lang = useLang()
const { data, isFetching, fetchNextPage, hasNextPage, isLoading } =
trpc.user.stays.upcoming.useInfiniteQuery(
{
limit: 6,
lang,
},
{
getNextPageParam: (lastPage) => {
return lastPage?.nextCursor
},
initialData: {
pageParams: [undefined, 1],
pages: [initialUpcomingStays],
},
}
)
if (isLoading) {
return <LoadingSpinner />
}
function loadMoreData() {
if (hasNextPage) {
fetchNextPage()
}
}
const stays = data.pages
.filter((page): page is UpcomingStaysNonNullResponseObject => !!page?.data)
.flatMap((page) => page.data)
return stays.length ? (
<ListContainer>
<Grids.Stackable>
{stays.map((stay) => (
<OldStayCard key={stay.attributes.confirmationNumber} stay={stay} />
))}
</Grids.Stackable>
{hasNextPage ? (
<ShowMoreButton isPending={isFetching} loadMoreData={loadMoreData} />
) : null}
</ListContainer>
) : null
}

21
apps/scandic-web/components/Blocks/DynamicContent/Stays/Upcoming/index.tsx
View File

@@ -1,4 +1,3 @@
import { env } from "@/env/server"
import { serverClient } from "@/lib/trpc/server"
import { Section } from "@/components/Section"
@@ -6,8 +5,6 @@ import { SectionHeader } from "@/components/Section/Header"
import SectionLink from "@/components/Section/Link"
import UpcomingStaysCarousel from "./Carousel"
import EmptyUpcomingStays from "./EmptyUpcomingStays"
import ClientUpcomingStays from "./OldClient"
import styles from "./upcoming.module.css"
@@ -25,26 +22,12 @@ export default async function UpcomingStays({
const hasStays =
initialUpcomingStays?.data && initialUpcomingStays.data.length > 0
if (env.NEW_STAYS_ON_MY_PAGES) {
if (!hasStays) return null
return (
<Section className={styles.container}>
{title && <SectionHeader heading={title} link={link} />}
<UpcomingStaysCarousel initialUpcomingStays={initialUpcomingStays} />
<SectionLink link={link} variant="mobile" />
</Section>
)
}
if (!hasStays) return null
return (
<Section className={styles.container}>
{title && <SectionHeader heading={title} link={link} />}
{hasStays ? (
<ClientUpcomingStays initialUpcomingStays={initialUpcomingStays} />
) : (
<EmptyUpcomingStays />
)}
<UpcomingStaysCarousel initialUpcomingStays={initialUpcomingStays} />
<SectionLink link={link} variant="mobile" />
</Section>
)

8
apps/scandic-web/env/server.ts vendored
View File

@@ -91,13 +91,6 @@ export const env = createEnv({
.string()
.optional()
.transform((s) => s?.split(",") || []),
NEW_STAYS_ON_MY_PAGES: z
.string()
// only allow "true" or "false"
.refine((s) => s === "true" || s === "false")
// transform to boolean
.transform((s) => s === "true")
.default("false"),
SEO_INERT: z
.string()
.refine((s) => s === "1" || s === "0")
@@ -166,7 +159,6 @@ export const env = createEnv({
DTMC_ENTRA_ID_ISSUER: process.env.DTMC_ENTRA_ID_ISSUER,
DTMC_ENTRA_ID_SECRET: process.env.DTMC_ENTRA_ID_SECRET,
CHATBOT_LIVE_LANGS: process.env.CHATBOT_LIVE_LANGS,
NEW_STAYS_ON_MY_PAGES: process.env.NEW_STAYS_ON_MY_PAGES,
SEO_INERT: process.env.SEO_INERT,
ENABLE_PROFILE_CONSENT: process.env.ENABLE_PROFILE_CONSENT,
RELEASE_TAG: process.env.NEXT_PUBLIC_RELEASE_TAG,