@qite/tide-booking-component 1.4.85 → 1.4.87

package/src/search-results/components/search-results-container/search-results-container.tsx

@@ -13,7 +13,8 @@ import {
   setFlyInIsOpen,
   setFilteredResults,
   setPackagingAccoResults,
-  setFilteredPackagingAccoResults
+  setFilteredPackagingAccoResults,
+  setPackagingAccoSearchDetails
 } from '../../store/search-results-slice';
 import { Filter, SortByType } from '../../types';
 import useMediaQuery from '../../../shared/utils/use-media-query-util';
@@ -575,9 +576,9 @@ const SearchResultsContainer: React.FC = () => {
 
   // Seperate detailsCall
   useEffect(() => {
-    const fetchPackageDetails = async () => {
-      if ((!selectedSearchResultId && !selectedPackagingAccoResultCode) || !context) return;
-
+    const fetchDetails = async () => {
+      console.log('Fetching details for selected search result', selectedSearchResultId);
+      if (!selectedSearchResultId || !context) return;
       if (context?.searchConfiguration.qsmType === PortalQsmType.Accommodation || context?.searchConfiguration.qsmType === PortalQsmType.GroupTour) {
         handleFlyInToggle(true);
       }
@@ -631,17 +632,111 @@ const SearchResultsContainer: React.FC = () => {
           console.log('Details:', detailsResponse);
           dispatch(setBookingPackageDetails({ details: detailsResponse?.payload }));
         } else {
-          const detailsWLResponse = await detailsWL(config, detailsRequest);
-          console.log('Details with entryLight:', detailsWLResponse);
-          dispatch(setBookingPackageDetails({ details: detailsWLResponse?.payload?.bookingPackage }));
-          dispatch(setEntry({ entry: detailsWLResponse?.payload?.entry }));
+          // const detailsWLResponse = await detailsWL(config, detailsRequest);
+          // console.log('Details with entryLight:', detailsWLResponse);
+          // dispatch(setBookingPackageDetails({ details: detailsWLResponse?.payload?.bookingPackage }));
+          // dispatch(setEntry({ entry: detailsWLResponse?.payload?.entry }));
+
+          const detailsResponse = await details(config, detailsRequest);
+          dispatch(setBookingPackageDetails({ details: detailsResponse?.payload }));
         }
       } catch (err) {
         console.error('Failed to fetch package details', err);
       }
     };
 
-    fetchPackageDetails();
+    const fetchPackagingAccoSearchDetails = async () => {
+      if (!selectedPackagingAccoResultCode || !context) return;
+
+      if (context?.searchConfiguration.qsmType === PortalQsmType.Accommodation || context?.searchConfiguration.qsmType === PortalQsmType.GroupTour) {
+        handleFlyInToggle(true);
+      }
+
+      try {
+        const config: TideClientConfig = {
+          host: context.tideConnection.host,
+          apiKey: context.tideConnection.apiKey
+        };
+
+        console.log('selectedPackagingAccoResultCode', selectedPackagingAccoResultCode);
+        const selectedItem = packagingAccoResults.find((r) => r.code === selectedPackagingAccoResultCode);
+        console.log('Selected packaging acco item', selectedItem);
+        if (!selectedItem) {
+          // TODO: handle this case better, show an error message to the user
+          return;
+        }
+
+        const params = new URLSearchParams(location.search);
+        const rooms = getRoomsFromParams(params, 'rooms');
+        let tagId = getNumberFromParams(params, 'tagId');
+        let agentId = getNumberFromParams(params, 'agentId');
+
+        let destinationAirport = getStringFromParams(params, 'destinationAirport');
+
+        let destinationId: number | null = null;
+        let destinationIsCountry = false;
+        let destinationIsRegion = false;
+        let destinationIsOord = false;
+        let destinationIsLocation = false;
+        let destinationCode: string | null = null;
+        let destinationIsAirport = false;
+
+        if (selectedItem.countryId) {
+          destinationId = selectedItem.countryId;
+          destinationIsCountry = true;
+        } else if (selectedItem.regionId) {
+          destinationId = selectedItem.regionId;
+          destinationIsRegion = true;
+        } else if (selectedItem.oordId) {
+          destinationId = selectedItem.oordId;
+          destinationIsOord = true;
+        } else if (selectedItem.locationId) {
+          destinationId = selectedItem.locationId;
+          destinationIsLocation = true;
+        } else if (destinationAirport) {
+          destinationCode = destinationAirport;
+          destinationIsAirport = true;
+        }
+
+        const detailSearchRequest: PackagingAccommodationRequest = {
+          officeId: 1,
+          portalId: context.portalId,
+          agentId: agentId ?? null,
+          catalogueId: context!.searchConfiguration.defaultCatalogueId ?? 0,
+          searchConfigurationId: context!.searchConfiguration.id,
+          vendorConfigurationId: selectedItem.vendorId,
+          language: context!.languageCode ?? 'en-GB',
+          serviceType: 3,
+          fromDate: selectedItem.fromDate,
+          toDate: selectedItem.toDate,
+          destination: {
+            id: Number(destinationId),
+            isCountry: destinationIsCountry,
+            isRegion: destinationIsRegion,
+            isOord: destinationIsOord,
+            isLocation: destinationIsLocation,
+            isAirport: destinationIsAirport,
+            code: destinationCode
+          } as PackagingDestination,
+          productCode: selectedItem.code ? selectedItem.code : '',
+          rooms: getPackagingRequestRooms(rooms),
+          tagIds: tagId ? [tagId] : []
+        };
+
+        const packageAccoSearchDetails = await searchPackagingAccommodations(config, detailSearchRequest);
+        console.log('Packaging Acco Search details', packageAccoSearchDetails);
+        dispatch(setPackagingAccoSearchDetails(packageAccoSearchDetails));
+      } catch (err) {
+        console.error('Failed to fetch package details', err);
+      }
+    };
+
+    if (selectedSearchResultId) {
+      fetchDetails();
+    }
+    if (selectedPackagingAccoResultCode) {
+      fetchPackagingAccoSearchDetails();
+    }
   }, [selectedSearchResultId, selectedPackagingAccoResultCode]);
 
   useEffect(() => {

package/src/search-results/store/search-results-slice.ts

@@ -8,6 +8,7 @@ export interface SearchResultsState {
   selectedSearchResultId: number | null;
   packagingAccoResults: PackagingAccommodationResponse[];
   filteredPackagingAccoResults: PackagingAccommodationResponse[];
+  packagingAccoSearchDetails: PackagingAccommodationResponse[];
   selectedPackagingAccoResultCode: string | null;
   selectedFlight: ExtendedFlightSearchResponseItem | null;
   selectedFlightDetails: ExtendedFlightSearchResponseItem | null;
@@ -27,6 +28,7 @@ const initialState: SearchResultsState = {
   selectedSearchResultId: null,
   packagingAccoResults: [],
   filteredPackagingAccoResults: [],
+  packagingAccoSearchDetails: [],
   selectedPackagingAccoResultCode: null,
   selectedFlight: null,
   selectedFlightDetails: null,
@@ -59,6 +61,9 @@ const searchResultsSlice = createSlice({
     setFilteredPackagingAccoResults(state, action: PayloadAction<PackagingAccommodationResponse[]>) {
       state.filteredPackagingAccoResults = action.payload;
     },
+    setPackagingAccoSearchDetails(state, action: PayloadAction<PackagingAccommodationResponse[]>) {
+      state.packagingAccoSearchDetails = action.payload;
+    },
     setSelectedPackagingAccoResult(state, action: PayloadAction<string | null>) {
       state.selectedPackagingAccoResultCode = action.payload;
     },
@@ -133,6 +138,7 @@ export const {
   setSelectedSearchResult,
   setPackagingAccoResults,
   setFilteredPackagingAccoResults,
+  setPackagingAccoSearchDetails,
   setSelectedPackagingAccoResult,
   setSelectedFlight,
   setSelectedFlightDetails,

package/src/search-results/types.ts

@@ -1,4 +1,4 @@
-import { FlightSearchResponseItem, WebsiteConfigurationSearchConfiguration } from '@qite/tide-client';
+import { BookingPackageItem, FlightSearchResponseItem, WebsiteConfigurationSearchConfiguration } from '@qite/tide-client';
 import { ReactNode } from 'react';
 
 export type FlightSelectionMode = 'paired' | 'independent';
@@ -51,6 +51,7 @@ export interface SearchResultsConfiguration {
   languageCode?: string;
 
   destinationImage?: { url: string; alt: string };
+  onBook?: (result: BookingPackageItem) => void;
 }
 
 export type FilterType = 'checkbox' | 'toggle' | 'slider' | 'star-rating';