chore: cleaning up select-rate

components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/index.tsx

@@ -0,0 +1,56 @@
+"use client"
+import { useIntl } from "react-intl"
+
+import { alternativeHotels } from "@/constants/routes/hotelReservation"
+
+import Alert from "@/components/TempDesignSystem/Alert"
+import { useRoomContext } from "@/contexts/Room"
+import useLang from "@/hooks/useLang"
+
+import RoomCard from "./RoomCard"
+import RoomTypeFilter from "./RoomTypeFilter"
+
+import styles from "./roomSelectionPanel.module.css"
+
+import { AvailabilityEnum } from "@/types/components/hotelReservation/selectHotel/selectHotel"
+import { AlertTypeEnum } from "@/types/enums/alert"
+
+export default function RoomSelectionPanel() {
+  const { rooms } = useRoomContext()
+  const intl = useIntl()
+  const lang = useLang()
+  const noAvailableRooms = rooms.every(
+    (roomConfig) => roomConfig.status === AvailabilityEnum.NotAvailable
+  )
+  return (
+    <>
+      {noAvailableRooms ? (
+        <div className={styles.hotelAlert}>
+          <Alert
+            type={AlertTypeEnum.Info}
+            heading={intl.formatMessage({ id: "No availability" })}
+            text={intl.formatMessage({
+              id: "There are no rooms available that match your request.",
+            })}
+            link={{
+              title: intl.formatMessage({ id: "See alternative hotels" }),
+              url: `${alternativeHotels(lang)}`,
+              keepSearchParams: true,
+            }}
+          />
+        </div>
+      ) : null}
+      <RoomTypeFilter />
+      <div className={styles.wrapper}>
+        <ul className={styles.roomList}>
+          {rooms.map((roomConfiguration) => (
+            <RoomCard
+              key={roomConfiguration.roomTypeCode}
+              roomConfiguration={roomConfiguration}
+            />
+          ))}
+        </ul>
+      </div>
+    </>
+  )
+}