@qite/tide-booking-component 1.4.103 → 1.4.104

package/build/build-cjs/index.js

@@ -21756,7 +21756,11 @@ var FlightOptionsForm = function () {
     setFlightGroups = _f[1];
   var handleSubmit = function (e) {
     if (settings.skipRouter) {
-      dispatch(setCurrentStep(ROOM_OPTIONS_FORM_STEP));
+      if (settings.roomOptions.isHidden) {
+        dispatch(setCurrentStep(OPTIONS_FORM_STEP));
+      } else {
+        dispatch(setCurrentStep(ROOM_OPTIONS_FORM_STEP));
+      }
     } else {
       if (settings.roomOptions.isHidden) {
         navigate(
@@ -33857,21 +33861,28 @@ var initialState$1 = {
   packagingAccoSearchDetails: [],
   selectedPackagingAccoResultCode: null,
   packagingFlightResults: [],
+  filteredPackagingFlightResults: [],
   selectedPackagingFlight: null,
+  selectedOutwardKey: null,
+  selectedReturnKey: null,
   selectedFlight: null,
   selectedFlightDetails: null,
   bookingPackageDetails: null,
+  priceDetails: null,
   isLoading: false,
   flightsLoading: false,
-  filters: [],
   selectedSortType: null,
+  selectedFlightSortType: null,
+  initialFilters: [],
+  filters: [],
+  initialFlightFilters: [],
+  flightFilters: [],
   activeTab: 'compact',
   currentPage: 1,
+  transactionId: null,
   flyInIsOpen: false,
+  flyInType: null,
   editablePackagingEntry: null,
-  transactionId: null,
-  accommodationFlyInStep: 'details',
-  priceDetails: null,
   itinerary: null
 };
 var searchResultsSlice = toolkit.createSlice({
@@ -33902,6 +33913,9 @@ var searchResultsSlice = toolkit.createSlice({
     setPackagingFlightResults: function (state, action) {
       state.packagingFlightResults = action.payload;
     },
+    setFilteredPackagingFlightResults: function (state, action) {
+      state.filteredPackagingFlightResults = action.payload;
+    },
     setSelectedPackagingFlight: function (state, action) {
       state.selectedPackagingFlight = action.payload;
     },
@@ -33930,6 +33944,9 @@ var searchResultsSlice = toolkit.createSlice({
     setFlightsLoading: function (state, action) {
       state.flightsLoading = action.payload;
     },
+    setInitialFilters: function (state, action) {
+      state.initialFilters = action.payload;
+    },
     setFilters: function (state, action) {
       var updatedFilters = action.payload;
       updatedFilters.forEach(function (updatedFilter) {
@@ -33946,9 +33963,31 @@ var searchResultsSlice = toolkit.createSlice({
     resetFilters: function (state, action) {
       state.filters = action.payload;
     },
+    setInitialFlightFilters: function (state, action) {
+      state.initialFlightFilters = action.payload;
+    },
+    setFlightFilters: function (state, action) {
+      var updatedFilters = action.payload;
+      updatedFilters.forEach(function (updatedFilter) {
+        var existingIndex = state.flightFilters.findIndex(function (f) {
+          return f.property === updatedFilter.property;
+        });
+        if (existingIndex !== -1) {
+          state.flightFilters[existingIndex] = updatedFilter;
+        } else {
+          state.flightFilters.push(updatedFilter); // Optional: Add new filters if not present
+        }
+      });
+    },
+    resetFlightFilters: function (state, action) {
+      state.flightFilters = action.payload;
+    },
     setSortType: function (state, action) {
       state.selectedSortType = action.payload;
     },
+    setFlightSortType: function (state, action) {
+      state.selectedFlightSortType = action.payload;
+    },
     setActiveTab: function (state, action) {
       state.activeTab = action.payload;
     },
@@ -33972,14 +34011,24 @@ var searchResultsSlice = toolkit.createSlice({
     setTransactionId: function (state, action) {
       state.transactionId = action.payload;
     },
-    setAccommodationFlyInStep: function (state, action) {
-      state.accommodationFlyInStep = action.payload;
+    setFlyInType: function (state, action) {
+      state.flyInType = action.payload;
     },
     setPriceDetails: function (state, action) {
       state.priceDetails = action.payload;
     },
     setItinerary: function (state, action) {
       state.itinerary = action.payload;
+    },
+    setSelectedOutwardKey: function (state, action) {
+      state.selectedOutwardKey = action.payload;
+    },
+    setSelectedReturnKey: function (state, action) {
+      state.selectedReturnKey = action.payload;
+    },
+    resetFlightSelection: function (state) {
+      state.selectedOutwardKey = null;
+      state.selectedReturnKey = null;
     }
   }
 });
@@ -33988,6 +34037,7 @@ var setResults = ((_a = searchResultsSlice.actions), _a.setResults),
   setSelectedSearchResult = _a.setSelectedSearchResult,
   setPackagingAccoResults = _a.setPackagingAccoResults,
   setFilteredPackagingAccoResults = _a.setFilteredPackagingAccoResults,
+  setFilteredPackagingFlightResults = _a.setFilteredPackagingFlightResults,
   setPackagingAccoSearchDetails = _a.setPackagingAccoSearchDetails,
   setSelectedPackagingAccoResult = _a.setSelectedPackagingAccoResult,
   setPackagingFlightResults = _a.setPackagingFlightResults,
@@ -33998,18 +34048,26 @@ var setResults = ((_a = searchResultsSlice.actions), _a.setResults),
 _a.selectFlight;
 var setIsLoading = _a.setIsLoading,
   setFlightsLoading = _a.setFlightsLoading,
+  setInitialFilters = _a.setInitialFilters,
   setFilters = _a.setFilters,
   resetFilters = _a.resetFilters,
+  setInitialFlightFilters = _a.setInitialFlightFilters,
+  setFlightFilters = _a.setFlightFilters,
+  resetFlightFilters = _a.resetFlightFilters,
   setSortType = _a.setSortType,
+  setFlightSortType = _a.setFlightSortType,
   setActiveTab = _a.setActiveTab;
 _a.setCurrentPage;
 _a.resetSearchState;
 var setFlyInIsOpen = _a.setFlyInIsOpen,
   setEditablePackagingEntry = _a.setEditablePackagingEntry,
   setTransactionId = _a.setTransactionId,
-  setAccommodationFlyInStep = _a.setAccommodationFlyInStep,
+  setFlyInType = _a.setFlyInType,
   setPriceDetails = _a.setPriceDetails,
-  setItinerary = _a.setItinerary;
+  setItinerary = _a.setItinerary,
+  setSelectedOutwardKey = _a.setSelectedOutwardKey,
+  setSelectedReturnKey = _a.setSelectedReturnKey;
+_a.resetFlightSelection;
 var searchResultsReducer = searchResultsSlice.reducer;
 
 var ItemPicker = function (_a) {
@@ -43637,7 +43695,7 @@ var mapPackagingAccoResult = function (searchResult, cmsItem, languageCode, tran
     contents: searchResult.contents
   });
 };
-var renderHotelResults = function (results, context, activeTab, translations) {
+var renderHotelResults = function (results, context, activeTab, translations, selectedPackagingAccoResult, isFlyIn) {
   var renderedResults = results.map(function (result, index) {
     var _a;
     var key = ''.concat((_a = result.id) !== null && _a !== void 0 ? _a : result.code, '-').concat(index);
@@ -43652,13 +43710,22 @@ var renderHotelResults = function (results, context, activeTab, translations) {
   return React__default['default'].createElement(
     'div',
     { className: 'search__results__cards '.concat(activeTab ? 'search__results__cards--'.concat(activeTab) : '') },
+    selectedPackagingAccoResult &&
+      !isFlyIn &&
+      React__default['default'].createElement(HotelCard, {
+        key: selectedPackagingAccoResult.code,
+        result: selectedPackagingAccoResult,
+        translations: translations
+      }),
     renderedResults
   );
 };
 var HotelAccommodationResults = function (_a) {
   var _b, _c;
-  var isLoading = _a.isLoading;
+  var isLoading = _a.isLoading,
+    isFlyIn = _a.isFlyIn;
   var context = React.useContext(SearchResultsConfigurationContext);
+  var dispatch = reactRedux.useDispatch();
   if (!context) {
     return null;
   }
@@ -43668,7 +43735,10 @@ var HotelAccommodationResults = function (_a) {
     }),
     filteredResults = _d.filteredResults,
     filteredPackagingAccoResults = _d.filteredPackagingAccoResults,
+    packagingAccoResults = _d.packagingAccoResults,
     activeTab = _d.activeTab;
+  _d.flyInIsOpen;
+  var selectedPackagingAccoResultCode = _d.selectedPackagingAccoResultCode;
   var cmsMap = React__default['default'].useMemo(
     function () {
       var _a;
@@ -43731,193 +43801,1188 @@ var HotelAccommodationResults = function (_a) {
       : firstPackagingResult.fromDate;
   var firstResultDay = firstResultDate ? dateFns.format(dateFns.parseISO(firstResultDate), 'd') : null;
   var firstResultMonth = firstResultDate ? dateFns.format(dateFns.parseISO(firstResultDate), 'MMM') : null;
+  var selectedPackagingAccoResult = React__default['default'].useMemo(
+    function () {
+      var selectedResult = packagingAccoResults.find(function (result) {
+        return result.code === selectedPackagingAccoResultCode;
+      });
+      if (selectedResult) {
+        return mapPackagingAccoResult(selectedResult, cmsMap.get(selectedResult.code), context.languageCode, translations);
+      }
+    },
+    [packagingAccoResults, selectedPackagingAccoResultCode, cmsMap, context.languageCode, translations]
+  );
+  var visibleResults = React__default['default'].useMemo(
+    function () {
+      var shouldShowAll =
+        (context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) !== build.PortalQsmType.AccommodationAndFlight || isFlyIn;
+      if (shouldShowAll) {
+        return mappedResults;
+      }
+      if (selectedPackagingAccoResult) {
+        return mappedResults
+          .filter(function (result) {
+            return result.code !== selectedPackagingAccoResult.code;
+          })
+          .slice(0, 2);
+      }
+      return mappedResults.slice(0, 3);
+    },
+    [context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType, mappedResults, isFlyIn, selectedPackagingAccoResult]
+  );
+  var handleShowMoreHotels = function (flyInType) {
+    dispatch(setFlyInType(flyInType));
+    dispatch(setFlyInIsOpen(true));
+  };
   return React__default['default'].createElement(
     React__default['default'].Fragment,
     null,
-    React__default['default'].createElement(
-      'div',
-      { className: 'search__results__label search__results__label--secondary' },
-      React__default['default'].createElement(
-        'div',
-        { className: 'search__results__label__date' },
-        firstResultDay && firstResultMonth
-          ? React__default['default'].createElement(
-              React__default['default'].Fragment,
-              null,
-              React__default['default'].createElement('p', { className: 'search__results__label__date-date' }, firstResultDay),
-              React__default['default'].createElement('p', null, firstResultMonth)
-            )
-          : React__default['default'].createElement(Icon$1, { name: 'ui-bed', height: 16, fill: 'white' })
-      ),
+    !isFlyIn &&
       React__default['default'].createElement(
         'div',
-        { className: 'search__results__label__text' },
+        { className: 'search__results__label search__results__label--secondary' },
         React__default['default'].createElement(
-          'h3',
-          null,
-          translations.SRP.SELECT,
-          ' ',
-          React__default['default'].createElement('strong', null, translations.SRP.ACCOMMODATION)
+          'div',
+          { className: 'search__results__label__date' },
+          firstResultDay && firstResultMonth
+            ? React__default['default'].createElement(
+                React__default['default'].Fragment,
+                null,
+                React__default['default'].createElement('p', { className: 'search__results__label__date-date' }, firstResultDay),
+                React__default['default'].createElement('p', null, firstResultMonth)
+              )
+            : React__default['default'].createElement(Icon$1, { name: 'ui-bed', height: 16, fill: 'white' })
+        ),
+        React__default['default'].createElement(
+          'div',
+          { className: 'search__results__label__text' },
+          React__default['default'].createElement(
+            'h3',
+            null,
+            translations.SRP.SELECT,
+            ' ',
+            React__default['default'].createElement('strong', null, translations.SRP.ACCOMMODATION)
+          )
         )
-      )
-    ),
+      ),
     isLoading
       ? React__default['default'].createElement(
           React__default['default'].Fragment,
           null,
           (_c = context.customSpinner) !== null && _c !== void 0 ? _c : React__default['default'].createElement(Spinner, null)
         )
-      : renderHotelResults(mappedResults, context, activeTab, translations),
+      : renderHotelResults(visibleResults, context, activeTab, translations, selectedPackagingAccoResult, isFlyIn),
+    packagingAccoResults.length > 3 &&
+      !isFlyIn &&
+      React__default['default'].createElement(
+        'div',
+        { className: 'search__results__cards__actions' },
+        React__default['default'].createElement(
+          'button',
+          {
+            className: 'cta cta--secondary',
+            onClick: function () {
+              return handleShowMoreHotels('acco-results');
+            }
+          },
+          translations.SRP.SHOW_MORE
+        )
+      ),
     mappedResults.length === 0 && !isLoading && React__default['default'].createElement('div', { className: 'no-results' }, translations.SRP.NO_RESULTS)
   );
 };
 
-var FlyIn = function (_a) {
-  var title = _a.title,
-    srpType = _a.srpType,
-    isOpen = _a.isOpen,
-    setIsOpen = _a.setIsOpen,
-    _b = _a.className,
-    className = _b === void 0 ? '' : _b,
-    onPanelRef = _a.onPanelRef,
-    detailsLoading = _a.detailsLoading,
-    accommodationStep = _a.accommodationStep,
-    isPackageEditFlow = _a.isPackageEditFlow,
-    handleConfirm = _a.handleConfirm;
-  var dispatch = reactRedux.useDispatch();
-  var onCancelSearch = useFlightSearch().onCancelSearch;
-  var panelRef = React.useRef(null);
-  // expose DOM node if needed
-  React.useEffect(
-    function () {
-      onPanelRef === null || onPanelRef === void 0 ? void 0 : onPanelRef(panelRef.current);
-      return function () {
-        return onPanelRef === null || onPanelRef === void 0 ? void 0 : onPanelRef(null);
-      };
-    },
-    [onPanelRef]
-  );
-  React.useEffect(
-    function () {
-      // click outside detection
-      var handleClickOutside = function (event) {
-        if (isOpen && panelRef.current && !panelRef.current.contains(event.target)) {
-          handleClose();
-        }
-      };
-      document.addEventListener('mousedown', handleClickOutside);
-      return function () {
-        return document.removeEventListener('mousedown', handleClickOutside);
-      };
-    },
-    [isOpen, setIsOpen]
-  );
-  // body scroll lock
-  React.useEffect(
-    function () {
-      document.body.style.overflow = isOpen ? 'hidden' : '';
-      return function () {
-        document.body.style.overflow = '';
-      };
-    },
-    [isOpen]
-  );
-  var handleClose = function () {
-    if (isOpen && panelRef.current) {
-      if (srpType === build.PortalQsmType.Flight) {
-        dispatch(setSelectedFlight(null));
-        dispatch(setSelectedFlightDetails(null));
-        onCancelSearch();
-      } else {
-        dispatch(setSelectedSearchResult(null));
-        dispatch(setSelectedPackagingAccoResult(null));
-      }
-      dispatch(setAccommodationFlyInStep('details'));
-      setIsOpen(false);
+var selectSearchResultsState = function (state) {
+  return state.searchResults;
+};
+var selectPackagingFlightResults = toolkit.createSelector([selectSearchResultsState], function (state) {
+  return state.packagingFlightResults;
+});
+var selectFilteredPackagingFlightResults = toolkit.createSelector([selectSearchResultsState], function (state) {
+  return state.filteredPackagingFlightResults;
+});
+var selectSelectedOutwardKey = toolkit.createSelector([selectSearchResultsState], function (state) {
+  return state.selectedOutwardKey;
+});
+var selectSelectedReturnKey = toolkit.createSelector([selectSearchResultsState], function (state) {
+  return state.selectedReturnKey;
+});
+var selectUniqueOutwardFlights = toolkit.createSelector([selectFilteredPackagingFlightResults], function (packagingFlightResults) {
+  var map = new Map();
+  packagingFlightResults.forEach(function (flight) {
+    var key = getFlightKey(flight.outward.segments);
+    if (!map.has(key)) {
+      map.set(key, flight);
     }
-  };
-  var handleGoBack = function () {
-    dispatch(setAccommodationFlyInStep('results'));
-  };
+  });
+  return Array.from(map.values());
+});
+var selectUniqueReturnFlights = toolkit.createSelector(
+  [selectFilteredPackagingFlightResults, selectSelectedOutwardKey],
+  function (packagingFlightResults, selectedOutwardKey) {
+    if (!selectedOutwardKey) return [];
+    var matchingCombinations = packagingFlightResults.filter(function (flight) {
+      return getFlightKey(flight.outward.segments) === selectedOutwardKey;
+    });
+    var map = new Map();
+    matchingCombinations.forEach(function (flight) {
+      var key = getFlightKey(flight.return.segments);
+      if (!map.has(key)) {
+        map.set(key, flight);
+      }
+    });
+    return Array.from(map.values());
+  }
+);
+var selectSelectedOutward = toolkit.createSelector(
+  [selectPackagingFlightResults, selectSelectedOutwardKey],
+  function (packagingFlightResults, selectedOutwardKey) {
+    var _a;
+    if (!selectedOutwardKey) return null;
+    return (_a = packagingFlightResults.find(function (flight) {
+      return getFlightKey(flight.outward.segments) === selectedOutwardKey;
+    })) !== null && _a !== void 0
+      ? _a
+      : null;
+  }
+);
+var selectSelectedReturn = toolkit.createSelector(
+  [selectPackagingFlightResults, selectSelectedReturnKey],
+  function (packagingFlightResults, selectedReturnKey) {
+    var _a;
+    if (!selectedReturnKey) return null;
+    return (_a = packagingFlightResults.find(function (flight) {
+      return getFlightKey(flight.return.segments) === selectedReturnKey;
+    })) !== null && _a !== void 0
+      ? _a
+      : null;
+  }
+);
+var selectSelectedCombinationFlight = toolkit.createSelector(
+  [selectPackagingFlightResults, selectSelectedOutwardKey, selectSelectedReturnKey],
+  function (packagingFlightResults, selectedOutwardKey, selectedReturnKey) {
+    var _a;
+    if (!selectedOutwardKey || !selectedReturnKey) return null;
+    return (_a = packagingFlightResults.find(function (flight) {
+      return getFlightKey(flight.outward.segments) === selectedOutwardKey && getFlightKey(flight.return.segments) === selectedReturnKey;
+    })) !== null && _a !== void 0
+      ? _a
+      : null;
+  }
+);
+
+var IndependentFlightOption = function (_a) {
+  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+  var item = _a.item,
+    onSelect = _a.onSelect,
+    guid = _a.guid,
+    selectedGuid = _a.selectedGuid,
+    isOutward = _a.isOutward,
+    showSelectedState = _a.showSelectedState,
+    currentSelectedPrice = _a.currentSelectedPrice,
+    price = _a.price;
+  var context = React.useContext(SearchResultsConfigurationContext);
+  var language = (_b = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _b !== void 0 ? _b : 'en-GB';
+  var translations = getTranslations(language);
+  var _p = React.useState(false),
+    detailsOpen = _p[0],
+    setDetailsOpen = _p[1];
+  var priceDifference = price && currentSelectedPrice ? price - currentSelectedPrice : null;
   return React__default['default'].createElement(
     'div',
-    {
-      className: 'flyin '
-        .concat(isOpen ? 'flyin--active' : '', ' ')
-        .concat(className, ' ')
-        .concat(isPackageEditFlow ? 'flyin--large' : '')
-    },
+    { className: 'search__result-card', key: 'flight-'.concat(item.code) },
     React__default['default'].createElement(
       'div',
-      { className: 'flyin__panel '.concat(isOpen ? 'flyin__panel--active' : ''), ref: panelRef },
+      { className: 'flight '.concat(showSelectedState && selectedGuid === guid ? 'flight--selected' : '') },
       React__default['default'].createElement(
         'div',
-        { className: 'flyin__content' },
+        { className: 'flight__option' },
         React__default['default'].createElement(
           'div',
-          { className: 'flyin__content-title-row' },
-          React__default['default'].createElement('h3', { className: 'flyin__content-title' }, title),
-          React__default['default'].createElement(
-            'span',
-            {
-              className: 'flyin__close',
-              onClick: function () {
-                return handleClose();
-              }
-            },
-            React__default['default'].createElement(Icon, { name: 'ui-close', width: 30, height: 30, 'aria-hidden': 'true' })
-          )
-        ),
-        isPackageEditFlow &&
-          accommodationStep === 'details' &&
+          { className: 'flight__content' },
           React__default['default'].createElement(
             'div',
-            { className: 'flyin__content-title-row' },
+            { className: 'flight__flights' },
             React__default['default'].createElement(
               'div',
-              { onClick: handleGoBack, className: 'flyin__content-title__back' },
-              React__default['default'].createElement(Icon, { name: 'ui-chevron', width: 14, height: 14, 'aria-hidden': 'true' }),
-              'Go Back'
-            )
-          )
-      ),
-      srpType === build.PortalQsmType.Flight && React__default['default'].createElement(FlightsFlyIn, { isOpen: isOpen, setIsOpen: setIsOpen }),
-      (srpType === build.PortalQsmType.Accommodation || srpType === build.PortalQsmType.AccommodationAndFlight) &&
-        accommodationStep === 'results' &&
-        React__default['default'].createElement(
-          'div',
-          { className: 'flyin__content' },
-          React__default['default'].createElement(HotelAccommodationResults, { isLoading: detailsLoading })
-        ),
-      (srpType === build.PortalQsmType.Accommodation || srpType === build.PortalQsmType.AccommodationAndFlight) &&
-        accommodationStep === 'details' &&
-        React__default['default'].createElement(AccommodationFlyIn, { isLoading: detailsLoading, handleConfirm: handleConfirm }),
-      srpType === build.PortalQsmType.GroupTour &&
-        React__default['default'].createElement(GroupTourFlyIn, { isLoading: detailsLoading, isOpen: isOpen, setIsOpen: setIsOpen })
-    )
-  );
-};
-
-var RoundTripResults = function () {
-  var activeTab = reactRedux.useSelector(function (state) {
-    return state.searchResults;
-  }).activeTab;
-  var dispatch = reactRedux.useDispatch();
-  React.useEffect(
-    function () {
-      if (activeTab === 'compact') {
-        dispatch(setActiveTab('list'));
-      }
-    },
-    [activeTab]
-  );
-  return React__default['default'].createElement(
-    'div',
-    { className: 'search__results__cards search__results__cards--'.concat(activeTab) },
-    React__default['default'].createElement(
-      'div',
-      { className: 'search__result-card' },
-      React__default['default'].createElement(
+              { className: 'flight__flight' },
+              React__default['default'].createElement(
+                'div',
+                { className: 'flight__flight__header' },
+                React__default['default'].createElement('div', { className: 'flight__status__container' }),
+                React__default['default'].createElement(
+                  'div',
+                  { className: 'flight__price' },
+                  price != null &&
+                    price > 0 &&
+                    (isOutward
+                      ? React__default['default'].createElement(
+                          'span',
+                          { className: 'price' },
+                          translations.QSM.ROUNDTRIP + ' ' + translations.SRP.PRICE,
+                          '\u00A0',
+                          formatPrice$2(
+                            price,
+                            'EUR',
+                            (_c = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _c !== void 0 ? _c : 'en-GB'
+                          )
+                        )
+                      : priceDifference != null &&
+                        Math.abs(priceDifference) > 0 &&
+                        React__default['default'].createElement(
+                          'span',
+                          { className: 'price' },
+                          priceDifference > 0 ? '+' : '-',
+                          '\u00A0',
+                          formatPrice$2(
+                            Math.abs(priceDifference),
+                            'EUR',
+                            (_d = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _d !== void 0 ? _d : 'en-GB'
+                          )
+                        )),
+                  React__default['default'].createElement(
+                    'button',
+                    {
+                      type: 'button',
+                      className: 'cta '.concat(selectedGuid === guid ? 'cta--selected' : 'cta--select'),
+                      onClick: function () {
+                        return onSelect === null || onSelect === void 0 ? void 0 : onSelect();
+                      }
+                    },
+                    selectedGuid === guid ? 'Selected' : 'Select'
+                  )
+                )
+              )
+            ),
+            React__default['default'].createElement(
+              'div',
+              { className: 'flight__flight' },
+              React__default['default'].createElement(
+                'div',
+                { className: 'flight__flight__container' },
+                React__default['default'].createElement(
+                  'div',
+                  { className: 'flight__flight__wrapper' },
+                  React__default['default'].createElement(
+                    'div',
+                    { className: 'flight__logo__wrapper' },
+                    React__default['default'].createElement('img', {
+                      src: 'https://media.tidesoftware.be/media/shared/Airlines/'.concat(
+                        (_e = getDepartureSegment(item)) === null || _e === void 0 ? void 0 : _e.marketingAirlineCode,
+                        '.png?height=256'
+                      ),
+                      alt: '',
+                      className: 'flight__logo'
+                    }),
+                    React__default['default'].createElement(
+                      'span',
+                      null,
+                      (_f = getDepartureSegment(item)) === null || _f === void 0 ? void 0 : _f.marketingAirlineName
+                    )
+                  ),
+                  React__default['default'].createElement(
+                    'div',
+                    { className: 'flight__info' },
+                    React__default['default'].createElement(
+                      'div',
+                      { className: 'flight__info__times' },
+                      React__default['default'].createElement(
+                        'strong',
+                        null,
+                        timeFromDateTime((_g = getDepartureSegment(item)) === null || _g === void 0 ? void 0 : _g.departureDateTime),
+                        ' ',
+                        (_h = getDepartureSegment(item)) === null || _h === void 0 ? void 0 : _h.departureAirportCode
+                      ),
+                      React__default['default'].createElement(
+                        'p',
+                        null,
+                        longFormatDate((_j = getDepartureSegment(item)) === null || _j === void 0 ? void 0 : _j.departureDateTime, language)
+                      )
+                    ),
+                    React__default['default'].createElement(
+                      'div',
+                      { className: 'flight__info__duration' },
+                      React__default['default'].createElement('p', null, durationTicksInHoursString(item.durationInTicks)),
+                      React__default['default'].createElement(
+                        'div',
+                        { className: 'flight__info__duration__stops' },
+                        React__default['default'].createElement('div', { className: 'flight__info__duration__stop' })
+                      ),
+                      React__default['default'].createElement(
+                        'span',
+                        null,
+                        getNumberOfStopsLabel(item, translations.SRP.DIRECT, translations.SRP.STOPS, translations.SRP.STOP)
+                      )
+                    ),
+                    React__default['default'].createElement(
+                      'div',
+                      { className: 'flight__info__times flight__info__times--arrival' },
+                      React__default['default'].createElement(
+                        'strong',
+                        null,
+                        timeFromDateTime((_k = getArrivalSegment(item)) === null || _k === void 0 ? void 0 : _k.arrivalDateTime),
+                        ' ',
+                        (_l = getArrivalSegment(item)) === null || _l === void 0 ? void 0 : _l.arrivalAirportCode
+                      ),
+                      React__default['default'].createElement(
+                        'p',
+                        null,
+                        longFormatDate((_m = getArrivalSegment(item)) === null || _m === void 0 ? void 0 : _m.arrivalDateTime, language)
+                      )
+                    )
+                  )
+                ),
+                React__default['default'].createElement(
+                  'div',
+                  { className: 'flight__detail__btn__wrapper' },
+                  React__default['default'].createElement(
+                    'div',
+                    {
+                      className: 'flight__detail__btn '.concat(detailsOpen ? 'flight__detail__btn--active' : ''),
+                      onClick: function () {
+                        return setDetailsOpen(function (prev) {
+                          return !prev;
+                        });
+                      }
+                    },
+                    React__default['default'].createElement(Icon$1, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
+                  )
+                )
+              ),
+              React__default['default'].createElement(
+                'div',
+                { className: 'flight__detail '.concat(detailsOpen ? 'flight__detail--active' : '') },
+                (_o = getFlightSegments(item)) === null || _o === void 0
+                  ? void 0
+                  : _o.map(function (segment, index) {
+                      return React__default['default'].createElement(
+                        React__default['default'].Fragment,
+                        { key: 'outward-segment-'.concat(index, '-').concat(segment.flightNumber) },
+                        React__default['default'].createElement(
+                          'div',
+                          { className: 'flight__info' },
+                          React__default['default'].createElement(
+                            'div',
+                            { className: 'flight__info__times__wrapper' },
+                            React__default['default'].createElement(
+                              'div',
+                              { className: 'flight__info__times' },
+                              React__default['default'].createElement('p', null, timeFromDateTime(segment.departureDateTime)),
+                              React__default['default'].createElement('strong', null, segment.departureAirportCode),
+                              React__default['default'].createElement('p', null, longFormatDate(segment.departureDateTime, language))
+                            ),
+                            React__default['default'].createElement(
+                              'div',
+                              null,
+                              React__default['default'].createElement(Icon$1, { name: 'ui-plane-depart', width: 30, height: 20 })
+                            )
+                          ),
+                          React__default['default'].createElement(
+                            'div',
+                            { className: 'flight__info__duration' },
+                            React__default['default'].createElement('p', null, durationTicksInHoursString(segment.durationInTicks)),
+                            React__default['default'].createElement('div', { className: 'flight__info__duration__stops' }),
+                            React__default['default'].createElement('span', null, segment.marketingAirlineName),
+                            React__default['default'].createElement('strong', null, segment.operatingFlightNumber)
+                          ),
+                          React__default['default'].createElement(
+                            'div',
+                            { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
+                            React__default['default'].createElement(
+                              'div',
+                              null,
+                              React__default['default'].createElement(Icon$1, { name: 'ui-plane-arrive', width: 30, height: 20 })
+                            ),
+                            React__default['default'].createElement(
+                              'div',
+                              { className: 'flight__info__times flight__info__times--arrival' },
+                              React__default['default'].createElement('p', null, timeFromDateTime(segment.arrivalDateTime)),
+                              React__default['default'].createElement('strong', null, segment.arrivalAirportCode),
+                              React__default['default'].createElement('p', null, longFormatDate(segment.arrivalDateTime, language))
+                            )
+                          )
+                        ),
+                        segment.transferTimeInTicks &&
+                          React__default['default'].createElement(
+                            'div',
+                            { className: 'flight__info' },
+                            React__default['default'].createElement('div', { className: 'flight__info__times' }),
+                            React__default['default'].createElement(
+                              'div',
+                              { className: 'flight__info__duration flight__info__duration--waittime' },
+                              React__default['default'].createElement(
+                                'div',
+                                { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
+                                React__default['default'].createElement(Icon$1, { name: 'ui-clock', width: 24, height: 24 })
+                              ),
+                              React__default['default'].createElement(
+                                'div',
+                                { className: 'flight__info__duration__stoptime' },
+                                React__default['default'].createElement('span', null, 'Stop time'),
+                                React__default['default'].createElement('strong', null, durationTicksInHoursString(segment.transferTimeInTicks))
+                              )
+                            ),
+                            React__default['default'].createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
+                          )
+                      );
+                    })
+              )
+            )
+          )
+        )
+      )
+    )
+  );
+};
+
+var MultiRangeFilter = function (_a) {
+  var min = _a.min,
+    max = _a.max,
+    selectedMin = _a.selectedMin,
+    selectedMax = _a.selectedMax,
+    valueFormatter = _a.valueFormatter,
+    onChange = _a.onChange;
+  var _b = React.useState(false),
+    isDragging = _b[0],
+    setIsDragging = _b[1];
+  var _c = React.useState(0),
+    leftPercentage = _c[0],
+    setLeftPercentage = _c[1];
+  var _d = React.useState(0),
+    rightPercentage = _d[0],
+    setRightPercentage = _d[1];
+  var _e = React.useState(selectedMin !== null && selectedMin !== void 0 ? selectedMin : min),
+    minVal = _e[0],
+    setMinVal = _e[1];
+  var _f = React.useState(selectedMax !== null && selectedMax !== void 0 ? selectedMax : max),
+    maxVal = _f[0],
+    setMaxVal = _f[1];
+  var minGap = 5;
+  // Sync internal state with external selectedMin/selectedMax changes
+  React.useEffect(
+    function () {
+      setMinVal(selectedMin !== null && selectedMin !== void 0 ? selectedMin : min);
+      setMaxVal(selectedMax !== null && selectedMax !== void 0 ? selectedMax : max);
+    },
+    [min, max, selectedMin, selectedMax]
+  );
+  // Recalculate slider track whenever values change
+  React.useEffect(
+    function () {
+      var range = max - min || 1;
+      var minPercent = ((minVal - min) / range) * 100;
+      var maxPercent = ((maxVal - min) / range) * 100;
+      setLeftPercentage(minPercent);
+      setRightPercentage(100 - maxPercent);
+    },
+    [minVal, maxVal, min, max]
+  );
+  var slideMin = function (e) {
+    var value = parseInt(e.target.value, 10);
+    // Ensure the thumbs don’t cross and enforce minGap
+    if (value <= maxVal - minGap) {
+      setMinVal(value);
+    }
+  };
+  var slideMax = function (e) {
+    var value = parseInt(e.target.value, 10);
+    // Ensure the thumbs don’t cross and enforce minGap
+    if (value >= minVal + minGap) {
+      setMaxVal(value);
+    }
+  };
+  var startDrag = function () {
+    setIsDragging(true);
+  };
+  var stopDrag = function () {
+    setIsDragging(false);
+    // Notify parent with the final values
+    onChange(minVal, maxVal);
+  };
+  return React__default['default'].createElement(
+    'div',
+    { className: 'double-slider-box' },
+    React__default['default'].createElement(
+      'div',
+      { className: 'input-box' },
+      React__default['default'].createElement('div', { className: 'min-box' }, valueFormatter(minVal)),
+      React__default['default'].createElement('div', { className: 'max-box' }, valueFormatter(maxVal))
+    ),
+    React__default['default'].createElement(
+      'div',
+      { className: 'range-slider' },
+      React__default['default'].createElement('div', {
+        className: 'slider-track',
+        style: { left: ''.concat(leftPercentage, '%'), right: ''.concat(rightPercentage, '%') }
+      }),
+      React__default['default'].createElement('input', {
+        type: 'range',
+        min: min,
+        max: max,
+        value: minVal,
+        onChange: slideMin,
+        onMouseDown: startDrag,
+        onMouseUp: stopDrag,
+        onTouchStart: startDrag,
+        onTouchEnd: stopDrag,
+        className: 'min-val'
+      }),
+      React__default['default'].createElement('input', {
+        type: 'range',
+        min: min,
+        max: max,
+        value: maxVal,
+        onChange: slideMax,
+        onMouseDown: startDrag,
+        onMouseUp: stopDrag,
+        onTouchStart: startDrag,
+        onTouchEnd: stopDrag,
+        className: 'max-val'
+      }),
+      isDragging && React__default['default'].createElement('div', { className: 'min-tooltip' }, valueFormatter(minVal)),
+      isDragging && React__default['default'].createElement('div', { className: 'max-tooltip' }, valueFormatter(maxVal))
+    )
+  );
+};
+
+var Filters = function (_a) {
+  var _b;
+  var initialFilters = _a.initialFilters,
+    filters = _a.filters,
+    isOpen = _a.isOpen,
+    handleSetIsOpen = _a.handleSetIsOpen,
+    isLoading = _a.isLoading,
+    setFilters = _a.setFilters,
+    resetFilters = _a.resetFilters;
+  var context = React.useContext(SearchResultsConfigurationContext);
+  if (!context || !context.showFilters) {
+    return null;
+  }
+  var translations = getTranslations((_b = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _b !== void 0 ? _b : 'en-GB');
+  var _c = React.useState({}),
+    visibleFilters = _c[0],
+    setVisibleFilters = _c[1];
+  var toggleFilterVisibility = function (filterId) {
+    setVisibleFilters(function (prev) {
+      var _a;
+      return __assign(__assign({}, prev), ((_a = {}), (_a[filterId] = !prev[filterId]), _a));
+    });
+  };
+  var handleCheckBoxFilter = function (filter, option) {
+    var updated = filters.map(function (f) {
+      var _a;
+      if (f.property !== filter.property) return f;
+      return __assign(__assign({}, f), {
+        options:
+          (_a = f.options) === null || _a === void 0
+            ? void 0
+            : _a.map(function (opt) {
+                return opt.value === option.value ? __assign(__assign({}, opt), { isChecked: !opt.isChecked }) : opt;
+              })
+      });
+    });
+    setFilters(updated);
+  };
+  var handleSliderChange = function (filter, newMin, newMax) {
+    var updated = filters.map(function (f) {
+      if (f.property !== filter.property) return f;
+      return __assign(__assign({}, f), { selectedMin: newMin, selectedMax: newMax });
+    });
+    setFilters(updated);
+  };
+  var handleFullReset = function () {
+    if (!isLoading) {
+      resetFilters(initialFilters);
+    }
+  };
+  return React__default['default'].createElement(
+    'div',
+    { className: 'search__filters--modal '.concat(isOpen ? 'is-open' : '') },
+    React__default['default'].createElement('div', {
+      className: 'search__filters--background',
+      onClick: function () {
+        return handleSetIsOpen();
+      }
+    }),
+    React__default['default'].createElement(
+      'button',
+      {
+        className: 'search__filters--close',
+        onClick: function () {
+          return handleSetIsOpen();
+        }
+      },
+      React__default['default'].createElement(Icon$1, { name: 'ui-close', height: 24 })
+    ),
+    React__default['default'].createElement(
+      'div',
+      { className: 'search__filters' },
+      React__default['default'].createElement(
+        'div',
+        { className: 'search__filter-row search__filter__header' },
+        React__default['default'].createElement(
+          'div',
+          { className: 'search__filter-row-flex-title' },
+          React__default['default'].createElement('p', { className: 'search__filter-small-title' }, translations.SRP.FILTERS)
+        ),
+        !isLoading &&
+          React__default['default'].createElement(
+            'a',
+            {
+              className: 'search__filter-reset',
+              onClick: function () {
+                return handleFullReset();
+              }
+            },
+            translations.SRP.RESET
+          )
+      ),
+      isLoading
+        ? React__default['default'].createElement(Spinner, null)
+        : React__default['default'].createElement(
+            React__default['default'].Fragment,
+            null,
+            React__default['default'].createElement(
+              'div',
+              { className: 'search__filters__group-container' },
+              filters.map(function (filter, index) {
+                var _a, _b;
+                var isVisible = (_a = visibleFilters[filter.property]) !== null && _a !== void 0 ? _a : true;
+                return React__default['default'].createElement(
+                  'div',
+                  { key: ''.concat(filter.property, '-').concat(index), className: 'search__filter-group' },
+                  React__default['default'].createElement(
+                    'div',
+                    {
+                      className: 'search__filter-row search__filter-row--underline',
+                      onClick: function () {
+                        return toggleFilterVisibility(filter.property);
+                      },
+                      role: 'button',
+                      tabIndex: 0
+                    },
+                    React__default['default'].createElement('h6', { className: 'search__filter-large-title' }, filter.label),
+                    React__default['default'].createElement(
+                      'svg',
+                      {
+                        id: 'search-chevron-up-icon',
+                        className: 'search__filter-chevron-icon '.concat(isVisible ? 'search__filter-chevron-icon--flipped' : '', ' '),
+                        viewBox: '0 0 10 6.063',
+                        width: 10,
+                        height: 6.063
+                      },
+                      React__default['default'].createElement('path', {
+                        id: 'Path_62',
+                        'data-name': 'Path 62',
+                        d: 'M245-617.937l-5-5L241.063-624,245-620.062,248.938-624,250-622.937Z',
+                        transform: 'translate(-240 624)',
+                        fill: '#707070'
+                      })
+                    )
+                  ),
+                  isVisible &&
+                    filter.type === 'checkbox' &&
+                    React__default['default'].createElement(
+                      'div',
+                      { className: 'search__filter-rows' },
+                      filter.options &&
+                        filter.options.map(function (option, optionIndex) {
+                          return React__default['default'].createElement(
+                            'div',
+                            { className: 'search__filter-row search__filter-row--checkbox', key: ''.concat(option.label, '-').concat(optionIndex) },
+                            React__default['default'].createElement(
+                              'div',
+                              { className: 'checkbox' },
+                              React__default['default'].createElement(
+                                'label',
+                                { className: 'checkbox__label' },
+                                React__default['default'].createElement('input', {
+                                  type: 'checkbox',
+                                  className: 'checkbox__input checkbox__input--parent',
+                                  checked: option.isChecked,
+                                  onChange: function (e) {
+                                    return handleCheckBoxFilter(filter, option);
+                                  }
+                                }),
+                                React__default['default'].createElement('span', { className: 'radiobutton__label-text' }, option.label)
+                              )
+                            )
+                          );
+                        })
+                    ),
+                  isVisible &&
+                    filter.type === 'toggle' &&
+                    React__default['default'].createElement(
+                      'div',
+                      { className: 'search__filter-rows' },
+                      (_b = filter.options) === null || _b === void 0
+                        ? void 0
+                        : _b.map(function (option, optionIndex) {
+                            return React__default['default'].createElement(
+                              'div',
+                              { className: 'search__filter-row', key: ''.concat(option.label, '-').concat(optionIndex) },
+                              React__default['default'].createElement('span', { className: 'search__filter-toggle-label' }, option.label),
+                              React__default['default'].createElement('div', { className: 'checkbox' }),
+                              React__default['default'].createElement(
+                                'label',
+                                { className: 'checkbox__label' },
+                                React__default['default'].createElement('input', {
+                                  type: 'checkbox',
+                                  className: 'checkbox__input',
+                                  checked: option.isChecked,
+                                  onChange: function () {
+                                    return handleCheckBoxFilter(filter, option);
+                                  }
+                                })
+                              )
+                            );
+                          })
+                    ),
+                  isVisible &&
+                    filter &&
+                    filter.type === 'slider' &&
+                    (function () {
+                      var _a, _b, _c, _d;
+                      var min = (_a = filter.min) !== null && _a !== void 0 ? _a : 0;
+                      var max = (_b = filter.max) !== null && _b !== void 0 ? _b : 100;
+                      var selectedMin = (_c = filter.selectedMin) !== null && _c !== void 0 ? _c : min;
+                      var selectedMax = (_d = filter.selectedMax) !== null && _d !== void 0 ? _d : max;
+                      return React__default['default'].createElement(MultiRangeFilter, {
+                        min: min,
+                        max: max,
+                        selectedMin: selectedMin,
+                        selectedMax: selectedMax,
+                        valueFormatter: function (value) {
+                          return ''.concat(value);
+                        },
+                        onChange: function (newMin, newMax) {
+                          handleSliderChange(filter, newMin, newMax);
+                        }
+                      });
+                    })()
+                );
+              })
+            )
+          )
+    )
+  );
+};
+
+var PackageingFlightsFlyIn = function (_a) {
+  var _b;
+  _a.isOpen;
+  _a.setIsOpen;
+  var context = React.useContext(SearchResultsConfigurationContext);
+  var language = (_b = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _b !== void 0 ? _b : 'en-GB';
+  var translations = getTranslations(language);
+  var dispatch = reactRedux.useDispatch();
+  var _c = reactRedux.useSelector(function (state) {
+      return state.searchResults;
+    }),
+    flightsLoading = _c.flightsLoading,
+    initialFlightFilters = _c.initialFlightFilters,
+    flightFilters = _c.flightFilters,
+    flyInType = _c.flyInType,
+    selectedFlightSortType = _c.selectedFlightSortType;
+  var uniqueOutwardFlights = reactRedux.useSelector(selectUniqueOutwardFlights);
+  var uniqueReturnFlights = reactRedux.useSelector(selectUniqueReturnFlights);
+  var selectedOutward = reactRedux.useSelector(selectSelectedOutward);
+  var selectedReturn = reactRedux.useSelector(selectSelectedReturn);
+  var _d = React.useState(false),
+    outwardStepComplete = _d[0],
+    setOutwardStepComplete = _d[1];
+  var handleConfirm = function () {
+    if (!outwardStepComplete) {
+      setOutwardStepComplete(true);
+      dispatch(setFlyInType('flight-return-results'));
+      return;
+    } else {
+      dispatch(setFlyInType(null));
+      setOutwardStepComplete(false);
+      dispatch(setFlyInIsOpen(false));
+    }
+  };
+  var sortByTypes = [
+    { direction: 'asc', label: 'default' },
+    { direction: 'asc', label: 'price' },
+    { direction: 'desc', label: 'price' },
+    { direction: 'asc', label: 'departureTime' },
+    { direction: 'desc', label: 'departureTime' },
+    { direction: 'asc', label: 'durationInTicks' },
+    { direction: 'desc', label: 'durationInTicks' }
+  ];
+  var handleSortChange = function (newSortKey, direction) {
+    if (sortByTypes === undefined) return;
+    var newSortByType = findSortByType(sortByTypes, newSortKey, direction !== null && direction !== void 0 ? direction : 'asc');
+    if (newSortByType) {
+      dispatch(setFlightSortType(newSortByType));
+    }
+  };
+  return React__default['default'].createElement(
+    React__default['default'].Fragment,
+    null,
+    React__default['default'].createElement(
+      'div',
+      { className: 'flyin__content flyin__content--columns' },
+      flightsLoading
+        ? React__default['default'].createElement(Spinner, null)
+        : React__default['default'].createElement(
+            React__default['default'].Fragment,
+            null,
+            React__default['default'].createElement(Filters, {
+              initialFilters: initialFlightFilters,
+              filters: flightFilters,
+              isOpen: false,
+              handleSetIsOpen: function () {},
+              // handleApplyFilters={() => setSearchTrigger((prev) => prev + 1)}
+              isLoading: flightsLoading,
+              setFilters: function (filters) {
+                return dispatch(setFlightFilters(filters));
+              },
+              resetFilters: function (filters) {
+                return dispatch(resetFlightFilters(filters));
+              }
+            }),
+            React__default['default'].createElement(
+              'div',
+              { className: 'search__results__wrapper' },
+              React__default['default'].createElement(
+                'div',
+                { className: 'search__result-row' },
+                React__default['default'].createElement(
+                  'span',
+                  { className: 'search__result-row-text' },
+                  (uniqueOutwardFlights === null || uniqueOutwardFlights === void 0 ? void 0 : uniqueOutwardFlights.length) && uniqueOutwardFlights.length,
+                  '\u00A0',
+                  translations.FLIGHTS_FORM.FLIGHTS_FOUND_2,
+                  '\u00A0',
+                  translations.FLIGHTS_FORM.FLIGHTS_FOUND_3
+                ),
+                sortByTypes &&
+                  sortByTypes.length > 0 &&
+                  React__default['default'].createElement(
+                    'div',
+                    { className: 'search__result-row-filter' },
+                    React__default['default'].createElement(ItemPicker, {
+                      items: sortByTypes,
+                      selection: (selectedFlightSortType === null || selectedFlightSortType === void 0 ? void 0 : selectedFlightSortType.label) || undefined,
+                      selectedSortByType: selectedFlightSortType || undefined,
+                      label: translations.SRP.SORTBY,
+                      placeholder: translations.SRP.SORTBY,
+                      classModifier: '',
+                      valueFormatter: function (value, direction) {
+                        return getSortingName(translations, findSortByType(sortByTypes, value, direction !== null && direction !== void 0 ? direction : 'asc'));
+                      },
+                      // onPick={handleSortChange}
+                      onPick: function (newSortKey, direction) {
+                        return handleSortChange(newSortKey, direction);
+                      }
+                    })
+                  )
+              ),
+              React__default['default'].createElement(
+                'div',
+                { className: 'search__results__cards search__results__cards--extended' },
+                flyInType == 'flight-outward-results' &&
+                  uniqueOutwardFlights.map(function (result) {
+                    return React__default['default'].createElement(IndependentFlightOption, {
+                      key: 'flight-'.concat(result.outwardGuid),
+                      item: result.outward,
+                      onSelect: function () {
+                        return dispatch(setSelectedOutwardKey(getFlightKey(result.outward.segments)));
+                      },
+                      guid: result.outwardGuid,
+                      isOutward: true,
+                      price: result.price,
+                      currentSelectedPrice: selectedOutward === null || selectedOutward === void 0 ? void 0 : selectedOutward.price,
+                      selectedGuid: selectedOutward === null || selectedOutward === void 0 ? void 0 : selectedOutward.outwardGuid,
+                      showSelectedState: true
+                    });
+                  }),
+                flyInType == 'flight-return-results' &&
+                  uniqueReturnFlights.map(function (result) {
+                    return React__default['default'].createElement(IndependentFlightOption, {
+                      key: 'flight-'.concat(result.outwardGuid),
+                      item: result.return,
+                      onSelect: function () {
+                        return dispatch(setSelectedReturnKey(getFlightKey(result.return.segments)));
+                      },
+                      guid: result.outwardGuid,
+                      isOutward: false,
+                      price: result.price,
+                      currentSelectedPrice: selectedReturn === null || selectedReturn === void 0 ? void 0 : selectedReturn.price,
+                      selectedGuid: selectedReturn === null || selectedReturn === void 0 ? void 0 : selectedReturn.outwardGuid,
+                      showSelectedState: true
+                    });
+                  })
+              )
+            )
+          )
+    ),
+    React__default['default'].createElement(
+      'div',
+      { className: 'flyin__footer' },
+      React__default['default'].createElement('div', { className: 'flyin__footer__price' }),
+      React__default['default'].createElement(
+        'div',
+        { className: 'flyin__button-wrapper' },
+        React__default['default'].createElement(
+          'button',
+          {
+            className: 'cta cta--select',
+            onClick: function () {
+              return handleConfirm();
+            }
+          },
+          translations.QSM.CONFIRM
+        )
+      )
+    )
+  );
+};
+
+var FlyIn = function (_a) {
+  var _b;
+  var srpType = _a.srpType,
+    isOpen = _a.isOpen,
+    setIsOpen = _a.setIsOpen,
+    _c = _a.className,
+    className = _c === void 0 ? '' : _c,
+    onPanelRef = _a.onPanelRef,
+    detailsLoading = _a.detailsLoading,
+    flyInType = _a.flyInType,
+    isPackageEditFlow = _a.isPackageEditFlow,
+    handleConfirm = _a.handleConfirm,
+    sortByTypes = _a.sortByTypes;
+  var dispatch = reactRedux.useDispatch();
+  var context = React.useContext(SearchResultsConfigurationContext);
+  var language = (_b = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _b !== void 0 ? _b : 'en-GB';
+  var translations = getTranslations(language);
+  var _d = reactRedux.useSelector(function (state) {
+      return state.searchResults;
+    }),
+    isLoading = _d.isLoading,
+    initialFilters = _d.initialFilters,
+    filters = _d.filters,
+    filteredPackagingAccoResults = _d.filteredPackagingAccoResults,
+    selectedSortType = _d.selectedSortType;
+  var onCancelSearch = useFlightSearch().onCancelSearch;
+  var panelRef = React.useRef(null);
+  // expose DOM node if needed
+  React.useEffect(
+    function () {
+      onPanelRef === null || onPanelRef === void 0 ? void 0 : onPanelRef(panelRef.current);
+      return function () {
+        return onPanelRef === null || onPanelRef === void 0 ? void 0 : onPanelRef(null);
+      };
+    },
+    [onPanelRef]
+  );
+  React.useEffect(
+    function () {
+      // click outside detection
+      var handleClickOutside = function (event) {
+        if (isOpen && panelRef.current && !panelRef.current.contains(event.target)) {
+          handleClose();
+        }
+      };
+      document.addEventListener('mousedown', handleClickOutside);
+      return function () {
+        return document.removeEventListener('mousedown', handleClickOutside);
+      };
+    },
+    [isOpen, setIsOpen]
+  );
+  // body scroll lock
+  React.useEffect(
+    function () {
+      document.body.style.overflow = isOpen ? 'hidden' : '';
+      return function () {
+        document.body.style.overflow = '';
+      };
+    },
+    [isOpen]
+  );
+  var handleClose = function () {
+    if (isOpen && panelRef.current) {
+      if (srpType === build.PortalQsmType.Flight) {
+        dispatch(setSelectedFlight(null));
+        dispatch(setSelectedFlightDetails(null));
+        onCancelSearch();
+      } else {
+        dispatch(setSelectedSearchResult(null));
+        dispatch(setSelectedPackagingAccoResult(null));
+      }
+      dispatch(setFlyInType('acco-details'));
+      setIsOpen(false);
+    }
+  };
+  var handleGoBack = function () {
+    dispatch(setFlyInType('acco-results'));
+  };
+  var handleSortChange = function (newSortKey, direction) {
+    if (sortByTypes === undefined) return;
+    var newSortByType = findSortByType(sortByTypes, newSortKey, direction !== null && direction !== void 0 ? direction : 'asc');
+    if (newSortByType) {
+      dispatch(setSortType(newSortByType));
+    }
+  };
+  return React__default['default'].createElement(
+    'div',
+    {
+      className: 'flyin '
+        .concat(isOpen ? 'flyin--active' : '', ' ')
+        .concat(className, ' ')
+        .concat(
+          isPackageEditFlow || flyInType === 'flight-outward-results' || flyInType === 'flight-return-results' || flyInType === 'acco-results'
+            ? 'flyin--large'
+            : ''
+        )
+    },
+    React__default['default'].createElement(
+      'div',
+      { className: 'flyin__panel '.concat(isOpen ? 'flyin__panel--active' : ''), ref: panelRef },
+      React__default['default'].createElement(
+        'div',
+        { className: 'flyin__content' },
+        React__default['default'].createElement(
+          'div',
+          { className: 'flyin__content-title-row' },
+          React__default['default'].createElement(
+            'h3',
+            { className: 'flyin__content-title' },
+            srpType === build.PortalQsmType.Flight && 'Select your fare',
+            srpType === build.PortalQsmType.Accommodation ||
+              (srpType === build.PortalQsmType.AccommodationAndFlight &&
+                (flyInType === 'acco-results' || flyInType === 'acco-details') &&
+                ''.concat(translations.SRP.SELECT, ' ').concat(translations.SRP.ACCOMMODATION)),
+            srpType === build.PortalQsmType.AccommodationAndFlight &&
+              flyInType === 'flight-outward-results' &&
+              ''.concat(translations.SRP.SELECT, ' ').concat(translations.FLIGHTS_FORM.OUTWARD_FLIGHT),
+            srpType === build.PortalQsmType.AccommodationAndFlight &&
+              flyInType === 'flight-return-results' &&
+              ''.concat(translations.SRP.SELECT, ' ').concat(translations.FLIGHTS_FORM.RETURN_FLIGHT),
+            srpType === build.PortalQsmType.AccommodationAndFlight && flyInType === 'flight-details' && 'Select your fare'
+          ),
+          React__default['default'].createElement(
+            'span',
+            {
+              className: 'flyin__close',
+              onClick: function () {
+                return handleClose();
+              }
+            },
+            React__default['default'].createElement(Icon, { name: 'ui-close', width: 30, height: 30, 'aria-hidden': 'true' })
+          )
+        ),
+        isPackageEditFlow &&
+          flyInType === 'acco-details' &&
+          React__default['default'].createElement(
+            'div',
+            { className: 'flyin__content-title-row' },
+            React__default['default'].createElement(
+              'div',
+              { onClick: handleGoBack, className: 'flyin__content-title__back' },
+              React__default['default'].createElement(Icon, { name: 'ui-chevron', width: 14, height: 14, 'aria-hidden': 'true' }),
+              'Go Back'
+            )
+          )
+      ),
+      srpType === build.PortalQsmType.Flight && React__default['default'].createElement(FlightsFlyIn, { isOpen: isOpen, setIsOpen: setIsOpen }),
+      (srpType === build.PortalQsmType.Accommodation || srpType === build.PortalQsmType.AccommodationAndFlight) &&
+        flyInType === 'acco-results' &&
+        React__default['default'].createElement(
+          'div',
+          { className: 'flyin__content flyin__content--columns' },
+          React__default['default'].createElement(Filters, {
+            initialFilters: initialFilters,
+            filters: filters,
+            isOpen: false,
+            handleSetIsOpen: function () {},
+            // handleApplyFilters={() => setSearchTrigger((prev) => prev + 1)}
+            isLoading: isLoading,
+            setFilters: function (filters) {
+              return dispatch(setFilters(filters));
+            },
+            resetFilters: function (filters) {
+              return dispatch(resetFilters(filters));
+            }
+          }),
+          React__default['default'].createElement(
+            'div',
+            { className: 'search__results__wrapper' },
+            React__default['default'].createElement(
+              'div',
+              { className: 'search__result-row' },
+              React__default['default'].createElement(
+                'span',
+                { className: 'search__result-row-text' },
+                !isLoading &&
+                  React__default['default'].createElement(
+                    React__default['default'].Fragment,
+                    null,
+                    (filteredPackagingAccoResults === null || filteredPackagingAccoResults === void 0 ? void 0 : filteredPackagingAccoResults.length) &&
+                      filteredPackagingAccoResults.length,
+                    '\u00A0',
+                    translations.SRP.TOTAL_RESULTS_LABEL
+                  )
+              ),
+              sortByTypes &&
+                sortByTypes.length > 0 &&
+                React__default['default'].createElement(
+                  'div',
+                  { className: 'search__result-row-filter' },
+                  React__default['default'].createElement(ItemPicker, {
+                    items: sortByTypes,
+                    selection: (selectedSortType === null || selectedSortType === void 0 ? void 0 : selectedSortType.label) || undefined,
+                    selectedSortByType: selectedSortType,
+                    label: translations.SRP.SORTBY,
+                    placeholder: translations.SRP.SORTBY,
+                    classModifier: 'travel-class-picker__items',
+                    valueFormatter: function (value, direction) {
+                      return getSortingName(translations, findSortByType(sortByTypes, value, direction !== null && direction !== void 0 ? direction : 'asc'));
+                    },
+                    onPick: function (newSortKey, direction) {
+                      return handleSortChange(newSortKey, direction);
+                    }
+                  })
+                )
+            ),
+            React__default['default'].createElement(HotelAccommodationResults, { isLoading: detailsLoading, isFlyIn: true })
+          )
+        ),
+      (srpType === build.PortalQsmType.Accommodation || srpType === build.PortalQsmType.AccommodationAndFlight) &&
+        flyInType === 'acco-details' &&
+        React__default['default'].createElement(AccommodationFlyIn, { isLoading: detailsLoading, handleConfirm: handleConfirm }),
+      srpType === build.PortalQsmType.AccommodationAndFlight &&
+        (flyInType === 'flight-outward-results' || flyInType === 'flight-return-results') &&
+        React__default['default'].createElement(PackageingFlightsFlyIn, { isOpen: isOpen, setIsOpen: setIsOpen }),
+      srpType === build.PortalQsmType.GroupTour &&
+        React__default['default'].createElement(GroupTourFlyIn, { isLoading: detailsLoading, isOpen: isOpen, setIsOpen: setIsOpen })
+    )
+  );
+};
+
+var RoundTripResults = function () {
+  var activeTab = reactRedux.useSelector(function (state) {
+    return state.searchResults;
+  }).activeTab;
+  var dispatch = reactRedux.useDispatch();
+  React.useEffect(
+    function () {
+      if (activeTab === 'compact') {
+        dispatch(setActiveTab('list'));
+      }
+    },
+    [activeTab]
+  );
+  return React__default['default'].createElement(
+    'div',
+    { className: 'search__results__cards search__results__cards--'.concat(activeTab) },
+    React__default['default'].createElement(
+      'div',
+      { className: 'search__result-card' },
+      React__default['default'].createElement(
         'div',
         { className: 'search__result-card__allotment' },
         React__default['default'].createElement(
@@ -44214,238 +45279,65 @@ var PairedFlightOption = function (_a) {
   var _v = React.useState(false),
     isOutwardOpen = _v[0],
     setIsOutwardOpen = _v[1];
-  var _w = React.useState(false),
-    isReturnOpen = _w[0],
-    setIsReturnOpen = _w[1];
-  var handleSelect = function (flight) {
-    dispatch(setSelectedFlight(flight));
-    onFlightSearch(flight); // Trigger search to update accommodation options based on selected flight
-    dispatch(setFlyInIsOpen(true));
-  };
-  return React__default['default'].createElement(
-    'div',
-    { className: 'search__result-card', key: 'flight-'.concat(item.guid) },
-    React__default['default'].createElement(
-      'div',
-      { className: 'flight' },
-      React__default['default'].createElement(
-        'div',
-        { className: 'flight__option' },
-        React__default['default'].createElement(
-          'div',
-          { className: 'flight__content' },
-          React__default['default'].createElement(
-            'div',
-            { className: 'flight__flights' },
-            React__default['default'].createElement(
-              'div',
-              { className: 'flight__flight' },
-              React__default['default'].createElement(
-                'div',
-                { className: 'flight__flight__header' },
-                React__default['default'].createElement('div', { className: 'flight__status__container' }),
-                React__default['default'].createElement(
-                  'div',
-                  { className: 'flight__price' },
-                  React__default['default'].createElement(
-                    'span',
-                    { className: 'price' },
-                    formatPrice$2(
-                      item.price,
-                      'EUR',
-                      (_c = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _c !== void 0 ? _c : 'en-GB'
-                    )
-                  ),
-                  React__default['default'].createElement(
-                    'button',
-                    {
-                      type: 'button',
-                      className: 'cta '.concat(
-                        (selectedFlight === null || selectedFlight === void 0 ? void 0 : selectedFlight.guid) === item.guid ? 'cta--selected' : 'cta--select'
-                      ),
-                      onClick: function () {
-                        return handleSelect(item);
-                      }
-                    },
-                    (selectedFlight === null || selectedFlight === void 0 ? void 0 : selectedFlight.guid) === item.guid ? 'Selected' : 'Select'
-                  )
-                )
-              )
-            ),
-            item.outward &&
-              React__default['default'].createElement(
-                'div',
-                { className: 'flight__flight' },
-                React__default['default'].createElement(
-                  'div',
-                  { className: 'flight__flight__container' },
-                  React__default['default'].createElement(
-                    'div',
-                    { className: 'flight__flight__wrapper' },
-                    React__default['default'].createElement(
-                      'div',
-                      { className: 'flight__logo__wrapper' },
-                      React__default['default'].createElement('img', {
-                        src: 'https://media.tidesoftware.be/media/shared/Airlines/'.concat(
-                          (_d = getDepartureSegment(item.outward)) === null || _d === void 0 ? void 0 : _d.marketingAirlineCode,
-                          '.png?height=256'
-                        ),
-                        alt: '',
-                        className: 'flight__logo'
-                      }),
-                      React__default['default'].createElement(
-                        'span',
-                        null,
-                        (_e = getDepartureSegment(item.outward)) === null || _e === void 0 ? void 0 : _e.marketingAirlineName
-                      )
-                    ),
-                    React__default['default'].createElement(
-                      'div',
-                      { className: 'flight__info' },
-                      React__default['default'].createElement(
-                        'div',
-                        { className: 'flight__info__times' },
-                        React__default['default'].createElement(
-                          'strong',
-                          null,
-                          timeFromDateTime((_f = getDepartureSegment(item.outward)) === null || _f === void 0 ? void 0 : _f.departureDateTime),
-                          ' ',
-                          (_g = getDepartureSegment(item.outward)) === null || _g === void 0 ? void 0 : _g.departureAirportCode
-                        ),
-                        React__default['default'].createElement(
-                          'p',
-                          null,
-                          longFormatDate((_h = getDepartureSegment(item.outward)) === null || _h === void 0 ? void 0 : _h.departureDateTime, language)
-                        )
-                      ),
-                      React__default['default'].createElement(
-                        'div',
-                        { className: 'flight__info__duration' },
-                        React__default['default'].createElement('p', null, durationTicksInHoursString(item.outward.durationInTicks)),
-                        React__default['default'].createElement(
-                          'div',
-                          { className: 'flight__info__duration__stops' },
-                          React__default['default'].createElement('div', { className: 'flight__info__duration__stop' })
-                        ),
-                        React__default['default'].createElement(
-                          'span',
-                          null,
-                          getNumberOfStopsLabel(item.outward, translations.SRP.DIRECT, translations.SRP.STOPS, translations.SRP.STOP)
-                        )
-                      ),
-                      React__default['default'].createElement(
-                        'div',
-                        { className: 'flight__info__times flight__info__times--arrival' },
-                        React__default['default'].createElement(
-                          'strong',
-                          null,
-                          timeFromDateTime((_j = getArrivalSegment(item.outward)) === null || _j === void 0 ? void 0 : _j.arrivalDateTime),
-                          ' ',
-                          (_k = getArrivalSegment(item.outward)) === null || _k === void 0 ? void 0 : _k.arrivalAirportCode
-                        ),
-                        React__default['default'].createElement(
-                          'p',
-                          null,
-                          longFormatDate((_l = getArrivalSegment(item.outward)) === null || _l === void 0 ? void 0 : _l.arrivalDateTime, language)
-                        )
-                      )
-                    )
-                  ),
-                  React__default['default'].createElement(
-                    'div',
-                    { className: 'flight__detail__btn__wrapper' },
-                    React__default['default'].createElement(
-                      'div',
-                      {
-                        className: 'flight__detail__btn '.concat(isOutwardOpen ? 'flight__detail__btn--active' : ''),
-                        onClick: function () {
-                          return setIsOutwardOpen(function (prev) {
-                            return !prev;
-                          });
-                        }
-                      },
-                      React__default['default'].createElement(Icon$1, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
-                    )
-                  )
-                ),
-                React__default['default'].createElement(
-                  'div',
-                  { className: 'flight__detail '.concat(isOutwardOpen ? 'flight__detail--active' : '') },
-                  getFlightSegments(item.outward).map(function (segment, index) {
-                    return React__default['default'].createElement(
-                      React__default['default'].Fragment,
-                      { key: 'outward-segment-'.concat(index, '-').concat(segment.flightNumber) },
-                      React__default['default'].createElement(
-                        'div',
-                        { className: 'flight__info' },
-                        React__default['default'].createElement(
-                          'div',
-                          { className: 'flight__info__times__wrapper' },
-                          React__default['default'].createElement(
-                            'div',
-                            { className: 'flight__info__times' },
-                            React__default['default'].createElement('p', null, timeFromDateTime(segment.departureDateTime)),
-                            React__default['default'].createElement('strong', null, segment.departureAirportCode),
-                            React__default['default'].createElement('p', null, longFormatDate(segment.departureDateTime, language))
-                          ),
-                          React__default['default'].createElement(
-                            'div',
-                            null,
-                            React__default['default'].createElement(Icon$1, { name: 'ui-plane-depart', width: 30, height: 20 })
-                          )
-                        ),
-                        React__default['default'].createElement(
-                          'div',
-                          { className: 'flight__info__duration' },
-                          React__default['default'].createElement('p', null, durationTicksInHoursString(segment.durationInTicks)),
-                          React__default['default'].createElement('div', { className: 'flight__info__duration__stops' }),
-                          React__default['default'].createElement('span', null, segment.marketingAirlineName),
-                          React__default['default'].createElement('strong', null, segment.operatingFlightNumber)
-                        ),
-                        React__default['default'].createElement(
-                          'div',
-                          { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
-                          React__default['default'].createElement(
-                            'div',
-                            null,
-                            React__default['default'].createElement(Icon$1, { name: 'ui-plane-arrive', width: 30, height: 20 })
-                          ),
-                          React__default['default'].createElement(
-                            'div',
-                            { className: 'flight__info__times flight__info__times--arrival' },
-                            React__default['default'].createElement('p', null, timeFromDateTime(segment.arrivalDateTime)),
-                            React__default['default'].createElement('strong', null, segment.arrivalAirportCode),
-                            React__default['default'].createElement('p', null, longFormatDate(segment.arrivalDateTime, language))
-                          )
-                        )
+  var _w = React.useState(false),
+    isReturnOpen = _w[0],
+    setIsReturnOpen = _w[1];
+  var handleSelect = function (flight) {
+    dispatch(setSelectedFlight(flight));
+    onFlightSearch(flight); // Trigger search to update accommodation options based on selected flight
+    dispatch(setFlyInIsOpen(true));
+  };
+  return React__default['default'].createElement(
+    'div',
+    { className: 'search__result-card', key: 'flight-'.concat(item.guid) },
+    React__default['default'].createElement(
+      'div',
+      { className: 'flight' },
+      React__default['default'].createElement(
+        'div',
+        { className: 'flight__option' },
+        React__default['default'].createElement(
+          'div',
+          { className: 'flight__content' },
+          React__default['default'].createElement(
+            'div',
+            { className: 'flight__flights' },
+            React__default['default'].createElement(
+              'div',
+              { className: 'flight__flight' },
+              React__default['default'].createElement(
+                'div',
+                { className: 'flight__flight__header' },
+                React__default['default'].createElement('div', { className: 'flight__status__container' }),
+                React__default['default'].createElement(
+                  'div',
+                  { className: 'flight__price' },
+                  React__default['default'].createElement(
+                    'span',
+                    { className: 'price' },
+                    formatPrice$2(
+                      item.price,
+                      'EUR',
+                      (_c = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _c !== void 0 ? _c : 'en-GB'
+                    )
+                  ),
+                  React__default['default'].createElement(
+                    'button',
+                    {
+                      type: 'button',
+                      className: 'cta '.concat(
+                        (selectedFlight === null || selectedFlight === void 0 ? void 0 : selectedFlight.guid) === item.guid ? 'cta--selected' : 'cta--select'
                       ),
-                      segment.transferTimeInTicks &&
-                        React__default['default'].createElement(
-                          'div',
-                          { className: 'flight__info' },
-                          React__default['default'].createElement('div', { className: 'flight__info__times' }),
-                          React__default['default'].createElement(
-                            'div',
-                            { className: 'flight__info__duration flight__info__duration--waittime' },
-                            React__default['default'].createElement(
-                              'div',
-                              { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
-                              React__default['default'].createElement(Icon$1, { name: 'ui-clock', width: 24, height: 24 })
-                            ),
-                            React__default['default'].createElement(
-                              'div',
-                              { className: 'flight__info__duration__stoptime' },
-                              React__default['default'].createElement('span', null, 'Stop time'),
-                              React__default['default'].createElement('strong', null, durationTicksInHoursString(segment.transferTimeInTicks))
-                            )
-                          ),
-                          React__default['default'].createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
-                        )
-                    );
-                  })
+                      onClick: function () {
+                        return handleSelect(item);
+                      }
+                    },
+                    (selectedFlight === null || selectedFlight === void 0 ? void 0 : selectedFlight.guid) === item.guid ? 'Selected' : 'Select'
+                  )
                 )
-              ),
-            item.return &&
+              )
+            ),
+            item.outward &&
               React__default['default'].createElement(
                 'div',
                 { className: 'flight__flight' },
@@ -44460,7 +45352,7 @@ var PairedFlightOption = function (_a) {
                       { className: 'flight__logo__wrapper' },
                       React__default['default'].createElement('img', {
                         src: 'https://media.tidesoftware.be/media/shared/Airlines/'.concat(
-                          (_m = getDepartureSegment(item.return)) === null || _m === void 0 ? void 0 : _m.marketingAirlineCode,
+                          (_d = getDepartureSegment(item.outward)) === null || _d === void 0 ? void 0 : _d.marketingAirlineCode,
                           '.png?height=256'
                         ),
                         alt: '',
@@ -44469,7 +45361,7 @@ var PairedFlightOption = function (_a) {
                       React__default['default'].createElement(
                         'span',
                         null,
-                        (_o = getDepartureSegment(item.return)) === null || _o === void 0 ? void 0 : _o.marketingAirlineName
+                        (_e = getDepartureSegment(item.outward)) === null || _e === void 0 ? void 0 : _e.marketingAirlineName
                       )
                     ),
                     React__default['default'].createElement(
@@ -44481,20 +45373,20 @@ var PairedFlightOption = function (_a) {
                         React__default['default'].createElement(
                           'strong',
                           null,
-                          timeFromDateTime((_p = getDepartureSegment(item.return)) === null || _p === void 0 ? void 0 : _p.departureDateTime),
+                          timeFromDateTime((_f = getDepartureSegment(item.outward)) === null || _f === void 0 ? void 0 : _f.departureDateTime),
                           ' ',
-                          (_q = getDepartureSegment(item.return)) === null || _q === void 0 ? void 0 : _q.departureAirportCode
+                          (_g = getDepartureSegment(item.outward)) === null || _g === void 0 ? void 0 : _g.departureAirportCode
                         ),
                         React__default['default'].createElement(
                           'p',
                           null,
-                          longFormatDate((_r = getDepartureSegment(item.return)) === null || _r === void 0 ? void 0 : _r.departureDateTime, language)
+                          longFormatDate((_h = getDepartureSegment(item.outward)) === null || _h === void 0 ? void 0 : _h.departureDateTime, language)
                         )
                       ),
                       React__default['default'].createElement(
                         'div',
                         { className: 'flight__info__duration' },
-                        React__default['default'].createElement('p', null, durationTicksInHoursString(item.return.durationInTicks)),
+                        React__default['default'].createElement('p', null, durationTicksInHoursString(item.outward.durationInTicks)),
                         React__default['default'].createElement(
                           'div',
                           { className: 'flight__info__duration__stops' },
@@ -44503,7 +45395,7 @@ var PairedFlightOption = function (_a) {
                         React__default['default'].createElement(
                           'span',
                           null,
-                          getNumberOfStopsLabel(item.return, translations.SRP.DIRECT, translations.SRP.STOPS, translations.SRP.STOP)
+                          getNumberOfStopsLabel(item.outward, translations.SRP.DIRECT, translations.SRP.STOPS, translations.SRP.STOP)
                         )
                       ),
                       React__default['default'].createElement(
@@ -44512,14 +45404,14 @@ var PairedFlightOption = function (_a) {
                         React__default['default'].createElement(
                           'strong',
                           null,
-                          timeFromDateTime((_s = getArrivalSegment(item.return)) === null || _s === void 0 ? void 0 : _s.arrivalDateTime),
+                          timeFromDateTime((_j = getArrivalSegment(item.outward)) === null || _j === void 0 ? void 0 : _j.arrivalDateTime),
                           ' ',
-                          (_t = getArrivalSegment(item.return)) === null || _t === void 0 ? void 0 : _t.arrivalAirportCode
+                          (_k = getArrivalSegment(item.outward)) === null || _k === void 0 ? void 0 : _k.arrivalAirportCode
                         ),
                         React__default['default'].createElement(
                           'p',
                           null,
-                          longFormatDate((_u = getArrivalSegment(item.return)) === null || _u === void 0 ? void 0 : _u.arrivalDateTime, language)
+                          longFormatDate((_l = getArrivalSegment(item.outward)) === null || _l === void 0 ? void 0 : _l.arrivalDateTime, language)
                         )
                       )
                     )
@@ -44530,9 +45422,9 @@ var PairedFlightOption = function (_a) {
                     React__default['default'].createElement(
                       'div',
                       {
-                        className: 'flight__detail__btn '.concat(isReturnOpen ? 'flight__detail__btn--active' : ''),
+                        className: 'flight__detail__btn '.concat(isOutwardOpen ? 'flight__detail__btn--active' : ''),
                         onClick: function () {
-                          return setIsReturnOpen(function (prev) {
+                          return setIsOutwardOpen(function (prev) {
                             return !prev;
                           });
                         }
@@ -44543,11 +45435,11 @@ var PairedFlightOption = function (_a) {
                 ),
                 React__default['default'].createElement(
                   'div',
-                  { className: 'flight__detail '.concat(isReturnOpen ? 'flight__detail--active' : '') },
-                  getFlightSegments(item.return).map(function (segment, index) {
+                  { className: 'flight__detail '.concat(isOutwardOpen ? 'flight__detail--active' : '') },
+                  getFlightSegments(item.outward).map(function (segment, index) {
                     return React__default['default'].createElement(
                       React__default['default'].Fragment,
-                      { key: 'return-segment-'.concat(index, '-').concat(segment.flightNumber) },
+                      { key: 'outward-segment-'.concat(index, '-').concat(segment.flightNumber) },
                       React__default['default'].createElement(
                         'div',
                         { className: 'flight__info' },
@@ -44574,352 +45466,223 @@ var PairedFlightOption = function (_a) {
                           React__default['default'].createElement('div', { className: 'flight__info__duration__stops' }),
                           React__default['default'].createElement('span', null, segment.marketingAirlineName),
                           React__default['default'].createElement('strong', null, segment.operatingFlightNumber)
-                        ),
-                        React__default['default'].createElement(
-                          'div',
-                          { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
-                          React__default['default'].createElement(
-                            'div',
-                            null,
-                            React__default['default'].createElement(Icon$1, { name: 'ui-plane-arrive', width: 30, height: 20 })
-                          ),
-                          React__default['default'].createElement(
-                            'div',
-                            { className: 'flight__info__times flight__info__times--arrival' },
-                            React__default['default'].createElement('p', null, timeFromDateTime(segment.arrivalDateTime)),
-                            React__default['default'].createElement('strong', null, segment.arrivalAirportCode),
-                            React__default['default'].createElement('p', null, longFormatDate(segment.arrivalDateTime, language))
-                          )
-                        )
-                      ),
-                      segment.transferTimeInTicks &&
-                        React__default['default'].createElement(
-                          'div',
-                          { className: 'flight__info' },
-                          React__default['default'].createElement('div', { className: 'flight__info__times' }),
-                          React__default['default'].createElement(
-                            'div',
-                            { className: 'flight__info__duration flight__info__duration--waittime' },
-                            React__default['default'].createElement(
-                              'div',
-                              { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
-                              React__default['default'].createElement(Icon$1, { name: 'ui-clock', width: 24, height: 24 })
-                            ),
-                            React__default['default'].createElement(
-                              'div',
-                              { className: 'flight__info__duration__stoptime' },
-                              React__default['default'].createElement('span', null, 'Stop time'),
-                              React__default['default'].createElement('strong', null, durationTicksInHoursString(segment.transferTimeInTicks))
-                            )
-                          ),
-                          React__default['default'].createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
-                        )
-                    );
-                  })
-                )
-              )
-          )
-        )
-      )
-    )
-  );
-};
-
-var PairedFlightSelection = function (_a) {
-  var _b;
-  var searchResults = _a.searchResults;
-  var context = React.useContext(SearchResultsConfigurationContext);
-  var translations = getTranslations((_b = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _b !== void 0 ? _b : 'en-GB');
-  return React__default['default'].createElement(
-    React__default['default'].Fragment,
-    null,
-    React__default['default'].createElement(
-      'div',
-      { className: 'search__results__label search__results__label--secondary' },
-      React__default['default'].createElement(
-        'div',
-        { className: 'search__results__label__date' },
-        React__default['default'].createElement(Icon$1, { name: 'ui-flight', height: 16, fill: 'white' })
-      ),
-      React__default['default'].createElement(
-        'div',
-        { className: 'search__results__label__text' },
-        React__default['default'].createElement(
-          'h3',
-          null,
-          translations.SRP.SELECT,
-          ' ',
-          React__default['default'].createElement('strong', null, ' ', translations.SIDEBAR.FLIGHT)
-        )
-      )
-    ),
-    React__default['default'].createElement(
-      'div',
-      { className: 'search__results__cards search__results__cards--extended' },
-      searchResults.map(function (result) {
-        return React__default['default'].createElement(PairedFlightOption, { key: 'flight-'.concat(result.guid), item: result });
-      })
-    )
-  );
-};
-
-var IndependentFlightOption = function (_a) {
-  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
-  var item = _a.item,
-    onSelect = _a.onSelect,
-    guid = _a.guid,
-    selectedGuid = _a.selectedGuid,
-    isOutward = _a.isOutward,
-    showSelectedState = _a.showSelectedState,
-    currentSelectedPrice = _a.currentSelectedPrice,
-    price = _a.price;
-  var context = React.useContext(SearchResultsConfigurationContext);
-  var language = (_b = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _b !== void 0 ? _b : 'en-GB';
-  var translations = getTranslations(language);
-  var _p = React.useState(false),
-    detailsOpen = _p[0],
-    setDetailsOpen = _p[1];
-  var priceDifference = price && currentSelectedPrice ? price - currentSelectedPrice : null;
-  return React__default['default'].createElement(
-    'div',
-    { className: 'search__result-card', key: 'flight-'.concat(item.code) },
-    React__default['default'].createElement(
-      'div',
-      { className: 'flight '.concat(showSelectedState && selectedGuid === guid ? 'flight--selected' : '') },
-      React__default['default'].createElement(
-        'div',
-        { className: 'flight__option' },
-        React__default['default'].createElement(
-          'div',
-          { className: 'flight__content' },
-          React__default['default'].createElement(
-            'div',
-            { className: 'flight__flights' },
-            React__default['default'].createElement(
-              'div',
-              { className: 'flight__flight' },
-              React__default['default'].createElement(
-                'div',
-                { className: 'flight__flight__header' },
-                React__default['default'].createElement('div', { className: 'flight__status__container' }),
-                React__default['default'].createElement(
-                  'div',
-                  { className: 'flight__price' },
-                  price != null &&
-                    price > 0 &&
-                    (isOutward
-                      ? React__default['default'].createElement(
-                          'span',
-                          { className: 'price' },
-                          translations.QSM.ROUNDTRIP + ' ' + translations.SRP.PRICE,
-                          '\u00A0',
-                          formatPrice$2(
-                            price,
-                            'EUR',
-                            (_c = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _c !== void 0 ? _c : 'en-GB'
+                        ),
+                        React__default['default'].createElement(
+                          'div',
+                          { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
+                          React__default['default'].createElement(
+                            'div',
+                            null,
+                            React__default['default'].createElement(Icon$1, { name: 'ui-plane-arrive', width: 30, height: 20 })
+                          ),
+                          React__default['default'].createElement(
+                            'div',
+                            { className: 'flight__info__times flight__info__times--arrival' },
+                            React__default['default'].createElement('p', null, timeFromDateTime(segment.arrivalDateTime)),
+                            React__default['default'].createElement('strong', null, segment.arrivalAirportCode),
+                            React__default['default'].createElement('p', null, longFormatDate(segment.arrivalDateTime, language))
                           )
                         )
-                      : priceDifference != null &&
-                        Math.abs(priceDifference) > 0 &&
+                      ),
+                      segment.transferTimeInTicks &&
                         React__default['default'].createElement(
-                          'span',
-                          { className: 'price' },
-                          priceDifference > 0 ? '+' : '-',
-                          '\u00A0',
-                          formatPrice$2(
-                            Math.abs(priceDifference),
-                            'EUR',
-                            (_d = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _d !== void 0 ? _d : 'en-GB'
-                          )
-                        )),
-                  React__default['default'].createElement(
-                    'button',
-                    {
-                      type: 'button',
-                      className: 'cta '.concat(selectedGuid === guid ? 'cta--selected' : 'cta--select'),
-                      onClick: function () {
-                        return onSelect === null || onSelect === void 0 ? void 0 : onSelect();
-                      }
-                    },
-                    selectedGuid === guid ? 'Selected' : 'Select'
-                  )
+                          'div',
+                          { className: 'flight__info' },
+                          React__default['default'].createElement('div', { className: 'flight__info__times' }),
+                          React__default['default'].createElement(
+                            'div',
+                            { className: 'flight__info__duration flight__info__duration--waittime' },
+                            React__default['default'].createElement(
+                              'div',
+                              { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
+                              React__default['default'].createElement(Icon$1, { name: 'ui-clock', width: 24, height: 24 })
+                            ),
+                            React__default['default'].createElement(
+                              'div',
+                              { className: 'flight__info__duration__stoptime' },
+                              React__default['default'].createElement('span', null, 'Stop time'),
+                              React__default['default'].createElement('strong', null, durationTicksInHoursString(segment.transferTimeInTicks))
+                            )
+                          ),
+                          React__default['default'].createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
+                        )
+                    );
+                  })
                 )
-              )
-            ),
-            React__default['default'].createElement(
-              'div',
-              { className: 'flight__flight' },
+              ),
+            item.return &&
               React__default['default'].createElement(
                 'div',
-                { className: 'flight__flight__container' },
+                { className: 'flight__flight' },
                 React__default['default'].createElement(
                   'div',
-                  { className: 'flight__flight__wrapper' },
-                  React__default['default'].createElement(
-                    'div',
-                    { className: 'flight__logo__wrapper' },
-                    React__default['default'].createElement('img', {
-                      src: 'https://media.tidesoftware.be/media/shared/Airlines/'.concat(
-                        (_e = getDepartureSegment(item)) === null || _e === void 0 ? void 0 : _e.marketingAirlineCode,
-                        '.png?height=256'
-                      ),
-                      alt: '',
-                      className: 'flight__logo'
-                    }),
-                    React__default['default'].createElement(
-                      'span',
-                      null,
-                      (_f = getDepartureSegment(item)) === null || _f === void 0 ? void 0 : _f.marketingAirlineName
-                    )
-                  ),
+                  { className: 'flight__flight__container' },
                   React__default['default'].createElement(
                     'div',
-                    { className: 'flight__info' },
+                    { className: 'flight__flight__wrapper' },
                     React__default['default'].createElement(
                       'div',
-                      { className: 'flight__info__times' },
-                      React__default['default'].createElement(
-                        'strong',
-                        null,
-                        timeFromDateTime((_g = getDepartureSegment(item)) === null || _g === void 0 ? void 0 : _g.departureDateTime),
-                        ' ',
-                        (_h = getDepartureSegment(item)) === null || _h === void 0 ? void 0 : _h.departureAirportCode
-                      ),
+                      { className: 'flight__logo__wrapper' },
+                      React__default['default'].createElement('img', {
+                        src: 'https://media.tidesoftware.be/media/shared/Airlines/'.concat(
+                          (_m = getDepartureSegment(item.return)) === null || _m === void 0 ? void 0 : _m.marketingAirlineCode,
+                          '.png?height=256'
+                        ),
+                        alt: '',
+                        className: 'flight__logo'
+                      }),
                       React__default['default'].createElement(
-                        'p',
+                        'span',
                         null,
-                        longFormatDate((_j = getDepartureSegment(item)) === null || _j === void 0 ? void 0 : _j.departureDateTime, language)
+                        (_o = getDepartureSegment(item.return)) === null || _o === void 0 ? void 0 : _o.marketingAirlineName
                       )
                     ),
                     React__default['default'].createElement(
                       'div',
-                      { className: 'flight__info__duration' },
-                      React__default['default'].createElement('p', null, durationTicksInHoursString(item.durationInTicks)),
+                      { className: 'flight__info' },
                       React__default['default'].createElement(
                         'div',
-                        { className: 'flight__info__duration__stops' },
-                        React__default['default'].createElement('div', { className: 'flight__info__duration__stop' })
+                        { className: 'flight__info__times' },
+                        React__default['default'].createElement(
+                          'strong',
+                          null,
+                          timeFromDateTime((_p = getDepartureSegment(item.return)) === null || _p === void 0 ? void 0 : _p.departureDateTime),
+                          ' ',
+                          (_q = getDepartureSegment(item.return)) === null || _q === void 0 ? void 0 : _q.departureAirportCode
+                        ),
+                        React__default['default'].createElement(
+                          'p',
+                          null,
+                          longFormatDate((_r = getDepartureSegment(item.return)) === null || _r === void 0 ? void 0 : _r.departureDateTime, language)
+                        )
                       ),
                       React__default['default'].createElement(
-                        'span',
-                        null,
-                        getNumberOfStopsLabel(item, translations.SRP.DIRECT, translations.SRP.STOPS, translations.SRP.STOP)
-                      )
-                    ),
-                    React__default['default'].createElement(
-                      'div',
-                      { className: 'flight__info__times flight__info__times--arrival' },
-                      React__default['default'].createElement(
-                        'strong',
-                        null,
-                        timeFromDateTime((_k = getArrivalSegment(item)) === null || _k === void 0 ? void 0 : _k.arrivalDateTime),
-                        ' ',
-                        (_l = getArrivalSegment(item)) === null || _l === void 0 ? void 0 : _l.arrivalAirportCode
+                        'div',
+                        { className: 'flight__info__duration' },
+                        React__default['default'].createElement('p', null, durationTicksInHoursString(item.return.durationInTicks)),
+                        React__default['default'].createElement(
+                          'div',
+                          { className: 'flight__info__duration__stops' },
+                          React__default['default'].createElement('div', { className: 'flight__info__duration__stop' })
+                        ),
+                        React__default['default'].createElement(
+                          'span',
+                          null,
+                          getNumberOfStopsLabel(item.return, translations.SRP.DIRECT, translations.SRP.STOPS, translations.SRP.STOP)
+                        )
                       ),
                       React__default['default'].createElement(
-                        'p',
-                        null,
-                        longFormatDate((_m = getArrivalSegment(item)) === null || _m === void 0 ? void 0 : _m.arrivalDateTime, language)
+                        'div',
+                        { className: 'flight__info__times flight__info__times--arrival' },
+                        React__default['default'].createElement(
+                          'strong',
+                          null,
+                          timeFromDateTime((_s = getArrivalSegment(item.return)) === null || _s === void 0 ? void 0 : _s.arrivalDateTime),
+                          ' ',
+                          (_t = getArrivalSegment(item.return)) === null || _t === void 0 ? void 0 : _t.arrivalAirportCode
+                        ),
+                        React__default['default'].createElement(
+                          'p',
+                          null,
+                          longFormatDate((_u = getArrivalSegment(item.return)) === null || _u === void 0 ? void 0 : _u.arrivalDateTime, language)
+                        )
                       )
                     )
+                  ),
+                  React__default['default'].createElement(
+                    'div',
+                    { className: 'flight__detail__btn__wrapper' },
+                    React__default['default'].createElement(
+                      'div',
+                      {
+                        className: 'flight__detail__btn '.concat(isReturnOpen ? 'flight__detail__btn--active' : ''),
+                        onClick: function () {
+                          return setIsReturnOpen(function (prev) {
+                            return !prev;
+                          });
+                        }
+                      },
+                      React__default['default'].createElement(Icon$1, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
+                    )
                   )
                 ),
                 React__default['default'].createElement(
                   'div',
-                  { className: 'flight__detail__btn__wrapper' },
-                  React__default['default'].createElement(
-                    'div',
-                    {
-                      className: 'flight__detail__btn '.concat(detailsOpen ? 'flight__detail__btn--active' : ''),
-                      onClick: function () {
-                        return setDetailsOpen(function (prev) {
-                          return !prev;
-                        });
-                      }
-                    },
-                    React__default['default'].createElement(Icon$1, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
-                  )
-                )
-              ),
-              React__default['default'].createElement(
-                'div',
-                { className: 'flight__detail '.concat(detailsOpen ? 'flight__detail--active' : '') },
-                (_o = getFlightSegments(item)) === null || _o === void 0
-                  ? void 0
-                  : _o.map(function (segment, index) {
-                      return React__default['default'].createElement(
-                        React__default['default'].Fragment,
-                        { key: 'outward-segment-'.concat(index, '-').concat(segment.flightNumber) },
+                  { className: 'flight__detail '.concat(isReturnOpen ? 'flight__detail--active' : '') },
+                  getFlightSegments(item.return).map(function (segment, index) {
+                    return React__default['default'].createElement(
+                      React__default['default'].Fragment,
+                      { key: 'return-segment-'.concat(index, '-').concat(segment.flightNumber) },
+                      React__default['default'].createElement(
+                        'div',
+                        { className: 'flight__info' },
+                        React__default['default'].createElement(
+                          'div',
+                          { className: 'flight__info__times__wrapper' },
+                          React__default['default'].createElement(
+                            'div',
+                            { className: 'flight__info__times' },
+                            React__default['default'].createElement('p', null, timeFromDateTime(segment.departureDateTime)),
+                            React__default['default'].createElement('strong', null, segment.departureAirportCode),
+                            React__default['default'].createElement('p', null, longFormatDate(segment.departureDateTime, language))
+                          ),
+                          React__default['default'].createElement(
+                            'div',
+                            null,
+                            React__default['default'].createElement(Icon$1, { name: 'ui-plane-depart', width: 30, height: 20 })
+                          )
+                        ),
+                        React__default['default'].createElement(
+                          'div',
+                          { className: 'flight__info__duration' },
+                          React__default['default'].createElement('p', null, durationTicksInHoursString(segment.durationInTicks)),
+                          React__default['default'].createElement('div', { className: 'flight__info__duration__stops' }),
+                          React__default['default'].createElement('span', null, segment.marketingAirlineName),
+                          React__default['default'].createElement('strong', null, segment.operatingFlightNumber)
+                        ),
+                        React__default['default'].createElement(
+                          'div',
+                          { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
+                          React__default['default'].createElement(
+                            'div',
+                            null,
+                            React__default['default'].createElement(Icon$1, { name: 'ui-plane-arrive', width: 30, height: 20 })
+                          ),
+                          React__default['default'].createElement(
+                            'div',
+                            { className: 'flight__info__times flight__info__times--arrival' },
+                            React__default['default'].createElement('p', null, timeFromDateTime(segment.arrivalDateTime)),
+                            React__default['default'].createElement('strong', null, segment.arrivalAirportCode),
+                            React__default['default'].createElement('p', null, longFormatDate(segment.arrivalDateTime, language))
+                          )
+                        )
+                      ),
+                      segment.transferTimeInTicks &&
                         React__default['default'].createElement(
                           'div',
                           { className: 'flight__info' },
+                          React__default['default'].createElement('div', { className: 'flight__info__times' }),
                           React__default['default'].createElement(
                             'div',
-                            { className: 'flight__info__times__wrapper' },
+                            { className: 'flight__info__duration flight__info__duration--waittime' },
                             React__default['default'].createElement(
                               'div',
-                              { className: 'flight__info__times' },
-                              React__default['default'].createElement('p', null, timeFromDateTime(segment.departureDateTime)),
-                              React__default['default'].createElement('strong', null, segment.departureAirportCode),
-                              React__default['default'].createElement('p', null, longFormatDate(segment.departureDateTime, language))
+                              { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
+                              React__default['default'].createElement(Icon$1, { name: 'ui-clock', width: 24, height: 24 })
                             ),
                             React__default['default'].createElement(
                               'div',
-                              null,
-                              React__default['default'].createElement(Icon$1, { name: 'ui-plane-depart', width: 30, height: 20 })
+                              { className: 'flight__info__duration__stoptime' },
+                              React__default['default'].createElement('span', null, 'Stop time'),
+                              React__default['default'].createElement('strong', null, durationTicksInHoursString(segment.transferTimeInTicks))
                             )
                           ),
-                          React__default['default'].createElement(
-                            'div',
-                            { className: 'flight__info__duration' },
-                            React__default['default'].createElement('p', null, durationTicksInHoursString(segment.durationInTicks)),
-                            React__default['default'].createElement('div', { className: 'flight__info__duration__stops' }),
-                            React__default['default'].createElement('span', null, segment.marketingAirlineName),
-                            React__default['default'].createElement('strong', null, segment.operatingFlightNumber)
-                          ),
-                          React__default['default'].createElement(
-                            'div',
-                            { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
-                            React__default['default'].createElement(
-                              'div',
-                              null,
-                              React__default['default'].createElement(Icon$1, { name: 'ui-plane-arrive', width: 30, height: 20 })
-                            ),
-                            React__default['default'].createElement(
-                              'div',
-                              { className: 'flight__info__times flight__info__times--arrival' },
-                              React__default['default'].createElement('p', null, timeFromDateTime(segment.arrivalDateTime)),
-                              React__default['default'].createElement('strong', null, segment.arrivalAirportCode),
-                              React__default['default'].createElement('p', null, longFormatDate(segment.arrivalDateTime, language))
-                            )
-                          )
-                        ),
-                        segment.transferTimeInTicks &&
-                          React__default['default'].createElement(
-                            'div',
-                            { className: 'flight__info' },
-                            React__default['default'].createElement('div', { className: 'flight__info__times' }),
-                            React__default['default'].createElement(
-                              'div',
-                              { className: 'flight__info__duration flight__info__duration--waittime' },
-                              React__default['default'].createElement(
-                                'div',
-                                { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
-                                React__default['default'].createElement(Icon$1, { name: 'ui-clock', width: 24, height: 24 })
-                              ),
-                              React__default['default'].createElement(
-                                'div',
-                                { className: 'flight__info__duration__stoptime' },
-                                React__default['default'].createElement('span', null, 'Stop time'),
-                                React__default['default'].createElement('strong', null, durationTicksInHoursString(segment.transferTimeInTicks))
-                              )
-                            ),
-                            React__default['default'].createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
-                          )
-                      );
-                    })
+                          React__default['default'].createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
+                        )
+                    );
+                  })
+                )
               )
-            )
           )
         )
       )
@@ -44927,6 +45690,44 @@ var IndependentFlightOption = function (_a) {
   );
 };
 
+var PairedFlightSelection = function (_a) {
+  var _b;
+  var searchResults = _a.searchResults;
+  var context = React.useContext(SearchResultsConfigurationContext);
+  var translations = getTranslations((_b = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _b !== void 0 ? _b : 'en-GB');
+  return React__default['default'].createElement(
+    React__default['default'].Fragment,
+    null,
+    React__default['default'].createElement(
+      'div',
+      { className: 'search__results__label search__results__label--secondary' },
+      React__default['default'].createElement(
+        'div',
+        { className: 'search__results__label__date' },
+        React__default['default'].createElement(Icon$1, { name: 'ui-flight', height: 16, fill: 'white' })
+      ),
+      React__default['default'].createElement(
+        'div',
+        { className: 'search__results__label__text' },
+        React__default['default'].createElement(
+          'h3',
+          null,
+          translations.SRP.SELECT,
+          ' ',
+          React__default['default'].createElement('strong', null, ' ', translations.SIDEBAR.FLIGHT)
+        )
+      )
+    ),
+    React__default['default'].createElement(
+      'div',
+      { className: 'search__results__cards search__results__cards--extended' },
+      searchResults.map(function (result) {
+        return React__default['default'].createElement(PairedFlightOption, { key: 'flight-'.concat(result.guid), item: result });
+      })
+    )
+  );
+};
+
 var IndependentFlightSelection = function (_a) {
   var _b;
   var searchResults = _a.searchResults;
@@ -45049,189 +45850,79 @@ var IndependentFlightSelection = function (_a) {
         ? React__default['default'].createElement(IndependentFlightOption, {
             key: 'flight-'.concat(selectedOutwardKey),
             item: selectedOutward.outward,
-            guid: selectedOutward.guid,
-            onSelect: function () {
-              return setSelectedOutwardKey(null);
-            },
-            selectedGuid: selectedOutward.guid,
-            isOutward: true
-          })
-        : uniqueOutwardFlights.map(function (result) {
-            return React__default['default'].createElement(IndependentFlightOption, {
-              key: 'flight-'.concat(result.guid),
-              item: result.outward,
-              onSelect: function () {
-                return setSelectedOutwardKey(getFlightKey(result.outward.segments));
-              },
-              guid: result.guid,
-              isOutward: true
-            });
-          })
-    ),
-    React__default['default'].createElement(
-      'div',
-      { className: 'search__results__label search__results__label--secondary' },
-      React__default['default'].createElement(
-        'div',
-        { className: 'search__results__label__date' },
-        React__default['default'].createElement(Icon$1, { name: 'ui-flight', height: 16, fill: 'white' })
-      ),
-      React__default['default'].createElement(
-        'div',
-        { className: 'search__results__label__text' },
-        React__default['default'].createElement(
-          'h3',
-          null,
-          translations.SRP.SELECT,
-          ' ',
-          React__default['default'].createElement('strong', null, ' ', translations.SRP.RETURN)
-        )
-      )
-    ),
-    React__default['default'].createElement(
-      'div',
-      { className: 'search__results__cards search__results__cards--extended' },
-      selectedReturnKey && selectedReturn
-        ? React__default['default'].createElement(IndependentFlightOption, {
-            key: 'flight-'.concat(selectedReturnKey),
-            item: selectedReturn.return,
-            guid: selectedReturn.guid,
-            selectedGuid: selectedReturn.guid,
-            isOutward: false
-          })
-        : uniqueReturnFlights.map(function (result) {
-            return React__default['default'].createElement(IndependentFlightOption, {
-              key: 'flight-'.concat(result.guid),
-              item: result.return,
-              onSelect: function () {
-                return setSelectedReturnKey(getFlightKey(result.return.segments));
-              },
-              guid: result.guid,
-              isOutward: false
-            });
-          })
-    )
-  );
-};
-
-var FlightSelection = function (_a) {
-  var searchResults = _a.searchResults,
-    flightSelectionType = _a.flightSelectionType;
-  return flightSelectionType === 'paired'
-    ? React__default['default'].createElement(PairedFlightSelection, { searchResults: searchResults })
-    : React__default['default'].createElement(IndependentFlightSelection, { searchResults: searchResults });
-};
-
-var MultiRangeFilter = function (_a) {
-  var min = _a.min,
-    max = _a.max,
-    selectedMin = _a.selectedMin,
-    selectedMax = _a.selectedMax,
-    valueFormatter = _a.valueFormatter,
-    onChange = _a.onChange;
-  var _b = React.useState(false),
-    isDragging = _b[0],
-    setIsDragging = _b[1];
-  var _c = React.useState(0),
-    leftPercentage = _c[0],
-    setLeftPercentage = _c[1];
-  var _d = React.useState(0),
-    rightPercentage = _d[0],
-    setRightPercentage = _d[1];
-  var _e = React.useState(selectedMin !== null && selectedMin !== void 0 ? selectedMin : min),
-    minVal = _e[0],
-    setMinVal = _e[1];
-  var _f = React.useState(selectedMax !== null && selectedMax !== void 0 ? selectedMax : max),
-    maxVal = _f[0],
-    setMaxVal = _f[1];
-  var minGap = 5;
-  // Sync internal state with external selectedMin/selectedMax changes
-  React.useEffect(
-    function () {
-      setMinVal(selectedMin !== null && selectedMin !== void 0 ? selectedMin : min);
-      setMaxVal(selectedMax !== null && selectedMax !== void 0 ? selectedMax : max);
-    },
-    [min, max, selectedMin, selectedMax]
-  );
-  // Recalculate slider track whenever values change
-  React.useEffect(
-    function () {
-      var range = max - min || 1;
-      var minPercent = ((minVal - min) / range) * 100;
-      var maxPercent = ((maxVal - min) / range) * 100;
-      setLeftPercentage(minPercent);
-      setRightPercentage(100 - maxPercent);
-    },
-    [minVal, maxVal, min, max]
-  );
-  var slideMin = function (e) {
-    var value = parseInt(e.target.value, 10);
-    // Ensure the thumbs don’t cross and enforce minGap
-    if (value <= maxVal - minGap) {
-      setMinVal(value);
-    }
-  };
-  var slideMax = function (e) {
-    var value = parseInt(e.target.value, 10);
-    // Ensure the thumbs don’t cross and enforce minGap
-    if (value >= minVal + minGap) {
-      setMaxVal(value);
-    }
-  };
-  var startDrag = function () {
-    setIsDragging(true);
-  };
-  var stopDrag = function () {
-    setIsDragging(false);
-    // Notify parent with the final values
-    onChange(minVal, maxVal);
-  };
-  return React__default['default'].createElement(
-    'div',
-    { className: 'double-slider-box' },
+            guid: selectedOutward.guid,
+            onSelect: function () {
+              return setSelectedOutwardKey(null);
+            },
+            selectedGuid: selectedOutward.guid,
+            isOutward: true
+          })
+        : uniqueOutwardFlights.map(function (result) {
+            return React__default['default'].createElement(IndependentFlightOption, {
+              key: 'flight-'.concat(result.guid),
+              item: result.outward,
+              onSelect: function () {
+                return setSelectedOutwardKey(getFlightKey(result.outward.segments));
+              },
+              guid: result.guid,
+              isOutward: true
+            });
+          })
+    ),
     React__default['default'].createElement(
       'div',
-      { className: 'input-box' },
-      React__default['default'].createElement('div', { className: 'min-box' }, valueFormatter(minVal)),
-      React__default['default'].createElement('div', { className: 'max-box' }, valueFormatter(maxVal))
+      { className: 'search__results__label search__results__label--secondary' },
+      React__default['default'].createElement(
+        'div',
+        { className: 'search__results__label__date' },
+        React__default['default'].createElement(Icon$1, { name: 'ui-flight', height: 16, fill: 'white' })
+      ),
+      React__default['default'].createElement(
+        'div',
+        { className: 'search__results__label__text' },
+        React__default['default'].createElement(
+          'h3',
+          null,
+          translations.SRP.SELECT,
+          ' ',
+          React__default['default'].createElement('strong', null, ' ', translations.SRP.RETURN)
+        )
+      )
     ),
     React__default['default'].createElement(
       'div',
-      { className: 'range-slider' },
-      React__default['default'].createElement('div', {
-        className: 'slider-track',
-        style: { left: ''.concat(leftPercentage, '%'), right: ''.concat(rightPercentage, '%') }
-      }),
-      React__default['default'].createElement('input', {
-        type: 'range',
-        min: min,
-        max: max,
-        value: minVal,
-        onChange: slideMin,
-        onMouseDown: startDrag,
-        onMouseUp: stopDrag,
-        onTouchStart: startDrag,
-        onTouchEnd: stopDrag,
-        className: 'min-val'
-      }),
-      React__default['default'].createElement('input', {
-        type: 'range',
-        min: min,
-        max: max,
-        value: maxVal,
-        onChange: slideMax,
-        onMouseDown: startDrag,
-        onMouseUp: stopDrag,
-        onTouchStart: startDrag,
-        onTouchEnd: stopDrag,
-        className: 'max-val'
-      }),
-      isDragging && React__default['default'].createElement('div', { className: 'min-tooltip' }, valueFormatter(minVal)),
-      isDragging && React__default['default'].createElement('div', { className: 'max-tooltip' }, valueFormatter(maxVal))
+      { className: 'search__results__cards search__results__cards--extended' },
+      selectedReturnKey && selectedReturn
+        ? React__default['default'].createElement(IndependentFlightOption, {
+            key: 'flight-'.concat(selectedReturnKey),
+            item: selectedReturn.return,
+            guid: selectedReturn.guid,
+            selectedGuid: selectedReturn.guid,
+            isOutward: false
+          })
+        : uniqueReturnFlights.map(function (result) {
+            return React__default['default'].createElement(IndependentFlightOption, {
+              key: 'flight-'.concat(result.guid),
+              item: result.return,
+              onSelect: function () {
+                return setSelectedReturnKey(getFlightKey(result.return.segments));
+              },
+              guid: result.guid,
+              isOutward: false
+            });
+          })
     )
   );
 };
 
+var FlightSelection = function (_a) {
+  var searchResults = _a.searchResults,
+    flightSelectionType = _a.flightSelectionType;
+  return flightSelectionType === 'paired'
+    ? React__default['default'].createElement(PairedFlightSelection, { searchResults: searchResults })
+    : React__default['default'].createElement(IndependentFlightSelection, { searchResults: searchResults });
+};
+
 var FlightFilters = function (_a) {
   var _b;
   var isOpen = _a.isOpen,
@@ -46233,311 +46924,89 @@ var FlightResultsContainer = function (_a) {
                 placeholder: translations.SRP.SORTBY,
                 classModifier: 'travel-class-picker__items',
                 valueFormatter: function (value, direction) {
-                  return getSortingName(translations, findSortByType(sortByTypes, value, direction !== null && direction !== void 0 ? direction : 'asc'));
-                },
-                onPick: handleSortChange
-              })
-          ),
-        React__default['default'].createElement(
-          'div',
-          { className: 'search__result-row' },
-          React__default['default'].createElement(
-            'span',
-            { className: 'search__result-row-text' },
-            !flightsLoading &&
-              React__default['default'].createElement(
-                React__default['default'].Fragment,
-                null,
-                (results === null || results === void 0 ? void 0 : results.length) &&
-                  React__default['default'].createElement(React__default['default'].Fragment, null, results.length, ' ', translations.SRP.TOTAL_RESULTS_LABEL)
-              )
-          ),
-          !isMobile &&
-            React__default['default'].createElement(
-              React__default['default'].Fragment,
-              null,
-              React__default['default'].createElement(
-                'div',
-                { className: 'search__result-row-filter' },
-                React__default['default'].createElement(ItemPicker, {
-                  items: selectionTypes,
-                  selection:
-                    ((_c = selectionTypes.find(function (type) {
-                      return type.id === flightSelectionType;
-                    })) === null || _c === void 0
-                      ? void 0
-                      : _c.label) || undefined,
-                  label: 'Selection Type',
-                  placeholder: 'Selection Type',
-                  classModifier: 'travel-class-picker__items',
-                  valueFormatter: function (value) {
-                    return value;
-                  },
-                  onPick: function (value) {
-                    var _a;
-                    return setFlightSelectionType(
-                      ((_a = selectionTypes.find(function (type) {
-                        return type.label === value;
-                      })) === null || _a === void 0
-                        ? void 0
-                        : _a.id) || 'independent'
-                    );
-                  }
-                })
-              ),
-              sortByTypes &&
-                sortByTypes.length > 0 &&
-                React__default['default'].createElement(
-                  'div',
-                  { className: 'search__result-row-filter' },
-                  React__default['default'].createElement(ItemPicker, {
-                    items: sortByTypes,
-                    selection: (selectedSortByType === null || selectedSortByType === void 0 ? void 0 : selectedSortByType.label) || undefined,
-                    selectedSortByType: selectedSortByType || undefined,
-                    label: translations.SRP.SORTBY,
-                    placeholder: translations.SRP.SORTBY,
-                    classModifier: 'travel-class-picker__items',
-                    valueFormatter: function (value, direction) {
-                      return getSortingName(translations, findSortByType(sortByTypes, value, direction !== null && direction !== void 0 ? direction : 'asc'));
-                    },
-                    onPick: handleSortChange
-                  })
-                )
-            )
-        ),
-        React__default['default'].createElement(
-          'div',
-          { className: 'search__results__wrapper' },
-          flightsLoading && React__default['default'].createElement(Spinner, null),
-          (context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) == build.PortalQsmType.Flight &&
-            (context === null || context === void 0 ? void 0 : context.showFlightAccommodationResults) &&
-            results &&
-            results.length > 0 &&
-            React__default['default'].createElement(FlightSelection, { searchResults: results, flightSelectionType: flightSelectionType })
-        )
-      )
-    )
-  );
-};
-
-var Filters = function (_a) {
-  var _b;
-  var initialFilters = _a.initialFilters,
-    filters = _a.filters,
-    isOpen = _a.isOpen,
-    handleSetIsOpen = _a.handleSetIsOpen,
-    isLoading = _a.isLoading;
-  var context = React.useContext(SearchResultsConfigurationContext);
-  if (!context || !context.showFilters) {
-    return null;
-  }
-  var translations = getTranslations((_b = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _b !== void 0 ? _b : 'en-GB');
-  var _c = React.useState({}),
-    visibleFilters = _c[0],
-    setVisibleFilters = _c[1];
-  var dispatch = reactRedux.useDispatch();
-  var toggleFilterVisibility = function (filterId) {
-    setVisibleFilters(function (prev) {
-      var _a;
-      return __assign(__assign({}, prev), ((_a = {}), (_a[filterId] = !prev[filterId]), _a));
-    });
-  };
-  var handleCheckBoxFilter = function (filter, option) {
-    var updated = filters.map(function (f) {
-      var _a;
-      if (f.property !== filter.property) return f;
-      return __assign(__assign({}, f), {
-        options:
-          (_a = f.options) === null || _a === void 0
-            ? void 0
-            : _a.map(function (opt) {
-                return opt.value === option.value ? __assign(__assign({}, opt), { isChecked: !opt.isChecked }) : opt;
-              })
-      });
-    });
-    dispatch(setFilters(updated));
-  };
-  var handleSliderChange = function (filter, newMin, newMax) {
-    var updated = filters.map(function (f) {
-      if (f.property !== filter.property) return f;
-      return __assign(__assign({}, f), { selectedMin: newMin, selectedMax: newMax });
-    });
-    dispatch(setFilters(updated));
-  };
-  var handleFullReset = function () {
-    if (!isLoading) {
-      dispatch(resetFilters(initialFilters));
-    }
-  };
-  return React__default['default'].createElement(
-    'div',
-    { className: 'search__filters--modal '.concat(isOpen ? 'is-open' : '') },
-    React__default['default'].createElement('div', {
-      className: 'search__filters--background',
-      onClick: function () {
-        return handleSetIsOpen();
-      }
-    }),
-    React__default['default'].createElement(
-      'button',
-      {
-        className: 'search__filters--close',
-        onClick: function () {
-          return handleSetIsOpen();
-        }
-      },
-      React__default['default'].createElement(Icon$1, { name: 'ui-close', height: 24 })
-    ),
-    React__default['default'].createElement(
-      'div',
-      { className: 'search__filters' },
-      React__default['default'].createElement(
-        'div',
-        { className: 'search__filter-row search__filter__header' },
+                  return getSortingName(translations, findSortByType(sortByTypes, value, direction !== null && direction !== void 0 ? direction : 'asc'));
+                },
+                onPick: handleSortChange
+              })
+          ),
         React__default['default'].createElement(
           'div',
-          { className: 'search__filter-row-flex-title' },
-          React__default['default'].createElement('p', { className: 'search__filter-small-title' }, translations.SRP.FILTERS)
-        ),
-        !isLoading &&
+          { className: 'search__result-row' },
           React__default['default'].createElement(
-            'a',
-            {
-              className: 'search__filter-reset',
-              onClick: function () {
-                return handleFullReset();
-              }
-            },
-            translations.SRP.RESET
-          )
-      ),
-      isLoading
-        ? React__default['default'].createElement(Spinner, null)
-        : React__default['default'].createElement(
-            React__default['default'].Fragment,
-            null,
+            'span',
+            { className: 'search__result-row-text' },
+            !flightsLoading &&
+              React__default['default'].createElement(
+                React__default['default'].Fragment,
+                null,
+                (results === null || results === void 0 ? void 0 : results.length) &&
+                  React__default['default'].createElement(React__default['default'].Fragment, null, results.length, ' ', translations.SRP.TOTAL_RESULTS_LABEL)
+              )
+          ),
+          !isMobile &&
             React__default['default'].createElement(
-              'div',
-              { className: 'search__filters__group-container' },
-              filters.map(function (filter, index) {
-                var _a, _b;
-                var isVisible = (_a = visibleFilters[filter.property]) !== null && _a !== void 0 ? _a : true;
-                return React__default['default'].createElement(
+              React__default['default'].Fragment,
+              null,
+              React__default['default'].createElement(
+                'div',
+                { className: 'search__result-row-filter' },
+                React__default['default'].createElement(ItemPicker, {
+                  items: selectionTypes,
+                  selection:
+                    ((_c = selectionTypes.find(function (type) {
+                      return type.id === flightSelectionType;
+                    })) === null || _c === void 0
+                      ? void 0
+                      : _c.label) || undefined,
+                  label: 'Selection Type',
+                  placeholder: 'Selection Type',
+                  classModifier: 'travel-class-picker__items',
+                  valueFormatter: function (value) {
+                    return value;
+                  },
+                  onPick: function (value) {
+                    var _a;
+                    return setFlightSelectionType(
+                      ((_a = selectionTypes.find(function (type) {
+                        return type.label === value;
+                      })) === null || _a === void 0
+                        ? void 0
+                        : _a.id) || 'independent'
+                    );
+                  }
+                })
+              ),
+              sortByTypes &&
+                sortByTypes.length > 0 &&
+                React__default['default'].createElement(
                   'div',
-                  { key: ''.concat(filter.property, '-').concat(index), className: 'search__filter-group' },
-                  React__default['default'].createElement(
-                    'div',
-                    {
-                      className: 'search__filter-row search__filter-row--underline',
-                      onClick: function () {
-                        return toggleFilterVisibility(filter.property);
-                      },
-                      role: 'button',
-                      tabIndex: 0
+                  { className: 'search__result-row-filter' },
+                  React__default['default'].createElement(ItemPicker, {
+                    items: sortByTypes,
+                    selection: (selectedSortByType === null || selectedSortByType === void 0 ? void 0 : selectedSortByType.label) || undefined,
+                    selectedSortByType: selectedSortByType || undefined,
+                    label: translations.SRP.SORTBY,
+                    placeholder: translations.SRP.SORTBY,
+                    classModifier: 'travel-class-picker__items',
+                    valueFormatter: function (value, direction) {
+                      return getSortingName(translations, findSortByType(sortByTypes, value, direction !== null && direction !== void 0 ? direction : 'asc'));
                     },
-                    React__default['default'].createElement('h6', { className: 'search__filter-large-title' }, filter.label),
-                    React__default['default'].createElement(
-                      'svg',
-                      {
-                        id: 'search-chevron-up-icon',
-                        className: 'search__filter-chevron-icon '.concat(isVisible ? 'search__filter-chevron-icon--flipped' : '', ' '),
-                        viewBox: '0 0 10 6.063',
-                        width: 10,
-                        height: 6.063
-                      },
-                      React__default['default'].createElement('path', {
-                        id: 'Path_62',
-                        'data-name': 'Path 62',
-                        d: 'M245-617.937l-5-5L241.063-624,245-620.062,248.938-624,250-622.937Z',
-                        transform: 'translate(-240 624)',
-                        fill: '#707070'
-                      })
-                    )
-                  ),
-                  isVisible &&
-                    filter.type === 'checkbox' &&
-                    React__default['default'].createElement(
-                      'div',
-                      { className: 'search__filter-rows' },
-                      filter.options &&
-                        filter.options.map(function (option, optionIndex) {
-                          return React__default['default'].createElement(
-                            'div',
-                            { className: 'search__filter-row search__filter-row--checkbox', key: ''.concat(option.label, '-').concat(optionIndex) },
-                            React__default['default'].createElement(
-                              'div',
-                              { className: 'checkbox' },
-                              React__default['default'].createElement(
-                                'label',
-                                { className: 'checkbox__label' },
-                                React__default['default'].createElement('input', {
-                                  type: 'checkbox',
-                                  className: 'checkbox__input checkbox__input--parent',
-                                  checked: option.isChecked,
-                                  onChange: function (e) {
-                                    return handleCheckBoxFilter(filter, option);
-                                  }
-                                }),
-                                React__default['default'].createElement('span', { className: 'radiobutton__label-text' }, option.label)
-                              )
-                            )
-                          );
-                        })
-                    ),
-                  isVisible &&
-                    filter.type === 'toggle' &&
-                    React__default['default'].createElement(
-                      'div',
-                      { className: 'search__filter-rows' },
-                      (_b = filter.options) === null || _b === void 0
-                        ? void 0
-                        : _b.map(function (option, optionIndex) {
-                            return React__default['default'].createElement(
-                              'div',
-                              { className: 'search__filter-row', key: ''.concat(option.label, '-').concat(optionIndex) },
-                              React__default['default'].createElement('span', { className: 'search__filter-toggle-label' }, option.label),
-                              React__default['default'].createElement('div', { className: 'checkbox' }),
-                              React__default['default'].createElement(
-                                'label',
-                                { className: 'checkbox__label' },
-                                React__default['default'].createElement('input', {
-                                  type: 'checkbox',
-                                  className: 'checkbox__input',
-                                  checked: option.isChecked,
-                                  onChange: function () {
-                                    return handleCheckBoxFilter(filter, option);
-                                  }
-                                })
-                              )
-                            );
-                          })
-                    ),
-                  isVisible &&
-                    filter &&
-                    filter.type === 'slider' &&
-                    (function () {
-                      var _a, _b, _c, _d;
-                      var min = (_a = filter.min) !== null && _a !== void 0 ? _a : 0;
-                      var max = (_b = filter.max) !== null && _b !== void 0 ? _b : 100;
-                      var selectedMin = (_c = filter.selectedMin) !== null && _c !== void 0 ? _c : min;
-                      var selectedMax = (_d = filter.selectedMax) !== null && _d !== void 0 ? _d : max;
-                      return React__default['default'].createElement(MultiRangeFilter, {
-                        min: min,
-                        max: max,
-                        selectedMin: selectedMin,
-                        selectedMax: selectedMax,
-                        valueFormatter: function (value) {
-                          return ''.concat(value);
-                        },
-                        onChange: function (newMin, newMax) {
-                          handleSliderChange(filter, newMin, newMax);
-                        }
-                      });
-                    })()
-                );
-              })
+                    onPick: handleSortChange
+                  })
+                )
             )
-          )
+        ),
+        React__default['default'].createElement(
+          'div',
+          { className: 'search__results__wrapper' },
+          flightsLoading && React__default['default'].createElement(Spinner, null),
+          (context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) == build.PortalQsmType.Flight &&
+            (context === null || context === void 0 ? void 0 : context.showFlightAccommodationResults) &&
+            results &&
+            results.length > 0 &&
+            React__default['default'].createElement(FlightSelection, { searchResults: results, flightSelectionType: flightSelectionType })
+        )
+      )
     )
   );
 };
@@ -46859,80 +47328,245 @@ var enrichFiltersWithResults = function (results, filters, tags) {
     return updatedFilter;
   });
 };
-var enrichFiltersWithPackageAccoResults = function (results, filters, tags) {
-  if (!results || results.length === 0 || !filters) {
-    return filters !== null && filters !== void 0 ? filters : [];
-  }
-  return filters.map(function (filter) {
-    var updatedFilter = __assign({}, filter);
-    if (filter.property === 'price' && (filter.min == null || filter.max == null)) {
-      var prices = results
-        .map(function (r) {
-          var _a;
-          return (_a = r.price) !== null && _a !== void 0 ? _a : 0;
-        })
-        .filter(function (p) {
-          return p > 0;
-        });
-      if (prices.length > 0) {
-        updatedFilter.min = Math.floor(Math.min.apply(Math, prices));
-        updatedFilter.max = Math.ceil(Math.max.apply(Math, prices));
-      }
-    }
-    if (filter.property === 'accommodation') {
-      var map_4 = new Map();
-      results.forEach(function (r) {
-        var rooms = lodash.flatMap(r.rooms);
-        if (rooms) {
-          rooms.map(function (room) {
-            room.options.map(function (option) {
-              if (option.accommodationCode) {
-                map_4.set(option.accommodationCode, {
-                  name: option.accommodationName,
-                  code: option.accommodationCode
-                });
-              }
+var enrichFiltersWithPackageAccoResults = function (results, tags) {
+  var filters = [];
+  if (!results || results.length === 0) {
+    return filters;
+  }
+  var regimeFilter = {
+    property: 'regime',
+    label: 'Regime',
+    type: 'checkbox',
+    options: [],
+    isFrontendFilter: true
+  };
+  var map = new Map();
+  results.forEach(function (r) {
+    var rooms = lodash.flatMap(r.rooms);
+    if (rooms) {
+      rooms.map(function (room) {
+        room.options.map(function (option) {
+          if (option.regimeCode) {
+            map.set(option.regimeCode, {
+              name: option.regimeName,
+              code: option.regimeCode
             });
-          });
-        }
+          }
+        });
       });
-      updatedFilter.options = Array.from(map_4.values()).map(function (accommodation) {
-        var _a;
-        return {
-          label: (_a = accommodation.name) !== null && _a !== void 0 ? _a : accommodation.code,
-          value: accommodation.code,
-          isChecked: false
-        };
+    }
+  });
+  regimeFilter.options = Array.from(map.values()).map(function (regime) {
+    var _a;
+    return {
+      label: (_a = regime.name) !== null && _a !== void 0 ? _a : regime.code,
+      value: regime.code,
+      isChecked: false
+    };
+  });
+  filters.push(regimeFilter);
+  var priceFilter = {
+    property: 'price',
+    label: 'Prijs',
+    type: 'slider',
+    isFrontendFilter: true
+  };
+  var prices = results
+    .map(function (r) {
+      var _a;
+      return (_a = r.price) !== null && _a !== void 0 ? _a : 0;
+    })
+    .filter(function (p) {
+      return p > 0;
+    });
+  priceFilter.min = Math.floor(Math.min.apply(Math, prices));
+  priceFilter.max = Math.ceil(Math.max.apply(Math, prices));
+  filters.push(priceFilter);
+  return filters;
+};
+var enrichFiltersWithPackageFlightResults = function (results, tags, translations) {
+  var filters = [];
+  if (!results || results.length === 0) {
+    return filters;
+  }
+  // Airlines
+  var airlinesFilter = {
+    label: 'Airlines',
+    property: 'airline',
+    type: 'checkbox',
+    isFrontendFilter: true,
+    options: []
+  };
+  var airlinesFilterMap = new Map();
+  results.map(function (r) {
+    var airlineCode = r.airlineCode;
+    var airlineName = r.airlineName;
+    if (airlineCode && airlineName) {
+      airlinesFilterMap.set(airlineCode, {
+        name: airlineName,
+        code: airlineCode
       });
     }
-    if (filter.property === 'regime') {
-      var map_5 = new Map();
-      results.forEach(function (r) {
-        var rooms = lodash.flatMap(r.rooms);
-        if (rooms) {
-          rooms.map(function (room) {
-            room.options.map(function (option) {
-              if (option.regimeCode) {
-                map_5.set(option.regimeCode, {
-                  name: option.regimeName,
-                  code: option.regimeCode
-                });
-              }
-            });
-          });
-        }
+  });
+  airlinesFilter.options = Array.from(airlinesFilterMap.values()).map(function (airline) {
+    var _a;
+    return {
+      label: (_a = airline.name) !== null && _a !== void 0 ? _a : airline.code,
+      value: airline.code,
+      isChecked: false
+    };
+  });
+  filters.push(airlinesFilter);
+  // Number of stops
+  var stopsFilter = {
+    label: 'Number of Stops',
+    property: 'numberOfStops',
+    type: 'checkbox',
+    isFrontendFilter: true,
+    options: []
+  };
+  var stopsMap = new Map();
+  results.map(function (result) {
+    var numberOfStops = getNumberOfStops(result.outward);
+    if (!stopsMap.has(numberOfStops)) {
+      stopsMap.set(numberOfStops, { numberOfStops: numberOfStops });
+    }
+  });
+  stopsFilter.options = Array.from(stopsMap.values()).map(function (stop) {
+    return {
+      label: ''.concat(stop.numberOfStops == 0 ? 'direct' : stop.numberOfStops + ' Stop'.concat(stop.numberOfStops !== 1 ? 's' : '')),
+      value: stop.numberOfStops,
+      isChecked: false
+    };
+  });
+  filters.push(stopsFilter);
+  // Departure range
+  var departureRangeFilter = {
+    label: 'Departure Range',
+    property: 'departureRange',
+    type: 'checkbox',
+    isFrontendFilter: true,
+    options: []
+  };
+  var departureRangeMap = new Map();
+  results.map(function (result) {
+    var _a;
+    var departureRange = rangeFromDateTimeInMinutes((_a = getDepartureSegment(result.outward)) === null || _a === void 0 ? void 0 : _a.departureDateTime);
+    if (!departureRangeMap.has(departureRange)) {
+      departureRangeMap.set(departureRange, departureRange);
+    }
+  });
+  departureRangeFilter.options = lodash.orderBy(Array.from(departureRangeMap.values()), ['id'], ['asc']).map(function (range) {
+    return {
+      label: getDepartureRangeName(translations, range),
+      value: range,
+      isChecked: false
+    };
+  });
+  filters.push(departureRangeFilter);
+  // Departure Airport
+  var departureAirportFilter = {
+    label: 'Departure Airport',
+    property: 'departureAirport',
+    type: 'checkbox',
+    isFrontendFilter: true,
+    options: []
+  };
+  var departureAirportsMap = new Map();
+  results.map(function (result) {
+    var departureSegment = getDepartureSegment(result.outward);
+    var departureAirport = departureSegment === null || departureSegment === void 0 ? void 0 : departureSegment.departureAirportCode;
+    if (departureAirport && !departureAirportsMap.has(departureAirport)) {
+      departureAirportsMap.set(departureAirport, {
+        name: (departureSegment === null || departureSegment === void 0 ? void 0 : departureSegment.departureAirportName) + ' (' + departureAirport + ')',
+        code: departureAirport
       });
-      updatedFilter.options = Array.from(map_5.values()).map(function (regime) {
-        var _a;
-        return {
-          label: (_a = regime.name) !== null && _a !== void 0 ? _a : regime.code,
-          value: regime.code,
-          isChecked: false
-        };
+    }
+  });
+  departureAirportFilter.options = Array.from(departureAirportsMap.values()).map(function (airport) {
+    var _a;
+    return {
+      label: (_a = airport.name) !== null && _a !== void 0 ? _a : airport.code,
+      value: airport.code,
+      isChecked: false
+    };
+  });
+  filters.push(departureAirportFilter);
+  // Arrival Airport
+  var arrivalAirportFilter = {
+    label: 'Arrival Airport',
+    property: 'arrivalAirport',
+    type: 'checkbox',
+    isFrontendFilter: true,
+    options: []
+  };
+  var arrivalAirportsMap = new Map();
+  results.map(function (result) {
+    var arrivalSegment = getArrivalSegment(result.outward);
+    var arrivalAirport = arrivalSegment === null || arrivalSegment === void 0 ? void 0 : arrivalSegment.arrivalAirportCode;
+    if (arrivalAirport && !arrivalAirportsMap.has(arrivalAirport)) {
+      arrivalAirportsMap.set(arrivalAirport, {
+        name: (arrivalSegment === null || arrivalSegment === void 0 ? void 0 : arrivalSegment.arrivalAirportName) + ' (' + arrivalAirport + ')',
+        code: arrivalAirport
       });
     }
-    return updatedFilter;
   });
+  arrivalAirportFilter.options = Array.from(arrivalAirportsMap.values()).map(function (airport) {
+    var _a;
+    return {
+      label: (_a = airport.name) !== null && _a !== void 0 ? _a : airport.code,
+      value: airport.code,
+      isChecked: false
+    };
+  });
+  filters.push(arrivalAirportFilter);
+  // Price
+  var priceFilter = {
+    label: 'Price',
+    property: 'price',
+    type: 'slider',
+    isFrontendFilter: true
+  };
+  var prices = results
+    .map(function (r) {
+      var _a;
+      return (_a = r.price) !== null && _a !== void 0 ? _a : 0;
+    })
+    .filter(function (p) {
+      return p > 0;
+    });
+  if (prices.length > 0) {
+    priceFilter.min = Math.floor(Math.min.apply(Math, prices));
+    priceFilter.max = Math.ceil(Math.max.apply(Math, prices));
+  }
+  filters.push(priceFilter);
+  // Travel duration
+  var travelDurationFilter = {
+    label: 'Travel Duration',
+    property: 'travelDuration',
+    type: 'slider',
+    isFrontendFilter: true
+  };
+  var minTravelTimeDuration = Math.min.apply(
+    Math,
+    results.map(function (result) {
+      return result.outward.durationInTicks;
+    })
+  );
+  var maxTravelTimeDuration = Math.max.apply(
+    Math,
+    results.map(function (result) {
+      return result.outward.durationInTicks;
+    })
+  );
+  var minTravelTimeValue = durationInTicksInMinutes(minTravelTimeDuration);
+  var maxTravelTimeValue = durationInTicksInMinutes(maxTravelTimeDuration);
+  if (minTravelTimeValue != null && maxTravelTimeValue != null) {
+    travelDurationFilter.min = minTravelTimeValue;
+    travelDurationFilter.max = maxTravelTimeValue;
+  }
+  filters.push(travelDurationFilter);
+  return filters;
 };
 var applyFilters = function (results, filters, sortBy) {
   var filtered = results.filter(function (r) {
@@ -47074,6 +47708,147 @@ var applyFiltersToPackageAccoResults = function (results, filters, sortBy) {
     return 0;
   });
 };
+var applyFiltersToPackageFlightResults = function (results, filters, sortBy) {
+  var filtered = results.filter(function (result) {
+    return filters.every(function (filter) {
+      var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+      if (!filter.isFrontendFilter) return true;
+      // Airline
+      if (filter.property === 'airline') {
+        var selected =
+          (_a = filter.options) === null || _a === void 0
+            ? void 0
+            : _a
+                .filter(function (o) {
+                  return o.isChecked;
+                })
+                .map(function (o) {
+                  return o.value;
+                });
+        if (!selected || selected.length === 0) return true;
+        return selected.includes(result.airlineCode);
+      }
+      // Stops
+      if (filter.property === 'numberOfStops') {
+        var selected =
+          (_b = filter.options) === null || _b === void 0
+            ? void 0
+            : _b
+                .filter(function (o) {
+                  return o.isChecked;
+                })
+                .map(function (o) {
+                  return o.value;
+                });
+        if (!selected || selected.length === 0) return true;
+        return selected.includes(getNumberOfStops(result.outward)) && selected.includes(getNumberOfStops(result.return));
+      }
+      // Departure range
+      if (filter.property === 'departureRange') {
+        var selected =
+          (_c = filter.options) === null || _c === void 0
+            ? void 0
+            : _c
+                .filter(function (o) {
+                  return o.isChecked;
+                })
+                .map(function (o) {
+                  return o.value;
+                });
+        if (!selected || selected.length === 0) return true;
+        return selected.includes(
+          rangeFromDateTimeInMinutes((_d = getDepartureSegment(result.outward)) === null || _d === void 0 ? void 0 : _d.departureDateTime)
+        );
+      }
+      // Departure airport
+      if (filter.property === 'departureAirport') {
+        var selected =
+          (_e = filter.options) === null || _e === void 0
+            ? void 0
+            : _e
+                .filter(function (o) {
+                  return o.isChecked;
+                })
+                .map(function (o) {
+                  return o.value;
+                });
+        if (!selected || selected.length === 0) return true;
+        var departureAirportCode = (_f = getDepartureSegment(result.outward)) === null || _f === void 0 ? void 0 : _f.departureAirportCode;
+        if (!departureAirportCode) return false;
+        return selected.includes(departureAirportCode);
+      }
+      // Arrival airport
+      if (filter.property === 'arrivalAirport') {
+        var selected =
+          (_g = filter.options) === null || _g === void 0
+            ? void 0
+            : _g
+                .filter(function (o) {
+                  return o.isChecked;
+                })
+                .map(function (o) {
+                  return o.value;
+                });
+        if (!selected || selected.length === 0) return true;
+        var arrivalAirportCode = (_h = getArrivalSegment(result.outward)) === null || _h === void 0 ? void 0 : _h.arrivalAirportCode;
+        if (!arrivalAirportCode) return false;
+        return selected.includes(arrivalAirportCode);
+      }
+      // PRICE
+      if (filter.property === 'price') {
+        if (filter.selectedMin != null && result.price < filter.selectedMin) return false;
+        if (filter.selectedMax != null && result.price > filter.selectedMax) return false;
+        return true;
+      }
+      // Travel times
+      if (filter.property === 'travelDuration') {
+        if (
+          filter.selectedMin != null &&
+          durationInTicksInMinutes((_j = result.outward) === null || _j === void 0 ? void 0 : _j.durationInTicks) < filter.selectedMin
+        )
+          return false;
+        if (
+          filter.selectedMax != null &&
+          durationInTicksInMinutes((_k = result.outward) === null || _k === void 0 ? void 0 : _k.durationInTicks) > filter.selectedMax
+        )
+          return false;
+        return true;
+      }
+      return true;
+    });
+  });
+  // SORTING
+  if (!sortBy || sortBy.label === 'default') {
+    return filtered;
+  }
+  if (sortBy.label === 'departureTime') {
+    return lodash.orderBy(
+      results,
+      [
+        function (result) {
+          var _a;
+          return (_a = getDepartureSegment(result.outward)) === null || _a === void 0 ? void 0 : _a.departureDateTime;
+        }
+      ],
+      [sortBy.direction] // or "desc"
+    );
+  } else if (sortBy.label === 'durationInTicks') {
+    return lodash.orderBy(
+      results,
+      [
+        function (result) {
+          var _a, _b;
+          return durationInTicksInMinutes(
+            (_b = (_a = result.outward) === null || _a === void 0 ? void 0 : _a.durationInTicks) !== null && _b !== void 0 ? _b : 0
+          );
+        }
+      ],
+      [sortBy.direction] // or "desc"
+    );
+  } else {
+    return lodash.orderBy(results, [sortBy.label], [sortBy.direction]);
+  }
+};
 
 var getSelectedOptionsPerRoom = function (details) {
   var _a;
@@ -47282,28 +48057,30 @@ var SearchResultsContainer = function () {
     results = _c.results,
     filteredResults = _c.filteredResults,
     packagingAccoResults = _c.packagingAccoResults,
-    filteredPackagingAccoResults = _c.filteredPackagingAccoResults;
-  _c.bookingPackageDetails;
-  var isLoading = _c.isLoading,
+    filteredPackagingAccoResults = _c.filteredPackagingAccoResults,
+    isLoading = _c.isLoading,
     flightsLoading = _c.flightsLoading,
+    initialFilters = _c.initialFilters,
     filters = _c.filters,
+    flightFilters = _c.flightFilters,
     selectedSortType = _c.selectedSortType,
+    selectedFlightSortType = _c.selectedFlightSortType,
     selectedSearchResult = _c.selectedSearchResult,
     selectedPackagingAccoResultCode = _c.selectedPackagingAccoResultCode,
     flyInIsOpen = _c.flyInIsOpen,
     packagingAccoSearchDetails = _c.packagingAccoSearchDetails,
     editablePackagingEntry = _c.editablePackagingEntry,
     transactionId = _c.transactionId,
-    accommodationFlyInStep = _c.accommodationFlyInStep,
+    flyInType = _c.flyInType,
     itinerary = _c.itinerary,
     packagingFlightResults = _c.packagingFlightResults;
   var isMobile = useMediaQuery('(max-width: 1200px)');
   var _d = React.useState(false),
     initialFiltersSet = _d[0],
     setInitialFiltersSet = _d[1];
-  var _e = React.useState([]),
-    initialFilters = _e[0],
-    setInitialFilters = _e[1];
+  var _e = React.useState(false),
+    initialFlightFiltersSet = _e[0],
+    setInitialFlightFiltersSet = _e[1];
   var _f = React.useState(false),
     filtersOpen = _f[0],
     setFiltersOpen = _f[1];
@@ -47323,9 +48100,6 @@ var SearchResultsContainer = function () {
     selectedAccommodationSeed = _l[0],
     setSelectedAccommodationSeed = _l[1];
   var skipInitialPackagingAccoDetailsRef = React.useRef(false);
-  var _m = React.useState(false),
-    showAllOutwardFlights = _m[0],
-    setShowAllOutwardFlights = _m[1];
   var panelRef = React.useRef(null);
   var sortByTypes = [
     { direction: 'asc', label: 'default' },
@@ -47643,7 +48417,7 @@ var SearchResultsContainer = function () {
             if (!seed) return [2 /*return*/];
             setDetailsIsLoading(true);
             setSelectedAccommodationSeed(seed);
-            dispatch(setAccommodationFlyInStep('results'));
+            dispatch(setFlyInType('acco-results'));
             handleFlyInToggle(true);
             return [4 /*yield*/, getOrCreateTransactionId()];
           case 1:
@@ -47801,7 +48575,7 @@ var SearchResultsContainer = function () {
             enrichedFilters = enrichFiltersWithResults(packageSearchResults, context.filters, (_a = context.tags) !== null && _a !== void 0 ? _a : []);
             if (!initialFiltersSet) {
               dispatch(resetFilters(enrichedFilters));
-              setInitialFilters(enrichedFilters);
+              dispatch(setInitialFilters(enrichedFilters));
               setInitialFiltersSet(true);
             }
             dispatch(setResults(packageSearchResults));
@@ -47876,11 +48650,7 @@ var SearchResultsContainer = function () {
             return [4 /*yield*/, build.searchPackagingAccommodations(config, searchRequest)];
           case 1:
             packageAccoSearchResults = _d.sent();
-            enrichedFilters = enrichFiltersWithPackageAccoResults(
-              packageAccoSearchResults,
-              context.filters,
-              (_a = context.tags) !== null && _a !== void 0 ? _a : []
-            );
+            enrichedFilters = enrichFiltersWithPackageAccoResults(packageAccoSearchResults, (_a = context.tags) !== null && _a !== void 0 ? _a : []);
             if (!initialFiltersSet) {
               dispatch(resetFilters(enrichedFilters));
               setInitialFilters(enrichedFilters);
@@ -47926,11 +48696,12 @@ var SearchResultsContainer = function () {
   };
   var runFlightSearch = function (currentTransactionId, seed) {
     return __awaiter(void 0, void 0, void 0, function () {
-      var config, searchRequest, packageFlightSearchResults, firstResult, err_4;
-      return __generator(this, function (_a) {
-        switch (_a.label) {
+      var config, searchRequest, packageFlightSearchResults, enrichedFilters, initialFilteredResults, firstResult, err_4;
+      var _a;
+      return __generator(this, function (_b) {
+        switch (_b.label) {
           case 0:
-            _a.trys.push([0, 2, , 3]);
+            _b.trys.push([0, 2, , 3]);
             if (!context) return [2 /*return*/];
             dispatch(setFlightsLoading(true));
             config = {
@@ -47941,17 +48712,31 @@ var SearchResultsContainer = function () {
             searchRequest.agentId = context.agentId;
             return [4 /*yield*/, build.searchPackagingFlights(config, searchRequest)];
           case 1:
-            packageFlightSearchResults = _a.sent();
+            packageFlightSearchResults = _b.sent();
+            enrichedFilters = enrichFiltersWithPackageFlightResults(
+              packageFlightSearchResults,
+              (_a = context.tags) !== null && _a !== void 0 ? _a : [],
+              translations
+            );
+            if (!initialFlightFiltersSet) {
+              dispatch(resetFlightFilters(enrichedFilters));
+              dispatch(setInitialFlightFilters(enrichedFilters));
+              setInitialFlightFiltersSet(true);
+            }
             dispatch(setPackagingFlightResults(packageFlightSearchResults));
-            firstResult = lodash.first(packageFlightSearchResults);
-            if (firstResult) {
-              setSelectedOutwardKey(getFlightKey(firstResult.outward.segments));
-              setSelectedReturnKey(getFlightKey(firstResult.return.segments));
+            initialFilteredResults = applyFiltersToPackageFlightResults(packageFlightSearchResults, filters, null);
+            dispatch(setFilteredPackagingFlightResults(initialFilteredResults));
+            if (initialFilteredResults.length > 0) {
+              firstResult = lodash.first(packageFlightSearchResults);
+              if (firstResult) {
+                dispatch(setSelectedOutwardKey(getFlightKey(firstResult.outward.segments)));
+                dispatch(setSelectedReturnKey(getFlightKey(firstResult.return.segments)));
+              }
             }
             dispatch(setFlightsLoading(false));
             return [3 /*break*/, 3];
           case 2:
-            err_4 = _a.sent();
+            err_4 = _b.sent();
             console.error('FlightSearch failed', err_4);
             dispatch(setFlightsLoading(false));
             return [3 /*break*/, 3];
@@ -48173,6 +48958,7 @@ var SearchResultsContainer = function () {
                   (context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.GroupTour
                 ) {
                   handleFlyInToggle(true);
+                  dispatch(setFlyInType('acco-details'));
                 }
                 _f.label = 1;
               case 1:
@@ -48264,13 +49050,15 @@ var SearchResultsContainer = function () {
       if (selectedPackagingAccoResultCode) {
         fetchPackagingAccoSearchDetails();
       }
-      dispatch(setAccommodationFlyInStep('details'));
     },
     [selectedSearchResult, selectedPackagingAccoResultCode]
   );
   React.useEffect(
     function () {
-      if ((context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.Accommodation) {
+      if (
+        (context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.Accommodation ||
+        (context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.AccommodationAndFlight
+      ) {
         var filteredPackageAccoResults = applyFiltersToPackageAccoResults(packagingAccoResults, filters, selectedSortType);
         dispatch(setFilteredPackagingAccoResults(filteredPackageAccoResults));
       } else {
@@ -48280,6 +49068,15 @@ var SearchResultsContainer = function () {
     },
     [filters, results, packagingAccoResults, selectedSortType]
   );
+  React.useEffect(
+    function () {
+      if ((context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.AccommodationAndFlight) {
+        var filteredPackageFlightResults = applyFiltersToPackageFlightResults(packagingFlightResults, flightFilters, selectedFlightSortType);
+        dispatch(setFilteredPackagingFlightResults(filteredPackageFlightResults));
+      }
+    },
+    [flightFilters, packagingFlightResults, selectedFlightSortType]
+  );
   React.useEffect(
     function () {
       setInitialFiltersSet(false);
@@ -48354,7 +49151,6 @@ var SearchResultsContainer = function () {
                 return [4 /*yield*/, build.getItinerary(config, request)];
               case 2:
                 itinerary_1 = _c.sent();
-                console.log('Fetched itinerary', itinerary_1);
                 dispatch(setItinerary(itinerary_1));
                 setItineraryIsLoading(false);
                 return [3 /*break*/, 4];
@@ -48375,37 +49171,22 @@ var SearchResultsContainer = function () {
     [editablePackagingEntry]
   );
   // Flight selection
-  var _o = React.useState(null),
-    selectedOutwardKey = _o[0],
-    setSelectedOutwardKey = _o[1];
-  var _p = React.useState(null),
-    selectedReturnKey = _p[0],
-    setSelectedReturnKey = _p[1];
-  var uniqueOutwardFlights = React__default['default'].useMemo(
-    function () {
-      var map = new Map();
-      packagingFlightResults.forEach(function (flight) {
-        var key = getFlightKey(flight.outward.segments);
-        if (!map.has(key)) {
-          map.set(key, flight);
-        }
-      });
-      return Array.from(map.values());
-    },
-    [packagingFlightResults]
-  );
-  var _q = React.useState([]),
-    uniqueReturnFlights = _q[0],
-    setUniqueReturnFlights = _q[1];
+  // const [selectedOutwardKey, setSelectedOutwardKey] = useState<string | null>(null);
+  // const [selectedReturnKey, setSelectedReturnKey] = useState<string | null>(null);
+  var selectedOutwardKey = reactRedux.useSelector(selectSelectedOutwardKey);
+  var selectedReturnKey = reactRedux.useSelector(selectSelectedReturnKey);
+  var uniqueOutwardFlights = reactRedux.useSelector(selectUniqueOutwardFlights);
+  var uniqueReturnFlights = reactRedux.useSelector(selectUniqueReturnFlights);
+  var selectedOutward = reactRedux.useSelector(selectSelectedOutward);
+  var selectedReturn = reactRedux.useSelector(selectSelectedReturn);
+  var selectedCombinationFlight = reactRedux.useSelector(selectSelectedCombinationFlight);
   React.useEffect(
     function () {
       var _a;
       if (!selectedOutwardKey) {
-        setUniqueReturnFlights([]);
-        setSelectedReturnKey(null);
+        dispatch(setSelectedReturnKey(null));
         return;
       }
-      // Filter combinations that match selected outward fare
       var matchingCombinations = packagingFlightResults.filter(function (flight) {
         return getFlightKey(flight.outward.segments) === selectedOutwardKey;
       });
@@ -48417,44 +49198,26 @@ var SearchResultsContainer = function () {
         }
       });
       var returns = Array.from(returnMap.values());
-      setUniqueReturnFlights(returns);
-      var firstReturnKey = returns.length > 0 ? getFlightKey((_a = lodash.first(returns)) === null || _a === void 0 ? void 0 : _a.return.segments) : null;
-      if (firstReturnKey) {
-        setSelectedReturnKey(firstReturnKey);
+      var segments = (_a = lodash.first(returns)) === null || _a === void 0 ? void 0 : _a.return.segments;
+      var firstReturnKey = returns.length > 0 && segments ? getFlightKey(segments) : null;
+      if (
+        !returns.some(function (x) {
+          return getFlightKey(x.return.segments) === selectedReturnKey;
+        })
+      ) {
+        dispatch(setSelectedReturnKey(firstReturnKey));
       }
     },
-    [selectedOutwardKey, packagingFlightResults]
-  );
-  var selectedOutward = React__default['default'].useMemo(
-    function () {
-      if (!selectedOutwardKey) return null;
-      return (
-        packagingFlightResults.find(function (flight) {
-          return getFlightKey(flight.outward.segments) === selectedOutwardKey;
-        }) || null
-      );
-    },
-    [packagingFlightResults, selectedOutwardKey]
-  );
-  var selectedReturn = React__default['default'].useMemo(
-    function () {
-      if (!selectedReturnKey) return null;
-      return (
-        packagingFlightResults.find(function (flight) {
-          return getFlightKey(flight.return.segments) === selectedReturnKey;
-        }) || null
-      );
-    },
-    [packagingFlightResults, selectedReturnKey]
+    [selectedOutwardKey, packagingFlightResults, selectedReturnKey, dispatch]
   );
-  var selectedCombinationFlight = React__default['default'].useMemo(
+  var visibleOutwardFlights = React__default['default'].useMemo(
     function () {
-      if (!selectedOutwardKey || !selectedReturnKey) return undefined;
-      return packagingFlightResults.find(function (flight) {
-        return getFlightKey(flight.outward.segments) === selectedOutwardKey && getFlightKey(flight.return.segments) === selectedReturnKey;
+      var withoutSelected = uniqueOutwardFlights.filter(function (x) {
+        return getFlightKey(x.outward.segments) !== selectedOutwardKey;
       });
+      return withoutSelected.slice(0, 3);
     },
-    [packagingFlightResults, selectedOutwardKey, selectedReturnKey]
+    [uniqueOutwardFlights, selectedOutwardKey]
   );
   // TODO: get details for selected combination flight and show in fly-in
   // useEffect(() => {
@@ -48463,6 +49226,7 @@ var SearchResultsContainer = function () {
   //   // onFlightSearch(selectedCombinationFlight); // Trigger search to update accommodation options based on selected flight
   //   dispatch(setFlyInIsOpen(true));
   // }, [selectedCombinationFlight, dispatch]);
+  // Build packagingEntry
   React.useEffect(
     function () {
       var _a, _b, _c, _d;
@@ -48761,12 +49525,10 @@ var SearchResultsContainer = function () {
       lines: []
     };
   };
-  var visibleOutwardFlights = React__default['default'].useMemo(
-    function () {
-      return showAllOutwardFlights ? uniqueOutwardFlights : uniqueOutwardFlights.slice(0, 3);
-    },
-    [showAllOutwardFlights, uniqueOutwardFlights]
-  );
+  var handleShowMoreFlights = function (flyInType) {
+    dispatch(setFlyInType(flyInType));
+    dispatch(setFlyInIsOpen(true));
+  };
   return React__default['default'].createElement(
     'div',
     { id: 'tide-booking', className: 'search__bg' },
@@ -48783,7 +49545,6 @@ var SearchResultsContainer = function () {
               { tideConnection: context.tideConnection },
               React__default['default'].createElement(FlightResultsContainer, { isMobile: isMobile }),
               React__default['default'].createElement(FlyIn, {
-                title: 'Select your fare',
                 srpType: context.searchConfiguration.qsmType,
                 isOpen: flyInIsOpen,
                 setIsOpen: handleFlyInToggle,
@@ -48810,7 +49571,13 @@ var SearchResultsContainer = function () {
                     return setFiltersOpen(!filtersOpen);
                   },
                   // handleApplyFilters={() => setSearchTrigger((prev) => prev + 1)}
-                  isLoading: isLoading
+                  isLoading: isLoading,
+                  setFilters: function (filters) {
+                    return dispatch(setFilters(filters));
+                  },
+                  resetFilters: function (filters) {
+                    return dispatch(resetFilters(filters));
+                  }
                 }),
               context.searchConfiguration.qsmType === build.PortalQsmType.AccommodationAndFlight &&
                 React__default['default'].createElement(Itinerary, {
@@ -48877,53 +49644,53 @@ var SearchResultsContainer = function () {
                         }
                       })
                   ),
-                React__default['default'].createElement(
-                  'div',
-                  { className: 'search__result-row' },
+                context.searchConfiguration.qsmType !== build.PortalQsmType.AccommodationAndFlight &&
                   React__default['default'].createElement(
-                    'span',
-                    { className: 'search__result-row-text' },
-                    !isLoading &&
-                      context.searchConfiguration.qsmType !== build.PortalQsmType.AccommodationAndFlight &&
+                    'div',
+                    { className: 'search__result-row' },
+                    React__default['default'].createElement(
+                      'span',
+                      { className: 'search__result-row-text' },
+                      !isLoading &&
+                        React__default['default'].createElement(
+                          React__default['default'].Fragment,
+                          null,
+                          context.searchConfiguration.qsmType === build.PortalQsmType.Accommodation &&
+                            (filteredPackagingAccoResults === null || filteredPackagingAccoResults === void 0 ? void 0 : filteredPackagingAccoResults.length) &&
+                            (filteredPackagingAccoResults === null || filteredPackagingAccoResults === void 0 ? void 0 : filteredPackagingAccoResults.length),
+                          context.searchConfiguration.qsmType !== build.PortalQsmType.Accommodation &&
+                            (filteredResults === null || filteredResults === void 0 ? void 0 : filteredResults.length) &&
+                            filteredResults.length,
+                          '\u00A0',
+                          translations.SRP.TOTAL_RESULTS_LABEL
+                        )
+                    ),
+                    !context.packagingEntry &&
+                      !isMobile &&
+                      sortByTypes &&
+                      sortByTypes.length > 0 &&
                       React__default['default'].createElement(
-                        React__default['default'].Fragment,
-                        null,
-                        context.searchConfiguration.qsmType === build.PortalQsmType.Accommodation &&
-                          (filteredPackagingAccoResults === null || filteredPackagingAccoResults === void 0 ? void 0 : filteredPackagingAccoResults.length) &&
-                          (filteredPackagingAccoResults === null || filteredPackagingAccoResults === void 0 ? void 0 : filteredPackagingAccoResults.length),
-                        context.searchConfiguration.qsmType !== build.PortalQsmType.Accommodation &&
-                          (filteredResults === null || filteredResults === void 0 ? void 0 : filteredResults.length) &&
-                          filteredResults.length,
-                        '\u00A0',
-                        translations.SRP.TOTAL_RESULTS_LABEL
+                        'div',
+                        { className: 'search__result-row-filter' },
+                        React__default['default'].createElement(ItemPicker, {
+                          items: sortByTypes,
+                          selection: (selectedSortType === null || selectedSortType === void 0 ? void 0 : selectedSortType.label) || undefined,
+                          selectedSortByType: selectedSortType,
+                          label: translations.SRP.SORTBY,
+                          placeholder: translations.SRP.SORTBY,
+                          classModifier: 'travel-class-picker__items',
+                          valueFormatter: function (value, direction) {
+                            return getSortingName(
+                              translations,
+                              findSortByType(sortByTypes, value, direction !== null && direction !== void 0 ? direction : 'asc')
+                            );
+                          },
+                          onPick: function (newSortKey, direction) {
+                            return handleSortChange(newSortKey, direction);
+                          }
+                        })
                       )
                   ),
-                  !context.packagingEntry &&
-                    !isMobile &&
-                    sortByTypes &&
-                    sortByTypes.length > 0 &&
-                    React__default['default'].createElement(
-                      'div',
-                      { className: 'search__result-row-filter' },
-                      React__default['default'].createElement(ItemPicker, {
-                        items: sortByTypes,
-                        selection: (selectedSortType === null || selectedSortType === void 0 ? void 0 : selectedSortType.label) || undefined,
-                        selectedSortByType: selectedSortType,
-                        label: translations.SRP.SORTBY,
-                        placeholder: translations.SRP.SORTBY,
-                        classModifier: 'travel-class-picker__items',
-                        valueFormatter: function (value, direction) {
-                          return getSortingName(
-                            translations,
-                            findSortByType(sortByTypes, value, direction !== null && direction !== void 0 ? direction : 'asc')
-                          );
-                        },
-                        onPick: function (newSortKey, direction) {
-                          return handleSortChange(newSortKey, direction);
-                        }
-                      })
-                    )
-                ),
                 React__default['default'].createElement(
                   'div',
                   { className: 'search__results__wrapper' },
@@ -48977,7 +49744,7 @@ var SearchResultsContainer = function () {
                                   item: selectedOutward.outward,
                                   guid: selectedOutward.outwardGuid,
                                   onSelect: function () {
-                                    return setSelectedOutwardKey(null);
+                                    return dispatch(setSelectedOutwardKey(null));
                                   },
                                   selectedGuid: selectedOutward.outwardGuid,
                                   isOutward: true,
@@ -48989,7 +49756,7 @@ var SearchResultsContainer = function () {
                                   key: 'flight-'.concat(result.outwardGuid),
                                   item: result.outward,
                                   onSelect: function () {
-                                    return setSelectedOutwardKey(getFlightKey(result.outward.segments));
+                                    return dispatch(setSelectedOutwardKey(getFlightKey(result.outward.segments)));
                                   },
                                   guid: result.outwardGuid,
                                   isOutward: true,
@@ -49008,10 +49775,10 @@ var SearchResultsContainer = function () {
                                   {
                                     className: 'cta cta--secondary',
                                     onClick: function () {
-                                      return setShowAllOutwardFlights(!showAllOutwardFlights);
+                                      return handleShowMoreFlights('flight-outward-results');
                                     }
                                   },
-                                  showAllOutwardFlights ? translations.SRP.SHOW_LESS : translations.SRP.SHOW_MORE
+                                  translations.SRP.SHOW_MORE
                                 )
                               )
                           )
@@ -49066,7 +49833,7 @@ var SearchResultsContainer = function () {
                             key: 'flight-'.concat(result.outwardGuid),
                             item: result.return,
                             onSelect: function () {
-                              return setSelectedReturnKey(getFlightKey(result.return.segments));
+                              return dispatch(setSelectedReturnKey(getFlightKey(result.return.segments)));
                             },
                             guid: result.outwardGuid,
                             isOutward: false,
@@ -49083,7 +49850,6 @@ var SearchResultsContainer = function () {
                 )
               ),
               React__default['default'].createElement(FlyIn, {
-                title: ''.concat(translations.SRP.SELECT, ' ').concat(translations.SRP.ACCOMMODATION),
                 srpType: context.searchConfiguration.qsmType,
                 isOpen: flyInIsOpen,
                 setIsOpen: handleFlyInToggle,
@@ -49094,8 +49860,9 @@ var SearchResultsContainer = function () {
                   return (panelRef.current = el);
                 },
                 detailsLoading: detailsIsLoading,
-                accommodationStep: accommodationFlyInStep,
-                isPackageEditFlow: !!context.packagingEntry
+                flyInType: flyInType,
+                isPackageEditFlow: !!context.packagingEntry,
+                sortByTypes: sortByTypes
               })
             )
         )