diff --git a/components/Blocks/DynamicContent/Stays/StayCard/index.tsx b/components/Blocks/DynamicContent/Stays/StayCard/index.tsx
index 5ab6c0b5d..506df2e65 100644
--- a/components/Blocks/DynamicContent/Stays/StayCard/index.tsx
+++ b/components/Blocks/DynamicContent/Stays/StayCard/index.tsx
@@ -1,4 +1,6 @@
"use client"
+import { useEffect, useState } from "react"
+
import { dt } from "@/lib/dt"
import { CalendarIcon } from "@/components/Icons"
@@ -12,8 +14,27 @@ import styles from "./stay.module.css"
import type { StayCardProps } from "@/types/components/myPages/stays/stayCard"
+const useCheckIfExternal = (bookingUrl: string) => {
+ const [isExternal, setIsExternal] = useState(false)
+
+ useEffect(() => {
+ if (typeof window !== "undefined") {
+ const hostName = window.location.hostname
+ const bookingURL = new URL(bookingUrl)
+
+ const hostsMatch = hostName === bookingURL.hostname
+ const langRouteRegex = /\/[a-zA-Z]{2}\//
+
+ setIsExternal(!hostsMatch || !langRouteRegex.test(bookingURL.pathname))
+ }
+ }, [bookingUrl])
+
+ return isExternal
+}
+
export default function StayCard({ stay }: StayCardProps) {
const lang = useLang()
+
const { checkinDate, checkoutDate, hotelInformation, bookingUrl } =
stay.attributes
@@ -24,8 +45,13 @@ export default function StayCard({ stay }: StayCardProps) {
const departDate = depart.format("DD MMM YYYY")
const departDateTime = depart.format("YYYY-MM-DD")
- return (
-
+ // TODO: Remove this check (and hook) and only return when current web is deleted
+ const isExternal = useCheckIfExternal(bookingUrl)
+
+ const linkProps = {
+ href: bookingUrl,
+ className: styles.link,
+ children: (
-
- )
+ ),
+ }
+
+ return isExternal ? :
}
diff --git a/components/Blocks/DynamicContent/Stays/StayCard/stay.module.css b/components/Blocks/DynamicContent/Stays/StayCard/stay.module.css
index 1d3a685d7..995aa102a 100644
--- a/components/Blocks/DynamicContent/Stays/StayCard/stay.module.css
+++ b/components/Blocks/DynamicContent/Stays/StayCard/stay.module.css
@@ -6,6 +6,10 @@
overflow: hidden;
}
+.link {
+ text-decoration: none;
+}
+
.stay:hover {
border: 1.5px solid var(--Base-Border-Hover);
}