+
{intl.formatMessage({ id: "Search" })}
diff --git a/components/Forms/BookingWidget/form.module.css b/components/Forms/BookingWidget/form.module.css
index 22ef6be86..46c53e8b2 100644
--- a/components/Forms/BookingWidget/form.module.css
+++ b/components/Forms/BookingWidget/form.module.css
@@ -22,6 +22,7 @@
@media screen and (min-width: 768px) {
.section {
display: flex;
+ width: 100%;
}
.default {
@@ -35,6 +36,13 @@
var(--Spacing-x-one-and-half) var(--Spacing-x1);
}
+ .section {
+ width: min(
+ calc(100dvw - (var(--Spacing-x2) * 2)),
+ var(--max-width-navigation)
+ );
+ }
+
.full {
padding: var(--Spacing-x1) 0;
}
diff --git a/components/Forms/BookingWidget/index.tsx b/components/Forms/BookingWidget/index.tsx
index 80a822315..270a38b04 100644
--- a/components/Forms/BookingWidget/index.tsx
+++ b/components/Forms/BookingWidget/index.tsx
@@ -2,6 +2,10 @@
import { useRouter } from "next/navigation"
import { useFormContext } from "react-hook-form"
+import { selectHotel, selectRate } from "@/constants/routes/hotelReservation"
+
+import useLang from "@/hooks/useLang"
+
import FormContent from "./FormContent"
import { bookingWidgetVariants } from "./variants"
@@ -9,11 +13,13 @@ import styles from "./form.module.css"
import type { BookingWidgetSchema } from "@/types/components/bookingWidget"
import type { BookingWidgetFormProps } from "@/types/components/form/bookingwidget"
+import { Location } from "@/types/trpc/routers/hotel/locations"
const formId = "booking-widget"
export default function Form({ locations, type }: BookingWidgetFormProps) {
const router = useRouter()
+ const lang = useLang()
const classNames = bookingWidgetVariants({
type,
@@ -23,11 +29,32 @@ export default function Form({ locations, type }: BookingWidgetFormProps) {
useFormContext()
function onSubmit(data: BookingWidgetSchema) {
- data.location = JSON.parse(decodeURIComponent(data.location))
- console.log(data)
- // TODO: Parse data and route accordignly to Select hotel or select room-rate page
- console.log("to be routing")
- router.push("/en/hotelreservation/select-hotel")
+ const locationData: Location = JSON.parse(decodeURIComponent(data.location))
+
+ const bookingFlowPage =
+ locationData.type == "cities" ? selectHotel[lang] : selectRate[lang]
+ const bookingWidgetParams = new URLSearchParams(data.date)
+
+ if (locationData.type == "cities")
+ bookingWidgetParams.set("city", locationData.name)
+ else bookingWidgetParams.set("hotel", locationData.operaId || "")
+
+ data.rooms.forEach((room, index) => {
+ bookingWidgetParams.set(`room[${index}].adults`, room.adults.toString())
+
+ room.children.forEach((child, childIndex) => {
+ bookingWidgetParams.set(
+ `room[${index}].child[${childIndex}].age`,
+ child.age.toString()
+ )
+ bookingWidgetParams.set(
+ `room[${index}].child[${childIndex}].bed`,
+ child.bed.toString()
+ )
+ })
+ })
+
+ router.push(`${bookingFlowPage}?${bookingWidgetParams.toString()}`)
}
return (
diff --git a/components/Forms/BookingWidget/schema.ts b/components/Forms/BookingWidget/schema.ts
index f474a72e1..cfa3cb03f 100644
--- a/components/Forms/BookingWidget/schema.ts
+++ b/components/Forms/BookingWidget/schema.ts
@@ -2,6 +2,18 @@ import { z } from "zod"
import type { Location } from "@/types/trpc/routers/hotel/locations"
+export const guestRoomSchema = z.object({
+ adults: z.number().default(1),
+ children: z.array(
+ z.object({
+ age: z.number().nonnegative(),
+ bed: z.number(),
+ })
+ ),
+})
+
+export const guestRoomsSchema = z.array(guestRoomSchema)
+
export const bookingWidgetSchema = z.object({
bookingCode: z.string(), // Update this as required when working with booking codes component
date: z.object({
@@ -25,18 +37,7 @@ export const bookingWidgetSchema = z.object({
{ message: "Required" }
),
redemption: z.boolean().default(false),
- rooms: z.array(
- // This will be updated when working in guests component
- z.object({
- adults: z.number().default(1),
- children: z.array(
- z.object({
- age: z.number(),
- bed: z.number(),
- })
- ),
- })
- ),
+ rooms: guestRoomsSchema,
search: z.string({ coerce: true }).min(1, "Required"),
voucher: z.boolean().default(false),
})
diff --git a/components/Forms/Edit/Profile/FormContent/index.tsx b/components/Forms/Edit/Profile/FormContent/index.tsx
index a4c86f225..ad26f1087 100644
--- a/components/Forms/Edit/Profile/FormContent/index.tsx
+++ b/components/Forms/Edit/Profile/FormContent/index.tsx
@@ -24,7 +24,7 @@ export default function FormContent() {
const email = `${intl.formatMessage({ id: "Email" })} ${intl.formatMessage({ id: "Address" }).toLowerCase()}`
const street = intl.formatMessage({ id: "Address" })
const phoneNumber = intl.formatMessage({ id: "Phone number" })
- const password = intl.formatMessage({ id: "Current password" })
+ const currentPassword = intl.formatMessage({ id: "Current password" })
const retypeNewPassword = intl.formatMessage({ id: "Retype new password" })
const zipCode = intl.formatMessage({ id: "Zip code" })
@@ -72,8 +72,10 @@ export default function FormContent() {
{intl.formatMessage({ id: "Password" })}