@qite/tide-booking-component 1.4.97 → 1.4.99

package/build/build-cjs/index.js

@@ -13415,11 +13415,17 @@ PERFORMANCE OF THIS SOFTWARE.
   };
 
   var ENDPOINT = '/api/web/packaging';
+  var ENDPOINT_START_TRANSACTION = ENDPOINT + '/start';
   var ENDPOINT_ACCOMMODATIONS = ENDPOINT + '/accommodations';
   var ENDPOINT_ENTRY = function (magicLinkCode) {
     return ENDPOINT + '/entry/' + magicLinkCode;
   };
   // MANUAL PACKAGING SEARCH
+  var startTransaction = function (config, signal) {
+    var apiKey = config.apiKey;
+    var url = '' + config.host + ENDPOINT_START_TRANSACTION;
+    return get(url, apiKey, config.token, signal, true);
+  };
   var searchPackagingAccommodations = function (config, request, signal) {
     var url = '' + config.host + ENDPOINT_ACCOMMODATIONS;
     var apiKey = config.apiKey;
@@ -13507,6 +13513,7 @@ PERFORMANCE OF THIS SOFTWARE.
   exports.searchWithErrorMapping = searchWithErrorMapping;
   exports.setCustomEntryStatus = setCustomEntryStatus;
   exports.setEntryStatus = setEntryStatus;
+  exports.startTransaction = startTransaction;
   exports.tourCodes = tourCodes;
   exports.transportDates = transportDates;
   exports.update = update;
@@ -32836,7 +32843,6 @@ var SearchInputGroup = function (_a) {
   );
   React.useEffect(
     function () {
-      console.log('options updated, resetting loading state');
       setIsLoading(false);
     },
     [options]
@@ -33798,13 +33804,15 @@ var initialState$1 = {
   selectedFlight: null,
   selectedFlightDetails: null,
   bookingPackageDetails: null,
-  entry: null,
   isLoading: false,
   filters: [],
   selectedSortType: null,
   activeTab: 'compact',
   currentPage: 1,
-  flyInIsOpen: false
+  flyInIsOpen: false,
+  editablePackagingEntry: null,
+  transactionId: null,
+  accommodationFlyInStep: 'details'
 };
 var searchResultsSlice = toolkit.createSlice({
   name: 'searchResults',
@@ -33840,9 +33848,6 @@ var searchResultsSlice = toolkit.createSlice({
     setBookingPackageDetails: function (state, action) {
       state.bookingPackageDetails = action.payload.details;
     },
-    setEntry: function (state, action) {
-      state.entry = action.payload.entry;
-    },
     selectFlight: function (state, action) {
       if (!state.bookingPackageDetails) return;
       var _a = action.payload,
@@ -33891,6 +33896,15 @@ var searchResultsSlice = toolkit.createSlice({
     },
     setFlyInIsOpen: function (state, action) {
       state.flyInIsOpen = action.payload;
+    },
+    setEditablePackagingEntry: function (state, action) {
+      state.editablePackagingEntry = action.payload;
+    },
+    setTransactionId: function (state, action) {
+      state.transactionId = action.payload;
+    },
+    setAccommodationFlyInStep: function (state, action) {
+      state.accommodationFlyInStep = action.payload;
     }
   }
 });
@@ -33904,7 +33918,6 @@ var setResults = ((_a = searchResultsSlice.actions), _a.setResults),
   setSelectedFlight = _a.setSelectedFlight,
   setSelectedFlightDetails = _a.setSelectedFlightDetails,
   setBookingPackageDetails = _a.setBookingPackageDetails,
-  setEntry = _a.setEntry,
   selectFlight = _a.selectFlight,
   setIsLoading = _a.setIsLoading,
   setFilters = _a.setFilters,
@@ -33913,7 +33926,10 @@ var setResults = ((_a = searchResultsSlice.actions), _a.setResults),
   setActiveTab = _a.setActiveTab;
 _a.setCurrentPage;
 _a.resetSearchState;
-var setFlyInIsOpen = _a.setFlyInIsOpen;
+var setFlyInIsOpen = _a.setFlyInIsOpen,
+  setEditablePackagingEntry = _a.setEditablePackagingEntry,
+  setTransactionId = _a.setTransactionId,
+  setAccommodationFlyInStep = _a.setAccommodationFlyInStep;
 var searchResultsReducer = searchResultsSlice.reducer;
 
 var ItemPicker = function (_a) {
@@ -34942,492 +34958,715 @@ var Icon$1 = function (_a) {
   }
 };
 
-var getDepartureTime = function (flight) {
-  var _a, _b;
-  if (lodash.isEmpty(flight === null || flight === void 0 ? void 0 : flight.metaDatas)) return '';
-  try {
-    var config = (_a = lodash.first(flight === null || flight === void 0 ? void 0 : flight.metaDatas)) === null || _a === void 0 ? void 0 : _a.configuration;
-    if (!config) return '';
-    var parsed = JSON.parse(config);
-    var line = lodash.first(parsed === null || parsed === void 0 ? void 0 : parsed.FlightLines);
-    return (_b = line === null || line === void 0 ? void 0 : line.DepartureTime) !== null && _b !== void 0 ? _b : '';
-  } catch (_c) {
-    return '';
+var GROUP_TOUR_SERVICE_TYPE = 1;
+var ACCOMMODATION_SERVICE_TYPE = 3;
+var FLIGHT_SERVICE_TYPE = 7;
+var toDateOnlyString = function (value) {
+  var date = value instanceof Date ? value : new Date(value);
+  return date.toISOString().split('T')[0];
+};
+var getAgeAtReferenceDate = function (dateOfBirth, referenceDate) {
+  var dob = dateOfBirth instanceof Date ? dateOfBirth : new Date(dateOfBirth);
+  var ref = referenceDate instanceof Date ? referenceDate : new Date(referenceDate);
+  var age = ref.getFullYear() - dob.getFullYear();
+  var monthDiff = ref.getMonth() - dob.getMonth();
+  if (monthDiff < 0 || (monthDiff === 0 && ref.getDate() < dob.getDate())) {
+    age--;
   }
+  return age;
 };
-var getArrivalTime = function (flight) {
-  var _a, _b;
-  if (lodash.isEmpty(flight === null || flight === void 0 ? void 0 : flight.metaDatas)) return '';
-  try {
-    var config = (_a = lodash.first(flight === null || flight === void 0 ? void 0 : flight.metaDatas)) === null || _a === void 0 ? void 0 : _a.configuration;
-    if (!config) return '';
-    var parsed = JSON.parse(config);
-    var line = lodash.last(parsed === null || parsed === void 0 ? void 0 : parsed.FlightLines);
-    return (_b = line === null || line === void 0 ? void 0 : line.ArrivalTime) !== null && _b !== void 0 ? _b : '';
-  } catch (_c) {
-    return '';
+var getFlightLines$1 = function (lines) {
+  return __spreadArray([], lines, true)
+    .filter(function (line) {
+      return line.serviceType === FLIGHT_SERVICE_TYPE;
+    })
+    .sort(function (a, b) {
+      return new Date(a.from).getTime() - new Date(b.from).getTime();
+    });
+};
+var getDepartureAirportFromEntry = function (lines) {
+  var _a, _b, _c;
+  var firstFlight = getFlightLines$1(lines)[0];
+  var firstSegment =
+    (_b =
+      (_a = firstFlight === null || firstFlight === void 0 ? void 0 : firstFlight.flightInformation) === null || _a === void 0 ? void 0 : _a.flightLines) ===
+      null || _b === void 0
+      ? void 0
+      : _b[0];
+  return (_c = firstSegment === null || firstSegment === void 0 ? void 0 : firstSegment.departureAirportCode) !== null && _c !== void 0 ? _c : null;
+};
+var getDestinationAirportFromEntry = function (lines) {
+  var _a, _b, _c;
+  var outboundFlight = getFlightLines$1(lines)[0];
+  var flightSegments =
+    (_a = outboundFlight === null || outboundFlight === void 0 ? void 0 : outboundFlight.flightInformation) === null || _a === void 0 ? void 0 : _a.flightLines;
+  if (!(flightSegments === null || flightSegments === void 0 ? void 0 : flightSegments.length)) return null;
+  return (_c = (_b = flightSegments[flightSegments.length - 1]) === null || _b === void 0 ? void 0 : _b.arrivalAirportCode) !== null && _c !== void 0
+    ? _c
+    : null;
+};
+var mapPackagingPaxToBookingPax = function (pax, fallbackId, referenceDate) {
+  var _a, _b, _c, _d, _e, _f;
+  return {
+    id: (_a = pax === null || pax === void 0 ? void 0 : pax.id) !== null && _a !== void 0 ? _a : fallbackId,
+    guid:
+      (_c = (_b = pax === null || pax === void 0 ? void 0 : pax.id) === null || _b === void 0 ? void 0 : _b.toString()) !== null && _c !== void 0
+        ? _c
+        : fallbackId.toString(),
+    firstName: (_d = pax === null || pax === void 0 ? void 0 : pax.firstName) !== null && _d !== void 0 ? _d : '',
+    lastName: (_e = pax === null || pax === void 0 ? void 0 : pax.lastName) !== null && _e !== void 0 ? _e : '',
+    dateOfBirth: (_f = pax === null || pax === void 0 ? void 0 : pax.dateOfBirth) !== null && _f !== void 0 ? _f : undefined,
+    age: (pax === null || pax === void 0 ? void 0 : pax.dateOfBirth) ? getAgeAtReferenceDate(pax.dateOfBirth, referenceDate) : undefined,
+    isMainBooker: pax === null || pax === void 0 ? void 0 : pax.isMainBooker,
+    email: ''
+  };
+};
+var getRequestRoomsFromPackagingEntry = function (entry) {
+  var _a, _b, _c, _d;
+  var accommodationLines = ((_a = entry.lines) !== null && _a !== void 0 ? _a : []).filter(function (line) {
+    var _a;
+    return line.serviceType === ACCOMMODATION_SERVICE_TYPE && ((_a = line.pax) === null || _a === void 0 ? void 0 : _a.length) > 0;
+  });
+  var paxById = new Map(
+    ((_b = entry.pax) !== null && _b !== void 0 ? _b : []).map(function (p) {
+      return [p.id, p];
+    })
+  );
+  if (!accommodationLines.length) {
+    return [
+      {
+        index: 0,
+        pax: ((_c = entry.pax) !== null && _c !== void 0 ? _c : []).map(function (p) {
+          return mapPackagingPaxToBookingPax(p, p.id, new Date().toISOString());
+        })
+      }
+    ];
+  }
+  var roomGroups = [];
+  accommodationLines.forEach(function (line) {
+    var groupedByRoom = new Map();
+    line.pax.forEach(function (linePax) {
+      var _a;
+      var roomIndexWithinLine = Number((_a = linePax.room) !== null && _a !== void 0 ? _a : 0);
+      var paxId = Number(linePax.paxId);
+      var pax = mapPackagingPaxToBookingPax(paxById.get(paxId), paxId, line.from);
+      if (!groupedByRoom.has(roomIndexWithinLine)) {
+        groupedByRoom.set(roomIndexWithinLine, []);
+      }
+      groupedByRoom.get(roomIndexWithinLine).push(pax);
+    });
+    var sortedGroups = Array.from(groupedByRoom.entries())
+      .sort(function (_a, _b) {
+        var a = _a[0];
+        var b = _b[0];
+        return a - b;
+      })
+      .map(function (_a) {
+        var pax = _a[1];
+        return pax;
+      });
+    roomGroups.push.apply(roomGroups, sortedGroups);
+  });
+  if (!roomGroups.length) {
+    return [
+      {
+        index: 0,
+        pax: ((_d = entry.pax) !== null && _d !== void 0 ? _d : []).map(function (p) {
+          return mapPackagingPaxToBookingPax(p, p.id, accommodationLines[0].from);
+        })
+      }
+    ];
   }
+  return roomGroups.map(function (pax, index) {
+    return {
+      index: index,
+      pax: pax
+    };
+  });
 };
-var getDuration = function (flight) {
-  var _a;
-  if (lodash.isEmpty(flight === null || flight === void 0 ? void 0 : flight.metaDatas)) return '';
-  try {
-    var config = (_a = lodash.first(flight === null || flight === void 0 ? void 0 : flight.metaDatas)) === null || _a === void 0 ? void 0 : _a.configuration;
-    if (!config) return '';
-    var parsed = JSON.parse(config);
-    var ticks = parsed === null || parsed === void 0 ? void 0 : parsed.DurationInTicks;
-    if (!ticks) return '';
-    var seconds = ticks / 10000000;
-    var hours = Math.floor(seconds / 3600);
-    var minutes = Math.floor((seconds % 3600) / 60);
-    return ''.concat(hours, 'h ').concat(minutes.toString().padStart(2, '0'), 'm');
-  } catch (_b) {
-    return '';
+var parseHotelId = function (line) {
+  if (!(line === null || line === void 0 ? void 0 : line.productCode)) return null;
+  var parsed = Number(line.productCode);
+  return Number.isNaN(parsed) ? null : parsed;
+};
+var getPackagingRequestRoomsFromBookingRooms = function (rooms) {
+  if (!(rooms === null || rooms === void 0 ? void 0 : rooms.length)) {
+    var room_1 = { index: 0, travellers: [] };
+    lodash.range(0, 2).forEach(function () {
+      room_1.travellers.push({
+        age: 30
+      });
+    });
+    return [room_1];
   }
+  return rooms.map(function (x, i) {
+    var _a;
+    var room = { index: (_a = x.index) !== null && _a !== void 0 ? _a : i, travellers: [] };
+    x.pax.forEach(function (p) {
+      var _a;
+      room.travellers.push({
+        age: (_a = p.age) !== null && _a !== void 0 ? _a : 30
+      });
+    });
+    return room;
+  });
+};
+
+var getFlightLines = function (flight) {
+  var _a, _b;
+  return (_b = (_a = flight === null || flight === void 0 ? void 0 : flight.flightInformation) === null || _a === void 0 ? void 0 : _a.flightLines) !== null &&
+    _b !== void 0
+    ? _b
+    : [];
+};
+var getDepartureTime = function (flight) {
+  var firstLine = lodash.first(getFlightLines(flight));
+  if (!(firstLine === null || firstLine === void 0 ? void 0 : firstLine.departureTime)) return '';
+  return firstLine.departureTime.slice(0, 5);
+};
+var getArrivalTime = function (flight) {
+  var lastLine = lodash.last(getFlightLines(flight));
+  if (!(lastLine === null || lastLine === void 0 ? void 0 : lastLine.arrivalTime)) return '';
+  return lastLine.arrivalTime.slice(0, 5);
+};
+var getDuration = function (flight) {
+  var lines = getFlightLines(flight);
+  if (!lines.length) return '';
+  var totalTicks =
+    lines.reduce(function (sum, line) {
+      var _a;
+      return sum + ((_a = line.durationInTicks) !== null && _a !== void 0 ? _a : 0);
+    }, 0) || 0;
+  if (!totalTicks) return '';
+  var seconds = totalTicks / 10000000;
+  var hours = Math.floor(seconds / 3600);
+  var minutes = Math.floor((seconds % 3600) / 60);
+  return ''.concat(hours, 'h ').concat(minutes.toString().padStart(2, '0'), 'm');
 };
 var numberOfNights = function (segment) {
-  return dateFns.differenceInCalendarDays(new Date(segment.endDate), new Date(segment.startDate));
+  return dateFns.differenceInCalendarDays(new Date(segment.to), new Date(segment.from));
+};
+var getSegmentIcon = function (segment) {
+  switch (segment.serviceType) {
+    case 3:
+      return React__default['default'].createElement(
+        'div',
+        { className: 'search__filter__itinerary__segment-badge search__filter__itinerary__segment-badge--secondary' },
+        React__default['default'].createElement(Icon$1, { name: 'ui-bed', width: 15, height: 15 })
+      );
+    case 4:
+      return React__default['default'].createElement(
+        'div',
+        { className: 'search__filter__itinerary__segment-badge search__filter__itinerary__segment-badge--secondary' },
+        React__default['default'].createElement(Icon$1, { name: 'ui-ticket', width: 15, height: 15 })
+      );
+    case 11:
+      return React__default['default'].createElement(
+        'div',
+        { className: 'search__filter__itinerary__segment-badge search__filter__itinerary__segment-badge--secondary' },
+        React__default['default'].createElement(Icon$1, { name: 'ui-ship', width: 15, height: 15 })
+      );
+    case 13:
+    case 17:
+    case 22:
+      return React__default['default'].createElement(
+        'div',
+        { className: 'search__filter__itinerary__transport-badge' },
+        React__default['default'].createElement(Icon$1, { name: 'ui-car', width: 15, height: 15 })
+      );
+    default:
+      return React__default['default'].createElement(
+        'div',
+        { className: 'search__filter__itinerary__segment-badge' },
+        React__default['default'].createElement(Icon$1, { name: 'ui-location', width: 15, height: 15 })
+      );
+  }
+};
+var canEdit = function (segment) {
+  if (segment.serviceType === ACCOMMODATION_SERVICE_TYPE) {
+    return true;
+  }
+  return false;
+};
+var getSegmentTitle = function (segment) {
+  var _a;
+  return (_a = segment.productName) !== null && _a !== void 0 ? _a : segment.accommodationName;
 };
 var Itinerary = function (_a) {
-  var _b;
+  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
   var isOpen = _a.isOpen,
-    handleSetIsOpen = _a.handleSetIsOpen,
-    isLoading = _a.isLoading;
+    handleSetIsOpen = _a.handleSetIsOpen;
+  _a.isLoading;
+  var onEditAccommodation = _a.onEditAccommodation;
   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');
-  var entry = reactRedux.useSelector(function (state) {
+  var editablePackagingEntry = reactRedux.useSelector(function (state) {
     return state.searchResults;
-  }).entry;
-  if (isLoading || !entry) {
+  }).editablePackagingEntry;
+  var packagingEntry =
+    editablePackagingEntry !== null && editablePackagingEntry !== void 0
+      ? editablePackagingEntry
+      : context === null || context === void 0
+      ? void 0
+      : context.packagingEntry;
+  var sortedLines = React.useMemo(
+    function () {
+      var _a;
+      return __spreadArray(
+        [],
+        (_a = packagingEntry === null || packagingEntry === void 0 ? void 0 : packagingEntry.lines) !== null && _a !== void 0 ? _a : [],
+        true
+      ).sort(function (a, b) {
+        var _a, _b;
+        var orderA = (_a = a.order) !== null && _a !== void 0 ? _a : Infinity;
+        var orderB = (_b = b.order) !== null && _b !== void 0 ? _b : Infinity;
+        // First sort by order
+        if (orderA !== orderB) {
+          return orderA - orderB;
+        }
+        // Fallback to date
+        return new Date(a.from).getTime() - new Date(b.from).getTime();
+      });
+    },
+    [packagingEntry]
+  );
+  if (!packagingEntry) {
     return null;
   }
-  var firstEntryLine = lodash.first(entry === null || entry === void 0 ? void 0 : entry.items);
-  var lastEntryLine = lodash.last(entry === null || entry === void 0 ? void 0 : entry.items);
-  var country = firstEntryLine === null || firstEntryLine === void 0 ? void 0 : firstEntryLine.countryName;
-  var location = firstEntryLine === null || firstEntryLine === void 0 ? void 0 : firstEntryLine.locationName;
-  var outboundFlight =
-    entry === null || entry === void 0
-      ? void 0
-      : entry.items.find(function (item) {
-          return item.productType === 7 && !item.isReturnFlight;
-        });
-  var returnFlight =
-    entry === null || entry === void 0
+  var firstEntryLine = lodash.first(sortedLines);
+  var lastEntryLine = lodash.last(sortedLines);
+  var accommodationLine =
+    (_c = sortedLines.find(function (line) {
+      return line.serviceType === ACCOMMODATION_SERVICE_TYPE;
+    })) !== null && _c !== void 0
+      ? _c
+      : firstEntryLine;
+  var country =
+    (_e =
+      (_d = accommodationLine === null || accommodationLine === void 0 ? void 0 : accommodationLine.country) === null || _d === void 0 ? void 0 : _d.name) !==
+      null && _e !== void 0
+      ? _e
+      : (_f = firstEntryLine === null || firstEntryLine === void 0 ? void 0 : firstEntryLine.country) === null || _f === void 0
       ? void 0
-      : entry.items.find(function (item) {
-          return item.productType === 7 && item.isReturnFlight;
-        });
-  var otherSegments =
-    entry === null || entry === void 0
+      : _f.name;
+  var location =
+    (_m =
+      (_k =
+        (_h =
+          (_g = accommodationLine === null || accommodationLine === void 0 ? void 0 : accommodationLine.location) === null || _g === void 0
+            ? void 0
+            : _g.name) !== null && _h !== void 0
+          ? _h
+          : (_j = accommodationLine === null || accommodationLine === void 0 ? void 0 : accommodationLine.oord) === null || _j === void 0
+          ? void 0
+          : _j.name) !== null && _k !== void 0
+        ? _k
+        : (_l = accommodationLine === null || accommodationLine === void 0 ? void 0 : accommodationLine.region) === null || _l === void 0
+        ? void 0
+        : _l.name) !== null && _m !== void 0
+      ? _m
+      : (_o = firstEntryLine === null || firstEntryLine === void 0 ? void 0 : firstEntryLine.location) === null || _o === void 0
       ? void 0
-      : entry.items.filter(function (item) {
-          return item.productType !== 7;
-        });
+      : _o.name;
+  var flightSegments = sortedLines.filter(function (item) {
+    return item.serviceType === FLIGHT_SERVICE_TYPE;
+  });
+  var outboundFlight = lodash.first(flightSegments);
+  var returnFlight = flightSegments.length > 1 ? lodash.last(flightSegments) : undefined;
+  var otherSegments = sortedLines.filter(function (item) {
+    return item.serviceType !== FLIGHT_SERVICE_TYPE;
+  });
+  var grouped = lodash.groupBy(otherSegments, function (segment) {
+    return ''.concat(segment.productCode, '-').concat(segment.from, '-').concat(segment.to);
+  });
+  var groupedOtherSegments = Object.entries(grouped).map(function (_a) {
+    var key = _a[0],
+      segments = _a[1];
+    return {
+      key: key,
+      segments: segments
+    };
+  });
+  console.log('otherSegments', otherSegments);
+  console.log('groupedOtherSegments', groupedOtherSegments);
+  var numberOfPax = ((_p = packagingEntry.pax) === null || _p === void 0 ? void 0 : _p.length) || 1;
+  var totalPrice = packagingEntry.price || 0;
+  var pricePerPerson = totalPrice / numberOfPax;
   return React__default['default'].createElement(
-    React__default['default'].Fragment,
-    null,
+    'div',
+    { className: 'search__filters--modal '.concat(isOpen ? 'is-open' : '') },
+    React__default['default'].createElement('div', { className: 'search__filters--background', onClick: handleSetIsOpen }),
+    React__default['default'].createElement(
+      'button',
+      { className: 'search__filters--close', onClick: handleSetIsOpen },
+      React__default['default'].createElement(Icon$1, { name: 'ui-close', height: 24 })
+    ),
     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();
-        }
-      }),
+      { className: 'search__filters' },
       React__default['default'].createElement(
-        'button',
-        {
-          className: 'search__filters--close',
-          onClick: function () {
-            return handleSetIsOpen();
-          }
-        },
-        React__default['default'].createElement(Icon$1, { name: 'ui-close', height: 24 })
+        '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.ITINERARY_TITLE)
+        )
       ),
       React__default['default'].createElement(
-        'div',
-        { className: 'search__filters' },
+        React__default['default'].Fragment,
+        null,
+        React__default['default'].createElement(
+          'div',
+          { className: 'search__filter-group' },
+          (context === null || context === void 0 ? void 0 : context.destinationImage) &&
+            React__default['default'].createElement(
+              'div',
+              { className: 'search__filter__image__wrapper' },
+              React__default['default'].createElement('img', {
+                src: context.destinationImage.url,
+                alt: context.destinationImage.alt,
+                className: 'search__filter__image'
+              }),
+              (packagingEntry === null || packagingEntry === void 0 ? void 0 : packagingEntry.dossierNumber) &&
+                React__default['default'].createElement(
+                  'span',
+                  { className: 'search__filter__image__text' },
+                  translations.SRP.DOSSIER_NUMBER,
+                  ': ',
+                  packagingEntry.dossierNumber
+                ),
+              React__default['default'].createElement(
+                'h4',
+                { className: 'search__filter__image__title' },
+                (location || '') + (location && country ? ' - ' : '') + (country || '')
+              )
+            )
+        ),
         React__default['default'].createElement(
           'div',
-          { className: 'search__filter-row search__filter__header' },
+          { className: 'search__filter__prices' },
           React__default['default'].createElement(
             'div',
-            { className: 'search__filter-row-flex-title' },
-            React__default['default'].createElement('p', { className: 'search__filter-small-title' }, translations.SRP.ITINERARY_TITLE)
-          )
-        ),
-        isLoading
-          ? React__default['default'].createElement(Spinner, null)
-          : React__default['default'].createElement(
-              React__default['default'].Fragment,
+            { className: 'search__filter__prices__wrapper' },
+            React__default['default'].createElement('h3', { className: 'search__filter__prices--amount' }, formatPrice$2(pricePerPerson, 'EUR')),
+            React__default['default'].createElement('p', null, translations.SRP.PACKAGE_PRICE_PER_PERSON),
+            React__default['default'].createElement(
+              'p',
               null,
+              React__default['default'].createElement('strong', null, '(', formatPrice$2(totalPrice, 'EUR'), ' ', translations.SRP.TOTAL, ')')
+            )
+          ),
+          React__default['default'].createElement('button', { className: 'cta' }, translations.QSM.CONFIRM)
+        ),
+        React__default['default'].createElement(
+          'div',
+          { className: 'search__filter__itinerary' },
+          React__default['default'].createElement('p', null, translations.SRP.DAY_BY_DAY),
+          firstEntryLine &&
+            React__default['default'].createElement(
+              'div',
+              { className: 'search__filter__itinerary__country' },
               React__default['default'].createElement(
                 'div',
-                { className: 'search__filter-group' },
-                (context === null || context === void 0 ? void 0 : context.destinationImage) &&
-                  React__default['default'].createElement(
-                    'div',
-                    { className: 'search__filter__image__wrapper' },
-                    React__default['default'].createElement('img', {
-                      src: context.destinationImage.url,
-                      alt: context.destinationImage.alt,
-                      className: 'search__filter__image'
-                    }),
-                    (entry === null || entry === void 0 ? void 0 : entry.number) &&
-                      React__default['default'].createElement(
-                        'span',
-                        { className: 'search__filter__image__text' },
-                        translations.SRP.DOSSIER_NUMBER,
-                        ': ',
-                        entry === null || entry === void 0 ? void 0 : entry.number
-                      ),
-                    React__default['default'].createElement(
-                      'h4',
-                      { className: 'search__filter__image__title' },
-                      (location || '') + (location && country ? ' - ' : '') + (country || '')
-                    )
-                  )
+                { className: 'search__filter__itinerary__country-icon' },
+                React__default['default'].createElement(Icon$1, { name: 'ui-flag', width: 17.5, height: 20 })
               ),
               React__default['default'].createElement(
                 'div',
-                { className: 'search__filter__prices' },
+                { className: 'search__filter__itinerary__country-content' },
+                React__default['default'].createElement(
+                  'p',
+                  null,
+                  dateFns.format(new Date(firstEntryLine.from), 'EEE. d MMM yyyy'),
+                  ' - ',
+                  React__default['default'].createElement('strong', null, translations.SRP.START)
+                )
+              )
+            ),
+          outboundFlight &&
+            React__default['default'].createElement(
+              'div',
+              { className: 'search__filter__itinerary__transport' },
+              React__default['default'].createElement(
+                'div',
+                { className: 'search__filter__itinerary__transport-timeline' },
+                React__default['default'].createElement('div', { className: 'search__filter__itinerary__transport-timeline-line' })
+              ),
+              React__default['default'].createElement(
+                'div',
+                { className: 'search__filter__itinerary__transport-item' },
                 React__default['default'].createElement(
                   'div',
-                  { className: 'search__filter__prices__wrapper' },
+                  { className: 'search__filter__itinerary__transport-date' },
                   React__default['default'].createElement(
-                    'h3',
-                    { className: 'search__filter__prices--amount' },
-                    formatPrice$2(
-                      ((entry === null || entry === void 0 ? void 0 : entry.sellingPrice) || 0) /
-                        ((entry === null || entry === void 0 ? void 0 : entry.numberOfPax) || 1),
-                      (entry === null || entry === void 0 ? void 0 : entry.currencyCode) || 'EUR'
+                    'p',
+                    { className: 'search__filter__itinerary__transport-date-date' },
+                    React__default['default'].createElement('strong', null, dateFns.format(new Date(outboundFlight.from), 'd'))
+                  ),
+                  React__default['default'].createElement('p', null, dateFns.format(new Date(outboundFlight.from), 'MMM'))
+                ),
+                React__default['default'].createElement(
+                  'div',
+                  { className: 'search__filter__itinerary__transport-badge' },
+                  React__default['default'].createElement(Icon$1, { name: 'ui-plane', height: 15 })
+                ),
+                React__default['default'].createElement(
+                  'div',
+                  { className: 'search__filter__itinerary__transport-details' },
+                  React__default['default'].createElement('h6', null, outboundFlight.productName),
+                  React__default['default'].createElement(
+                    'p',
+                    { className: 'search__filter__itinerary__transport-details-plane' },
+                    React__default['default'].createElement(
+                      'span',
+                      null,
+                      React__default['default'].createElement(Icon$1, { name: 'ui-plane-depart', height: 14 }),
+                      ' ',
+                      React__default['default'].createElement('strong', null, getDepartureTime(outboundFlight))
+                    ),
+                    ' ',
+                    '-',
+                    ' ',
+                    React__default['default'].createElement(
+                      'span',
+                      null,
+                      React__default['default'].createElement(Icon$1, { name: 'ui-plane-arrive', height: 14 }),
+                      ' ',
+                      React__default['default'].createElement('strong', null, getArrivalTime(outboundFlight))
                     )
                   ),
-                  React__default['default'].createElement('p', null, translations.SRP.PACKAGE_PRICE_PER_PERSON),
                   React__default['default'].createElement(
                     'p',
-                    null,
+                    { className: 'search__filter__itinerary__transport-details-time' },
                     React__default['default'].createElement(
-                      'strong',
+                      'span',
                       null,
-                      '(',
-                      formatPrice$2(
-                        (entry === null || entry === void 0 ? void 0 : entry.sellingPrice) || 0,
-                        (entry === null || entry === void 0 ? void 0 : entry.currencyCode) || 'EUR'
-                      ),
+                      React__default['default'].createElement(Icon$1, { name: 'ui-clock', height: 20 }),
                       ' ',
-                      translations.SRP.TOTAL,
-                      ')'
+                      getDuration(outboundFlight)
                     )
                   )
-                ),
-                React__default['default'].createElement('button', { className: 'cta' }, translations.QSM.CONFIRM)
-              ),
-              React__default['default'].createElement(
+                )
+              )
+            ),
+          !lodash.isEmpty(groupedOtherSegments) &&
+            groupedOtherSegments.map(function (group) {
+              var _a, _b, _c, _d, _e, _f, _g, _h;
+              var firstSegment = lodash.first(group.segments);
+              if (!firstSegment) return null;
+              return React__default['default'].createElement(
                 'div',
-                { className: 'search__filter__itinerary' },
-                React__default['default'].createElement('p', null, translations.SRP.DAY_BY_DAY),
+                { className: 'search__filter__itinerary__segments' },
                 React__default['default'].createElement(
                   'div',
-                  { className: 'search__filter__itinerary__country' },
+                  { className: 'search__filter__itinerary__segments__wrapper', key: group.key },
                   React__default['default'].createElement(
                     'div',
-                    { className: 'search__filter__itinerary__country-icon' },
-                    React__default['default'].createElement(Icon$1, { name: 'ui-flag', width: 17.5, height: 20 })
+                    { className: 'search__filter__itinerary__segments-timeline' },
+                    React__default['default'].createElement('div', { className: 'search__filter__itinerary__segments-timeline-line' })
                   ),
                   React__default['default'].createElement(
                     'div',
-                    { className: 'search__filter__itinerary__country-content' },
-                    React__default['default'].createElement(
-                      'p',
-                      null,
-                      dateFns.format(
-                        new Date((firstEntryLine === null || firstEntryLine === void 0 ? void 0 : firstEntryLine.startDate) || ''),
-                        'EEE. d MMM yyyy'
-                      ),
-                      ' - ',
-                      React__default['default'].createElement('strong', null, translations.SRP.START)
-                    )
-                  )
-                ),
-                outboundFlight &&
-                  React__default['default'].createElement(
-                    'div',
-                    { className: 'search__filter__itinerary__transport' },
+                    { className: 'search__filter__itinerary__segment' },
                     React__default['default'].createElement(
                       'div',
-                      { className: 'search__filter__itinerary__transport-timeline' },
-                      React__default['default'].createElement('div', { className: 'search__filter__itinerary__transport-timeline-line' })
-                    ),
-                    React__default['default'].createElement(
-                      'div',
-                      { className: 'search__filter__itinerary__transport-item' },
+                      { className: 'search__filter__itinerary__segment-item search__filter__itinerary__segment-item--start' },
                       React__default['default'].createElement(
                         'div',
                         { className: 'search__filter__itinerary__transport-date' },
                         React__default['default'].createElement(
                           'p',
                           { className: 'search__filter__itinerary__transport-date-date' },
-                          React__default['default'].createElement(
-                            'strong',
-                            null,
-                            dateFns.format(new Date((outboundFlight === null || outboundFlight === void 0 ? void 0 : outboundFlight.startDate) || ''), 'd')
-                          )
+                          React__default['default'].createElement('strong', null, dateFns.format(new Date(firstSegment.from), 'd'))
                         ),
-                        React__default['default'].createElement(
-                          'p',
-                          null,
-                          dateFns.format(new Date((outboundFlight === null || outboundFlight === void 0 ? void 0 : outboundFlight.startDate) || ''), 'MMM')
-                        )
+                        React__default['default'].createElement('p', null, dateFns.format(new Date(firstSegment.from), 'MMM'))
                       ),
                       React__default['default'].createElement(
                         'div',
-                        { className: 'search__filter__itinerary__transport-badge' },
-                        React__default['default'].createElement(Icon$1, { name: 'ui-plane', height: 15 })
+                        { className: 'search__filter__itinerary__segment-badge' },
+                        React__default['default'].createElement(Icon$1, { name: 'ui-location', width: 15, height: 15 })
                       ),
                       React__default['default'].createElement(
                         'div',
-                        { className: 'search__filter__itinerary__transport-details' },
-                        React__default['default'].createElement('h6', null, outboundFlight.productName),
+                        { className: 'search__filter__itinerary__segment-details' },
                         React__default['default'].createElement(
-                          'p',
-                          { className: 'search__filter__itinerary__transport-details-plane' },
-                          React__default['default'].createElement(
-                            'span',
-                            null,
-                            React__default['default'].createElement(Icon$1, { name: 'ui-plane-depart', height: 14 }),
-                            ' ',
-                            React__default['default'].createElement('strong', null, getDepartureTime(outboundFlight))
-                          ),
-                          ' ',
-                          '-',
-                          ' ',
-                          React__default['default'].createElement(
-                            'span',
-                            null,
-                            React__default['default'].createElement(Icon$1, { name: 'ui-plane-arrive', height: 14 }),
-                            ' ',
-                            React__default['default'].createElement('strong', null, getArrivalTime(outboundFlight))
-                          )
+                          'h6',
+                          null,
+                          ((_a = firstSegment.location) === null || _a === void 0 ? void 0 : _a.name) ||
+                            ((_b = firstSegment.oord) === null || _b === void 0 ? void 0 : _b.name) ||
+                            ((_c = firstSegment.region) === null || _c === void 0 ? void 0 : _c.name),
+                          (((_d = firstSegment.location) === null || _d === void 0 ? void 0 : _d.name) ||
+                            ((_e = firstSegment.oord) === null || _e === void 0 ? void 0 : _e.name) ||
+                            ((_f = firstSegment.region) === null || _f === void 0 ? void 0 : _f.name)) &&
+                            ((_g = firstSegment.country) === null || _g === void 0 ? void 0 : _g.name)
+                            ? ', '
+                            : '',
+                          (_h = firstSegment.country) === null || _h === void 0 ? void 0 : _h.name
                         ),
                         React__default['default'].createElement(
                           'p',
-                          { className: 'search__filter__itinerary__transport-details-time' },
-                          React__default['default'].createElement(
-                            'span',
-                            null,
-                            React__default['default'].createElement(Icon$1, { name: 'ui-clock', height: 20 }),
-                            ' ',
-                            getDuration(outboundFlight)
-                          )
+                          { className: 'search__filter__itinerary__segment-details-text' },
+                          dateFns.format(new Date(firstSegment.from), 'EEE. d MMM yyyy'),
+                          '> ',
+                          dateFns.format(new Date(firstSegment.to), 'EEE. d MMM yyyy')
                         )
                       )
                     )
                   ),
-                !lodash.isEmpty(otherSegments) &&
-                  React__default['default'].createElement(
-                    'div',
-                    { className: 'search__filter__itinerary__segments' },
-                    otherSegments === null || otherSegments === void 0
-                      ? void 0
-                      : otherSegments.map(function (segment, index) {
-                          return React__default['default'].createElement(
-                            'div',
-                            { className: 'search__filter__itinerary__segments__wrapper', key: 'segment-'.concat(index) },
-                            React__default['default'].createElement(
-                              'div',
-                              { className: 'search__filter__itinerary__segments-timeline' },
-                              React__default['default'].createElement('div', { className: 'search__filter__itinerary__segments-timeline-line' })
-                            ),
-                            React__default['default'].createElement(
-                              'div',
-                              { className: 'search__filter__itinerary__segment' },
-                              React__default['default'].createElement(
-                                'div',
-                                { className: 'search__filter__itinerary__segment-item search__filter__itinerary__segment-item--start' },
-                                React__default['default'].createElement(
-                                  'div',
-                                  { className: 'search__filter__itinerary__transport-date' },
-                                  React__default['default'].createElement(
-                                    'p',
-                                    { className: 'search__filter__itinerary__transport-date-date' },
-                                    React__default['default'].createElement(
-                                      'strong',
-                                      null,
-                                      dateFns.format(new Date((segment === null || segment === void 0 ? void 0 : segment.startDate) || ''), 'd')
-                                    )
-                                  ),
-                                  React__default['default'].createElement(
-                                    'p',
-                                    null,
-                                    dateFns.format(new Date((segment === null || segment === void 0 ? void 0 : segment.startDate) || ''), 'MMM')
-                                  )
-                                ),
-                                React__default['default'].createElement(
-                                  'div',
-                                  { className: 'search__filter__itinerary__segment-badge' },
-                                  React__default['default'].createElement(Icon$1, { name: 'ui-location', width: 15, height: 15 })
-                                ),
-                                React__default['default'].createElement(
-                                  'div',
-                                  { className: 'search__filter__itinerary__segment-details' },
-                                  React__default['default'].createElement(
-                                    'h6',
-                                    null,
-                                    segment === null || segment === void 0 ? void 0 : segment.locationName,
-                                    ', ',
-                                    segment === null || segment === void 0 ? void 0 : segment.countryName
-                                  ),
-                                  React__default['default'].createElement(
-                                    'p',
-                                    { className: 'search__filter__itinerary__segment-details-text' },
-                                    dateFns.format(new Date((segment === null || segment === void 0 ? void 0 : segment.startDate) || ''), 'EEE. d MMM yyyy'),
-                                    '> ',
-                                    dateFns.format(new Date((segment === null || segment === void 0 ? void 0 : segment.endDate) || ''), 'EEE. d MMM yyyy')
-                                  )
-                                )
-                              )
-                            ),
-                            React__default['default'].createElement(
-                              'div',
-                              { className: 'search__filter__itinerary__segment' },
-                              React__default['default'].createElement(
-                                'div',
-                                { className: 'search__filter__itinerary__segment-item' },
-                                segment.productType === 3 &&
-                                  React__default['default'].createElement(
-                                    'div',
-                                    { className: 'search__filter__itinerary__segment-date search__filter__itinerary__segment-nights' },
-                                    React__default['default'].createElement(
-                                      'p',
-                                      { className: 'search__filter__itinerary__segment-date-date' },
-                                      React__default['default'].createElement('strong', null, numberOfNights(segment))
-                                    ),
-                                    React__default['default'].createElement(Icon$1, { name: 'ui-moon', width: 16, height: 16 })
-                                  ),
-                                React__default['default'].createElement(
-                                  'div',
-                                  { className: 'search__filter__itinerary__segment-badge search__filter__itinerary__segment-badge--secondary' },
-                                  segment.productType === 3 && React__default['default'].createElement(Icon$1, { name: 'ui-bed', width: 15, height: 15 }),
-                                  segment.productType === 4 && React__default['default'].createElement(Icon$1, { name: 'ui-ticket', width: 15, height: 15 }),
-                                  (segment.productType === 17 || segment.productType === 22) &&
-                                    React__default['default'].createElement(Icon$1, { name: 'ui-car', width: 15, height: 15 }),
-                                  segment.productType === 11 && React__default['default'].createElement(Icon$1, { name: 'ui-ship', width: 15, height: 15 })
-                                ),
-                                React__default['default'].createElement(
-                                  'div',
-                                  { className: 'search__filter__itinerary__segment-details' },
-                                  React__default['default'].createElement('h6', null, segment === null || segment === void 0 ? void 0 : segment.productName)
-                                )
-                              )
-                            )
-                          );
-                        })
-                  ),
-                returnFlight &&
                   React__default['default'].createElement(
                     'div',
-                    { className: 'search__filter__itinerary__transport' },
+                    { className: 'search__filter__itinerary__segment' },
                     React__default['default'].createElement(
                       'div',
-                      { className: 'search__filter__itinerary__transport-timeline' },
-                      React__default['default'].createElement('div', { className: 'search__filter__itinerary__transport-timeline-line' })
-                    ),
-                    React__default['default'].createElement(
-                      'div',
-                      { className: 'search__filter__itinerary__transport-item' },
+                      {
+                        className: 'search__filter__itinerary__segment-item '.concat(
+                          canEdit(firstSegment) ? 'search__filter__itinerary__segment-item--editable' : ''
+                        ),
+                        onClick: function () {
+                          if (canEdit(firstSegment) && onEditAccommodation) {
+                            onEditAccommodation(group.segments);
+                          }
+                        }
+                      },
                       React__default['default'].createElement(
                         'div',
-                        { className: 'search__filter__itinerary__transport-date' },
-                        React__default['default'].createElement(
-                          'p',
-                          { className: 'search__filter__itinerary__transport-date-date' },
+                        { className: 'search__filter__itinerary__segment-date search__filter__itinerary__segment-nights' },
+                        firstSegment.serviceType === ACCOMMODATION_SERVICE_TYPE &&
                           React__default['default'].createElement(
-                            'strong',
+                            React__default['default'].Fragment,
                             null,
-                            dateFns.format(new Date((returnFlight === null || returnFlight === void 0 ? void 0 : returnFlight.startDate) || ''), 'd')
+                            React__default['default'].createElement(
+                              'p',
+                              { className: 'search__filter__itinerary__segment-date-date' },
+                              React__default['default'].createElement('strong', null, numberOfNights(firstSegment))
+                            ),
+                            React__default['default'].createElement(Icon$1, { name: 'ui-moon', width: 16, height: 16 })
                           )
-                        ),
-                        React__default['default'].createElement(
-                          'p',
-                          null,
-                          dateFns.format(new Date((returnFlight === null || returnFlight === void 0 ? void 0 : returnFlight.startDate) || ''), 'MMM')
-                        )
                       ),
+                      getSegmentIcon(firstSegment),
                       React__default['default'].createElement(
                         'div',
-                        { className: 'search__filter__itinerary__transport-badge' },
-                        React__default['default'].createElement(Icon$1, { name: 'ui-plane', height: 15 })
-                      ),
-                      React__default['default'].createElement(
-                        'div',
-                        { className: 'search__filter__itinerary__transport-details' },
-                        React__default['default'].createElement(
-                          'h6',
-                          null,
-                          returnFlight === null || returnFlight === void 0 ? void 0 : returnFlight.productName
-                        ),
-                        React__default['default'].createElement(
-                          'p',
-                          { className: 'search__filter__itinerary__transport-details-plane' },
-                          React__default['default'].createElement(
-                            'span',
-                            null,
-                            React__default['default'].createElement(Icon$1, { name: 'ui-plane-depart', height: 14 }),
-                            ' ',
-                            React__default['default'].createElement('strong', null, getDepartureTime(returnFlight))
-                          ),
-                          ' ',
-                          '-',
-                          ' ',
-                          React__default['default'].createElement(
-                            'span',
-                            null,
-                            React__default['default'].createElement(Icon$1, { name: 'ui-plane-arrive', height: 14 }),
-                            ' ',
-                            React__default['default'].createElement('strong', null, getArrivalTime(returnFlight))
-                          )
-                        ),
-                        React__default['default'].createElement(
-                          'p',
-                          { className: 'search__filter__itinerary__transport-details-time' },
-                          React__default['default'].createElement(
-                            'span',
-                            null,
-                            React__default['default'].createElement(Icon$1, { name: 'ui-clock', height: 20 }),
-                            ' ',
-                            getDuration(returnFlight)
-                          )
-                        )
+                        { className: 'search__filter__itinerary__segment-details' },
+                        React__default['default'].createElement('h6', null, getSegmentTitle(firstSegment)),
+                        firstSegment.serviceType === ACCOMMODATION_SERVICE_TYPE &&
+                          group.segments.map(function (segment, index) {
+                            return React__default['default'].createElement(
+                              React__default['default'].Fragment,
+                              { key: segment.guid },
+                              React__default['default'].createElement('strong', null, translations.SHARED.ROOM, '\u00A0', index + 1),
+                              segment.productName &&
+                                segment.accommodationName &&
+                                React__default['default'].createElement(
+                                  'div',
+                                  { className: 'search__filter__itinerary__segment-details__room' },
+                                  React__default['default'].createElement(Icon$1, { name: 'ui-bed', width: 12, height: 12 }),
+                                  segment.accommodationName
+                                ),
+                              segment.regimeName &&
+                                React__default['default'].createElement(
+                                  'div',
+                                  { className: 'search__filter__itinerary__segment-details__room' },
+                                  React__default['default'].createElement(Icon$1, { name: 'ui-utensils', width: 12, height: 12 }),
+                                  segment.regimeName
+                                )
+                            );
+                          })
                       )
                     )
+                  )
+                )
+              );
+            }),
+          returnFlight &&
+            returnFlight !== outboundFlight &&
+            React__default['default'].createElement(
+              'div',
+              { className: 'search__filter__itinerary__transport' },
+              React__default['default'].createElement(
+                'div',
+                { className: 'search__filter__itinerary__transport-timeline' },
+                React__default['default'].createElement('div', { className: 'search__filter__itinerary__transport-timeline-line' })
+              ),
+              React__default['default'].createElement(
+                'div',
+                { className: 'search__filter__itinerary__transport-item' },
+                React__default['default'].createElement(
+                  'div',
+                  { className: 'search__filter__itinerary__transport-date' },
+                  React__default['default'].createElement(
+                    'p',
+                    { className: 'search__filter__itinerary__transport-date-date' },
+                    React__default['default'].createElement('strong', null, dateFns.format(new Date(returnFlight.from), 'd'))
                   ),
+                  React__default['default'].createElement('p', null, dateFns.format(new Date(returnFlight.from), 'MMM'))
+                ),
+                React__default['default'].createElement(
+                  'div',
+                  { className: 'search__filter__itinerary__transport-badge' },
+                  React__default['default'].createElement(Icon$1, { name: 'ui-plane', height: 15 })
+                ),
                 React__default['default'].createElement(
                   'div',
-                  { className: 'search__filter__itinerary__country' },
+                  { className: 'search__filter__itinerary__transport-details' },
+                  React__default['default'].createElement('h6', null, returnFlight.productName),
                   React__default['default'].createElement(
-                    'div',
-                    { className: 'search__filter__itinerary__country-icon' },
-                    React__default['default'].createElement(Icon$1, { name: 'ui-flag', width: 17.5, height: 20 })
+                    'p',
+                    { className: 'search__filter__itinerary__transport-details-plane' },
+                    React__default['default'].createElement(
+                      'span',
+                      null,
+                      React__default['default'].createElement(Icon$1, { name: 'ui-plane-depart', height: 14 }),
+                      ' ',
+                      React__default['default'].createElement('strong', null, getDepartureTime(returnFlight))
+                    ),
+                    ' ',
+                    '-',
+                    ' ',
+                    React__default['default'].createElement(
+                      'span',
+                      null,
+                      React__default['default'].createElement(Icon$1, { name: 'ui-plane-arrive', height: 14 }),
+                      ' ',
+                      React__default['default'].createElement('strong', null, getArrivalTime(returnFlight))
+                    )
                   ),
                   React__default['default'].createElement(
-                    'div',
-                    { className: 'search__filter__itinerary__country-content' },
+                    'p',
+                    { className: 'search__filter__itinerary__transport-details-time' },
                     React__default['default'].createElement(
-                      'p',
+                      'span',
                       null,
-                      dateFns.format(
-                        new Date((lastEntryLine === null || lastEntryLine === void 0 ? void 0 : lastEntryLine.startDate) || ''),
-                        'EEE. d MMM yyyy'
-                      ),
-                      ' - ',
-                      React__default['default'].createElement('strong', null, translations.SRP.END)
+                      React__default['default'].createElement(Icon$1, { name: 'ui-clock', height: 20 }),
+                      ' ',
+                      getDuration(returnFlight)
                     )
                   )
                 )
               )
+            ),
+          lastEntryLine &&
+            React__default['default'].createElement(
+              'div',
+              { className: 'search__filter__itinerary__country' },
+              React__default['default'].createElement(
+                'div',
+                { className: 'search__filter__itinerary__country-icon' },
+                React__default['default'].createElement(Icon$1, { name: 'ui-flag', width: 17.5, height: 20 })
+              ),
+              React__default['default'].createElement(
+                'div',
+                { className: 'search__filter__itinerary__country-content' },
+                React__default['default'].createElement(
+                  'p',
+                  null,
+                  dateFns.format(new Date(lastEntryLine.to), 'EEE. d MMM yyyy'),
+                  ' - ',
+                  React__default['default'].createElement('strong', null, translations.SRP.END)
+                )
+              )
             )
+        )
       )
     )
   );
@@ -38197,19 +38436,27 @@ var formatPrice$1 = function (price, currencyCode) {
   }).format(price);
 };
 var AccommodationFlyIn = function (_a) {
-  var _b;
-  _a.isLoading;
-  var isOpen = _a.isOpen,
-    setIsOpen = _a.setIsOpen;
+  var _b, _c;
+  var isLoading = _a.isLoading,
+    handleConfirm = _a.handleConfirm;
   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';
+  if (isLoading) {
+    return React__default['default'].createElement(
+      React__default['default'].Fragment,
+      null,
+      (_b = context === null || context === void 0 ? void 0 : context.customSpinner) !== null && _b !== void 0
+        ? _b
+        : React__default['default'].createElement(Spinner, null)
+    );
+  }
+  var language = (_c = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _c !== void 0 ? _c : 'en-GB';
   var translations = getTranslations(language);
-  var _c = reactRedux.useSelector(function (state) {
+  var _d = reactRedux.useSelector(function (state) {
       return state.searchResults;
     }),
-    packagingAccoSearchDetails = _c.packagingAccoSearchDetails,
-    selectedPackagingAccoResultCode = _c.selectedPackagingAccoResultCode;
+    packagingAccoSearchDetails = _d.packagingAccoSearchDetails,
+    selectedPackagingAccoResultCode = _d.selectedPackagingAccoResultCode;
   var selectedPackagingAccoSearchDetails = React.useMemo(
     function () {
       return packagingAccoSearchDetails === null || packagingAccoSearchDetails === void 0
@@ -38300,11 +38547,6 @@ var AccommodationFlyIn = function (_a) {
     });
     dispatch(setPackagingAccoSearchDetails(updatedPackagingAccoSearchDetails));
   };
-  var handleConfirm = function () {
-    if (isOpen) {
-      setIsOpen(false);
-    }
-  };
   if (!selectedPackagingAccoSearchDetails) {
     return null;
   }
@@ -38464,7 +38706,13 @@ var AccommodationFlyIn = function (_a) {
       React__default['default'].createElement(
         'div',
         { className: 'flyin__button-wrapper' },
-        React__default['default'].createElement('button', { className: 'cta cta--select', onClick: handleConfirm }, translations.PRODUCT.BOOK_NOW)
+        React__default['default'].createElement(
+          'button',
+          { className: 'cta cta--select', onClick: handleConfirm },
+          (context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) == build.PortalQsmType.AccommodationAndFlight
+            ? translations.QSM.CONFIRM
+            : translations.PRODUCT.BOOK_NOW
+        )
       )
     )
   );
@@ -38951,97 +39199,6 @@ var GroupTourFlyIn = function (_a) {
   );
 };
 
-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;
-  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();
-      }
-      setIsOpen(false);
-    }
-  };
-  return React__default['default'].createElement(
-    'div',
-    { className: 'flyin '.concat(isOpen ? 'flyin--active' : '', ' ').concat(className) },
-    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' }, 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' })
-          )
-        )
-      ),
-      srpType === build.PortalQsmType.Flight && React__default['default'].createElement(FlightsFlyIn, { isOpen: isOpen, setIsOpen: setIsOpen }),
-      srpType === build.PortalQsmType.Accommodation &&
-        React__default['default'].createElement(AccommodationFlyIn, { isLoading: true, isOpen: isOpen, setIsOpen: setIsOpen }),
-      srpType === build.PortalQsmType.GroupTour &&
-        React__default['default'].createElement(GroupTourFlyIn, { isLoading: detailsLoading, isOpen: isOpen, setIsOpen: setIsOpen })
-    )
-  );
-};
-
 var he$1 = { exports: {} };
 
 /*! https://mths.be/he v1.2.0 by @mathias | MIT license */
@@ -43520,6 +43677,132 @@ var HotelAccommodationResults = function (_a) {
   );
 };
 
+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 handleGoBack = function () {
+    dispatch(setAccommodationFlyInStep('results'));
+  };
+  return React__default['default'].createElement(
+    'div',
+    {
+      className: 'flyin '
+        .concat(isOpen ? 'flyin--active' : '', ' ')
+        .concat(className, ' ')
+        .concat(isPackageEditFlow ? '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' }, 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' &&
+          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) &&
+        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;
@@ -46935,42 +47218,140 @@ var applyFiltersToPackageAccoResults = function (results, filters, sortBy) {
   });
 };
 
-var SearchResultsContainer = function () {
+var getSelectedOptionsPerRoom = function (details) {
+  var _a;
+  var firstResult = details[0];
+  if (!((_a = firstResult === null || firstResult === void 0 ? void 0 : firstResult.rooms) === null || _a === void 0 ? void 0 : _a.length)) return [];
+  return firstResult.rooms.map(function (room, roomIndex) {
+    var _a;
+    var selectedOption =
+      (_a = room.options.find(function (option) {
+        return option.isSelected;
+      })) !== null && _a !== void 0
+        ? _a
+        : room.options[0];
+    return {
+      roomIndex: roomIndex,
+      option: selectedOption !== null && selectedOption !== void 0 ? selectedOption : null
+    };
+  });
+};
+var getRoomIndexFromLine = function (line) {
+  var _a, _b;
+  if (!((_a = line.pax) === null || _a === void 0 ? void 0 : _a.length)) return 0;
+  var firstPax = __spreadArray([], line.pax, true).sort(function (a, b) {
+    return a.order - b.order;
+  })[0];
+  return (_b = firstPax === null || firstPax === void 0 ? void 0 : firstPax.room) !== null && _b !== void 0 ? _b : 0;
+};
+var getRequestRoomsFromPackagingSegments = function (entry, segments) {
   var _a;
+  var accommodationLines = __spreadArray([], segments !== null && segments !== void 0 ? segments : [], true)
+    .filter(function (line) {
+      var _a;
+      return line.serviceType === ACCOMMODATION_SERVICE_TYPE && ((_a = line.pax) === null || _a === void 0 ? void 0 : _a.length) > 0;
+    })
+    .sort(function (a, b) {
+      return a.order - b.order;
+    });
+  var paxById = new Map(
+    ((_a = entry.pax) !== null && _a !== void 0 ? _a : []).map(function (p) {
+      return [p.id, p];
+    })
+  );
+  if (!accommodationLines.length) {
+    return [];
+  }
+  var roomGroups = [];
+  accommodationLines.forEach(function (line) {
+    var groupedByRoom = new Map();
+    line.pax.forEach(function (linePax) {
+      var _a, _b, _c, _d, _e, _f, _g;
+      var roomIndexWithinLine = Number((_a = linePax.room) !== null && _a !== void 0 ? _a : 0);
+      var paxId = Number(linePax.paxId);
+      var paxSource = paxById.get(paxId);
+      var pax = {
+        id: (_b = paxSource === null || paxSource === void 0 ? void 0 : paxSource.id) !== null && _b !== void 0 ? _b : paxId,
+        guid:
+          (_d = (_c = paxSource === null || paxSource === void 0 ? void 0 : paxSource.id) === null || _c === void 0 ? void 0 : _c.toString()) !== null &&
+          _d !== void 0
+            ? _d
+            : paxId.toString(),
+        firstName: (_e = paxSource === null || paxSource === void 0 ? void 0 : paxSource.firstName) !== null && _e !== void 0 ? _e : '',
+        lastName: (_f = paxSource === null || paxSource === void 0 ? void 0 : paxSource.lastName) !== null && _f !== void 0 ? _f : '',
+        dateOfBirth: (_g = paxSource === null || paxSource === void 0 ? void 0 : paxSource.dateOfBirth) !== null && _g !== void 0 ? _g : undefined,
+        age: (paxSource === null || paxSource === void 0 ? void 0 : paxSource.dateOfBirth) ? undefined : 30,
+        isMainBooker: paxSource === null || paxSource === void 0 ? void 0 : paxSource.isMainBooker,
+        email: ''
+      };
+      if (!groupedByRoom.has(roomIndexWithinLine)) {
+        groupedByRoom.set(roomIndexWithinLine, []);
+      }
+      groupedByRoom.get(roomIndexWithinLine).push(pax);
+    });
+    var sortedGroups = Array.from(groupedByRoom.entries())
+      .sort(function (_a, _b) {
+        var a = _a[0];
+        var b = _b[0];
+        return a - b;
+      })
+      .map(function (_a) {
+        var pax = _a[1];
+        return pax;
+      });
+    roomGroups.push.apply(roomGroups, sortedGroups);
+  });
+  return roomGroups.map(function (pax, index) {
+    return {
+      index: index,
+      pax: pax
+    };
+  });
+};
+
+var SearchResultsContainer = function () {
+  var _a, _b;
+  var currentSearch = typeof window !== 'undefined' ? window.location.search : '';
   var dispatch = reactRedux.useDispatch();
   var context = React.useContext(SearchResultsConfigurationContext);
   var translations = getTranslations((_a = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _a !== void 0 ? _a : 'en-GB');
-  var _b = reactRedux.useSelector(function (state) {
+  var _c = reactRedux.useSelector(function (state) {
       return state.searchResults;
     }),
-    results = _b.results,
-    filteredResults = _b.filteredResults,
-    packagingAccoResults = _b.packagingAccoResults,
-    filteredPackagingAccoResults = _b.filteredPackagingAccoResults,
-    bookingPackageDetails = _b.bookingPackageDetails,
-    entry = _b.entry,
-    isLoading = _b.isLoading,
-    filters = _b.filters,
-    selectedSortType = _b.selectedSortType,
-    selectedSearchResult = _b.selectedSearchResult,
-    selectedPackagingAccoResultCode = _b.selectedPackagingAccoResultCode,
-    flyInIsOpen = _b.flyInIsOpen;
+    results = _c.results,
+    filteredResults = _c.filteredResults,
+    packagingAccoResults = _c.packagingAccoResults,
+    filteredPackagingAccoResults = _c.filteredPackagingAccoResults,
+    bookingPackageDetails = _c.bookingPackageDetails,
+    isLoading = _c.isLoading,
+    filters = _c.filters,
+    selectedSortType = _c.selectedSortType,
+    selectedSearchResult = _c.selectedSearchResult,
+    selectedPackagingAccoResultCode = _c.selectedPackagingAccoResultCode,
+    flyInIsOpen = _c.flyInIsOpen,
+    packagingAccoSearchDetails = _c.packagingAccoSearchDetails,
+    editablePackagingEntry = _c.editablePackagingEntry,
+    transactionId = _c.transactionId,
+    accommodationFlyInStep = _c.accommodationFlyInStep;
   var isMobile = useMediaQuery('(max-width: 1200px)');
-  var _c = React.useState(false),
-    initialFiltersSet = _c[0],
-    setInitialFiltersSet = _c[1];
-  var _d = React.useState([]),
-    initialFilters = _d[0],
-    setInitialFilters = _d[1];
-  var _e = React.useState(false),
-    filtersOpen = _e[0],
-    setFiltersOpen = _e[1];
+  var _d = React.useState(false),
+    initialFiltersSet = _d[0],
+    setInitialFiltersSet = _d[1];
+  var _e = React.useState([]),
+    initialFilters = _e[0],
+    setInitialFilters = _e[1];
   var _f = React.useState(false),
-    detailsIsLoading = _f[0],
-    setDetailsIsLoading = _f[1];
+    filtersOpen = _f[0],
+    setFiltersOpen = _f[1];
   var _g = React.useState(false),
-    itineraryOpen = _g[0],
-    setItineraryOpen = _g[1];
+    detailsIsLoading = _g[0],
+    setDetailsIsLoading = _g[1];
+  var _h = React.useState(false),
+    itineraryOpen = _h[0],
+    setItineraryOpen = _h[1];
+  var _j = React.useState(null),
+    selectedAccommodationSeed = _j[0],
+    setSelectedAccommodationSeed = _j[1];
   var panelRef = React.useRef(null);
   var sortByTypes = [
     { direction: 'asc', label: 'default' },
@@ -46986,33 +47367,44 @@ var SearchResultsContainer = function () {
       dispatch(setSortType(newSortByType));
     }
   };
-  var buildSearchFromEntry = function (entry) {
+  var getRequestRooms = function (rooms) {
+    if (!rooms) {
+      // Fall back to 2 adults
+      var room = { index: 0, pax: [] };
+      lodash.range(0, 2).forEach(function () {
+        room.pax.push({
+          age: 30
+        });
+      });
+      return [room];
+    }
+    var requestRooms =
+      rooms === null || rooms === void 0
+        ? void 0
+        : rooms.map(function (x, i) {
+            var room = { index: i, pax: [] };
+            lodash.range(0, x.adults).forEach(function () {
+              room.pax.push({
+                age: 30
+              });
+            });
+            x.childAges.forEach(function (x) {
+              room.pax.push({
+                age: x
+              });
+            });
+            return room;
+          });
+    return requestRooms;
+  };
+  var buildSearchFromSeed = function (seed) {
     var _a;
-    var from = new Date(
-      Math.min.apply(
-        Math,
-        entry.items.map(function (i) {
-          return i.startDate.getTime();
-        })
-      )
-    ).toISOString();
-    var to = new Date(
-      Math.max.apply(
-        Math,
-        entry.items.map(function (i) {
-          return i.endDate.getTime();
-        })
-      )
-    ).toISOString();
-    var rooms = entry.rooms;
-    var hotelItem = entry.items.find(function (i) {
-      return i.productType === 3;
-    });
-    var country = hotelItem ? hotelItem.countryId : null;
-    var region = hotelItem ? hotelItem.regionId : null;
-    var oord = hotelItem ? hotelItem.oordId : null;
-    var city = hotelItem ? hotelItem.locationId : null;
-    var hotel = hotelItem ? hotelItem.productCode : null;
+    var country = seed.country;
+    var region = seed.region;
+    var oord = seed.oord;
+    var city = seed.location;
+    var hotel = seed.hotel;
+    var tagId = seed.tagId;
     if (typeof window !== 'undefined') {
       window.scrollTo(0, 0);
     }
@@ -47034,83 +47426,7 @@ var SearchResultsContainer = function () {
       destinationId = city;
       destinationIsLocation = true;
     }
-    var searchRequest = {
-      officeId: 1,
-      agentId: context === null || context === void 0 ? void 0 : context.agentId,
-      payload: {
-        catalogueIds: (_a = context.tideConnection.catalogueIds) !== null && _a !== void 0 ? _a : [],
-        serviceType:
-          context.searchConfiguration.qsmType === build.PortalQsmType.Accommodation ||
-          context.searchConfiguration.qsmType === build.PortalQsmType.AccommodationAndFlight
-            ? 3
-            : context.searchConfiguration.qsmType === build.PortalQsmType.Flight
-            ? 7
-            : context.searchConfiguration.qsmType === build.PortalQsmType.RoundTrip
-            ? 1
-            : 0,
-        searchType: 0,
-        destination: {
-          id: Number(destinationId),
-          isCountry: destinationIsCountry,
-          isRegion: destinationIsRegion,
-          isOord: destinationIsOord,
-          isLocation: destinationIsLocation
-        },
-        rooms: getRequestRoomsFromEntry(rooms),
-        fromDate: from,
-        toDate: to,
-        earliestFromOffset: 0,
-        latestToOffset: 0,
-        includeFlights: true,
-        regimeCodes:
-          entry.items.map(function (i) {
-            return i.regimeCode;
-          }) || [],
-        useExactDates: true,
-        onlyCachedResults: false,
-        includeAllAllotments: true,
-        productCodes: hotel ? [hotel] : []
-      }
-    };
-    return searchRequest;
-  };
-  var buildSearchFromQueryParams = function (params) {
-    var _a;
-    var from = getDateFromParams(params, 'fromDate');
-    var to = getDateFromParams(params, 'toDate');
-    var rooms = getRoomsFromParams(params, 'rooms');
-    var country = getNumberFromParams(params, 'country');
-    var region = getNumberFromParams(params, 'region');
-    var oord = getNumberFromParams(params, 'oord');
-    var city = getNumberFromParams(params, 'location');
-    var hotel = getNumberFromParams(params, 'hotel');
-    var tagId = getNumberFromParams(params, 'tagId');
-    if (!from || !to) {
-      console.error('Missing fromDate or toDate in query params, using default values');
-      return null;
-    }
-    if (typeof window !== 'undefined') {
-      window.scrollTo(0, 0);
-    }
-    var destinationId = null;
-    var destinationIsCountry = false;
-    var destinationIsRegion = false;
-    var destinationIsOord = false;
-    var destinationIsLocation = false;
-    if (country) {
-      destinationId = country;
-      destinationIsCountry = true;
-    } else if (region) {
-      destinationId = region;
-      destinationIsRegion = true;
-    } else if (oord) {
-      destinationId = oord;
-      destinationIsOord = true;
-    } else if (city) {
-      destinationId = city;
-      destinationIsLocation = true;
-    }
-    var searchRequest = {
+    return {
       officeId: 1,
       agentId: context === null || context === void 0 ? void 0 : context.agentId,
       payload: {
@@ -47118,11 +47434,11 @@ var SearchResultsContainer = function () {
         serviceType:
           context.searchConfiguration.qsmType === build.PortalQsmType.Accommodation ||
           context.searchConfiguration.qsmType === build.PortalQsmType.AccommodationAndFlight
-            ? 3
+            ? ACCOMMODATION_SERVICE_TYPE
             : context.searchConfiguration.qsmType === build.PortalQsmType.Flight
-            ? 7
+            ? FLIGHT_SERVICE_TYPE
             : context.searchConfiguration.qsmType === build.PortalQsmType.RoundTrip
-            ? 1
+            ? GROUP_TOUR_SERVICE_TYPE
             : undefined,
         searchType: context.searchConfiguration.qsmType === build.PortalQsmType.GroupTour ? 1 : 0,
         destination: {
@@ -47132,19 +47448,12 @@ var SearchResultsContainer = function () {
           isOord: destinationIsOord,
           isLocation: destinationIsLocation
         },
-        rooms: getRequestRooms(rooms),
-        fromDate: from,
-        toDate: to,
+        rooms: seed.rooms,
+        fromDate: seed.fromDate,
+        toDate: seed.toDate,
         earliestFromOffset: 0,
         latestToOffset: 0,
-        includeFlights: context.searchConfiguration.qsmType === build.PortalQsmType.AccommodationAndFlight ? true : false,
-        // regimeCodes:
-        //   filters
-        //     .find((f) => f.property === 'regime')
-        //     ?.options?.filter((o) => o.isChecked)
-        //     .flatMap((o) => o.value.toString()) || [],
-        // minPrice: filters.find((f) => f.property === 'price')?.selectedMin,
-        // maxPrice: filters.find((f) => f.property === 'price')?.selectedMax,
+        includeFlights: context.searchConfiguration.qsmType === build.PortalQsmType.AccommodationAndFlight,
         useExactDates: (context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.GroupTour ? false : true,
         onlyCachedResults: false,
         includeAllAllotments: true,
@@ -47152,82 +47461,16 @@ var SearchResultsContainer = function () {
         productTagIds: tagId ? [tagId] : []
       }
     };
-    console.log('Built search request from query params', searchRequest);
-    return searchRequest;
   };
-  var getRequestRoomsFromEntry = function (rooms) {
-    if (!rooms) {
-      // Fall back to 2 adults
-      var room = { index: 0, pax: [] };
-      lodash.range(0, 2).forEach(function () {
-        room.pax.push({
-          age: 30
-        });
-      });
-      return [room];
-    }
-    var requestRooms =
-      rooms === null || rooms === void 0
-        ? void 0
-        : rooms.map(function (x, i) {
-            var room = { index: i, pax: [] };
-            x.travellers.forEach(function (p) {
-              room.pax.push({
-                age: p.age,
-                dateOfBirth: p.dateOfBirth
-              });
-            });
-            return room;
-          });
-    return requestRooms;
-  };
-  var getRequestRooms = function (rooms) {
-    if (!rooms) {
-      // Fall back to 2 adults
-      var room = { index: 0, pax: [] };
-      lodash.range(0, 2).forEach(function () {
-        room.pax.push({
-          age: 30
-        });
-      });
-      return [room];
-    }
-    var requestRooms =
-      rooms === null || rooms === void 0
-        ? void 0
-        : rooms.map(function (x, i) {
-            var room = { index: i, pax: [] };
-            lodash.range(0, x.adults).forEach(function () {
-              room.pax.push({
-                age: 30
-              });
-            });
-            x.childAges.forEach(function (x) {
-              room.pax.push({
-                age: x
-              });
-            });
-            return room;
-          });
-    return requestRooms;
-  };
-  var buildPackagingAccommodationRequestFromQueryParams = function (params) {
-    var _a, _b;
-    var from = getDateFromParams(params, 'fromDate');
-    var to = getDateFromParams(params, 'toDate');
-    var rooms = getRoomsFromParams(params, 'rooms');
-    var country = getNumberFromParams(params, 'country');
-    var region = getNumberFromParams(params, 'region');
-    var oord = getNumberFromParams(params, 'oord');
-    var city = getNumberFromParams(params, 'location');
-    var hotel = getNumberFromParams(params, 'hotel');
-    var tagId = getNumberFromParams(params, 'tagId');
-    var agentId = getNumberFromParams(params, 'agentId');
-    var destinationAirport = getStringFromParams(params, 'destinationAirport');
-    if (!from || !to) {
-      console.error('Missing fromDate or toDate in query params, using default values');
-      return null;
-    }
+  var buildPackagingAccommodationRequestFromSeed = function (seed, currentTransactionId) {
+    var _a, _b, _c, _d;
+    var country = seed.country;
+    var region = seed.region;
+    var oord = seed.oord;
+    var city = seed.location;
+    (_a = seed.hotelCode) !== null && _a !== void 0 ? _a : seed.hotel ? seed.hotel.toString() : '';
+    var tagId = seed.tagId;
+    var destinationAirport = seed.destinationAirport;
     if (typeof window !== 'undefined') {
       window.scrollTo(0, 0);
     }
@@ -47238,31 +47481,32 @@ var SearchResultsContainer = function () {
     var destinationIsLocation = false;
     var destinationCode = null;
     var destinationIsAirport = false;
-    if (country) {
-      destinationId = country;
-      destinationIsCountry = true;
-    } else if (region) {
-      destinationId = region;
-      destinationIsRegion = true;
+    if (city) {
+      destinationId = city;
+      destinationIsLocation = true;
     } else if (oord) {
       destinationId = oord;
       destinationIsOord = true;
-    } else if (city) {
-      destinationId = city;
-      destinationIsLocation = true;
+    } else if (region) {
+      destinationId = region;
+      destinationIsRegion = true;
+    } else if (country) {
+      destinationId = country;
+      destinationIsCountry = true;
     } else if (destinationAirport) {
       destinationCode = destinationAirport;
       destinationIsAirport = true;
     }
-    var searchRequest = {
+    return {
+      transactionId: currentTransactionId,
       officeId: 1,
-      agentId: agentId !== null && agentId !== void 0 ? agentId : null,
-      catalogueId: (_a = context.searchConfiguration.defaultCatalogueId) !== null && _a !== void 0 ? _a : 0,
+      agentId: (_b = context === null || context === void 0 ? void 0 : context.agentId) !== null && _b !== void 0 ? _b : null,
+      catalogueId: (_c = context.searchConfiguration.defaultCatalogueId) !== null && _c !== void 0 ? _c : 0,
       searchConfigurationId: context.searchConfiguration.id,
-      language: (_b = context.languageCode) !== null && _b !== void 0 ? _b : 'en-GB',
-      servicesType: 3, // accommodation
-      fromDate: from,
-      toDate: to,
+      language: (_d = context.languageCode) !== null && _d !== void 0 ? _d : 'en-GB',
+      serviceType: ACCOMMODATION_SERVICE_TYPE,
+      fromDate: seed.fromDate,
+      toDate: seed.toDate,
       destination: {
         id: Number(destinationId),
         isCountry: destinationIsCountry,
@@ -47272,43 +47516,135 @@ var SearchResultsContainer = function () {
         isAirport: destinationIsAirport,
         code: destinationCode
       },
-      productCode: hotel ? hotel.toString() : '',
-      rooms: getPackagingRequestRooms(rooms),
+      productCode: '',
+      rooms: getPackagingRequestRoomsFromBookingRooms(seed.rooms),
       tagIds: tagId ? [tagId] : []
     };
-    console.log('Search request for packaging accommodation from query params', searchRequest);
-    return searchRequest;
   };
-  var getPackagingRequestRooms = function (rooms) {
-    if (!rooms) {
-      // Fall back to 2 adults
-      var room = { index: 0, travellers: [] };
-      lodash.range(0, 2).forEach(function () {
-        room.travellers.push({
-          age: 30
-        });
-      });
-      return [room];
+  var buildSearchSeedFromQueryParams = function (params) {
+    var from = getDateFromParams(params, 'fromDate');
+    var to = getDateFromParams(params, 'toDate');
+    var rooms = getRoomsFromParams(params, 'rooms');
+    var country = getNumberFromParams(params, 'country');
+    var region = getNumberFromParams(params, 'region');
+    var oord = getNumberFromParams(params, 'oord');
+    var city = getNumberFromParams(params, 'location');
+    var hotel = getNumberFromParams(params, 'hotel');
+    var tagId = getNumberFromParams(params, 'tagId');
+    var destinationAirport = getStringFromParams(params, 'destinationAirport');
+    var departureAirport = getStringFromParams(params, 'departureAirport');
+    if (!from || !to) {
+      return null;
     }
-    var requestRooms =
-      rooms === null || rooms === void 0
+    return {
+      fromDate: from,
+      toDate: to,
+      country: country,
+      region: region,
+      oord: oord,
+      location: city,
+      hotel: hotel,
+      hotelCode: hotel ? hotel.toString() : null,
+      tagId: tagId,
+      destinationAirport: destinationAirport,
+      departureAirport: departureAirport,
+      rooms: getRequestRooms(rooms)
+    };
+  };
+  var handleConfirmHotelSwap = function () {
+    var updatedEntry = swapHotelInPackagingEntry();
+    console.log('Updated entry after hotel swap', updatedEntry);
+    if (!updatedEntry) return;
+    dispatch(setEditablePackagingEntry(updatedEntry));
+    handleFlyInToggle(false);
+  };
+  var swapHotelInPackagingEntry = function () {
+    var sourceEntry =
+      editablePackagingEntry !== null && editablePackagingEntry !== void 0
+        ? editablePackagingEntry
+        : context === null || context === void 0
         ? void 0
-        : rooms.map(function (x, i) {
-            var room = { index: i, travellers: [] };
-            lodash.range(0, x.adults).forEach(function () {
-              room.travellers.push({
-                age: 30
-              });
-            });
-            x.childAges.forEach(function (x) {
-              room.travellers.push({
-                age: x
-              });
-            });
-            return room;
-          });
-    return requestRooms;
+        : context.packagingEntry;
+    var details = packagingAccoSearchDetails;
+    if (!sourceEntry || !(details === null || details === void 0 ? void 0 : details.length)) return null;
+    var selectedOptionsPerRoom = getSelectedOptionsPerRoom(details);
+    if (!selectedOptionsPerRoom.length) return null;
+    var selectedHotel = details[0];
+    var updatedLines = sourceEntry.lines.map(function (line) {
+      var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+      if (line.serviceType !== ACCOMMODATION_SERVICE_TYPE) {
+        return line;
+      }
+      // TODO: fix roomIndex
+      var roomIndex = getRoomIndexFromLine(line);
+      console.log('Processing line', line, 'with room index', roomIndex);
+      var selectedRoom = selectedOptionsPerRoom.find(function (x) {
+        return x.roomIndex === roomIndex;
+      });
+      var selectedOption = selectedRoom === null || selectedRoom === void 0 ? void 0 : selectedRoom.option;
+      if (!selectedOption) {
+        return line;
+      }
+      return __assign(__assign({}, line), {
+        guid: selectedOption.guid,
+        productName: selectedHotel.name,
+        productCode: selectedHotel.code,
+        accommodationName: selectedOption.accommodationName,
+        accommodationCode: selectedOption.accommodationCode,
+        regimeName: selectedOption.regimeName,
+        regimeCode: selectedOption.regimeCode,
+        country: line.country
+          ? __assign(__assign({}, line.country), {
+              id: (_a = selectedHotel.countryId) !== null && _a !== void 0 ? _a : line.country.id,
+              name: (_b = selectedHotel.countryName) !== null && _b !== void 0 ? _b : line.country.name
+            })
+          : selectedHotel.countryId
+          ? { id: selectedHotel.countryId, name: selectedHotel.countryName, localizations: [] }
+          : line.country,
+        region: line.region
+          ? __assign(__assign({}, line.region), {
+              id: (_c = selectedHotel.regionId) !== null && _c !== void 0 ? _c : line.region.id,
+              name: (_d = selectedHotel.regionName) !== null && _d !== void 0 ? _d : line.region.name
+            })
+          : selectedHotel.regionId
+          ? { id: selectedHotel.regionId, name: selectedHotel.regionName, localizations: [] }
+          : line.region,
+        oord: line.oord
+          ? __assign(__assign({}, line.oord), {
+              id: (_e = selectedHotel.oordId) !== null && _e !== void 0 ? _e : line.oord.id,
+              name: (_f = selectedHotel.oordName) !== null && _f !== void 0 ? _f : line.oord.name
+            })
+          : selectedHotel.oordId
+          ? { id: selectedHotel.oordId, name: selectedHotel.oordName, localizations: [] }
+          : line.oord,
+        location: line.location
+          ? __assign(__assign({}, line.location), {
+              id: (_g = selectedHotel.locationId) !== null && _g !== void 0 ? _g : line.location.id,
+              name: (_h = selectedHotel.locationName) !== null && _h !== void 0 ? _h : line.location.name
+            })
+          : selectedHotel.locationId
+          ? { id: selectedHotel.locationId, name: selectedHotel.locationName, localizations: [] }
+          : line.location,
+        latitude: (_j = selectedHotel.latitude) !== null && _j !== void 0 ? _j : line.latitude,
+        longitude: (_k = selectedHotel.longitude) !== null && _k !== void 0 ? _k : line.longitude,
+        from: (_l = selectedHotel.fromDate) !== null && _l !== void 0 ? _l : line.from,
+        to: (_m = selectedHotel.toDate) !== null && _m !== void 0 ? _m : line.to,
+        isChanged: true
+      });
+    });
+    return __assign(__assign({}, sourceEntry), { lines: updatedLines });
   };
+  var activeSearchSeed = React__default['default'].useMemo(
+    function () {
+      if (selectedAccommodationSeed) {
+        return selectedAccommodationSeed;
+      }
+      if (typeof window === 'undefined') return null;
+      var params = new URLSearchParams(window.location.search);
+      return buildSearchSeedFromQueryParams(params);
+    },
+    [selectedAccommodationSeed, currentSearch]
+  );
   React.useEffect(
     function () {
       if (typeof document !== 'undefined') {
@@ -47317,189 +47653,232 @@ var SearchResultsContainer = function () {
     },
     [filtersOpen]
   );
-  // seperate Search
-  React.useEffect(
-    function () {
-      var runSearch = function () {
-        return __awaiter(void 0, void 0, void 0, function () {
-          var config, params, entryId, entryLight, searchRequest, rq, packageSearchResults, enrichedFilters, initialFilteredResults, matching, err_1;
-          var _a;
-          return __generator(this, function (_b) {
-            switch (_b.label) {
-              case 0:
-                dispatch(setIsLoading(true));
-                _b.label = 1;
-              case 1:
-                _b.trys.push([1, 6, , 7]);
-                if (!context) {
-                  return [2 /*return*/];
-                }
-                config = {
-                  host: context.tideConnection.host,
-                  apiKey: context.tideConnection.apiKey
-                };
-                params = new URLSearchParams(location.search);
-                entryId = getStringFromParams(params, 'entryId');
-                entryLight = null;
-                searchRequest = void 0;
-                if (!entryId) return [3 /*break*/, 3];
-                return [4 /*yield*/, build.getEntryLight(config, entryId)];
-              case 2:
-                entryLight = _b.sent();
-                // populate itinerary store
-                dispatch(setEntry({ entry: entryLight }));
-                searchRequest = buildSearchFromEntry(entryLight);
-                return [3 /*break*/, 4];
-              case 3:
-                rq = buildSearchFromQueryParams(params);
-                if (!rq) {
-                  throw new Error('Invalid search parameters');
-                }
-                searchRequest = rq;
-                _b.label = 4;
-              case 4:
-                return [4 /*yield*/, build.search(config, searchRequest)];
-              case 5:
-                packageSearchResults = _b.sent();
-                console.log('Search results', packageSearchResults);
-                enrichedFilters = enrichFiltersWithResults(packageSearchResults, context.filters, (_a = context.tags) !== null && _a !== void 0 ? _a : []);
-                if (!initialFiltersSet) {
-                  dispatch(resetFilters(enrichedFilters));
-                  setInitialFilters(enrichedFilters);
-                  setInitialFiltersSet(true);
-                }
-                dispatch(setResults(packageSearchResults));
-                initialFilteredResults = applyFilters(packageSearchResults, filters, null);
-                dispatch(setFilteredResults(initialFilteredResults));
-                if ((packageSearchResults === null || packageSearchResults === void 0 ? void 0 : packageSearchResults.length) > 0) {
-                  if (entryId) {
-                    matching = packageSearchResults.find(function (r) {
-                      return r.productId === (entry === null || entry === void 0 ? void 0 : entry.id);
-                    });
-                    if (matching) {
-                      dispatch(setSelectedSearchResult(matching));
-                    }
-                  } else {
-                    if (context.searchConfiguration.qsmType === build.PortalQsmType.AccommodationAndFlight) {
-                      dispatch(setSelectedSearchResult(packageSearchResults[0]));
-                    }
-                  }
-                }
-                dispatch(setIsLoading(false));
-                return [3 /*break*/, 7];
-              case 6:
-                err_1 = _b.sent();
-                console.error('Search failed', err_1);
-                dispatch(setIsLoading(false));
-                return [3 /*break*/, 7];
-              case 7:
-                return [2 /*return*/];
+  var runSearch = function () {
+    return __awaiter(void 0, void 0, void 0, function () {
+      var config, seed, searchRequest, packageSearchResults, enrichedFilters, initialFilteredResults, err_1;
+      var _a;
+      return __generator(this, function (_b) {
+        switch (_b.label) {
+          case 0:
+            _b.trys.push([0, 2, 3, 4]);
+            if (!context) return [2 /*return*/];
+            dispatch(setIsLoading(true));
+            config = {
+              host: context.tideConnection.host,
+              apiKey: context.tideConnection.apiKey
+            };
+            seed = activeSearchSeed;
+            if (!seed) {
+              throw new Error('Invalid search parameters');
             }
-          });
-        });
-      };
-      var runHotelSearch = function () {
-        return __awaiter(void 0, void 0, void 0, function () {
-          var config, params, searchRequest, rq, packageAccoSearchResults, enrichedFilters, initialFilteredResults, err_2;
-          var _a;
-          return __generator(this, function (_b) {
-            switch (_b.label) {
-              case 0:
-                dispatch(setIsLoading(true));
-                _b.label = 1;
-              case 1:
-                _b.trys.push([1, 3, , 4]);
-                if (!context) {
-                  return [2 /*return*/];
-                }
-                config = {
-                  host: context.tideConnection.host,
-                  apiKey: context.tideConnection.apiKey
-                };
-                params = new URLSearchParams(location.search);
-                searchRequest = void 0;
-                rq = buildPackagingAccommodationRequestFromQueryParams(params);
-                if (!rq) {
-                  throw new Error('Invalid search parameters');
-                }
-                searchRequest = rq;
-                searchRequest.portalId = context.portalId;
-                searchRequest.agentId = context.agentId;
-                return [4 /*yield*/, build.searchPackagingAccommodations(config, searchRequest)];
-              case 2:
-                packageAccoSearchResults = _b.sent();
-                console.log('package Acco SearchResults', packageAccoSearchResults);
-                enrichedFilters = enrichFiltersWithPackageAccoResults(
-                  packageAccoSearchResults,
-                  context.filters,
-                  (_a = context.tags) !== null && _a !== void 0 ? _a : []
-                );
-                if (!initialFiltersSet) {
-                  dispatch(resetFilters(enrichedFilters));
-                  setInitialFilters(enrichedFilters);
-                  setInitialFiltersSet(true);
-                }
-                dispatch(setPackagingAccoResults(packageAccoSearchResults));
-                initialFilteredResults = applyFiltersToPackageAccoResults(packageAccoSearchResults, filters, null);
-                dispatch(setFilteredPackagingAccoResults(initialFilteredResults));
-                dispatch(setIsLoading(false));
-                return [3 /*break*/, 4];
-              case 3:
-                err_2 = _b.sent();
-                console.error('Search failed', err_2);
-                dispatch(setIsLoading(false));
-                return [3 /*break*/, 4];
-              case 4:
-                return [2 /*return*/];
+            searchRequest = buildSearchFromSeed(seed);
+            return [4 /*yield*/, build.search(config, searchRequest)];
+          case 1:
+            packageSearchResults = _b.sent();
+            console.log('Search results', packageSearchResults);
+            enrichedFilters = enrichFiltersWithResults(packageSearchResults, context.filters, (_a = context.tags) !== null && _a !== void 0 ? _a : []);
+            if (!initialFiltersSet) {
+              dispatch(resetFilters(enrichedFilters));
+              setInitialFilters(enrichedFilters);
+              setInitialFiltersSet(true);
             }
-          });
-        });
-      };
-      if (!(context === null || context === void 0 ? void 0 : context.showMockup)) {
-        if (
-          (context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.GroupTour ||
-          ((context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.AccommodationAndFlight &&
-            !context.searchConfiguration.enableManualPackaging)
-        ) {
-          runSearch();
+            dispatch(setResults(packageSearchResults));
+            initialFilteredResults = applyFilters(packageSearchResults, filters, null);
+            dispatch(setFilteredResults(initialFilteredResults));
+            if ((packageSearchResults === null || packageSearchResults === void 0 ? void 0 : packageSearchResults.length) > 0) {
+              if (context.searchConfiguration.qsmType === build.PortalQsmType.AccommodationAndFlight) {
+                dispatch(setSelectedSearchResult(packageSearchResults[0]));
+              }
+            }
+            return [3 /*break*/, 4];
+          case 2:
+            err_1 = _b.sent();
+            console.error('Search failed', err_1);
+            return [3 /*break*/, 4];
+          case 3:
+            dispatch(setIsLoading(false));
+            return [7 /*endfinally*/];
+          case 4:
+            return [2 /*return*/];
         }
-        if ((context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.Accommodation) {
-          runHotelSearch();
+      });
+    });
+  };
+  var runStartTransaction = function () {
+    return __awaiter(void 0, void 0, void 0, function () {
+      var config, transaction, err_2;
+      return __generator(this, function (_a) {
+        switch (_a.label) {
+          case 0:
+            _a.trys.push([0, 2, , 3]);
+            if (!context) return [2 /*return*/, null];
+            config = {
+              host: context.tideConnection.host,
+              apiKey: context.tideConnection.apiKey
+            };
+            return [4 /*yield*/, build.startTransaction(config)];
+          case 1:
+            transaction = _a.sent();
+            console.log('Transaction started', transaction);
+            dispatch(setTransactionId(transaction.transactionId));
+            return [2 /*return*/, transaction.transactionId];
+          case 2:
+            err_2 = _a.sent();
+            console.error('Transaction failed', err_2);
+            return [2 /*return*/, null];
+          case 3:
+            return [2 /*return*/];
         }
-        if (
-          (context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.AccommodationAndFlight &&
-          context.searchConfiguration.enableManualPackaging
-        ) {
-          // Manual packaging flow.
-          if (context.searchConfiguration.allowAccommodations) {
-            runHotelSearch();
-          }
+      });
+    });
+  };
+  var runHotelSearch = function (currentTransactionId, seed) {
+    return __awaiter(void 0, void 0, void 0, function () {
+      var config, searchRequest, packageAccoSearchResults, enrichedFilters, initialFilteredResults, err_3;
+      var _a;
+      return __generator(this, function (_b) {
+        switch (_b.label) {
+          case 0:
+            _b.trys.push([0, 2, , 3]);
+            if (!context) return [2 /*return*/];
+            dispatch(setIsLoading(true));
+            config = {
+              host: context.tideConnection.host,
+              apiKey: context.tideConnection.apiKey
+            };
+            searchRequest = buildPackagingAccommodationRequestFromSeed(seed, currentTransactionId);
+            searchRequest.portalId = context.portalId;
+            searchRequest.agentId = context.agentId;
+            console.log('Packaging accommodation search request', searchRequest);
+            return [4 /*yield*/, build.searchPackagingAccommodations(config, searchRequest)];
+          case 1:
+            packageAccoSearchResults = _b.sent();
+            enrichedFilters = enrichFiltersWithPackageAccoResults(
+              packageAccoSearchResults,
+              context.filters,
+              (_a = context.tags) !== null && _a !== void 0 ? _a : []
+            );
+            if (!initialFiltersSet) {
+              dispatch(resetFilters(enrichedFilters));
+              setInitialFilters(enrichedFilters);
+              setInitialFiltersSet(true);
+            }
+            dispatch(setPackagingAccoResults(packageAccoSearchResults));
+            initialFilteredResults = applyFiltersToPackageAccoResults(packageAccoSearchResults, filters, null);
+            dispatch(setFilteredPackagingAccoResults(initialFilteredResults));
+            dispatch(setIsLoading(false));
+            return [3 /*break*/, 3];
+          case 2:
+            err_3 = _b.sent();
+            console.error('Search failed', err_3);
+            dispatch(setIsLoading(false));
+            return [3 /*break*/, 3];
+          case 3:
+            return [2 /*return*/];
         }
+      });
+    });
+  };
+  var runAccommodationFlow = function (seed) {
+    return __awaiter(void 0, void 0, void 0, function () {
+      var currentTransactionId;
+      var _a;
+      return __generator(this, function (_b) {
+        switch (_b.label) {
+          case 0:
+            if (!context || context.showMockup) return [2 /*return*/];
+            currentTransactionId =
+              ((_a = context === null || context === void 0 ? void 0 : context.packagingEntry) === null || _a === void 0 ? void 0 : _a.transactionId) ||
+              transactionId;
+            console.log('Current transaction ID', currentTransactionId);
+            if (!!currentTransactionId) return [3 /*break*/, 2];
+            dispatch(setIsLoading(true));
+            return [4 /*yield*/, runStartTransaction()];
+          case 1:
+            currentTransactionId = _b.sent();
+            _b.label = 2;
+          case 2:
+            if (!currentTransactionId) {
+              dispatch(setIsLoading(false));
+              return [2 /*return*/];
+            }
+            return [4 /*yield*/, runHotelSearch(currentTransactionId, seed)];
+          case 3:
+            _b.sent();
+            return [2 /*return*/];
+        }
+      });
+    });
+  };
+  // separate Search
+  React.useEffect(
+    function () {
+      if (
+        (context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.GroupTour ||
+        ((context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.AccommodationAndFlight &&
+          !context.searchConfiguration.enableManualPackaging)
+      ) {
+        runSearch();
+      }
+      if ((context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.Accommodation) {
+        var seed = activeSearchSeed;
+        if (seed) {
+          runAccommodationFlow(seed);
+        }
+      }
+      if (
+        (context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.AccommodationAndFlight &&
+        context.searchConfiguration.enableManualPackaging &&
+        context.searchConfiguration.allowAccommodations &&
+        !(context === null || context === void 0 ? void 0 : context.packagingEntry)
+      ) {
+        var seed = activeSearchSeed;
+        if (seed) {
+          runAccommodationFlow(seed);
+        }
+      }
+    },
+    [
+      location.search,
+      context === null || context === void 0 ? void 0 : context.showMockup,
+      context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType,
+      context === null || context === void 0 ? void 0 : context.searchConfiguration.enableManualPackaging,
+      context === null || context === void 0 ? void 0 : context.searchConfiguration.allowAccommodations,
+      (_b = context === null || context === void 0 ? void 0 : context.packagingEntry) === null || _b === void 0 ? void 0 : _b.transactionId,
+      activeSearchSeed
+    ]
+  );
+  React.useEffect(
+    function () {
+      if (context === null || context === void 0 ? void 0 : context.packagingEntry) {
+        console.log('original packaging entry from context', context.packagingEntry);
+        dispatch(setEditablePackagingEntry(structuredClone(context.packagingEntry)));
+        dispatch(setTransactionId(context.packagingEntry.transactionId));
       }
     },
-    [location.search]
+    [context === null || context === void 0 ? void 0 : context.packagingEntry]
   );
-  // Seperate detailsCall
+  // separate detailsCall
   React.useEffect(
     function () {
       var fetchDetails = function () {
         return __awaiter(void 0, void 0, void 0, function () {
-          var config, selectedItem, params, entryId, requestRooms, rooms, detailsRequest, detailsResponse, detailsResponse, err_3;
-          return __generator(this, function (_a) {
-            switch (_a.label) {
+          var config, selectedItem, requestRooms, seed, detailsRequest, detailsResponse, err_4;
+          var _a;
+          return __generator(this, function (_b) {
+            switch (_b.label) {
               case 0:
-                setDetailsIsLoading(true);
-                console.log('Fetching details for selected search result', selectedSearchResult);
                 if (!selectedSearchResult || !context) return [2 /*return*/];
+                setDetailsIsLoading(true);
                 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.GroupTour
                 ) {
                   handleFlyInToggle(true);
                 }
-                _a.label = 1;
+                _b.label = 1;
               case 1:
-                _a.trys.push([1, 6, , 7]);
+                _b.trys.push([1, 3, , 4]);
                 config = {
                   host: context.tideConnection.host,
                   apiKey: context.tideConnection.apiKey
@@ -47511,14 +47890,14 @@ var SearchResultsContainer = function () {
                   // TODO: handle this case better, show an error message to the user
                   return [2 /*return*/];
                 }
-                params = new URLSearchParams(location.search);
-                entryId = getStringFromParams(params, 'entryId');
                 requestRooms = void 0;
-                if (entry && entryId) {
-                  requestRooms = getRequestRoomsFromEntry(entry.rooms);
+                if (context === null || context === void 0 ? void 0 : context.packagingEntry) {
+                  requestRooms = getRequestRoomsFromPackagingEntry(context.packagingEntry);
                 } else {
-                  rooms = getRoomsFromParams(params, 'rooms');
-                  requestRooms = getRequestRooms(rooms);
+                  seed = activeSearchSeed;
+                  requestRooms = ((_a = seed === null || seed === void 0 ? void 0 : seed.rooms) === null || _a === void 0 ? void 0 : _a.length)
+                    ? seed.rooms
+                    : getRequestRooms(null);
                 }
                 detailsRequest = {
                   officeId: 1,
@@ -47540,29 +47919,18 @@ var SearchResultsContainer = function () {
                   },
                   agentId: context.agentId
                 };
-                if (!(entry && entryId)) return [3 /*break*/, 3];
-                requestRooms = getRequestRoomsFromEntry(entry.rooms);
                 return [4 /*yield*/, build.details(config, detailsRequest)];
               case 2:
-                detailsResponse = _a.sent();
-                console.log('Details:', detailsResponse);
-                dispatch(setBookingPackageDetails({ details: detailsResponse === null || detailsResponse === void 0 ? void 0 : detailsResponse.payload }));
-                return [3 /*break*/, 5];
-              case 3:
-                return [4 /*yield*/, build.details(config, detailsRequest)];
-              case 4:
-                detailsResponse = _a.sent();
+                detailsResponse = _b.sent();
                 dispatch(setBookingPackageDetails({ details: detailsResponse === null || detailsResponse === void 0 ? void 0 : detailsResponse.payload }));
                 setDetailsIsLoading(false);
-                _a.label = 5;
-              case 5:
-                return [3 /*break*/, 7];
-              case 6:
-                err_3 = _a.sent();
-                console.error('Failed to fetch package details', err_3);
+                return [3 /*break*/, 4];
+              case 3:
+                err_4 = _b.sent();
+                console.error('Failed to fetch package details', err_4);
                 setDetailsIsLoading(false);
-                return [3 /*break*/, 7];
-              case 7:
+                return [3 /*break*/, 4];
+              case 4:
                 return [2 /*return*/];
             }
           });
@@ -47572,8 +47940,7 @@ var SearchResultsContainer = function () {
         return __awaiter(void 0, void 0, void 0, function () {
           var config,
             selectedItem,
-            params,
-            rooms,
+            seed,
             tagId,
             destinationAirport,
             destinationId,
@@ -47585,38 +47952,37 @@ var SearchResultsContainer = function () {
             destinationIsAirport,
             detailSearchRequest,
             packageAccoSearchDetails,
-            err_4;
-          var _a, _b;
-          return __generator(this, function (_c) {
-            switch (_c.label) {
+            err_5;
+          var _a, _b, _c, _d, _e;
+          return __generator(this, function (_f) {
+            switch (_f.label) {
               case 0:
                 if (!selectedPackagingAccoResultCode || !context) return [2 /*return*/];
+                setDetailsIsLoading(true);
                 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 ||
                   (context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.GroupTour
                 ) {
                   handleFlyInToggle(true);
                 }
-                _c.label = 1;
+                _f.label = 1;
               case 1:
-                _c.trys.push([1, 3, , 4]);
+                _f.trys.push([1, 3, , 4]);
                 config = {
                   host: context.tideConnection.host,
                   apiKey: context.tideConnection.apiKey
                 };
-                console.log('selectedPackagingAccoResultCode', selectedPackagingAccoResultCode);
                 selectedItem = packagingAccoResults.find(function (r) {
                   return r.code === selectedPackagingAccoResultCode;
                 });
-                console.log('Selected packaging acco item', selectedItem);
                 if (!selectedItem) {
                   // TODO: handle this case better, show an error message to the user
                   return [2 /*return*/];
                 }
-                params = new URLSearchParams(location.search);
-                rooms = getRoomsFromParams(params, 'rooms');
-                tagId = getNumberFromParams(params, 'tagId');
-                destinationAirport = getStringFromParams(params, 'destinationAirport');
+                seed = activeSearchSeed;
+                tagId = (_a = seed === null || seed === void 0 ? void 0 : seed.tagId) !== null && _a !== void 0 ? _a : null;
+                destinationAirport = (_b = seed === null || seed === void 0 ? void 0 : seed.destinationAirport) !== null && _b !== void 0 ? _b : null;
                 destinationId = null;
                 destinationIsCountry = false;
                 destinationIsRegion = false;
@@ -47641,14 +48007,15 @@ var SearchResultsContainer = function () {
                   destinationIsAirport = true;
                 }
                 detailSearchRequest = {
+                  transactionId: transactionId !== null && transactionId !== void 0 ? transactionId : '',
                   officeId: 1,
                   portalId: context.portalId,
                   agentId: context.agentId,
-                  catalogueId: (_a = context.searchConfiguration.defaultCatalogueId) !== null && _a !== void 0 ? _a : 0,
+                  catalogueId: (_c = context.searchConfiguration.defaultCatalogueId) !== null && _c !== void 0 ? _c : 0,
                   searchConfigurationId: context.searchConfiguration.id,
                   vendorConfigurationId: selectedItem.vendorId,
-                  language: (_b = context.languageCode) !== null && _b !== void 0 ? _b : 'en-GB',
-                  serviceType: 3,
+                  language: (_d = context.languageCode) !== null && _d !== void 0 ? _d : 'en-GB',
+                  serviceType: ACCOMMODATION_SERVICE_TYPE,
                   fromDate: selectedItem.fromDate,
                   toDate: selectedItem.toDate,
                   destination: {
@@ -47661,18 +48028,22 @@ var SearchResultsContainer = function () {
                     code: destinationCode
                   },
                   productCode: selectedItem.code ? selectedItem.code : '',
-                  rooms: getPackagingRequestRooms(rooms),
+                  rooms: getPackagingRequestRoomsFromBookingRooms(
+                    (_e = seed === null || seed === void 0 ? void 0 : seed.rooms) !== null && _e !== void 0 ? _e : null
+                  ),
                   tagIds: tagId ? [tagId] : []
                 };
                 return [4 /*yield*/, build.searchPackagingAccommodations(config, detailSearchRequest)];
               case 2:
-                packageAccoSearchDetails = _c.sent();
+                packageAccoSearchDetails = _f.sent();
                 console.log('Packaging Acco Search details', packageAccoSearchDetails);
                 dispatch(setPackagingAccoSearchDetails(packageAccoSearchDetails));
+                setDetailsIsLoading(false);
                 return [3 /*break*/, 4];
               case 3:
-                err_4 = _c.sent();
-                console.error('Failed to fetch package details', err_4);
+                err_5 = _f.sent();
+                console.error('Failed to fetch package details', err_5);
+                setDetailsIsLoading(false);
                 return [3 /*break*/, 4];
               case 4:
                 return [2 /*return*/];
@@ -47686,6 +48057,7 @@ var SearchResultsContainer = function () {
       if (selectedPackagingAccoResultCode) {
         fetchPackagingAccoSearchDetails();
       }
+      dispatch(setAccommodationFlyInStep('details'));
     },
     [selectedSearchResult, selectedPackagingAccoResultCode]
   );
@@ -47701,6 +48073,64 @@ var SearchResultsContainer = function () {
     },
     [filters, results, packagingAccoResults, selectedSortType]
   );
+  React.useEffect(
+    function () {
+      setInitialFiltersSet(false);
+    },
+    [activeSearchSeed]
+  );
+  var handleEditAccommodation = function (segments) {
+    return __awaiter(void 0, void 0, void 0, function () {
+      var sourceEntry, seed;
+      return __generator(this, function (_a) {
+        switch (_a.label) {
+          case 0:
+            sourceEntry =
+              editablePackagingEntry !== null && editablePackagingEntry !== void 0
+                ? editablePackagingEntry
+                : context === null || context === void 0
+                ? void 0
+                : context.packagingEntry;
+            if (!sourceEntry) return [2 /*return*/];
+            seed = buildSearchSeedFromAccommodationSegments(sourceEntry, segments);
+            if (!seed) return [2 /*return*/];
+            setDetailsIsLoading(true);
+            setSelectedAccommodationSeed(seed);
+            dispatch(setAccommodationFlyInStep('results'));
+            handleFlyInToggle(true);
+            return [4 /*yield*/, runAccommodationFlow(seed)];
+          case 1:
+            _a.sent();
+            setDetailsIsLoading(false);
+            return [2 /*return*/];
+        }
+      });
+    });
+  };
+  var buildSearchSeedFromAccommodationSegments = function (entry, segments) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+    if (!(segments === null || segments === void 0 ? void 0 : segments.length)) return null;
+    var sortedSegments = __spreadArray([], segments, true).sort(function (a, b) {
+      return new Date(a.from).getTime() - new Date(b.from).getTime();
+    });
+    var firstSegment = lodash.first(sortedSegments);
+    var lastSegment = lodash.last(sortedSegments);
+    if (!firstSegment || !lastSegment) return null;
+    return {
+      fromDate: toDateOnlyString(firstSegment.from),
+      toDate: toDateOnlyString(lastSegment.to),
+      country: (_b = (_a = firstSegment.country) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : null,
+      region: (_d = (_c = firstSegment.region) === null || _c === void 0 ? void 0 : _c.id) !== null && _d !== void 0 ? _d : null,
+      oord: (_f = (_e = firstSegment.oord) === null || _e === void 0 ? void 0 : _e.id) !== null && _f !== void 0 ? _f : null,
+      location: (_h = (_g = firstSegment.location) === null || _g === void 0 ? void 0 : _g.id) !== null && _h !== void 0 ? _h : null,
+      hotel: parseHotelId(firstSegment),
+      hotelCode: (_j = firstSegment.productCode) !== null && _j !== void 0 ? _j : null,
+      tagId: null,
+      destinationAirport: getDestinationAirportFromEntry((_k = entry.lines) !== null && _k !== void 0 ? _k : []),
+      departureAirport: getDepartureAirportFromEntry((_l = entry.lines) !== null && _l !== void 0 ? _l : []),
+      rooms: getRequestRoomsFromPackagingSegments(entry, sortedSegments)
+    };
+  };
   return React__default['default'].createElement(
     'div',
     { id: 'tide-booking', className: 'search__bg' },
@@ -47752,7 +48182,8 @@ var SearchResultsContainer = function () {
                   handleSetIsOpen: function () {
                     return setItineraryOpen(!itineraryOpen);
                   },
-                  isLoading: isLoading
+                  isLoading: isLoading,
+                  onEditAccommodation: handleEditAccommodation
                 }),
               React__default['default'].createElement(
                 'div',
@@ -47817,6 +48248,7 @@ var SearchResultsContainer = function () {
                     'span',
                     { className: 'search__result-row-text' },
                     !isLoading &&
+                      !context.packagingEntry &&
                       React__default['default'].createElement(
                         React__default['default'].Fragment,
                         null,
@@ -47832,7 +48264,8 @@ var SearchResultsContainer = function () {
                         translations.SRP.TOTAL_RESULTS_LABEL
                       )
                   ),
-                  !isMobile &&
+                  !context.packagingEntry &&
+                    !isMobile &&
                     sortByTypes &&
                     sortByTypes.length > 0 &&
                     React__default['default'].createElement(
@@ -47860,25 +48293,35 @@ var SearchResultsContainer = function () {
                 React__default['default'].createElement(
                   'div',
                   { className: 'search__results__wrapper' },
-                  context.showTabViews && React__default['default'].createElement(TabViews, null),
+                  context.showTabViews &&
+                    (context.searchConfiguration.qsmType === build.PortalQsmType.GroupTour ||
+                      context.searchConfiguration.qsmType === build.PortalQsmType.Accommodation) &&
+                    React__default['default'].createElement(TabViews, null),
                   context.showRoundTripResults && context.showMockup && React__default['default'].createElement(RoundTripResults, null),
                   context.searchConfiguration.qsmType === build.PortalQsmType.GroupTour &&
                     React__default['default'].createElement(GroupTourResults, { isLoading: isLoading }),
                   context.searchConfiguration.qsmType === build.PortalQsmType.AccommodationAndFlight &&
+                    !context.packagingEntry &&
                     context.showFlightResults &&
                     (bookingPackageDetails === null || bookingPackageDetails === void 0 ? void 0 : bookingPackageDetails.outwardFlights) &&
                     React__default['default'].createElement(FlightResults, {
                       flights: bookingPackageDetails === null || bookingPackageDetails === void 0 ? void 0 : bookingPackageDetails.outwardFlights,
                       isDeparture: true
                     }),
-                  context.showHotelAccommodationResults && React__default['default'].createElement(HotelAccommodationResults, { isLoading: isLoading }),
+                  context.showHotelAccommodationResults &&
+                    !context.packagingEntry &&
+                    React__default['default'].createElement(HotelAccommodationResults, { isLoading: isLoading }),
                   context.searchConfiguration.qsmType === build.PortalQsmType.AccommodationAndFlight &&
+                    !context.packagingEntry &&
                     context.showFlightResults &&
                     (bookingPackageDetails === null || bookingPackageDetails === void 0 ? void 0 : bookingPackageDetails.returnFlights) &&
                     React__default['default'].createElement(FlightResults, {
                       flights: bookingPackageDetails === null || bookingPackageDetails === void 0 ? void 0 : bookingPackageDetails.returnFlights,
                       isDeparture: false
-                    })
+                    }),
+                  context.searchConfiguration.qsmType === build.PortalQsmType.AccommodationAndFlight &&
+                    context.packagingEntry &&
+                    React__default['default'].createElement('span', null, 'TODO: Show Full Itinerary here')
                 )
               ),
               React__default['default'].createElement(FlyIn, {
@@ -47886,10 +48329,15 @@ var SearchResultsContainer = function () {
                 srpType: context.searchConfiguration.qsmType,
                 isOpen: flyInIsOpen,
                 setIsOpen: handleFlyInToggle,
+                handleConfirm: function () {
+                  return handleConfirmHotelSwap();
+                },
                 onPanelRef: function (el) {
                   return (panelRef.current = el);
                 },
-                detailsLoading: detailsIsLoading
+                detailsLoading: detailsIsLoading,
+                accommodationStep: accommodationFlyInStep,
+                isPackageEditFlow: !!context.packagingEntry
               })
             )
         )