scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged in feat/SW-1711-switch-icons (pull request #1558)

Browse Source 
Switches out all the old icons to new ones, and moves them to the design system. The new icons are of three different types: Materialise Symbol, Nucleo, and Customized. Also adds further mapping between facilities/amenities and icons.

Approved-by: Michael Zetterberg
Approved-by: Erik Tiekstra
This commit is contained in:
Matilda Landström
2025-03-27 09:42:52 +00:00
parent 93c7fe64bf
commit 5de2a993a7
524 changed files with 4442 additions and 6802 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
apps/scandic-web/components/SidePeeks/RoomSidePeek/bedIcon.ts
View File

@@ -1,37 +1,29 @@
import {
BedDoubleIcon,
BedSingleIcon,
KingBedSmallIcon,
} from "@/components/Icons"
import type { SymbolCodepoints } from "react-material-symbols"
import type { FC } from "react"
import type { IconProps } from "@/types/components/icon"
export function getBedIcon(name: string): FC<IconProps> | null {
export function getBedIconName(name: string): SymbolCodepoints {
const iconMappings = [
{
icon: BedDoubleIcon,
icon: "bed",
texts: ["Queen"],
},
{
icon: KingBedSmallIcon,
icon: "king_bed",
texts: ["King"],
},
{
icon: KingBedSmallIcon,
icon: "single_bed",
texts: ["CustomOccupancy"],
},
{
icon: BedSingleIcon,
icon: "bed",
texts: ["Twin"],
},
{
icon: BedSingleIcon,
icon: "single_bed",
texts: ["Single"],
},
]
const icon = iconMappings.find((icon) => icon.texts.includes(name))
return icon ? icon.icon : BedSingleIcon
return icon ? (icon.icon as SymbolCodepoints) : "single_bed"
}

240
apps/scandic-web/components/SidePeeks/RoomSidePeek/facilityIcon.ts
View File

@@ -1,240 +0,0 @@
import {
AcIcon,
AirplaneIcon,
BalconyIcon,
BathtubIcon,
BedDoubleIcon,
BedHotelIcon,
BedroomParentIcon,
BedSingleIcon,
BikeIcon,
BreakfastIcon,
BusinessIcon,
CableIcon,
ChairIcon,
CityIcon,
CoffeeAltIcon,
CoffeeIcon,
CoffeeMakerIcon,
ConciergeIcon,
CoolIcon,
DeskIcon,
DiningIcon,
ElectricBikeIcon,
FamilyIcon,
FitnessIcon,
FootstoolIcon,
HairdryerIcon,
HandSoapIcon,
HealthBeautyIcon,
HeartIcon,
IronIcon,
KayakingIcon,
KettleIcon,
LaptopIcon,
LaundryMachineIcon,
LocalBarIcon,
LuggageIcon,
MicrowaveIcon,
MirrorIcon,
NatureIcon,
NightlifeIcon,
NoSmokingIcon,
OutdoorFurnitureIcon,
ParkingIcon,
PetsIcon,
PhoneIcon,
RestaurantIcon,
RoomServiceIcon,
SafetyBoxIcon,
SaunaIcon,
ShowerIcon,
SpeakerIcon,
StoreIcon,
StreetIcon,
SwimIcon,
TshirtWashIcon,
TvCastingIcon,
WifiIcon,
WindowCurtainsAltIcon,
WindowNotAvailableIcon,
WineBarIcon,
WoodFloorIcon,
YardIcon,
} from "@/components/Icons"
import type { FC } from "react"
import type { IconProps } from "@/types/components/icon"
export function getFacilityIcon(
name: string | undefined
): FC<IconProps> | null {
if (!name) {
return HeartIcon
}
const normalizedName = name.toLowerCase()
const iconMappings = [
{ icon: AcIcon, name: "aircondition" },
{ icon: AirplaneIcon, name: "airport" },
{ icon: BalconyIcon, name: "balcony" },
{ icon: BalconyIcon, name: "balconyorterrace" },
{ icon: BalconyIcon, name: "frenchbalcony" },
{ icon: BathtubIcon, name: "bathroomwithbathtub" },
{ icon: BathtubIcon, name: "bathroomwithshowerandbathtub" },
{ icon: BathtubIcon, name: "bathroomwithshowerorbathtub" },
{ icon: BedDoubleIcon, name: "adjustablebeds" },
{ icon: BedDoubleIcon, name: "setoftwopillows" },
{ icon: BedHotelIcon, name: "armchairbed" },
{ icon: BedHotelIcon, name: "pulloutbed" },
{ icon: BedroomParentIcon, name: "separatebedroom" },
{ icon: BedSingleIcon, name: "extrabed" },
{ icon: BikeIcon, name: "bikeforloan" },
{ icon: BreakfastIcon, name: "breakfast" },
{ icon: BreakfastIcon, name: "servesbreakfastalwaysincluded" },
{ icon: BusinessIcon, name: "meetingconferencefacilities" },
{ icon: BusinessIcon, name: "meetingrooms" },
{ icon: CableIcon, name: "internetwithcableintheroom" },
{ icon: ChairIcon, name: "armchair" },
{ icon: ChairIcon, name: "connectingrooms" },
{ icon: CityIcon, name: "viewcityview" },
{ icon: CoffeeAltIcon, name: "nespressomachine" },
{ icon: CoffeeIcon, name: "café" },
{ icon: CoffeeIcon, name: "coffee" },
{ icon: CoffeeMakerIcon, name: "coffeemachine" },
{ icon: ConciergeIcon, name: "lifestyleconcierge" },
{ icon: CoolIcon, name: "aircooling" },
{ icon: CoolIcon, name: "cooler" },
{ icon: CoolIcon, name: "coolingcabinet" },
{ icon: DeskIcon, name: "deskandchair" },
{ icon: DiningIcon, name: "diningarea" },
{ icon: DiningIcon, name: "tablefordining" },
{ icon: ElectricBikeIcon, name: "ebikeschargingstation" },
{ icon: FamilyIcon, name: "extrafamilyfriendly" },
{ icon: FitnessIcon, name: "gym" },
{ icon: FootstoolIcon, name: "footstool" },
{ icon: HairdryerIcon, name: "hairdryer" },
{ icon: HandSoapIcon, name: "toiletries" },
{ icon: HealthBeautyIcon, name: "beautysalon" },
{ icon: HeartIcon, name: "bathrobes" },
{ icon: HeartIcon, name: "bathroom2separatebathrooms" },
{ icon: HeartIcon, name: "bodycareproducts" },
{ icon: HeartIcon, name: "bodylotion" },
{ icon: HeartIcon, name: "bowling" },
{ icon: HeartIcon, name: "bunkbed" },
{ icon: HeartIcon, name: "bunkbed80x188cm" },
{ icon: HeartIcon, name: "carpetingwalltowallcarpet" },
{ icon: HeartIcon, name: "cashfree800pmtill0600am" },
{ icon: HeartIcon, name: "cashfreehotel" },
{ icon: HeartIcon, name: "coffeevoucher" },
{ icon: HeartIcon, name: "complimentarycoldrefreshments" },
{ icon: HeartIcon, name: "conditioner" },
{ icon: HeartIcon, name: "conventioncentre" },
{ icon: HeartIcon, name: "disabledparking" },
{ icon: HeartIcon, name: "dockingstationforipodipad" },
{ icon: HeartIcon, name: "dryingcabinet" },
{ icon: HeartIcon, name: "easyaccess" },
{ icon: HeartIcon, name: "garmentsteamer" },
{ icon: HeartIcon, name: "highfloor" },
{ icon: HeartIcon, name: "icemachine" },
{ icon: HeartIcon, name: "icemachinereception" },
{ icon: HeartIcon, name: "jaccuzzi" },
{ icon: HeartIcon, name: "jacuzzi" },
{ icon: HeartIcon, name: "kitchen" },
{ icon: HeartIcon, name: "kitchenette" },
{ icon: HeartIcon, name: "latecheckoutuntil1400guaranteed" },
{ icon: HeartIcon, name: "livemusicexhibitions" },
{ icon: HeartIcon, name: "massage" },
{ icon: HeartIcon, name: "meetingarea" },
{ icon: HeartIcon, name: "minibarincludedinroomrate" },
{ icon: HeartIcon, name: "overnightsecurity" },
{ icon: HeartIcon, name: "parkingadditionalcost" },
{ icon: HeartIcon, name: "privatesauna" },
{ icon: HeartIcon, name: "refrigerator" },
{ icon: HeartIcon, name: "seatingarea" },
{ icon: HeartIcon, name: "security24hoours" },
{ icon: HeartIcon, name: "separatelivingroom" },
{ icon: HeartIcon, name: "separatetoilet" },
{ icon: HeartIcon, name: "servicesecurity24h" },
{ icon: HeartIcon, name: "shampoo" },
{ icon: HeartIcon, name: "slippers" },
{ icon: HeartIcon, name: "sofabed" },
{ icon: HeartIcon, name: "sofas" },
{ icon: HeartIcon, name: "sofawithtable" },
{ icon: HeartIcon, name: "spaciousroom" },
{ icon: HeartIcon, name: "stillandsparklingwater" },
{ icon: HeartIcon, name: "table" },
{ icon: HeartIcon, name: "tassimocoffeemaker" },
{ icon: HeartIcon, name: "terrace" },
{ icon: HeartIcon, name: "trouserpress" },
{ icon: HeartIcon, name: "tv" },
{ icon: HeartIcon, name: "tvwithcomplimentarymoviechannels" },
{ icon: HeartIcon, name: "tvwithmoviechannels" },
{ icon: HeartIcon, name: "tvwithstreamingoption" },
{ icon: HeartIcon, name: "ventilationinroom" },
{ icon: HeartIcon, name: "view" },
{ icon: HeartIcon, name: "viewfjordview" },
{ icon: HeartIcon, name: "viewlakeview" },
{ icon: HeartIcon, name: "viewpanoramicview" },
{ icon: HeartIcon, name: "viewseaview" },
{ icon: HeartIcon, name: "wallbed" },
{ icon: HeartIcon, name: "wallmountedcyclerack" },
{ icon: HeartIcon, name: "wardrobe" },
{ icon: HeartIcon, name: "wellnessandsaunaentrancefeeadmission16years" },
{ icon: HeartIcon, name: "wellnesspoolsaunaentrancefeeadmission16years" },
{ icon: HeartIcon, name: "windownook" },
{ icon: IronIcon, name: "ironandironingboard" },
{ icon: IronIcon, name: "ironingroom" },
{ icon: KayakingIcon, name: "kayaksforloan" },
{ icon: KettleIcon, name: "kettle" },
{ icon: KettleIcon, name: "kettlewithcoffeetea" },
{ icon: LaptopIcon, name: "laptopsafe" },
{ icon: LaptopIcon, name: "laptoptray" },
{ icon: LaundryMachineIcon, name: "laundryservice" },
{ icon: LocalBarIcon, name: "bar" },
{ icon: LocalBarIcon, name: "rooftopbar" },
{ icon: LocalBarIcon, name: "skybar" },
{ icon: LuggageIcon, name: "luggagelockers" },
{ icon: MicrowaveIcon, name: "microwave" },
{ icon: MirrorIcon, name: "cosmeticmirror" },
{ icon: NatureIcon, name: "viewparkview" },
{ icon: NightlifeIcon, name: "disconightclub" },
{ icon: NoSmokingIcon, name: "nonsmoking" },
{ icon: OutdoorFurnitureIcon, name: "outdoorterrace" },
{ icon: ParkingIcon, name: "parking" },
{ icon: ParkingIcon, name: "parkingfreeparking" },
{ icon: PetsIcon, name: "petfriendlyrooms" },
{ icon: PhoneIcon, name: "directdialphoneandvoicemail" },
{ icon: RestaurantIcon, name: "restaurant" },
{ icon: RoomServiceIcon, name: "roomservice" },
{ icon: SafetyBoxIcon, name: "safetybox" },
{ icon: SaunaIcon, name: "sauna" },
{ icon: ShowerIcon, name: "bathroomwithshower" },
{ icon: ShowerIcon, name: "rainshower" },
{ icon: ShowerIcon, name: "sharedbathroomwithshower" },
{ icon: ShowerIcon, name: "showergel" },
{ icon: ShowerIcon, name: "showerproductsscentbygrandcentral" },
{ icon: SpeakerIcon, name: "modernvinylplayer" },
{ icon: SpeakerIcon, name: "musicplayer" },
{ icon: StoreIcon, name: "hairdresser" },
{ icon: StoreIcon, name: "shop" },
{ icon: StreetIcon, name: "viewstreetview" },
{ icon: SwimIcon, name: "pool" },
{ icon: TshirtWashIcon, name: "handwash" },
{ icon: TvCastingIcon, name: "tvwithchromecast" },
{ icon: WifiIcon, name: "freewifi" },
{ icon: WindowCurtainsAltIcon, name: "blackoutcurtains" },
{ icon: WindowNotAvailableIcon, name: "nowindow" },
{ icon: WineBarIcon, name: "minibar" },
{ icon: WoodFloorIcon, name: "woodenfloor" },
{ icon: YardIcon, name: "viewatriumview" },
]
const icon = iconMappings.find(
(icon) => icon.name.toLowerCase() === normalizedName
)
return icon ? icon.icon : HeartIcon
}

236
apps/scandic-web/components/SidePeeks/RoomSidePeek/facilityIcon.tsx Normal file
View File

@@ -0,0 +1,236 @@
import {
BathroomCabinet2Icon,
BedHotelIcon,
BowlingPinsIcon,
ConferenceRoomIcon,
CoolingIcon,
CouchTableIcon,
Door2Icon,
FootStoolIcon,
Hairdresser1Icon,
HairDryerIcon,
HandSoapIcon,
IceMachineIcon,
type IconProps,
MassageIcon,
MaterialIcon,
type MaterialIconSetIconProps,
MdiBunkBedIcon,
MirrorIcon,
MovingBedsIcon,
type NucleoIconProps,
RecordPlayer3Icon,
RoadIcon,
RugIcon,
SafetyBoxIcon,
SlippersIcon,
Toilet2Icon,
TowelIcon,
UserPolice2Icon,
ViewIcon,
WardIcon,
WindowNotAvailableIcon,
WoodFloorIcon,
} from "@scandic-hotels/design-system/Icons"
import type { MaterialSymbolProps } from "react-material-symbols"
interface FacilityIconProps {
name: string | undefined
}
export function FacilityIcon({
name,
...props
}:
| (FacilityIconProps & MaterialIconSetIconProps)
| NucleoIconProps
| IconProps): JSX.Element {
if (!name) {
return <MaterialIcon icon="favorite" {...props} />
}
const normalizedName = name.toLowerCase()
const customIcon = CustomIconMappings.find(
(icon) => icon.name.toLowerCase() === normalizedName
)
if (customIcon) {
return <customIcon.icon {...props} />
}
const materialSymbolIcon = MaterialIconMappings.find(
(icon) => icon.name.toLowerCase() === normalizedName
)
return materialSymbolIcon ? (
<MaterialIcon icon={materialSymbolIcon.icon} {...props} />
) : (
<MaterialIcon icon="favorite" {...props} />
)
}
const MaterialIconMappings: {
icon: MaterialSymbolProps["icon"]
name: string
}[] = [
{ icon: "air_purifier_gen", name: "aircondition" },
{ icon: "travel", name: "airport" },
{ icon: "balcony", name: "balcony" },
{ icon: "deck", name: "balconyorterrace" },
{ icon: "balcony", name: "frenchbalcony" },
{ icon: "bathtub", name: "bathroomwithbathtub" },
{ icon: "bathtub", name: "bathroomwithshowerandbathtub" },
{ icon: "bed", name: "setoftwopillows" },
{ icon: "chair", name: "armchairbed" },
{ icon: "meeting_room", name: "separatebedroom" },
{ icon: "pedal_bike", name: "bikeforloan" },
{ icon: "bakery_dining", name: "breakfast" },
{ icon: "bakery_dining", name: "servesbreakfastalwaysincluded" },
{ icon: "business_center", name: "meetingconferencefacilities" },
{ icon: "business_center", name: "meetingrooms" },
{ icon: "router", name: "internetwithcableintheroom" },
{ icon: "chair", name: "armchair" },
{ icon: "chair", name: "chair" },
{ icon: "meeting_room", name: "connectingrooms" },
{ icon: "location_city", name: "viewcityview" },
{ icon: "coffee_maker", name: "nespressomachine" },
{ icon: "dining", name: "café" },
{ icon: "coffee", name: "coffee" },
{ icon: "coffee_maker", name: "coffeemachine" },
{ icon: "concierge", name: "lifestyleconcierge" },
{ icon: "mode_fan", name: "aircooling" },
{ icon: "mode_fan", name: "cooler" },
{ icon: "desk", name: "deskandchair" },
{ icon: "desk", name: "desk" },
{ icon: "dining", name: "diningarea" },
{ icon: "table_bar", name: "tablefordining" },
{ icon: "electric_bike", name: "ebikeschargingstation" },
{ icon: "family_restroom", name: "extrafamilyfriendly" },
{ icon: "exercise", name: "gym" },
{ icon: "health_and_beauty", name: "beautysalon" },
{ icon: "bathroom", name: "bathroom2separatebathrooms" },
{ icon: "credit_card_heart", name: "cashfree800pmtill0600am" },
{ icon: "credit_card_heart", name: "cashfreehotel" },
{ icon: "confirmation_number", name: "coffeevoucher" },
{ icon: "water_full", name: "complimentarycoldrefreshments" },
{ icon: "groups", name: "conventioncentre" },
{ icon: "accessible", name: "disabledparking" },
{ icon: "charging_station", name: "dockingstationforipodipad" },
{ icon: "cool_to_dry", name: "dryingcabinet" },
{ icon: "assistant_navigation", name: "easyaccess" },
{ icon: "laundry", name: "garmentsteamer" },
{ icon: "stairs", name: "highfloor" },
{ icon: "hot_tub", name: "jaccuzzi" },
{ icon: "hot_tub", name: "jacuzzi" },
{ icon: "countertops", name: "kitchen" },
{ icon: "countertops", name: "kitchenette" },
{ icon: "checked_bag", name: "latecheckoutuntil1400guaranteed" },
{ icon: "music_cast", name: "livemusicexhibitions" },
{ icon: "liquor", name: "minibarincludedinroomrate" },
{ icon: "local_parking", name: "parkingadditionalcost" },
{ icon: "sauna", name: "privatesauna" },
{ icon: "kitchen", name: "refrigerator" },
{ icon: "airline_seat_recline_normal", name: "seatingarea" },
{ icon: "scene", name: "separatelivingroom" },
{ icon: "chair", name: "sofabed" },
{ icon: "chair", name: "sofas" },
{ icon: "chair", name: "sofa" },
{ icon: "bedroom_parent", name: "spaciousroom" },
{ icon: "local_drink", name: "stillandsparklingwater" },
{ icon: "table_bar", name: "table" },
{ icon: "coffee_maker", name: "tassimocoffeemaker" },
{ icon: "deck", name: "terrace" },
{ icon: "iron", name: "trouserpress" },
{ icon: "tv_guide", name: "tv" },
{ icon: "tv_remote", name: "tvwithcomplimentarymoviechannels" },
{ icon: "tv_remote", name: "tvwithmoviechannels" },
{ icon: "live_tv", name: "tvwithstreamingoption" },
{ icon: "hvac", name: "ventilationinroom" },
{ icon: "landscape", name: "viewfjordview" },
{ icon: "houseboat", name: "viewlakeview" },
{ icon: "panorama", name: "viewpanoramicview" },
{ icon: "sailing", name: "viewseaview" },
{ icon: "ward", name: "wallbed" },
{ icon: "pedal_bike", name: "wallmountedcyclerack" },
{ icon: "dresser", name: "wardrobe" },
{ icon: "spa", name: "wellnessandsaunaentrancefeeadmission16years" },
{ icon: "spa", name: "wellnesspoolsaunaentrancefeeadmission16years" },
{ icon: "curtains", name: "windownook" },
{ icon: "iron", name: "ironandironingboard" },
{ icon: "iron", name: "ironingroom" },
{ icon: "kayaking", name: "kayaksforloan" },
{ icon: "kettle", name: "kettle" },
{ icon: "kettle", name: "kettlewithcoffee" },
{ icon: "sync_saved_locally", name: "laptopsafe" },
{ icon: "computer", name: "laptoptray" },
{ icon: "local_laundry_service", name: "laundryservice" },
{ icon: "local_bar", name: "bar" },
{ icon: "deck", name: "rooftopbar" },
{ icon: "local_bar", name: "skybar" },
{ icon: "microwave", name: "microwave" },
{ icon: "nature", name: "viewparkview" },
{ icon: "nightlife", name: "disconightclub" },
{ icon: "smoke_free", name: "nonsmoking" },
{ icon: "deck", name: "outdoorterrace" },
{ icon: "local_parking", name: "parking" },
{ icon: "local_parking", name: "parkingfreeparking" },
{ icon: "pets", name: "petfriendlyrooms" },
{ icon: "phone", name: "directdialphoneandvoicemail" },
{ icon: "restaurant", name: "restaurant" },
{ icon: "room_service", name: "roomservice" },
{ icon: "sauna", name: "sauna" },
{ icon: "shower", name: "bathroomwithshower" },
{ icon: "shower", name: "rainshower" },
{ icon: "shower", name: "sharedbathroomwithshower" },
{ icon: "radio", name: "musicplayer" },
{ icon: "shopping_bag", name: "shop" },
{ icon: "pool", name: "pool" },
{ icon: "laundry", name: "handwash" },
{ icon: "connected_tv", name: "tvwithchromecast" },
{ icon: "wifi", name: "freewifi" },
{ icon: "curtains_closed", name: "blackoutcurtains" },
{ icon: "liquor", name: "minibar" },
{ icon: "yard", name: "viewatriumview" },
]
const CustomIconMappings = [
{ icon: BathroomCabinet2Icon, name: "bathroomwithshowerorbathtub" },
{ icon: MovingBedsIcon, name: "adjustablebeds" },
{ icon: MovingBedsIcon, name: "pulloutbed" },
{ icon: BedHotelIcon, name: "extrabed" },
{ icon: CoolingIcon, name: "coolingcabinet" },
{ icon: FootStoolIcon, name: "footstool" },
{ icon: HairDryerIcon, name: "hairdryer" },
{ icon: Hairdresser1Icon, name: "hairdresser" },
{ icon: HandSoapIcon, name: "toiletries" },
{ icon: TowelIcon, name: "bathrobes" },
{ icon: HandSoapIcon, name: "bodycareproducts" },
{ icon: HandSoapIcon, name: "bodylotion" },
{ icon: BowlingPinsIcon, name: "bowling" },
{ icon: MdiBunkBedIcon, name: "bunkbed" },
{ icon: MdiBunkBedIcon, name: "bunkbed80x188cm" },
{ icon: IceMachineIcon, name: "icemachine" },
{ icon: IceMachineIcon, name: "icemachinereception" },
{ icon: MassageIcon, name: "massage" },
{ icon: ConferenceRoomIcon, name: "meetingarea" },
{ icon: UserPolice2Icon, name: "overnightsecurity" },
{ icon: UserPolice2Icon, name: "security24hoours" },
{ icon: UserPolice2Icon, name: "servicesecurity24h" },
{ icon: FootStoolIcon, name: "footstool" },
{ icon: WindowNotAvailableIcon, name: "nowindow" },
{ icon: Door2Icon, name: "luggagelockers" },
{ icon: MirrorIcon, name: "cosmeticmirror" },
{ icon: WardIcon, name: "wallbed" },
{ icon: CouchTableIcon, name: "sofawithtable" },
{ icon: SafetyBoxIcon, name: "safetybox" },
{ icon: RecordPlayer3Icon, name: "modernvinylplayer" },
{ icon: RugIcon, name: "carpetingwalltowallcarpet" },
{ icon: Toilet2Icon, name: "separatetoilet" },
{ icon: WoodFloorIcon, name: "woodenfloor" },
{ icon: ViewIcon, name: "view" },
{ icon: HandSoapIcon, name: "shampoo" },
{ icon: RoadIcon, name: "viewstreetview" },
{ icon: SlippersIcon, name: "slippers" },
{ icon: HandSoapIcon, name: "showergel" },
{ icon: HandSoapIcon, name: "showerproductsscentbygrandcentral" },
]

32
apps/scandic-web/components/SidePeeks/RoomSidePeek/index.tsx
View File

@@ -1,5 +1,7 @@
import { useIntl } from "react-intl"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
import ImageGallery from "@/components/ImageGallery"
import SidePeek from "@/components/TempDesignSystem/SidePeek"
import Body from "@/components/TempDesignSystem/Text/Body"
@@ -7,8 +9,8 @@ import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import { mapApiImagesToGalleryImages } from "@/utils/imageGallery"
import { getBedIcon } from "./bedIcon"
import { getFacilityIcon } from "./facilityIcon"
import { getBedIconName } from "./bedIcon"
import { FacilityIcon } from "./facilityIcon"
import styles from "./roomSidePeek.module.css"
@@ -85,16 +87,16 @@ export default function RoomSidePeek({
{room.roomFacilities
.sort((a, b) => a.sortOrder - b.sortOrder)
.map((facility) => {
const Icon = getFacilityIcon(facility.icon)
const Icon = (
<FacilityIcon
name={facility.icon}
size={24}
color="Icon/Default"
/>
)
return (
<li key={facility.name}>
{Icon && (
<Icon
width={24}
height={24}
color="uiTextMediumContrast"
/>
)}
{Icon && Icon}
<Body
asChild
className={!Icon ? styles.noIcon : undefined}
@@ -116,16 +118,10 @@ export default function RoomSidePeek({
</Body>
<ul className={styles.bedOptions}>
{room.roomTypes.map((roomType) => {
const BedIcon = getBedIcon(roomType.mainBed.type)
const bedIcon = getBedIconName(roomType.mainBed.type)
return (
<li key={roomType.code}>
{BedIcon && (
<BedIcon
color="uiTextMediumContrast"
width={24}
height={24}
/>
)}
<MaterialIcon icon={bedIcon} color="Icon/Feedback/Neutral" />
<Body color="uiTextMediumContrast" asChild>
<span>{roomType.mainBed.description}</span>
</Body>