Feat/BOOK-63 hotel subpages branding

* feat(BOOK-63): Replaced css variables and components to apply hotel branding on subpages
* feat(BOOK-63): Replaced css variables and components to apply hotel branding on hotel page map view

Approved-by: Christel Westerberg
Approved-by: Matilda Landström

packages/common/utils/theme/index.ts

@@ -0,0 +1,46 @@
+import { SignatureHotelEnum } from "@scandic-hotels/common/constants/signatureHotels"
+import { HotelTypeEnum } from "@scandic-hotels/trpc/enums/hotelType"
+
+export enum Theme {
+  scandic = "scandic",
+  downtownCamper = "downtown-camper",
+  haymarket = "haymarket",
+  scandicGo = "scandic-go",
+  grandHotel = "grand-hotel",
+  hotelNorge = "hotel-norge",
+  marski = "marski",
+  theDock = "the-dock",
+}
+
+export const DEFAULT_THEME = Theme.scandic
+export const THEMES = Object.values(Theme)
+
+function getSignatureHotelTheme(hotelId: string) {
+  switch (hotelId) {
+    case SignatureHotelEnum.Haymarket:
+      return Theme.haymarket
+    case SignatureHotelEnum.HotelNorge:
+      return Theme.hotelNorge
+    case SignatureHotelEnum.DowntownCamper:
+      return Theme.downtownCamper
+    case SignatureHotelEnum.GrandHotelOslo:
+      return Theme.grandHotel
+    case SignatureHotelEnum.Marski:
+      return Theme.marski
+    case SignatureHotelEnum.TheDock:
+      return Theme.theDock
+    default:
+      return DEFAULT_THEME
+  }
+}
+
+export function getThemeByHotel(hotelId: string, hotelType: string) {
+  if (hotelType === HotelTypeEnum.ScandicGo) {
+    return Theme.scandicGo
+  }
+  if (hotelType === HotelTypeEnum.Signature) {
+    return getSignatureHotelTheme(hotelId)
+  }
+
+  return DEFAULT_THEME
+}

packages/common/utils/theme/serverContext.ts

@@ -0,0 +1,31 @@
+import "server-only"
+
+import { cache } from "react"
+
+import { DEFAULT_THEME, type Theme } from "."
+
+const getRef = cache(() => ({ current: DEFAULT_THEME as Theme }))
+
+/**
+ * Set the global theme
+ *
+ * It works kind of like React's context,
+ * but on the server side, per request.
+ *
+ * @param newTheme
+ */
+export function setTheme(newTheme: Theme) {
+  getRef().current = newTheme
+
+  return newTheme
+}
+
+/**
+ * Get the global theme
+ *
+ * Note: This must be called after setTheme() has been called in the page/layout.
+ * If called before setTheme(), it will return DEFAULT_THEME.
+ */
+export function getTheme(): Theme {
+  return getRef().current ?? DEFAULT_THEME
+}