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

Merged in chore/fix-partner-sas-todos (pull request #2823)

Browse Source 
chore: Fix partner-sas todos

* Add onError to TrpcProvider

* Add AdobeSDKScript

* Add GTMScript

* Add adobeDataLayer script

* Add ReactQueryDevtools

* Move components to correct folder


Approved-by: Joakim Jäderberg
This commit is contained in:
Anton Gunnarsson
2025-09-18 07:28:14 +00:00
parent b0f3e4afbd
commit 65e4623b52
13 changed files with 110 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
apps/partner-sas/app/[lang]/layout.tsx
View File

@@ -4,6 +4,7 @@ import "@scandic-hotels/design-system/normalize.css"
import "@scandic-hotels/design-system/design-system-new-deprecated.css"
import "../../globals.css"
import { ReactQueryDevtools } from "@tanstack/react-query-devtools"
import Script from "next/script"
import { BookingFlowContextProvider } from "@scandic-hotels/booking-flow/BookingFlowContextProvider"
@@ -11,18 +12,20 @@ import { BookingFlowTrackingProvider } from "@scandic-hotels/booking-flow/Bookin
import { NuqsAdapter } from "@scandic-hotels/booking-flow/utils/nuqs"
import { Lang } from "@scandic-hotels/common/constants/language"
import { ToastHandler } from "@scandic-hotels/design-system/ToastHandler"
import { TrpcProvider } from "@scandic-hotels/trpc/Provider"
import AdobeSDKScript from "@/components/AdobeSDKScript"
import CookieBotConsent from "@/components/CookieBotConsent"
import GTMScript from "@/components/GTMScript"
import { RACRouterProvider } from "@/components/RACRouterProvider"
import { SiteWideAlert } from "@/components/SitewideAlert"
import TrpcProvider from "@/components/TrpcProvider"
import { FontPreload } from "@/fonts/font-preloading"
import { getMessages } from "@/i18n"
import ClientIntlProvider from "@/i18n/Provider"
import { setLang } from "@/i18n/serverContext"
import { Footer } from "../components/Footer/Footer"
import { Header } from "../components/Header/Header"
import { Footer } from "../../components/Footer/Footer"
import { Header } from "../../components/Header/Header"
import {
trackAccordionItemOpen,
trackBedSelection,
@@ -65,8 +68,14 @@ export default async function RootLayout(props: RootLayoutProps) {
return (
<html lang="en">
<head>
{/* TODO */}
<FontPreload />
<AdobeSDKScript />
<GTMScript />
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
<Script id="ensure-adobeDataLayer">{`
window.adobeDataLayer = window.adobeDataLayer || []
window.dataLayer = window.dataLayer || []
`}</Script>
</head>
<body className="scandic">
<div className="root">
@@ -76,7 +85,6 @@ export default async function RootLayout(props: RootLayoutProps) {
messages={messages}
>
<NuqsAdapter>
{/* TODO handle onError */}
<TrpcProvider>
<RACRouterProvider>
<BookingFlowContextProvider
@@ -106,6 +114,7 @@ export default async function RootLayout(props: RootLayoutProps) {
<Footer />
<ToastHandler />
<CookieBotConsent />
<ReactQueryDevtools initialIsOpen={false} />
</BookingFlowTrackingProvider>
</BookingFlowContextProvider>
</RACRouterProvider>

67
apps/partner-sas/app/components/Footer/Footer.tsx
View File

@@ -1,67 +0,0 @@
/* eslint-disable formatjs/no-literal-string-in-jsx */
import Link from "next/link"
import Image from "@scandic-hotels/design-system/Image"
import { Typography } from "@scandic-hotels/design-system/Typography"
import { PoweredByScandic } from "../PoweredByScandic/PoweredByScandic"
import styles from "./footer.module.css"
export function Footer() {
return (
<div className={styles.root}>
<div className={styles.top}>
<div>
<Image
alt="SAS logotype"
className={styles.sasLogo}
src="/_static/img/sas-logotype.svg"
height={32}
width={90}
sizes="100vw"
/>
<PoweredByScandic />
</div>
<div className={styles.links}>
<Typography variant="Body/Paragraph/mdRegular">
<Link href="#" className={styles.link}>
Privacy policy
</Link>
</Typography>
<Typography variant="Body/Paragraph/mdRegular">
<Link href="#" className={styles.link}>
Terms of use
</Link>
</Typography>
<Typography variant="Body/Paragraph/mdRegular">
<Link href="#" className={styles.link}>
Your privacy choices
</Link>
</Typography>
<Typography variant="Body/Paragraph/mdRegular">
<Link href="#" className={styles.link}>
Cookie Policy
</Link>
</Typography>
<Typography variant="Body/Paragraph/mdRegular">
<Link href="#" className={styles.link}>
More links
</Link>
</Typography>
</div>
</div>
<div className={styles.bottom}>
<Typography variant="Body/Supporting text (caption)/smRegular">
<p>© 1999 Something something.</p>
</Typography>
<Typography variant="Body/Supporting text (caption)/smRegular">
<p>
[Place holder text], LP and SAS are not responsible for content on
external Web sites.
</p>
</Typography>
</div>
</div>
)
}

48
apps/partner-sas/app/components/Footer/footer.module.css
View File

@@ -1,48 +0,0 @@
.root {
background-color: var(--Base-Surface-Primary-light-Normal);
}
.sasLogo {
height: auto;
width: 90px;
}
.top {
padding: 40px 16px 32px;
display: flex;
flex-direction: column;
gap: 24px;
@media screen and (min-width: 768px) {
padding: 40px;
}
}
.bottom {
background-color: var(--TEMP-sas-default);
color: white;
padding: 32px 16px 40px;
@media screen and (min-width: 768px) {
padding: 32px 40px 40px;
}
}
.links {
display: flex;
flex-direction: column;
gap: 8px;
@media screen and (min-width: 768px) {
flex-direction: row;
}
}
.link {
text-decoration: none;
color: var(--TEMP-sas-40);
&:hover {
text-decoration: underline;
}
}

25
apps/partner-sas/app/components/Header/Header.tsx
View File

@@ -1,25 +0,0 @@
import Image from "@scandic-hotels/design-system/Image"
import { PoweredByScandic } from "../PoweredByScandic/PoweredByScandic"
import styles from "./header.module.css"
export function Header() {
return (
<>
<header className={styles.header}>
<Image
alt="SAS logotype"
className={styles.logo}
src="/_static/img/sas-logotype-white.svg"
height={32}
width={90}
sizes="100vw"
/>
</header>
<div className={styles.poweredBy}>
<PoweredByScandic />
</div>
</>
)
}

25
apps/partner-sas/app/components/Header/header.module.css
View File

@@ -1,25 +0,0 @@
.header {
background-color: var(--TEMP-sas-default);
color: white;
display: flex;
align-items: center;
padding: 16px;
@media screen and (min-width: 768px) {
padding: 20px 40px;
}
}
.logo {
height: auto;
width: 90px;
}
.poweredBy {
padding: 6px 16px;
background-color: var(--Base-Surface-Primary-light-Normal);
@media screen and (min-width: 768px) {
padding: 8px 40px;
}
}

25
apps/partner-sas/app/components/PoweredByScandic/PoweredByScandic.tsx
View File

@@ -1,25 +0,0 @@
import Image from "@scandic-hotels/design-system/Image"
import { Typography } from "@scandic-hotels/design-system/Typography"
import styles from "./poweredByScandic.module.css"
export function PoweredByScandic() {
return (
<div className={styles.root}>
<Typography variant="Body/Supporting text (caption)/smRegular">
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
<p>Powered by</p>
</Typography>
<div>
<Image
alt="Scandic"
className={styles.logo}
src="/_static/img/scandic-logotype.svg"
height={14}
width={65}
sizes="100vw"
/>
</div>
</div>
)
}

13
apps/partner-sas/app/components/PoweredByScandic/poweredByScandic.module.css
View File

@@ -1,13 +0,0 @@
.root {
display: flex;
align-items: center;
gap: 8px;
color: var(--TEMP-sas-20);
}
.logo {
max-height: 14px;
max-width: 65px;
height: auto;
width: 100%;
}