feat(SW-392): Added book a table link click

components/ContentType/HotelPage/SidePeeks/RestaurantBar/RestaurantBarItem/index.tsx

@@ -1,8 +1,6 @@
-import NextLink from "next/link"
-
+import ButtonLink from "@/components/ButtonLink"
 import { OpenInNewSmallIcon } from "@/components/Icons"
 import Image from "@/components/Image"
-import Button from "@/components/TempDesignSystem/Button"
 import Link from "@/components/TempDesignSystem/Link"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import { getIntl } from "@/i18n"
@@ -18,7 +16,7 @@ export default async function RestaurantBarItem({
 }: RestaurantBarItemProps) {
   const intl = await getIntl()
   const { name, openingDetails, menus } = restaurant
-  const { images, bookTableUrl } = restaurant.content
+  const { bookTableUrl, images } = restaurant.content
   const visibleImages = restaurant.content.images.slice(0, 2)
   const imageWidth = images.length === 2 ? 240 : 496
 
@@ -86,18 +84,22 @@ export default async function RestaurantBarItem({
       {bookTableUrl || ctaUrl ? (
         <div className={styles.ctaWrapper}>
           {bookTableUrl ? (
-            <Button fullWidth theme="base" intent="primary" asChild>
-              <NextLink href={bookTableUrl} target="_blank">
-                {intl.formatMessage({ id: "Book a table online" })}
-              </NextLink>
-            </Button>
+            <ButtonLink
+              fullWidth
+              theme="base"
+              intent="primary"
+              href={bookTableUrl}
+              target="_blank"
+              trackingId="book a table"
+              trackingParams={{ restaurantName: name }}
+            >
+              {intl.formatMessage({ id: "Book a table online" })}
+            </ButtonLink>
           ) : null}
           {ctaUrl ? (
-            <Button fullWidth theme="base" intent="secondary" asChild>
-              <NextLink href={ctaUrl}>
-                {`${intl.formatMessage({ id: "Discover" })} ${name}`}
-              </NextLink>
-            </Button>
+            <ButtonLink fullWidth theme="base" intent="secondary" href={ctaUrl}>
+              {`${intl.formatMessage({ id: "Discover" })} ${name}`}
+            </ButtonLink>
           ) : null}
         </div>
       ) : null}