Merged in fix/SW-3001-select-hotel-booking-code- (pull request #2576)

Fix/SW-3001 select hotel booking code

* fix(SW-3001): Fixed booking code filter store to reset to default state when new search triggered, Removed state as using useState resets the value on every filter change

* fix: Route tracking parsing error in select-hotel page

* fix(SW-3001): Optimized code


Approved-by: Matilda Landström
This commit is contained in:
Hrishikesh Vaipurkar
2025-07-30 09:39:58 +00:00
parent 9bbea3f16f
commit f5531e8238
4 changed files with 26 additions and 16 deletions

View File

@@ -12,6 +12,7 @@ import {
selectHotel,
selectHotelMap,
} from "@/constants/routes/hotelReservation"
import { useBookingCodeFilterStore } from "@/stores/bookingCode-filter"
import useLang from "@/hooks/useLang"
import { trackBookingSearchClick } from "@/utils/tracking/booking"
@@ -27,6 +28,7 @@ import type {
BookingWidgetType,
} from "@/types/components/bookingWidget"
import type { BookingWidgetFormProps } from "@/types/components/form/bookingwidget"
import { BookingCodeFilterEnum } from "@/types/enums/bookingCodeFilter"
const formId = "booking-widget"
@@ -35,6 +37,9 @@ export default function Form({ type, onClose }: BookingWidgetFormProps) {
const pathname = usePathname()
const lang = useLang()
const [isPending, startTransition] = useTransition()
const setBookingCodeFilter = useBookingCodeFilterStore(
(state) => state.setFilter
)
const classNames = bookingWidgetVariants({
type,
@@ -67,13 +72,19 @@ export default function Form({ type, onClose }: BookingWidgetFormProps) {
startTransition(() => {
router.push(`${bookingFlowPage}?${bookingWidgetParams.toString()}`)
})
if (!data.bookingCode?.value) {
if (data.bookingCode?.value) {
// Reset the booking code filter if changed by user to "All rates"
setBookingCodeFilter(BookingCodeFilterEnum.Discounted)
if (data.bookingCode.remember) {
localStorage.setItem("bookingCode", JSON.stringify(data.bookingCode))
}
} else {
setValue("bookingCode.remember", false, {
shouldDirty: true,
})
localStorage.removeItem("bookingCode")
} else if (data.bookingCode?.remember) {
localStorage.setItem("bookingCode", JSON.stringify(data.bookingCode))
}
reset(data)
}

View File

@@ -31,11 +31,7 @@ export default function BookingCodeFilter() {
const activeCodeFilter = useBookingCodeFilterStore(
(state) => state.activeCodeFilter
)
const [filter, setFilter] = useState<BookingCodeFilterEnum>(
BookingCodeFilterEnum.Discounted
)
const setStoreFilter = useBookingCodeFilterStore((state) => state.setFilter)
const setFilter = useBookingCodeFilterStore((state) => state.setFilter)
const displayAsPopover = useMediaQuery("(min-width: 768px)")
@@ -56,7 +52,6 @@ export default function BookingCodeFilter() {
function updateFilter(selectedFilter: string) {
setFilter(selectedFilter as BookingCodeFilterEnum)
setStoreFilter(filter)
}
// To fix the hyderation error

View File

@@ -20,6 +20,7 @@ import type {
VoucherProduct,
} from "@scandic-hotels/trpc/types/roomAvailability"
import type { BookingWidgetSearchData } from "@/types/components/bookingWidget"
import type { BreakfastPackage } from "@/types/components/hotelReservation/breakfast"
import { type RoomRate } from "@/types/components/hotelReservation/enterDetails/details"
import type { Price } from "@/types/components/hotelReservation/price"
@@ -48,18 +49,18 @@ export function extractGuestFromUser(user: NonNullable<SafeUser>) {
}
export function checkIsSameBooking(
prev: SelectRateBooking & { errorCode?: string },
next: SelectRateBooking & { errorCode?: string }
prev: (SelectRateBooking | BookingWidgetSearchData) & { errorCode?: string },
next: (SelectRateBooking | BookingWidgetSearchData) & { errorCode?: string }
) {
const { rooms: prevRooms, errorCode: prevErrorCode, ...prevBooking } = prev
const prevRoomsWithoutRateCodes = prevRooms?.map(
({ rateCode, counterRateCode, roomTypeCode, bookingCode, ...room }) => room
({ adults, childrenInRoom }) => ({ adults, childrenInRoom })
)
const { rooms: nextRooms, errorCode: nextErrorCode, ...nextBooking } = next
const nextRoomsWithoutRateCodes = nextRooms?.map(
({ rateCode, counterRateCode, roomTypeCode, bookingCode, ...room }) => room
({ adults, childrenInRoom }) => ({ adults, childrenInRoom })
)
return isEqual(

View File

@@ -2,7 +2,10 @@
import { create } from "zustand"
import { parseSelectRateSearchParams, searchParamsToRecord } from "@/utils/url"
import {
parseBookingWidgetSearchParams,
searchParamsToRecord,
} from "@/utils/url"
import { checkIsSameBooking } from "./enter-details/helpers"
@@ -79,10 +82,10 @@ const useTrackingStore = create<TrackingStoreState>((set, get) => ({
if (!currentPath?.match(/^\/(da|de|en|fi|no|sv)\/(hotelreservation)/))
return false
const previousParamsObject = parseSelectRateSearchParams(
const previousParamsObject = parseBookingWidgetSearchParams(
searchParamsToRecord(previousParams)
)
const currentParamsObject = parseSelectRateSearchParams(
const currentParamsObject = parseBookingWidgetSearchParams(
searchParamsToRecord(currentParams)
)