d6fe6a33b4
This is the foundation for the rate selection. Since we don't have UX and UI ready yet this is on a best effort basis. Things that will be changed later includes proper API fetching, correct design, internationalization of text and form handling.
115 lines
3.8 KiB
TypeScript
115 lines
3.8 KiB
TypeScript
import RoomCard from "@/components/HotelReservation/SelectRate/RoomCard"
|
|
import { Room } from "@/components/HotelReservation/SelectRate/RoomCard/roomCard"
|
|
import Header from "@/components/Section/Header"
|
|
|
|
import styles from "./page.module.css"
|
|
|
|
const getRooms: () => Promise<Room[]> = () => {
|
|
return new Promise((resolve) =>
|
|
resolve([
|
|
{
|
|
id: 1,
|
|
name: "Cabin",
|
|
description:
|
|
"Stylish, peaceful and air-conditioned room. The rooms have small clerestory windows.",
|
|
size: "17 - 24 m² (1 - 2 persons)",
|
|
pricePerNight: 1348,
|
|
currency: "SEK",
|
|
imageSrc:
|
|
"https://www.scandichotels.se/imageVault/publishedmedia/xnmqnmz6mz0uhuat0917/scandic-helsinki-hub-room-standard-KR-7.jpg",
|
|
},
|
|
{
|
|
id: 2,
|
|
name: "Standard",
|
|
description:
|
|
"Stylish, peaceful and air-conditioned room. The rooms have small clerestory windows.",
|
|
size: "19 - 30 m² (1 - 2 persons)",
|
|
pricePerNight: 1548,
|
|
currency: "SEK",
|
|
imageSrc:
|
|
"https://www.scandichotels.se/imageVault/publishedmedia/xnmqnmz6mz0uhuat0917/scandic-helsinki-hub-room-standard-KR-7.jpg",
|
|
},
|
|
{
|
|
id: 3,
|
|
name: "Superior",
|
|
description:
|
|
"Stylish, peaceful and air-conditioned room. The rooms have small clerestory windows.",
|
|
size: "22 - 40 m² (1 - 3 persons)",
|
|
pricePerNight: 1744,
|
|
currency: "SEK",
|
|
imageSrc:
|
|
"https://www.scandichotels.se/imageVault/publishedmedia/xnmqnmz6mz0uhuat0917/scandic-helsinki-hub-room-standard-KR-7.jpg",
|
|
},
|
|
{
|
|
id: 4,
|
|
name: "Superior Family",
|
|
description:
|
|
"Stylish, peaceful and air-conditioned room. The rooms have small clerestory windows.",
|
|
size: "29 - 49 m² (3 - 4 persons)",
|
|
pricePerNight: 2032,
|
|
currency: "SEK",
|
|
imageSrc:
|
|
"https://www.scandichotels.se/imageVault/publishedmedia/xnmqnmz6mz0uhuat0917/scandic-helsinki-hub-room-standard-KR-7.jpg",
|
|
},
|
|
{
|
|
id: 5,
|
|
name: "Superior PLUS",
|
|
description:
|
|
"Stylish, peaceful and air-conditioned room. The rooms have small clerestory windows.",
|
|
size: "21 - 28 m² (2 - 3 persons)",
|
|
pricePerNight: 2065,
|
|
currency: "SEK",
|
|
imageSrc:
|
|
"https://www.scandichotels.se/imageVault/publishedmedia/xnmqnmz6mz0uhuat0917/scandic-helsinki-hub-room-standard-KR-7.jpg",
|
|
},
|
|
{
|
|
id: 6,
|
|
name: "Junior Suite",
|
|
description:
|
|
"Stylish, peaceful and air-conditioned room. The rooms have small clerestory windows.",
|
|
size: "35 - 43 m² (2 - 4 persons)",
|
|
pricePerNight: 3012,
|
|
currency: "SEK",
|
|
imageSrc:
|
|
"https://www.scandichotels.se/imageVault/publishedmedia/xnmqnmz6mz0uhuat0917/scandic-helsinki-hub-room-standard-KR-7.jpg",
|
|
},
|
|
])
|
|
)
|
|
}
|
|
|
|
export default async function SelectRate() {
|
|
const rooms = await getRooms()
|
|
|
|
return (
|
|
<div className={styles.page}>
|
|
<main className={styles.content}>
|
|
<div className={styles.hotelInfo}>Hotel info TBI</div>
|
|
<div className={styles.header}>
|
|
<Header
|
|
title="Choose room"
|
|
subtitle={"Which room class suits you the best?"}
|
|
link={{
|
|
href: "#",
|
|
text: "All rooms comes with standard amenities",
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
<ul className={styles.roomList}>
|
|
{rooms.map((room) => (
|
|
<li key={room.id}>
|
|
<input
|
|
type="radio"
|
|
name="room"
|
|
value={room.id}
|
|
id={`room-${room.id}`}
|
|
/>
|
|
<RoomCard room={room} />
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</main>
|
|
</div>
|
|
)
|
|
}
|