Merged in fix/book-674-select-hotel-infinite-loop (pull request #3351)

fix(BOOK-674): Refactor how we handle hotel filters

* Refactor hotel filters store to URL state

* Rename hotel filter store


Approved-by: Joakim Jäderberg

packages/booking-flow/lib/components/HotelCardListing/index.tsx

@@ -24,9 +24,10 @@ import {
   BookingCodeFilterEnum,
   useBookingCodeFilterStore,
 } from "../../stores/bookingCode-filter"
-import { useHotelFilterStore } from "../../stores/hotel-filters"
+import { useHotelResultCountStore } from "../../stores/hotel-result-count"
 import { useHotelsMapStore } from "../../stores/hotels-map"
 import { HotelDetailsSidePeek } from "../HotelDetailsSidePeek"
+import { useHotelFilters } from "../SelectHotel/Filters/useHotelFilters"
 import { DEFAULT_SORT } from "../SelectHotel/HotelSorter"
 import { getSortedHotels } from "./utils"
 
@@ -57,8 +58,10 @@ export default function HotelCardListing({
   const intl = useIntl()
   const isUserLoggedIn = useIsLoggedIn()
   const searchParams = useSearchParams()
-  const activeFilters = useHotelFilterStore((state) => state.activeFilters)
-  const setResultCount = useHotelFilterStore((state) => state.setResultCount)
+  const [activeFilters] = useHotelFilters(null)
+  const setResultCount = useHotelResultCountStore(
+    (state) => state.setResultCount
+  )
   const { activeHotel, activate, disengage, engage } = useHotelsMapStore()
   const { showBackToTop, scrollToTop } = useScrollToTop({ threshold: 490 })
   const activeCardRef = useRef<HTMLDivElement | null>(null)
@@ -150,7 +153,7 @@ export default function HotelCardListing({
     if (type === HotelCardListingTypeEnum.PageListing) {
       setResultCount(hotels.length, unfilteredHotelCount)
     }
-  }, [hotels, setResultCount, type, unfilteredHotelCount])
+  }, [hotels.length, setResultCount, type, unfilteredHotelCount])
 
   function isHotelActiveInMapView(hotelName: string): boolean {
     return (