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

Merged in feat(SW-1973)-mystay-multiroom-cancellation-scenarios (pull request #1613)

Browse Source 
My stay access denied

* feat(SW-1973) updated no access view

* feat(SW-1973) small fixes

* feat(SW-1973) Update copy


Approved-by: Niclas Edenvin
This commit is contained in:
Pontus Dreij
2025-03-24 14:52:00 +00:00
parent 34bc877092
commit 710e412414
12 changed files with 90 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
apps/scandic-web/components/HotelReservation/MyStay/MultiRoom/index.tsx
View File

@@ -38,7 +38,7 @@ interface MultiRoomProps {
| null
bookingPromise?: Promise<BookingConfirmation | null>
index?: number
user?: User | null
user: User | null
}
export default function MultiRoom({
@@ -203,31 +203,24 @@ export default function MultiRoom({
<div
className={`${styles.multiRoomCard} ${isCancelled ? styles.cancelled : ""}`}
>
{packages &&
packages.some((item) =>
Object.values(RoomPackageCodeEnum).includes(
item.code as RoomPackageCodeEnum
)
) && (
<div className={styles.packages}>
{packages
.filter((item) =>
Object.values(RoomPackageCodeEnum).includes(
item.code as RoomPackageCodeEnum
)
{packages?.some((item) =>
Object.values(RoomPackageCodeEnum).includes(item.code)
) && (
<div className={styles.packages}>
{packages
.filter((item) =>
Object.values(RoomPackageCodeEnum).includes(item.code)
)
.map((item) => {
const Icon = getIconForFeatureCode(item.code)
return (
<span className={styles.package} key={item.code}>
<Icon width={16} height={16} color="burgundy" />
</span>
)
.map((item) => {
const Icon = getIconForFeatureCode(
item.code as RoomPackageCodeEnum
)
return (
<span className={styles.package} key={item.code}>
<Icon width={16} height={16} color="burgundy" />
</span>
)
})}
</div>
)}
})}
</div>
)}
<div className={styles.imageContainer}>
<Image
src={roomInfo?.images[0]?.imageSizes.small ?? ""}

20
apps/scandic-web/components/HotelReservation/MyStay/Receipt/index.tsx
View File

@@ -12,7 +12,6 @@ import {
import { decrypt } from "@/server/routers/utils/encryption"
import { ScandicLogoIcon } from "@/components/Icons"
import Body from "@/components/TempDesignSystem/Text/Body"
import { getIntl } from "@/i18n"
import AdditionalInfoForm from "../../FindMyBooking/AdditionalInfoForm"
@@ -136,11 +135,20 @@ export async function Receipt({ refId }: { refId: string }) {
return (
<main className={styles.main}>
<div className={styles.logIn}>
<Body textAlign="center">
{intl.formatMessage({
id: "In order to view your booking, please log in.",
})}
</Body>
<Typography variant="Title/md">
<h1>
{intl.formatMessage({
id: "You need to be logged in to view your booking",
})}
</h1>
</Typography>
<Typography variant="Body/Lead text">
<p>
{intl.formatMessage({
id: "And you need to be logged in with the same member account that made the booking.",
})}
</p>
</Typography>
</div>
</main>
)

7
apps/scandic-web/components/HotelReservation/MyStay/Receipt/receipt.module.css
View File

@@ -36,5 +36,10 @@
}
.logIn {
padding: var(--Spacing-x5) var(--Spacing-x2);
padding: var(--Spacing-x9) var(--Spacing-x2);
display: flex;
flex-direction: column;
gap: var(--Spacing-x2);
align-items: center;
color: var(--Scandic-Grey-100);
}

35
apps/scandic-web/components/HotelReservation/MyStay/SingleRoom/index.tsx
View File

@@ -153,25 +153,24 @@ export function SingleRoom({ bedType, image, hotel, user }: RoomProps) {
<div
className={`${styles.content} ${isCancelled ? styles.cancelled : ""}`}
>
{packages &&
packages.some((item) =>
Object.values(RoomPackageCodeEnum).includes(item.code)
) && (
<div className={styles.packages}>
{packages
.filter((item) =>
Object.values(RoomPackageCodeEnum).includes(item.code)
{packages?.some((item) =>
Object.values(RoomPackageCodeEnum).includes(item.code)
) && (
<div className={styles.packages}>
{packages
.filter((item) =>
Object.values(RoomPackageCodeEnum).includes(item.code)
)
.map((item) => {
const Icon = getIconForFeatureCode(item.code)
return (
<span className={styles.package} key={item.code}>
<Icon width={16} height={16} color="burgundy" />
</span>
)
.map((item) => {
const Icon = getIconForFeatureCode(item.code)
return (
<span className={styles.package} key={item.code}>
<Icon width={16} height={16} color="burgundy" />
</span>
)
})}
</div>
)}
})}
</div>
)}
<div className={styles.imageContainer}>
<Image
key={image.imageSizes.small}

23
apps/scandic-web/components/HotelReservation/MyStay/index.tsx
View File

@@ -1,6 +1,8 @@
import { cookies } from "next/headers"
import { notFound } from "next/navigation"
import { Typography } from "@scandic-hotels/design-system/Typography"
import { homeHrefs } from "@/constants/homeHrefs"
import { env } from "@/env/server"
import { dt } from "@/lib/dt"
@@ -13,7 +15,6 @@ import {
import { decrypt } from "@/server/routers/utils/encryption"
import Image from "@/components/Image"
import Body from "@/components/TempDesignSystem/Text/Body"
import { getIntl } from "@/i18n"
import { getLang } from "@/i18n/serverContext"
@@ -49,6 +50,7 @@ export async function MyStay({ refId }: { refId: string }) {
const intl = await getIntl()
const access = accessBooking(booking.guest, lastName, user, bv)
if (access === ACCESS_GRANTED) {
const lang = getLang()
const ancillaryPackages = await getAncillaryPackages({
@@ -135,11 +137,20 @@ export async function MyStay({ refId }: { refId: string }) {
return (
<main className={styles.main}>
<div className={styles.logIn}>
<Body textAlign="center">
{intl.formatMessage({
id: "In order to view your booking, please log in.",
})}
</Body>
<Typography variant="Title/md">
<h1>
{intl.formatMessage({
id: "You need to be logged in to view your booking",
})}
</h1>
</Typography>
<Typography variant="Body/Lead text">
<p>
{intl.formatMessage({
id: "And you need to be logged in with the same member account that made the booking.",
})}
</p>
</Typography>
</div>
</main>
)

7
apps/scandic-web/components/HotelReservation/MyStay/myStay.module.css
View File

@@ -91,7 +91,12 @@
}
.logIn {
padding: var(--Spacing-x5) var(--Spacing-x2);
padding: var(--Spacing-x9) var(--Spacing-x2);
display: flex;
flex-direction: column;
gap: var(--Spacing-x2);
align-items: center;
color: var(--Scandic-Grey-100);
}
@media (min-width: 768px) {