Merged in feat/SW-2041-map-zoom-buttons (pull request #2550)

Feat(SW-661): Hotel page map zoom restrictions

* fix(SW-2041): update tokens

* chore(SW-2041): restrict zooming

* fix(SW-2041): remove ref

* fix(SW-2041): create map zoom hook


Approved-by: Erik Tiekstra
Approved-by: Hrishikesh Vaipurkar

apps/scandic-web/hooks/maps/useZoomControls.ts

@@ -0,0 +1,43 @@
+import { useMap } from "@vis.gl/react-google-maps"
+import { useEffect, useState } from "react"
+
+import { DEFAULT_ZOOM, MAX_ZOOM, MIN_ZOOM } from "@/constants/map"
+
+export function useZoomControls() {
+  const map = useMap()
+  const [zoomLevel, setZoomLevel] = useState(DEFAULT_ZOOM)
+
+  const zoomIn = () => {
+    if (map && zoomLevel < MAX_ZOOM) {
+      map.setZoom(zoomLevel + 1)
+    }
+  }
+
+  const zoomOut = () => {
+    if (map && zoomLevel > MIN_ZOOM) {
+      map.setZoom(zoomLevel - 1)
+    }
+  }
+
+  useEffect(() => {
+    if (!map) return
+
+    const handleZoomChanged = () => {
+      const currentZoom = map.getZoom()
+      if (currentZoom != null) {
+        setZoomLevel(currentZoom)
+      }
+    }
+
+    const listener = map.addListener("zoom_changed", handleZoomChanged)
+    return () => listener.remove()
+  }, [map])
+
+  return {
+    zoomLevel,
+    zoomIn,
+    zoomOut,
+    isMinZoom: zoomLevel <= MIN_ZOOM,
+    isMaxZoom: zoomLevel >= MAX_ZOOM,
+  }
+}