API - Use the new Prices API.

src/api/api-roomSearch.tsx

@@ -1,24 +1,14 @@
 import { fetcherUnwraperWithFilter } from "./backend";
 import useSWR from "swr";
 import {
-  AvailabilityFilter,
+  SearchPeriodRequest,
-  AvailabilityRequest,
-  FareFilter,
-  FareRequest,
   RoomAvailabity,
-  RoomPrice,
+  RoomPriceSearchResponse,
 } from "@/model/RoomSearch";
 
-export function useAPIRoomAvailability(filter: AvailabilityFilter | null) {
+export function useAPIRoomAvailability(filter: SearchPeriodRequest | null) {
-  const request: AvailabilityRequest | null = filter
-    ? {
-        startDate: filter.startDate,
-        endDate: filter.endDate,
-      }
-    : null;
-
   const { data, isLoading, error } = useSWR(
-    request ? ["/api/search/availability", request] : null,
+    filter ? ["/api/search/availability", filter] : null,
     ([url, request]) =>
       fetcherUnwraperWithFilter<RoomAvailabity[]>(url, request),
   );
@@ -30,18 +20,10 @@ export function useAPIRoomAvailability(filter: AvailabilityFilter | null) {
   };
 }
 
-export function useAPIRoomPrices(filter: FareFilter | null) {
+export function useAPIRoomPrices(filter: SearchPeriodRequest | null) {
-  const request: FareRequest | null = filter
-    ? {
-        roomCategory: filter.roomCategory,
-        startDate: filter.startDate,
-        endDate: filter.endDate,
-      }
-    : null;
-
   const { data, isLoading, error } = useSWR(
-    request ? ["/api/search/pricesCategory", request] : null,
+    filter ? ["/api/search/prices", filter] : null,
-    ([url, request]) => fetcherUnwraperWithFilter<RoomPrice[]>(url, request),
+    ([url, request]) => fetcherUnwraperWithFilter<RoomPriceSearchResponse[]>(url, request),
   );
 
   return {

src/components/Rooms/room-booking.tsx

@@ -1,4 +1,3 @@
-import { useAPIRoomCategory } from "@/api/api-roomCategories";
 import { Card, CardContent } from "../ui/card";
 import { Typography } from "../ui/typography";
 import {
@@ -11,14 +10,14 @@ import {
 } from "../ui/table";
 import { Skeleton } from "../ui/skeleton";
 import { useAppStore } from "@/store";
-import { useAPIRoomPrices } from "@/api/api-roomSearch";
 import { NumberSelector } from "../ui/number-selector";
 import { NewBooking, NewBookingRoom } from "@/model/Bookings";
 import { RoomItemCard } from "./room-item-card";
 import { IconWithTooltip } from "../ui/icon-number-tooltip";
 import { UserIcon } from "lucide-react";
-import { makeFareFilterFromSearchFilter } from "@/utils/utils";
+import { makeSearchPeriodRequestFromSearchFilter } from "@/utils/utils";
 import { SearchFilter } from "@/model/InternalTypes";
+import { useRoomCategory, useRoomPrice } from "@/utils/apiHooks";
 
 function RoomBooking({
   roomCategoryId,
@@ -77,24 +76,17 @@ function RoomBooking({
   const canAddMoreRooms: boolean = availableAmount > totalSelectAmount;
 
   //This seems a little bit overkill, but IDK.
-  const fareFilter = makeFareFilterFromSearchFilter(
+  const fareFilter = makeSearchPeriodRequestFromSearchFilter(appSearchFilter);
-    appSearchFilter,
+
+  const { value: roomCategory, isLoading: isLoadingCategory } =
+    useRoomCategory(roomCategoryId);
+  const { value: roomPriceList, isLoading: isLoadingPrices } = useRoomPrice(
+    fareFilter,
     roomCategoryId,
   );
 
-  const {
-    roomCategory,
-    isLoading: isLoadingCategory,
-    isError: isErrorCategory,
-  } = useAPIRoomCategory(roomCategoryId);
-  const {
-    roomPriceList,
-    isLoading: isLoadingPrices,
-    isError: isErrorPrices,
-  } = useAPIRoomPrices(fareFilter);
-
   const isLoading = isLoadingCategory || isLoadingPrices;
-  const isError = isErrorCategory || isErrorPrices;
+  const isError = roomCategory == null;
 
   if (isLoading) {
     return <Skeleton className="mx-auto h-[150px] w-[600px]" />;

src/components/booking/booking-details.tsx

@@ -19,7 +19,7 @@ export function BookingDetails({
   mode: BookingDetailsModes;
 }) {
   const bookingData = useAppStore((state) => state.currentBooking);
-  const roomCategoryList = useAPIRoomCategoryList();
+  const { roomCategoryList } = useAPIRoomCategoryList();
 
   const onBtBookingClick = () => {
     if (onBookingConfirm) {
@@ -43,9 +43,7 @@ export function BookingDetails({
   }
 
   const roomList = bookingData.rooms.map((room) => {
-    const category = roomCategoryList.roomCategoryList
+    const category = roomCategoryList?.find((c) => c.id == room.roomCategory);
-      ?.filter((c) => c.id == room.roomCategory)
-      .at(0);
     const photo = category?.roomCategoryPhotos.at(0);
 
     return (
@@ -101,10 +99,7 @@ export function BookingDetails({
           Arrival: {bookingData.arrivalDate.toLocaleDateString()} - Departure:{" "}
           {bookingData.departureDate.toLocaleDateString()} <br></br>
           Number of nights:{" "}
-          {differenceInDays(
+          {differenceInDays(bookingData.departureDate, bookingData.arrivalDate)}
-            bookingData.departureDate,
-            bookingData.arrivalDate,
-          ) + 1}
         </Typography>
         <Separator className="my-2"></Separator>
         <Typography variant={"h3"}>Your Rooms</Typography>

src/model/RoomSearch.ts

@@ -8,24 +8,12 @@ export type RoomPrice = {
   price: number;
 };
 
-export type AvailabilityRequest = {
+export type SearchPeriodRequest = {
   startDate: string;
   endDate: string;
 };
 
-export type AvailabilityFilter = {
+export type RoomPriceSearchResponse = {
-  startDate: string;
+  roomCategoryId: number;
-  endDate: string;
+  prices: RoomPrice[];
-};
-
-export type FareRequest = {
-  roomCategory: number;
-  startDate: string;
-  endDate: string;
-};
-
-export type FareFilter = {
-  roomCategory: number;
-  startDate: string;
-  endDate: string;
 };

src/routes/search-page.tsx

@@ -11,8 +11,8 @@ import { eBookingState } from "@/utils/AppStateManager";
 import { useAppStore } from "@/store";
 import {
   isValidSearchFilter,
-  makeAvailabilityFilterFromSearchFilter,
   makeDayUTCDate,
+  makeSearchPeriodRequestFromSearchFilter,
 } from "@/utils/utils";
 import { useNavigate } from "react-router-dom";
 
@@ -31,7 +31,7 @@ function SearchPage() {
     isLoading: isLoadingAvailability,
     isError: isErrorAvailability,
   } = useAPIRoomAvailability(
-    makeAvailabilityFilterFromSearchFilter(appSearchFilter) ?? null,
+    makeSearchPeriodRequestFromSearchFilter(appSearchFilter) ?? null,
   );
   const isLoading = isLoadingAvailability;
   const isError = isErrorAvailability;

src/utils/apiHooks.ts

@@ -0,0 +1,59 @@
+import { useAPIRoomCategoryList } from "@/api/api-roomCategories";
+import { useAPIRoomPrices } from "@/api/api-roomSearch";
+import { RoomCategory } from "@/model/RoomCategory";
+import { RoomPrice, SearchPeriodRequest } from "@/model/RoomSearch";
+
+export function useRoomCategory(roomCategoryId: number): {
+  value: RoomCategory | null;
+  isLoading: boolean;
+} {
+  const { roomCategoryList, isLoading, isError } = useAPIRoomCategoryList();
+
+  if (isLoading) {
+    return {
+      value: null,
+      isLoading: true,
+    };
+  }
+  if (isError) {
+    return {
+      value: null,
+      isLoading: false,
+    };
+  }
+
+  const roomCategoryItem = roomCategoryList?.find(
+    (i) => i.id == roomCategoryId,
+  );
+
+  return { value: roomCategoryItem ?? null, isLoading: isLoading };
+}
+
+export function useRoomPrice(
+  filter: SearchPeriodRequest | null,
+  roomCategoryId: number,
+): {
+  value: RoomPrice[];
+  isLoading: boolean;
+} {
+  const { roomPriceList, isLoading, isError } = useAPIRoomPrices(filter);
+
+  if (isLoading) {
+    return {
+      value: [],
+      isLoading: true,
+    };
+  }
+  if (isError) {
+    return {
+      value: [],
+      isLoading: false,
+    };
+  }
+
+  const roomPrice = roomPriceList?.find(
+    (i) => i.roomCategoryId == roomCategoryId,
+  );
+
+  return { value: roomPrice?.prices ?? [], isLoading: isLoading };
+}

src/utils/hooks.ts

@@ -2,7 +2,13 @@ import { useAPIConfigVarList } from "@/api/api-configVars";
 import { getConfigVarFromList } from "./utils";
 import { eConfigVarKeys } from "@/model/ConfigVar";
 
-export function useConfigVariable(key: eConfigVarKeys, defaultValue: string) {
+export function useConfigVariable(
+  key: eConfigVarKeys,
+  defaultValue: string,
+): {
+  value: string;
+  isLoading: boolean;
+} {
   const { configVarList, isLoading } = useAPIConfigVarList();
 
   if (isLoading) {

src/utils/utils.ts

@@ -1,4 +1,4 @@
-import { AvailabilityFilter, FareFilter } from "@/model/RoomSearch";
+import { SearchPeriodRequest } from "@/model/RoomSearch";
 import { SearchFilter } from "@/model/InternalTypes";
 import { ConfigVar } from "@/model/ConfigVar";
 
@@ -25,9 +25,9 @@ export function isValidSearchFilter(sf: SearchFilter): boolean {
   return false;
 }
 
-export function makeAvailabilityFilterFromSearchFilter(
+export function makeSearchPeriodRequestFromSearchFilter(
   sf: SearchFilter,
-): AvailabilityFilter | null {
+): SearchPeriodRequest | null {
   if (!isValidSearchFilter(sf)) {
     return null;
   }
@@ -37,21 +37,6 @@ export function makeAvailabilityFilterFromSearchFilter(
   };
 }
 
-export function makeFareFilterFromSearchFilter(
-  sf: SearchFilter,
-  roomCategoryId: number,
-): FareFilter | null {
-  if (!isValidSearchFilter(sf) || roomCategoryId < 0) {
-    return null;
-  }
-
-  return {
-    startDate: sf.dateRange.from!.toISOString(),
-    endDate: sf.dateRange.to!.toISOString(),
-    roomCategory: roomCategoryId,
-  };
-}
-
 export function getConfigVarFromList(
   varList: ConfigVar[] | undefined,
   key: string,