Merged in feat/SW-3461-setup-auth-with-sas-eurobonus (pull request #2825)

Feat/SW-3461 setup auth with sas eurobonus

* feat(SW-3461): Setup auth for sas eurobonus

* .

* feat: setup auth towards SAS

* Fix auth via SAS and add logout route

* .

* merge

* auth via SAS

* fix powered by scandic logo

* Merge branch 'master' of bitbucket.org:scandic-swap/web into feat/SW-3461-setup-auth-with-sas-eurobonus

* Include access_token in jwt after successful login

* merge


Approved-by: Anton Gunnarsson

apps/partner-sas/components/Header/Header.tsx

@@ -1,10 +1,22 @@
+"use client"
+
+import { useSession } from "next-auth/react"
+
 import Image from "@scandic-hotels/design-system/Image"
+import Link from "@scandic-hotels/design-system/Link"
+import SkeletonShimmer from "@scandic-hotels/design-system/SkeletonShimmer"
+import { Typography } from "@scandic-hotels/design-system/Typography"
+
+import useLang from "@/hooks/useLang"
 
 import { PoweredByScandic } from "../PoweredByScandic/PoweredByScandic"
 
 import styles from "./header.module.css"
 
 export function Header() {
+  const lang = useLang()
+  const session = useSession()
+
   return (
     <>
       <header className={styles.header}>
@@ -16,6 +28,29 @@ export function Header() {
           width={90}
           sizes="100vw"
         />
+        {session.status === "loading" && (
+          <SkeletonShimmer width={"12ch"} height={"1ch"} />
+        )}
+        {session.status === "unauthenticated" && (
+          /** For some reason it complains about RSC-payload if using <Link /> */
+          <a href={`/${lang}/login?redirectTo=${window?.location.href}`}>
+            {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
+            {"Login here"}
+          </a>
+        )}
+        {session.status === "authenticated" && (
+          <div>
+            <Typography variant="Body/Supporting text (caption)/smBold">
+              <span>
+                {session.data?.user && <>{session.data.user.email}</>}
+              </span>
+            </Typography>
+            <Link color={"white"} href={`/${lang}/logout`} prefetch={false}>
+              {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
+              {"Logout"}
+            </Link>
+          </div>
+        )}
       </header>
       <div className={styles.poweredBy}>
         <PoweredByScandic />

apps/partner-sas/components/Header/header.module.css

@@ -4,6 +4,7 @@
   display: flex;
   align-items: center;
   padding: 16px;
+  justify-content: space-between;
 
   @media screen and (min-width: 768px) {
     padding: 20px 40px;