feat(sw-343) added buttons to open map in mobile

2024-10-30 10:37:43 +01:00
parent 6debd2d898
commit 0aed1d9d57
12 changed files with 148 additions and 17 deletions
@@ -0,0 +1,48 @@
+"use client"
+
+import { useIntl } from "react-intl"
+
+import { selectHotelMap } from "@/constants/routes/hotelReservation"
+
+import { FilterIcon, MapIcon } from "@/components/Icons"
+import Button from "@/components/TempDesignSystem/Button"
+import Link from "@/components/TempDesignSystem/Link"
+import useLang from "@/hooks/useLang"
+
+import styles from "./mobileButtonContainer.module.css"
+
+export default function MobileButtonContainer({ city }: { city: string }) {
+  const intl = useIntl()
+  const lang = useLang()
+
+  return (
+    <div className={styles.buttonContainer}>
+      <Button
+        asChild
+        variant="icon"
+        intent="secondary"
+        size="small"
+        className={styles.button}
+      >
+        <Link
+          href={`${selectHotelMap[lang]}/${city}`}
+          keepSearchParams
+          color="burgundy"
+        >
+          <MapIcon color="burgundy" />
+          {intl.formatMessage({ id: "See on map" })}
+        </Link>
+      </Button>
+      {/* TODO: Add filter toggle */}
+      <Button
+        variant="icon"
+        intent="secondary"
+        size="small"
+        className={styles.button}
+      >
+        <FilterIcon color="burgundy" />
+        {intl.formatMessage({ id: "Filter and sort" })}
+      </Button>
+    </div>
+  )
+}