Merged in feat/LOY-261-Remove-Sidebar-From-MyPages (pull request #2380)

Feat/LOY-261 Remove Sidebar From MyPages

* feat(LOY-261): remove sidebar from my pages

* refactor(LOY-261): move SASLevelUpgradeCheck to my-pages layout and remove unused code

* chore(LOY-261): remove console logs

* fix(LOY-261): remove sidebar and center content in Loyalty Pages when logged in

* fix(LOY-261): better class naming for content width


Approved-by: Christian Andolf
Approved-by: Erik Tiekstra

apps/scandic-web/app/[lang]/(live)/(protected)/my-pages/@breadcrumbs/[...path]/page.tsx

@@ -8,7 +8,7 @@ import type { LangParams, PageArgs } from "@/types/params"
 export default function AllBreadcrumbs({}: PageArgs<LangParams>) {
   return (
     <Suspense fallback={<BreadcrumbsSkeleton />}>
-      <Breadcrumbs />
+      <Breadcrumbs size="contentWidth" />
     </Suspense>
   )
 }

apps/scandic-web/app/[lang]/(live)/(protected)/my-pages/layout.module.css

@@ -1,3 +1,7 @@
+.container {
+  background-color: var(--Background-Primary);
+}
+
 .layout {
   display: grid;
   font-family: var(--typography-Body-Regular-fontFamily);
@@ -8,19 +12,11 @@
   width: 100%;
 }
 
-.container {
-  background-color: var(--Background-Primary);
-}
-
 .content {
   display: grid;
   padding-bottom: var(--Spacing-x9);
   position: relative;
-}
-
-@media screen and (min-width: 1367px) {
-  .content {
-    gap: var(--Spacing-x5);
-    grid-template-columns: max(340px) 1fr;
-  }
+  max-width: var(--max-width-content);
+  margin: 0 auto;
+  width: 100%;
 }

apps/scandic-web/app/[lang]/(live)/(protected)/my-pages/layout.tsx

@@ -1,8 +1,8 @@
-import { Suspense } from "react"
+import { getProfileSafely } from "@/lib/trpc/memoizedRequests"
 
-import Sidebar from "@/components/MyPages/Sidebar"
-import SidebarNavigationSkeleton from "@/components/MyPages/Sidebar/SidebarNavigationSkeleton"
+import { SASLevelUpgradeCheck } from "@/components/MyPages/SASLevelUpgradeCheck"
 import Surprises from "@/components/MyPages/Surprises"
+import { getEurobonusMembership } from "@/utils/user"
 
 import styles from "./layout.module.css"
 
@@ -12,18 +12,19 @@ export default async function MyPagesLayout({
 }: React.PropsWithChildren<{
   breadcrumbs: React.ReactNode
 }>) {
+  const profile = await getProfileSafely()
+  const eurobonusMembership = profile?.loyalty
+    ? getEurobonusMembership(profile.loyalty)
+    : null
+
   return (
     <div className={styles.container}>
       <div className={styles.layout}>
         {breadcrumbs}
-        <div className={styles.content}>
-          <Suspense fallback={<SidebarNavigationSkeleton />}>
-            <Sidebar />
-          </Suspense>
-          {children}
-        </div>
+        <div className={styles.content}>{children}</div>
       </div>
 
+      {eurobonusMembership && <SASLevelUpgradeCheck />}
       <Surprises />
     </div>
   )