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

Merged in fix/sw-1144-prefill-filters (pull request #1049)

Browse Source 
fix(SW-1144): preselect room features from URL

* fix(SW-1144): preselect room features from URL


Approved-by: Bianca Widstam
Approved-by: Pontus Dreij
This commit is contained in:
Niclas Edenvin
2024-12-10 12:50:15 +00:00
parent 463354f10b
commit f98b07ab22
2 changed files with 44 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
components/HotelReservation/SelectRate/RoomFilter/index.tsx
View File

@@ -1,6 +1,7 @@
"use client" "use client"
import { zodResolver } from "@hookform/resolvers/zod" import { zodResolver } from "@hookform/resolvers/zod"
import { useSearchParams } from "next/navigation"
import { useCallback, useEffect, useMemo, useState } from "react" import { useCallback, useEffect, useMemo, useState } from "react"
import { FormProvider, useForm } from "react-hook-form" import { FormProvider, useForm } from "react-hook-form"
import { useIntl } from "react-intl" import { useIntl } from "react-intl"
@@ -30,17 +31,22 @@ export default function RoomFilter({
const isTabletAndUp = useMediaQuery("(min-width: 768px)") const isTabletAndUp = useMediaQuery("(min-width: 768px)")
const [isAboveMobile, setIsAboveMobile] = useState(false) const [isAboveMobile, setIsAboveMobile] = useState(false)
const initialFilterValues = useMemo( const searchParams = useSearchParams()
() => const initialFilterValues = useMemo(() => {
filterOptions.reduce( const packagesFromSearchParams =
(acc, option) => { searchParams.get("room[0].packages")?.split(",") ?? []
acc[option.code] = false
return acc const values = filterOptions.reduce(
}, (acc, option) => {
{} as Record<string, boolean | undefined> acc[option.code] = packagesFromSearchParams.includes(option.code)
), return acc
[filterOptions] },
) {} as Record<string, boolean | undefined>
)
onFilter(values)
return values
}, [filterOptions, onFilter, searchParams])
const intl = useIntl() const intl = useIntl()
const methods = useForm<Record<string, boolean | undefined>>({ const methods = useForm<Record<string, boolean | undefined>>({

50
components/HotelReservation/SelectRate/Rooms/index.tsx
View File

@@ -35,29 +35,33 @@ export default function Rooms({
const [selectedPackages, setSelectedPackages] = useState<RoomPackageCodes[]>( const [selectedPackages, setSelectedPackages] = useState<RoomPackageCodes[]>(
[] []
) )
const defaultPackages: DefaultFilterOptions[] = [
{ const defaultPackages: DefaultFilterOptions[] = useMemo(
code: RoomPackageCodeEnum.ACCESSIBILITY_ROOM, () => [
description: "Accessible Room", {
itemCode: availablePackages.find( code: RoomPackageCodeEnum.ACCESSIBILITY_ROOM,
(pkg) => pkg.code === RoomPackageCodeEnum.ACCESSIBILITY_ROOM description: "Accessible Room",
)?.itemCode, itemCode: availablePackages.find(
}, (pkg) => pkg.code === RoomPackageCodeEnum.ACCESSIBILITY_ROOM
{ )?.itemCode,
code: RoomPackageCodeEnum.ALLERGY_ROOM, },
description: "Allergy Room", {
itemCode: availablePackages.find( code: RoomPackageCodeEnum.ALLERGY_ROOM,
(pkg) => pkg.code === RoomPackageCodeEnum.ALLERGY_ROOM description: "Allergy Room",
)?.itemCode, itemCode: availablePackages.find(
}, (pkg) => pkg.code === RoomPackageCodeEnum.ALLERGY_ROOM
{ )?.itemCode,
code: RoomPackageCodeEnum.PET_ROOM, },
description: "Pet Room", {
itemCode: availablePackages.find( code: RoomPackageCodeEnum.PET_ROOM,
(pkg) => pkg.code === RoomPackageCodeEnum.PET_ROOM description: "Pet Room",
)?.itemCode, itemCode: availablePackages.find(
}, (pkg) => pkg.code === RoomPackageCodeEnum.PET_ROOM
] )?.itemCode,
},
],
[availablePackages]
)
const handleFilter = useCallback( const handleFilter = useCallback(
(filter: Record<RoomPackageCodeEnum, boolean | undefined>) => { (filter: Record<RoomPackageCodeEnum, boolean | undefined>) => {