From 354e4556847bb01ead4bc6b61df5654223603661 Mon Sep 17 00:00:00 2001
From: Pontus Dreij <pontus.dreij@scandichotels.com>
Date: Thu, 14 Nov 2024 10:23:06 +0100
Subject: [PATCH] feat(SW-892): Moved Pet Room Info Tooltip inside filter
 button

---
 .../HotelReservation/SelectRate/RoomFilter/index.tsx     | 8 +++++---
 .../TempDesignSystem/Form/FilterChip/_Chip/index.tsx     | 9 ++++++++-
 types/components/form/filterChip.ts                      | 1 +
 3 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/components/HotelReservation/SelectRate/RoomFilter/index.tsx b/components/HotelReservation/SelectRate/RoomFilter/index.tsx
index 9869d355b..fb41f3cc7 100644
--- a/components/HotelReservation/SelectRate/RoomFilter/index.tsx
+++ b/components/HotelReservation/SelectRate/RoomFilter/index.tsx
@@ -111,11 +111,13 @@ export default function RoomFilter({
                 }
                 selected={getValues(option.code)}
                 Icon={getIconForFeatureCode(option.code)}
+                tooltipText={
+                  option.code === RoomPackageCodeEnum.PET_ROOM
+                    ? tooltipText
+                    : undefined
+                }
               />
             ))}
-            <Tooltip text={tooltipText} position="bottom" arrow="right">
-              <InfoCircleIcon color="uiTextPlaceholder" />
-            </Tooltip>
           </div>
         </form>
       </FormProvider>
diff --git a/components/TempDesignSystem/Form/FilterChip/_Chip/index.tsx b/components/TempDesignSystem/Form/FilterChip/_Chip/index.tsx
index 528469df1..d1f935fa2 100644
--- a/components/TempDesignSystem/Form/FilterChip/_Chip/index.tsx
+++ b/components/TempDesignSystem/Form/FilterChip/_Chip/index.tsx
@@ -1,8 +1,9 @@
 import { useMemo } from "react"
 import { useFormContext } from "react-hook-form"
 
-import { HeartIcon } from "@/components/Icons"
+import { HeartIcon, InfoCircleIcon } from "@/components/Icons"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
+import { Tooltip } from "@/components/TempDesignSystem/Tooltip"
 
 import styles from "./chip.module.css"
 
@@ -19,6 +20,7 @@ export default function FilterChip({
   value,
   selected,
   disabled,
+  tooltipText,
 }: FilterChipProps) {
   const { register } = useFormContext()
 
@@ -43,6 +45,11 @@ export default function FilterChip({
       <Caption type="bold" color={color} className={styles.caption}>
         {label}
       </Caption>
+      {tooltipText && (
+        <Tooltip text={tooltipText} position="bottom" arrow="right">
+          <InfoCircleIcon color="uiTextPlaceholder" />
+        </Tooltip>
+      )}
       <input
         aria-hidden
         id={id || name}
diff --git a/types/components/form/filterChip.ts b/types/components/form/filterChip.ts
index 3ff40673d..4a6e357f1 100644
--- a/types/components/form/filterChip.ts
+++ b/types/components/form/filterChip.ts
@@ -11,6 +11,7 @@ export interface FilterChipProps {
   value?: string
   selected?: boolean
   disabled?: boolean
+  tooltipText: string | undefined
 }
 
 export type FilterChipCheckboxProps = Omit<FilterChipProps, "type">