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

feat(BOOK-463): Fetching hotel filters from CMS and using these inside the destination pages and select hotel page

Browse Source 
* feat(BOOK-463): Fetching hotel filters from CMS and using these inside the destination pages

* fix(BOOK-698): fetch hotel filters from CMS on select hotel page

Approved-by: Bianca Widstam
This commit is contained in:
Erik Tiekstra
2026-01-12 12:02:25 +00:00
parent b2ca2c2612
commit 0c6a4cf186
40 changed files with 732 additions and 399 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
apps/scandic-web/stores/hotel-listing-data/index.ts
View File

@@ -8,9 +8,14 @@ import {
trackSortingChangeEvent,
} from "@/utils/tracking/destinationPage"
import { getFilteredHotels, getSortedHotels, isValidSortOption } from "./helper"
import {
getFilteredHotels,
getFiltersWithHotelCount,
getSortedHotels,
isValidSortOption,
} from "./helper"
import type { HotelFilter } from "@scandic-hotels/trpc/types/hotel"
import type { HotelFilter } from "@scandic-hotels/trpc/routers/hotels/filters/output"
import type {
HotelListingDataState,
@@ -25,11 +30,10 @@ export function createHotelListingDataStore({
}: InitialState) {
const defaultSort =
sortItems.find((s) => s.isDefault)?.value ?? sortItems[0].value
const allFilterSlugs = Object.values(allFilters).flatMap(
(filter: HotelFilter[]) => filter.map((f) => f.slug)
)
const allFlattenedFilters = Object.values(allFilters).flat()
const allFilterSlugs = allFlattenedFilters.map((filter) => filter.slug)
const activeFilters: string[] = []
const activeFilters: HotelFilter[] = []
let activeSort = defaultSort
if (searchParams) {
@@ -43,8 +47,9 @@ export function createHotelListingDataStore({
if (filterParam) {
const filters = filterParam.split(",")
filters.forEach((filter) => {
if (allFilterSlugs.includes(filter)) {
activeFilters.push(filter)
const filterFromUrl = allFlattenedFilters.find((f) => f.slug === filter)
if (filterFromUrl) {
activeFilters.push(filterFromUrl)
}
})
}
@@ -52,15 +57,20 @@ export function createHotelListingDataStore({
const filteredHotels = getFilteredHotels(allHotels, activeFilters)
const activeHotels = getSortedHotels(filteredHotels, activeSort)
const filtersWithCount = getFiltersWithHotelCount(allFilters, filteredHotels)
return create<HotelListingDataState>((set) => ({
actions: {
updateActiveFiltersAndSort(filters, sort) {
updateActiveFiltersAndSort(filterSlugs, sort) {
return set(
produce((state: HotelListingDataState) => {
const newSort =
sort && isValidSortOption(sort, state.sortItems)
? sort
: state.defaultSort
const filters = allFlattenedFilters.filter((filter) =>
filterSlugs.includes(filter.slug)
)
const filteredHotels = getFilteredHotels(state.allHotels, filters)
const sortedHotels = getSortedHotels(filteredHotels, newSort)
@@ -71,16 +81,22 @@ export function createHotelListingDataStore({
if (
JSON.stringify(filters) !== JSON.stringify(state.activeFilters)
) {
const facilityFiltersUsed = filters.filter((f) =>
state.allFilters.facilityFilters
.map((ff) => ff.slug)
.includes(f)
)
const surroundingsFiltersUsed = filters.filter((f) =>
state.allFilters.surroundingsFilters
.map((sf) => sf.slug)
.includes(f)
)
const facilityFiltersUsed = filters
.filter(
(f) =>
!!state.allFilters.facilityFilters.find(
(ff) => ff.id === f.id
)
)
.map((f) => f.slug)
const surroundingsFiltersUsed = filters
.filter(
(f) =>
!!state.allFilters.surroundingsFilters.find(
(sf) => sf.id === f.id
)
)
.map((f) => f.slug)
trackFilterChangeEvent(
facilityFiltersUsed,
@@ -116,14 +132,23 @@ export function createHotelListingDataStore({
togglePendingFilter(filter) {
return set(
produce((state: HotelListingDataState) => {
const isActive = state.pendingFilters.includes(filter)
const filterId = filter.id
const isActive = !!state.pendingFilters.find(
(pf) => pf.id === filterId
)
const filters = isActive
? state.pendingFilters.filter((f) => f !== filter)
? state.pendingFilters.filter((pf) => pf.id !== filterId)
: [...state.pendingFilters, filter]
const pendingHotels = getFilteredHotels(state.allHotels, filters)
const pendingFiltersWithCount = getFiltersWithHotelCount(
state.allFilters,
pendingHotels
)
state.pendingFilters = filters
state.pendingHotelCount = pendingHotels.length
state.filtersWithCount = pendingFiltersWithCount
})
)
},
@@ -132,6 +157,10 @@ export function createHotelListingDataStore({
produce((state: HotelListingDataState) => {
state.pendingFilters = []
state.pendingHotelCount = state.allHotels.length
state.filtersWithCount = getFiltersWithHotelCount(
state.allFilters,
state.allHotels
)
})
)
},
@@ -141,6 +170,10 @@ export function createHotelListingDataStore({
state.pendingFilters = state.activeFilters
state.pendingSort = state.activeSort
state.pendingHotelCount = state.activeHotels.length
state.filtersWithCount = getFiltersWithHotelCount(
state.allFilters,
state.activeHotels
)
})
)
},
@@ -154,6 +187,7 @@ export function createHotelListingDataStore({
activeFilters,
pendingFilters: activeFilters,
allFilters,
filtersWithCount,
allFilterSlugs,
sortItems,
isLoading: false,