diff --git a/components/HotelReservation/SelectRate/RoomSelection/RoomCard/index.tsx b/components/HotelReservation/SelectRate/RoomSelection/RoomCard/index.tsx
index a045d639a..4eae4293c 100644
--- a/components/HotelReservation/SelectRate/RoomSelection/RoomCard/index.tsx
+++ b/components/HotelReservation/SelectRate/RoomSelection/RoomCard/index.tsx
@@ -23,6 +23,7 @@ export default function RoomCard({
rateDefinitions,
roomConfiguration,
roomCategories,
+ selectedPackages,
handleSelectRate,
}: RoomCardProps) {
const intl = useIntl()
@@ -133,15 +134,17 @@ export default function RoomCard({
>{`${roomConfiguration.roomsLeft} ${intl.formatMessage({ id: "Left" })}`}
)}
- {roomConfiguration.features.map((feature) => (
-
- {createElement(getIconForFeatureCode(feature.code), {
- width: 16,
- height: 16,
- color: "burgundy",
- })}
-
- ))}
+ {roomConfiguration.features
+ .filter((feature) => selectedPackages.includes(feature.code))
+ .map((feature) => (
+
+ {createElement(getIconForFeatureCode(feature.code), {
+ width: 16,
+ height: 16,
+ color: "burgundy",
+ })}
+
+ ))}
{/*NOTE: images from the test API are hosted on test3.scandichotels.com,
which can't be accessed unless on Scandic's Wifi or using Citrix. */}
diff --git a/components/HotelReservation/SelectRate/RoomSelection/index.tsx b/components/HotelReservation/SelectRate/RoomSelection/index.tsx
index 4b6613e7e..efe5778d1 100644
--- a/components/HotelReservation/SelectRate/RoomSelection/index.tsx
+++ b/components/HotelReservation/SelectRate/RoomSelection/index.tsx
@@ -16,6 +16,7 @@ export default function RoomSelection({
roomCategories,
user,
packages,
+ selectedPackages,
}: RoomSelectionProps) {
const [rateSummary, setRateSummary] = useState(null)
@@ -67,6 +68,7 @@ export default function RoomSelection({
roomConfiguration={roomConfiguration}
roomCategories={roomCategories}
handleSelectRate={setRateSummary}
+ selectedPackages={selectedPackages}
/>
))}
diff --git a/components/HotelReservation/SelectRate/Rooms/index.tsx b/components/HotelReservation/SelectRate/Rooms/index.tsx
index 8f9030149..8c122a9c0 100644
--- a/components/HotelReservation/SelectRate/Rooms/index.tsx
+++ b/components/HotelReservation/SelectRate/Rooms/index.tsx
@@ -9,6 +9,10 @@ import RoomSelection from "../RoomSelection"
import styles from "./rooms.module.css"
+import {
+ RoomPackageCodeEnum,
+ type RoomPackageCodes,
+} from "@/types/components/hotelReservation/selectRate/roomFilter"
import type { RoomSelectionProps } from "@/types/components/hotelReservation/selectRate/roomSelection"
export default function Rooms({
@@ -16,20 +20,25 @@ export default function Rooms({
roomCategories = [],
user,
packages,
-}: RoomSelectionProps) {
- const defaultRooms = roomsAvailability.roomConfigurations.filter(
- (room) => room.features.length === 0
- )
+}: Omit) {
+ const defaultRooms = roomsAvailability.roomConfigurations
const [rooms, setRooms] = useState({
...roomsAvailability,
roomConfigurations: defaultRooms,
})
+ const [selectedPackages, setSelectedPackages] = useState(
+ []
+ )
const handleFilter = useCallback(
- (filter: Record) => {
- const selectedCodes = Object.keys(filter).filter((key) => filter[key])
+ (filter: Record) => {
+ const filteredPackages = Object.keys(filter).filter(
+ (key) => filter[key as RoomPackageCodeEnum]
+ ) as RoomPackageCodeEnum[]
- if (selectedCodes.length === 0) {
+ setSelectedPackages(filteredPackages)
+
+ if (filteredPackages.length === 0) {
setRooms({
...roomsAvailability,
roomConfigurations: defaultRooms,
@@ -39,8 +48,8 @@ export default function Rooms({
const filteredRooms = roomsAvailability.roomConfigurations.filter(
(room) =>
- selectedCodes.every((selectedCode) =>
- room.features.some((feature) => feature.code === selectedCode)
+ filteredPackages.every((filteredPackage) =>
+ room.features.some((feature) => feature.code === filteredPackage)
)
)
setRooms({ ...roomsAvailability, roomConfigurations: filteredRooms })
@@ -60,6 +69,7 @@ export default function Rooms({
roomCategories={roomCategories}
user={user}
packages={packages}
+ selectedPackages={selectedPackages}
/>
)
diff --git a/types/components/hotelReservation/selectRate/roomCard.ts b/types/components/hotelReservation/selectRate/roomCard.ts
index a6ed91ac1..5af0c4bb1 100644
--- a/types/components/hotelReservation/selectRate/roomCard.ts
+++ b/types/components/hotelReservation/selectRate/roomCard.ts
@@ -5,11 +5,13 @@ import {
import { Rate } from "./selectRate"
-import { RoomData } from "@/types/hotel"
+import type { RoomData } from "@/types/hotel"
+import type { RoomPackageCodes } from "./roomFilter"
export type RoomCardProps = {
roomConfiguration: RoomConfiguration
rateDefinitions: RateDefinition[]
roomCategories: RoomData[]
+ selectedPackages: RoomPackageCodes[]
handleSelectRate: (rate: Rate) => void
}
diff --git a/types/components/hotelReservation/selectRate/roomSelection.ts b/types/components/hotelReservation/selectRate/roomSelection.ts
index 8d006779c..3e3a6117e 100644
--- a/types/components/hotelReservation/selectRate/roomSelection.ts
+++ b/types/components/hotelReservation/selectRate/roomSelection.ts
@@ -1,11 +1,12 @@
import type { RoomData } from "@/types/hotel"
import type { SafeUser } from "@/types/user"
import type { RoomsAvailability } from "@/server/routers/hotels/output"
-import type { RoomPackageData } from "./roomFilter"
+import type { RoomPackageCodes, RoomPackageData } from "./roomFilter"
export interface RoomSelectionProps {
roomsAvailability: RoomsAvailability
roomCategories: RoomData[]
user: SafeUser
packages: RoomPackageData
+ selectedPackages: RoomPackageCodes[]
}