@qite/tide-components 1.0.4 → 1.0.6

package/build/build-cjs/index.js

@@ -22890,6 +22890,10 @@ const NAME_CHARACTERS_REGEX = /^[\p{L}\s-]+$/u;
 function hasInvalidNameCharacters(name) {
     return !NAME_CHARACTERS_REGEX.test(name);
 }
+// Rejects values like a 5-digit year, which the native date input allows while typing
+function isValidBirthDate(birthDateText) {
+    return dateFns.isValid(dateFns.parse(birthDateText, 'yyyy-MM-dd', new Date()));
+}
 function getAge(birthDateText, startDateText) {
     var birthDate = new Date(birthDateText);
     var startDate = new Date(startDateText);
@@ -22957,7 +22961,7 @@ const validateForm$1 = (values, agentRequired, bookingType, translations, formFi
             }
         }
         if (isFormFieldPresent('birthDate')) {
-            if (lodash.isEmpty(adult.birthDate)) {
+            if (lodash.isEmpty(adult.birthDate) || !isValidBirthDate(adult.birthDate)) {
                 lodash.set(errors, `rooms[${rIndex}].adults[${index}].birthDate`, formatTravelerField(rIndex + 1, index + 1, translations.TRAVELERS_FORM.BIRTHDATE));
             }
             else if (values.endDate) {
@@ -22990,7 +22994,7 @@ const validateForm$1 = (values, agentRequired, bookingType, translations, formFi
             }
         }
         if (isFormFieldPresent('birthDate')) {
-            if (lodash.isEmpty(child.birthDate)) {
+            if (lodash.isEmpty(child.birthDate) || !isValidBirthDate(child.birthDate)) {
                 lodash.set(errors, `rooms[${rIndex}].children[${index}].birthDate`, formatTravelerField(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.BIRTHDATE));
             }
             else if (child.isBaby && values.startDate) {
@@ -23215,6 +23219,13 @@ const TypeAheadInput = ({ name, value, placeholder, options, onChange, onSelect,
 function isBabyAge(age, maxBabyAge = BABY_MAX_AGE) {
     return typeof age === 'number' && age <= maxBabyAge;
 }
+// The native date input can hold values format() throws on (e.g. a 5+ digit year while typing), so never format an unvalidated birthDate
+function formatBirthDate$1(birthDate) {
+    if (!birthDate)
+        return '';
+    const parsed = dateFns.parse(birthDate, 'yyyy-MM-dd', new Date());
+    return dateFns.isValid(parsed) ? dateFns.format(parsed, 'dd-MM-yyyy') : '';
+}
 function createTraveler(traveler, followNumber, personTranslation, isCompact, maxBabyAge) {
     if (isCompact) {
         return {
@@ -23522,10 +23533,7 @@ const SharedTravelersForm = ({ formik, translations, travellersSettings, countri
             !useCompactForm && (bookingType !== 'b2b' || travellersSettings?.mainBookerFormFields?.length) ? (React__default["default"].createElement("div", { className: "form__region" },
                 React__default["default"].createElement("div", { className: "form__region-header" },
                     React__default["default"].createElement("h5", { className: "form__region-heading" }, translations.TRAVELERS_FORM.MAIN_BOOKER),
-                    React__default["default"].createElement("p", { className: "form__region-label" }, lodash.compact([
-                        lodash.compact([mainBooker?.firstName, mainBooker?.lastName]).join(' '),
-                        mainBooker?.birthDate && dateFns.format(dateFns.parse(mainBooker.birthDate, 'yyyy-MM-dd', new Date()), 'dd-MM-yyyy')
-                    ]).join(', '))),
+                    React__default["default"].createElement("p", { className: "form__region-label" }, lodash.compact([lodash.compact([mainBooker?.firstName, mainBooker?.lastName]).join(' '), formatBirthDate$1(mainBooker?.birthDate)]).join(', '))),
                 travellersSettings?.mainBookerFormFields?.length ? (React__default["default"].createElement("div", { className: "main-booker-form__grid" }, travellersSettings.mainBookerFormFields.map((field, index) => (React__default["default"].createElement("div", { key: index, className: `control control--${field.type}` }, getControl(field.type, {}, field.type)))))) : (React__default["default"].createElement(React__default["default"].Fragment, null,
                     React__default["default"].createElement("div", { className: "form__twocolumn" },
                         React__default["default"].createElement("div", { className: "form__twocolumn-column" },
@@ -27370,7 +27378,8 @@ const initialState$1 = {
     currentStep: 0,
     bookingNumber: undefined,
     trajectNodeAvailability: {},
-    trajectFlightAvailability: {}
+    trajectFlightAvailability: {},
+    trajectEditLineGuid: null
 };
 const searchResultsSlice = toolkit.createSlice({
     name: 'searchResults',
@@ -27617,13 +27626,26 @@ const searchResultsSlice = toolkit.createSlice({
             flight.selectedGuid = action.payload.guid;
             flight.status = 'resolved';
         },
+        setTrajectEditLineGuid(state, action) {
+            state.trajectEditLineGuid = action.payload;
+        },
+        updateTrajectNodeResult(state, action) {
+            const { lineGuid, result } = action.payload;
+            const node = state.trajectNodeAvailability[lineGuid];
+            if (!node)
+                return;
+            node.results = node.results.map((x) => (x.code === result.code ? result : x));
+            node.selectedCode = result.code;
+            node.status = 'resolved';
+        },
         resetTrajectAvailability(state) {
             state.trajectNodeAvailability = {};
             state.trajectFlightAvailability = {};
+            state.trajectEditLineGuid = null;
         }
     }
 });
-const { setResults, setFilteredResults, setSelectedSearchResult, setPackagingAccoResults, setFilteredPackagingAccoResults, setFilteredPackagingFlightResults, setPackagingAccoSearchDetails, setSelectedPackagingAccoResult, setPackagingFlightResults, setSelectedPackagingFlight, setSelectedFlight, setSelectedFlightDetails, setBookingPackageDetails, selectFlight, setIsLoading, setFlightsLoading, setInitialFilters, setFilters, resetFilters, setInitialFlightFilters, setFlightFilters, resetFlightFilters, setSortType, setFlightSortType, setActiveTab, setCurrentPage, resetSearchState, setFlyInIsOpen, setEditablePackagingEntry, setTransactionId, setFlyInType, setPriceDetails, setItinerary, setSelectedOutwardKey, setSelectedReturnKey, resetFlightSelection, setExcursionSearchParams, setSelectedExcursionSearchResult, confirmExcursionForDay, removeConfirmedExcursionForDay, clearConfirmedExcursionsForDay, setBookPackagingEntry, setCurrentStep, setBookingNumber, setTrajectNodeLoading, setTrajectNodeAvailability, setTrajectNodeSelection, setTrajectFlightLoading, setTrajectFlightAvailability, setTrajectFlightSelection, resetTrajectAvailability, updateEditableEntryLine, removeEditableEntryLines } = searchResultsSlice.actions;
+const { setResults, setFilteredResults, setSelectedSearchResult, setPackagingAccoResults, setFilteredPackagingAccoResults, setFilteredPackagingFlightResults, setPackagingAccoSearchDetails, setSelectedPackagingAccoResult, setPackagingFlightResults, setSelectedPackagingFlight, setSelectedFlight, setSelectedFlightDetails, setBookingPackageDetails, selectFlight, setIsLoading, setFlightsLoading, setInitialFilters, setFilters, resetFilters, setInitialFlightFilters, setFlightFilters, resetFlightFilters, setSortType, setFlightSortType, setActiveTab, setCurrentPage, resetSearchState, setFlyInIsOpen, setEditablePackagingEntry, setTransactionId, setFlyInType, setPriceDetails, setItinerary, setSelectedOutwardKey, setSelectedReturnKey, resetFlightSelection, setExcursionSearchParams, setSelectedExcursionSearchResult, confirmExcursionForDay, removeConfirmedExcursionForDay, clearConfirmedExcursionsForDay, setBookPackagingEntry, setCurrentStep, setBookingNumber, setTrajectNodeLoading, setTrajectNodeAvailability, setTrajectNodeSelection, setTrajectFlightLoading, setTrajectFlightAvailability, setTrajectFlightSelection, setTrajectEditLineGuid, updateTrajectNodeResult, resetTrajectAvailability, updateEditableEntryLine, removeEditableEntryLines } = searchResultsSlice.actions;
 var searchResultsReducer = searchResultsSlice.reducer;
 
 const ItemPicker = ({ items, selection, selectedSortByType, label, placeholder, classModifier, onPick, valueFormatter }) => {
@@ -30603,6 +30625,293 @@ const ExcursionDetails = () => {
             React__default["default"].createElement("button", { type: "button", className: "cta cta--primary", onClick: handleConfirm }, translations?.QSM.CONFIRM))));
 };
 
+const REGULAR_TRAJECT_NODE_TYPE = 0;
+const isSearchableTrajectNode = (node) => node.serviceType === ACCOMMODATION_SERVICE_TYPE || node.serviceType === EXCURSION_SERVICE_TYPE;
+const isTrajectFlightNode = (node) => node.serviceType === FLIGHT_SERVICE_TYPE;
+const getTrajectNodesWithLines = (trajectEntry) => {
+    const linesByGuid = new Map((trajectEntry.entry.lines ?? []).map((line) => [line.guid, line]));
+    return [...(trajectEntry.nodes ?? [])]
+        .sort((a, b) => a.dayOrder - b.dayOrder || a.order - b.order)
+        .map((node) => {
+        const guids = node.lineGuids?.length ? node.lineGuids : [node.lineGuid];
+        const lines = guids.map((guid) => linesByGuid.get(guid)).filter((x) => !!x);
+        return { node, line: lines[0], lines };
+    })
+        .filter((x) => !!x.line);
+};
+const buildDestination = (line) => {
+    if (line.location?.id)
+        return { id: line.location.id, isLocation: true };
+    if (line.oord?.id)
+        return { id: line.oord.id, isOord: true };
+    if (line.region?.id)
+        return { id: line.region.id, isRegion: true };
+    if (line.country?.id)
+        return { id: line.country.id, isCountry: true };
+    if (line.latitude && line.longitude)
+        return { latitude: line.latitude, longitude: line.longitude };
+    return { id: 0 };
+};
+const buildTrajectNodeRequest = ({ node, line }, context, productCode) => ({
+    transactionId: context.transactionId,
+    officeId: context.officeId,
+    agentId: context.agentId ?? null,
+    catalogueId: context.catalogueId,
+    searchConfigurationId: context.searchConfigurationId,
+    portalId: context.portalId ?? null,
+    vendorConfigurationId: node.externalVendorId ?? null,
+    language: context.language,
+    serviceType: node.serviceType,
+    fromDate: toDateOnlyString(line.from),
+    toDate: toDateOnlyString(line.to),
+    destination: buildDestination(line),
+    productCode,
+    rooms: context.rooms,
+    tagIds: []
+});
+const getNodeCandidates = (node) => {
+    const configured = (node.alternatives ?? []).filter((x) => !!x.code && x.code.trim().length > 0);
+    if (configured.length)
+        return configured;
+    const fallbackCode = node.code ?? node.preferredAccommodationCode;
+    if (!fallbackCode || !fallbackCode.trim().length)
+        return [];
+    return [
+        {
+            code: fallbackCode,
+            name: node.name,
+            description: node.description,
+            imageUrl: node.imageUrl,
+            contentSource: node.contentSource,
+            vendor: node.vendor,
+            externalVendorId: node.externalVendorId,
+            isPreferred: true
+        }
+    ];
+};
+const findCandidateForResult = (node, result) => getNodeCandidates(node).find((candidate) => matchesCode(result, candidate.code)) ?? null;
+const matchesCode = (result, code) => {
+    if (result.code === code)
+        return true;
+    return (result.rooms ?? []).some((room) => (room.options ?? []).some((option) => option.accommodationCode === code));
+};
+const getPackagingRoomsFromEntry = (entry) => {
+    const paxById = new Map((entry.pax ?? []).map((p) => [p.id, p]));
+    const rooms = (entry.rooms ?? []).map((room) => ({
+        travellers: (room.paxIds ?? []).map((paxId) => {
+            const pax = paxById.get(paxId);
+            return {
+                id: paxId,
+                age: pax?.age ?? null,
+                dateOfBirth: pax?.dateOfBirth ?? null
+            };
+        })
+    }));
+    return rooms.filter((room) => room.travellers.length > 0);
+};
+const pickCheapest = (results) => [...results].sort((a, b) => a.price - b.price)[0] ?? null;
+const applyResultToLines = (lines, result) => lines.map((line, index) => applyResultToLine(line, result, index));
+const getOptionForRoom = (result, roomIndex) => {
+    const room = (result.rooms ?? [])[roomIndex];
+    if (room)
+        return (room.options ?? []).find((x) => x.isSelected) ?? (room.options ?? [])[0];
+    return (result.rooms ?? []).flatMap((x) => x.options ?? []).find((x) => x.isSelected) ?? (result.rooms ?? [])[0]?.options?.[0];
+};
+const applyResultToLine = (line, result, roomIndex = 0) => {
+    const option = getOptionForRoom(result, roomIndex);
+    return {
+        ...line,
+        productName: result.name ?? line.productName,
+        productCode: result.code ?? line.productCode,
+        accommodationCode: option?.accommodationCode ?? line.accommodationCode,
+        accommodationName: option?.accommodationName ?? line.accommodationName,
+        regimeCode: option?.regimeCode ?? line.regimeCode,
+        regimeName: option?.regimeName ?? line.regimeName,
+        latitude: result.latitude ?? line.latitude,
+        longitude: result.longitude ?? line.longitude,
+        isChanged: true
+    };
+};
+const toDateOnlyUtcString = (value) => {
+    const date = new Date(value);
+    return new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate())).toISOString();
+};
+const toTimeOnlyString = (value) => {
+    const date = new Date(value);
+    const hh = String(date.getUTCHours()).padStart(2, '0');
+    const mm = String(date.getUTCMinutes()).padStart(2, '0');
+    const ss = String(date.getUTCSeconds()).padStart(2, '0');
+    return `${hh}:${mm}:${ss}`;
+};
+const mapFlightSegmentsToFlightLines = (segments) => segments.map((segment) => ({
+    airlineCode: segment.marketingAirlineCode,
+    airlineDescription: segment.marketingAirlineName,
+    operatingAirlineCode: segment.operatingAirlineCode,
+    operatingAirlineDescription: segment.operatingAirlineName,
+    flightNumber: segment.flightNumber,
+    operatingFlightNumber: segment.operatingFlightNumber ?? null,
+    departureDate: toDateOnlyUtcString(segment.departureDateTime),
+    departureTime: toTimeOnlyString(segment.departureDateTime),
+    departureAirportCode: segment.departureAirportCode,
+    departureAirportDescription: segment.departureAirportName,
+    arrivalDate: toDateOnlyUtcString(segment.arrivalDateTime),
+    arrivalTime: toTimeOnlyString(segment.arrivalDateTime),
+    arrivalAirportCode: segment.arrivalAirportCode,
+    arrivalAirportDescription: segment.arrivalAirportName,
+    durationInTicks: segment.durationInTicks
+}));
+const buildTrajectFlightRequest = ({ node, line }, context, pax) => ({
+    transactionId: context.transactionId,
+    officeId: context.officeId,
+    catalogueId: context.catalogueId,
+    agentId: context.agentId ?? null,
+    language: context.language,
+    departureAirportCode: node.departureAirportCode ?? '',
+    arrivalAirportCode: node.arrivalAirportCode ?? '',
+    returnAirportCode: null,
+    luggageIncluded: null,
+    maxStops: null,
+    travelClass: null,
+    vendorConfigurationId: node.externalVendorId ?? null,
+    pax,
+    outward: { date: dateToDateStruct(new Date(line.from)) },
+    return: null
+});
+const pickCheapestFlight = (flights) => [...flights].sort((a, b) => a.price - b.price)[0] ?? null;
+const applyFlightToLine = (line, flight) => {
+    const segments = flight.outward?.segments ?? [];
+    if (!segments.length)
+        return line;
+    const firstSegment = segments[0];
+    const lastSegment = segments[segments.length - 1];
+    return {
+        ...line,
+        from: new Date(firstSegment.departureDateTime).toISOString(),
+        to: new Date(lastSegment.arrivalDateTime).toISOString(),
+        productName: `${firstSegment.departureAirportName} - ${lastSegment.arrivalAirportName} (${firstSegment.marketingAirlineName})`,
+        productCode: `${firstSegment.departureAirportCode} ${lastSegment.arrivalAirportCode}/${firstSegment.marketingAirlineCode}`,
+        accommodationName: firstSegment.metaData?.farePriceClassName ?? line.accommodationName,
+        accommodationCode: firstSegment.metaData?.fareCode ?? line.accommodationCode,
+        flightInformation: {
+            pnr: '',
+            flightLines: mapFlightSegmentsToFlightLines(segments)
+        },
+        isChanged: true
+    };
+};
+
+const getLocation = (result) => {
+    const place = result.locationName || result.regionName || result.oordName;
+    if (!place)
+        return result.countryName ?? '';
+    return result.countryName ? `${place}, ${result.countryName}` : place;
+};
+const toPlainText = (value) => {
+    if (!value)
+        return '';
+    return he
+        .decode(value.replace(/<[^>]*>/g, ' '))
+        .replace(/\s+/g, ' ')
+        .trim();
+};
+const TrajectNodeCard = ({ item, result, isSelected, languageCode, translations, onSelect, onEditOptions, showNights }) => {
+    const { node } = item;
+    const selectedPerRoom = (result.rooms ?? []).map((room) => (room.options ?? []).find((x) => x.isSelected) ?? (room.options ?? [])[0]);
+    const isMultiRoom = selectedPerRoom.length > 1;
+    const price = formatPrice$3(result.price, result.currencyCode, languageCode);
+    const nights = calculateNights(new Date(result.fromDate), new Date(result.toDate));
+    const candidate = findCandidateForResult(node, result);
+    const image = candidate?.imageUrl ?? null;
+    const description = toPlainText(candidate?.description);
+    const title = candidate?.name ?? result.name;
+    const priceBlock = (React__default["default"].createElement("div", { className: "search__result-card__price__wrapper" },
+        React__default["default"].createElement("span", { className: "search__result-card__price__label" }, translations?.SHARED.TOTAL_PRICE),
+        React__default["default"].createElement("span", { className: "search__result-card__price" }, price)));
+    const canEditOptions = isSelected && !!onEditOptions && (result.rooms ?? []).some((room) => (room.options ?? []).length > 1);
+    const selectButton = (React__default["default"].createElement(React__default["default"].Fragment, null,
+        React__default["default"].createElement("button", { type: "button", className: `cta ${isSelected ? 'cta--selected' : 'cta--select'}`, onClick: onSelect }, isSelected ? translations?.SHARED.SELECTED : translations?.SHARED.SELECT),
+        canEditOptions && (React__default["default"].createElement("button", { type: "button", className: "cta cta--secondary", onClick: onEditOptions },
+            translations?.SRP.SELECT,
+            " ",
+            translations?.SRP.ACCOMMODATION))));
+    if (result.contents?.length) {
+        return (React__default["default"].createElement("div", { className: `search__result-card__wrapper search__result-card__wrapper--custom ${isSelected ? 'search__result-card__wrapper--selected' : ''}` },
+            React__default["default"].createElement("div", { className: "search__result-card__top", dangerouslySetInnerHTML: { __html: he.decode(result.contents) } }),
+            React__default["default"].createElement("div", { className: "search__result-card__footer" }, selectButton)));
+    }
+    return (React__default["default"].createElement("div", { className: `search__result-card__wrapper ${isSelected ? 'search__result-card__wrapper--selected' : ''}` },
+        image && (React__default["default"].createElement("div", { className: "search__result-card__img-wrapper" },
+            React__default["default"].createElement("img", { src: image, alt: title, className: "search__result-card__img" }),
+            priceBlock)),
+        React__default["default"].createElement("div", { className: "search__result-card__content" },
+            React__default["default"].createElement("div", { className: "search__result-card__content__wrapper" },
+                React__default["default"].createElement("div", { className: "search__result-card__header" },
+                    React__default["default"].createElement("div", { className: "search__result-card__header__wrapper" },
+                        !!result.stars && (React__default["default"].createElement("div", { className: "rating" }, [...Array(result.stars)].map((_, index) => (React__default["default"].createElement(Icon, { name: "ui-star", key: `rating-star-${index + 1}`, width: 14, height: 14 }))))),
+                        React__default["default"].createElement("h3", { className: "search__result-card__title" }, title)),
+                    !image && priceBlock),
+                React__default["default"].createElement("span", { className: "search__result-card__location" },
+                    React__default["default"].createElement(Icon, { name: "ui-location", height: 16 }),
+                    getLocation(result)),
+                React__default["default"].createElement("div", { className: "search__result-card__options" },
+                    showNights && nights > 0 && (React__default["default"].createElement("div", { className: "search__result-card__option" },
+                        React__default["default"].createElement(Icon, { name: "ui-moon", height: 16 }),
+                        nights,
+                        " ",
+                        translations?.SRP.NIGHTS)),
+                    selectedPerRoom.map((option, roomIndex) => (React__default["default"].createElement(React__default["default"].Fragment, { key: `room-${roomIndex}` },
+                        option?.accommodationName && (React__default["default"].createElement("div", { className: "search__result-card__option" },
+                            React__default["default"].createElement(Icon, { name: "ui-bed", height: 16 }),
+                            isMultiRoom && `${translations?.SHARED.ROOM} ${roomIndex + 1}: `,
+                            option.accommodationName)),
+                        option?.regimeName && (React__default["default"].createElement("div", { className: "search__result-card__option" },
+                            React__default["default"].createElement(Icon, { name: "ui-utensils", height: 16 }),
+                            option.regimeName)))))),
+                description && React__default["default"].createElement("p", { className: "search__result-card__description" }, description)),
+            React__default["default"].createElement("div", { className: "search__result-card__footer" }, selectButton))));
+};
+
+const TrajectResultsFlyIn = ({ isLoading }) => {
+    const context = React.useContext(SearchResultsConfigurationContext);
+    const dispatch = reactRedux.useDispatch();
+    const translations = getTranslations(context?.languageCode ?? 'en-GB');
+    const { trajectNodeAvailability, trajectEditLineGuid } = reactRedux.useSelector((state) => state.searchResults);
+    const trajectEntry = context?.trajectEntry;
+    const item = React.useMemo(() => {
+        if (!trajectEntry || !trajectEditLineGuid)
+            return null;
+        return getTrajectNodesWithLines(trajectEntry).find((x) => x.line.guid === trajectEditLineGuid) ?? null;
+    }, [trajectEntry, trajectEditLineGuid]);
+    if (!context || !item)
+        return null;
+    const availability = trajectNodeAvailability[item.line.guid];
+    const results = availability?.results ?? [];
+    const ordered = [...results].sort((a, b) => {
+        const aConfigured = findCandidateForResult(item.node, a) ? 0 : 1;
+        const bConfigured = findCandidateForResult(item.node, b) ? 0 : 1;
+        return aConfigured - bConfigured || a.price - b.price;
+    });
+    const handleSelect = (code) => {
+        const result = results.find((x) => x.code === code);
+        if (!result)
+            return;
+        dispatch(setTrajectNodeSelection({ lineGuid: item.line.guid, code }));
+        applyResultToLines(item.lines, result).forEach((line) => dispatch(updateEditableEntryLine(line)));
+        dispatch(setTrajectEditLineGuid(null));
+        dispatch(setFlyInIsOpen(false));
+    };
+    if (isLoading) {
+        return React__default["default"].createElement(React__default["default"].Fragment, null, context.customSpinner ?? React__default["default"].createElement(Spinner, { label: translations.SRP.LOADING_ACCOMMODATIONS }));
+    }
+    return (React__default["default"].createElement("div", { className: "flyin__content" },
+        React__default["default"].createElement("div", { className: "search__result-row" },
+            React__default["default"].createElement("span", { className: "search__result-row-text" },
+                ordered.length,
+                "\u00A0",
+                translations.SRP.TOTAL_RESULTS_LABEL)),
+        ordered.length === 0 ? (React__default["default"].createElement("div", { className: "no-results" }, translations.SRP.NO_RESULTS)) : (React__default["default"].createElement("div", { className: "search__results__cards search__results__cards--compact" }, ordered.map((result) => (React__default["default"].createElement(TrajectNodeCard, { key: result.code, item: item, result: result, isSelected: result.code === availability?.selectedCode, languageCode: context.languageCode, translations: translations, onSelect: () => handleSelect(result.code), showNights: item.node.serviceType === ACCOMMODATION_SERVICE_TYPE })))))));
+};
+
 const FlyIn = ({ srpType, isOpen, setIsOpen, className = '', onPanelRef, detailsLoading, flyInType, isPackageEditFlow, handleConfirm, sortByTypes, activeSearchSeed, toggleFilters, filtersOpen }) => {
     const dispatch = reactRedux.useDispatch();
     const context = React.useContext(SearchResultsConfigurationContext);
@@ -30648,6 +30957,10 @@ const FlyIn = ({ srpType, isOpen, setIsOpen, className = '', onPanelRef, details
         }
     };
     const handleGoBack = () => {
+        if (context?.trajectEntry) {
+            handleClose();
+            return;
+        }
         if (flyInType === 'acco-details') {
             dispatch(setFlyInType('acco-results'));
         }
@@ -30671,7 +30984,7 @@ const FlyIn = ({ srpType, isOpen, setIsOpen, className = '', onPanelRef, details
             dispatch(setBookPackagingEntry(true));
         }
     };
-    return (React__default["default"].createElement("div", { className: `flyin ${isOpen ? 'flyin--active' : ''} ${className} ${isPackageEditFlow || flyInType === 'acco-results' ? 'flyin--large' : ''} ${flyInType === 'excursion-results' || flyInType === 'excursion-details' ? 'flyin--medium' : ''}
+    return (React__default["default"].createElement("div", { className: `flyin ${isOpen ? 'flyin--active' : ''} ${className} ${isPackageEditFlow || flyInType === 'acco-results' ? 'flyin--large' : ''} ${flyInType === 'excursion-results' || flyInType === 'excursion-details' ? 'flyin--medium' : ''}
       ${flyInType === 'flight-outward-results' || flyInType === 'flight-return-results' ? 'flyin--flight' : ''}` },
         React__default["default"].createElement("div", { className: `flyin__panel ${isOpen ? 'flyin__panel--active' : ''}`, ref: panelRef },
             React__default["default"].createElement("div", { className: "flyin__content" },
@@ -30697,7 +31010,10 @@ const FlyIn = ({ srpType, isOpen, setIsOpen, className = '', onPanelRef, details
                         React__default["default"].createElement(Icon, { name: "ui-chevron", width: 14, height: 14, "aria-hidden": "true" }),
                         "Go Back")))),
             srpType === build.PortalQsmType.Flight && React__default["default"].createElement(FlightsFlyIn, { isOpen: isOpen, setIsOpen: setIsOpen }),
-            (srpType === build.PortalQsmType.Accommodation || srpType === build.PortalQsmType.AccommodationAndFlight) && flyInType === 'acco-results' && (React__default["default"].createElement("div", { className: "flyin__content flyin__content--columns" },
+            context?.trajectEntry && flyInType === 'acco-results' && React__default["default"].createElement(TrajectResultsFlyIn, { isLoading: detailsLoading }),
+            !context?.trajectEntry &&
+                (srpType === build.PortalQsmType.Accommodation || srpType === build.PortalQsmType.AccommodationAndFlight) &&
+                flyInType === 'acco-results' && (React__default["default"].createElement("div", { className: "flyin__content flyin__content--columns" },
                 React__default["default"].createElement(Filters, { initialFilters: initialFilters, filters: filters, isOpen: filtersOpen, handleSetIsOpen: () => toggleFilters && toggleFilters(), 
                     // handleApplyFilters={() => setSearchTrigger((prev) => prev + 1)}
                     isLoading: isLoading, setFilters: (filters) => dispatch(setFilters(filters)), resetFilters: (filters) => dispatch(resetFilters(filters)) }),
@@ -32970,232 +33286,6 @@ const BookPackagingEntry = ({ activeSearchSeed, isLoading, isConfirmationPage })
             React__default["default"].createElement(WLSidebar, { activeSearchSeed: activeSearchSeed, packagingAccoResult: selectedPackagingAccoResult }))));
 };
 
-const REGULAR_TRAJECT_NODE_TYPE = 0;
-const isSearchableTrajectNode = (node) => node.serviceType === ACCOMMODATION_SERVICE_TYPE || node.serviceType === EXCURSION_SERVICE_TYPE;
-const isTrajectFlightNode = (node) => node.serviceType === FLIGHT_SERVICE_TYPE;
-const getTrajectNodesWithLines = (trajectEntry) => {
-    const linesByGuid = new Map((trajectEntry.entry.lines ?? []).map((line) => [line.guid, line]));
-    return [...(trajectEntry.nodes ?? [])]
-        .sort((a, b) => a.dayOrder - b.dayOrder || a.order - b.order)
-        .map((node) => ({ node, line: linesByGuid.get(node.lineGuid) }))
-        .filter((x) => !!x.line);
-};
-const buildDestination = (line) => {
-    if (line.location?.id)
-        return { id: line.location.id, isLocation: true };
-    if (line.oord?.id)
-        return { id: line.oord.id, isOord: true };
-    if (line.region?.id)
-        return { id: line.region.id, isRegion: true };
-    if (line.country?.id)
-        return { id: line.country.id, isCountry: true };
-    if (line.latitude && line.longitude)
-        return { latitude: line.latitude, longitude: line.longitude };
-    return { id: 0 };
-};
-const buildTrajectNodeRequest = ({ node, line }, context, productCode) => ({
-    transactionId: context.transactionId,
-    officeId: context.officeId,
-    agentId: context.agentId ?? null,
-    catalogueId: context.catalogueId,
-    searchConfigurationId: context.searchConfigurationId,
-    portalId: context.portalId ?? null,
-    vendorConfigurationId: node.externalVendorId ?? null,
-    language: context.language,
-    serviceType: node.serviceType,
-    fromDate: toDateOnlyString(line.from),
-    toDate: toDateOnlyString(line.to),
-    destination: buildDestination(line),
-    productCode,
-    rooms: context.rooms,
-    tagIds: []
-});
-const getNodeCandidates = (node) => {
-    const configured = (node.alternatives ?? []).filter((x) => !!x.code && x.code.trim().length > 0);
-    if (configured.length)
-        return configured;
-    const fallbackCode = node.code ?? node.preferredAccommodationCode;
-    if (!fallbackCode || !fallbackCode.trim().length)
-        return [];
-    return [
-        {
-            code: fallbackCode,
-            name: node.name,
-            description: node.description,
-            imageUrl: node.imageUrl,
-            contentSource: node.contentSource,
-            vendor: node.vendor,
-            externalVendorId: node.externalVendorId,
-            isPreferred: true
-        }
-    ];
-};
-const findCandidateForResult = (node, result) => getNodeCandidates(node).find((candidate) => matchesCode(result, candidate.code)) ?? null;
-const matchesCode = (result, code) => {
-    if (result.code === code)
-        return true;
-    return (result.rooms ?? []).some((room) => (room.options ?? []).some((option) => option.accommodationCode === code));
-};
-const getPackagingRoomsFromEntry = (entry) => {
-    const paxById = new Map((entry.pax ?? []).map((p) => [p.id, p]));
-    const rooms = (entry.rooms ?? []).map((room) => ({
-        travellers: (room.paxIds ?? []).map((paxId) => {
-            const pax = paxById.get(paxId);
-            return {
-                id: paxId,
-                age: pax?.age ?? null,
-                dateOfBirth: pax?.dateOfBirth ?? null
-            };
-        })
-    }));
-    return rooms.filter((room) => room.travellers.length > 0);
-};
-const pickCheapest = (results) => [...results].sort((a, b) => a.price - b.price)[0] ?? null;
-const applyResultToLine = (line, result) => {
-    const option = (result.rooms ?? []).flatMap((room) => room.options ?? []).find((x) => x.isSelected) ?? (result.rooms ?? [])[0]?.options?.[0];
-    return {
-        ...line,
-        productName: result.name ?? line.productName,
-        productCode: result.code ?? line.productCode,
-        accommodationCode: option?.accommodationCode ?? line.accommodationCode,
-        accommodationName: option?.accommodationName ?? line.accommodationName,
-        regimeCode: option?.regimeCode ?? line.regimeCode,
-        regimeName: option?.regimeName ?? line.regimeName,
-        latitude: result.latitude ?? line.latitude,
-        longitude: result.longitude ?? line.longitude,
-        isChanged: true
-    };
-};
-const toDateOnlyUtcString = (value) => {
-    const date = new Date(value);
-    return new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate())).toISOString();
-};
-const toTimeOnlyString = (value) => {
-    const date = new Date(value);
-    const hh = String(date.getUTCHours()).padStart(2, '0');
-    const mm = String(date.getUTCMinutes()).padStart(2, '0');
-    const ss = String(date.getUTCSeconds()).padStart(2, '0');
-    return `${hh}:${mm}:${ss}`;
-};
-const mapFlightSegmentsToFlightLines = (segments) => segments.map((segment) => ({
-    airlineCode: segment.marketingAirlineCode,
-    airlineDescription: segment.marketingAirlineName,
-    operatingAirlineCode: segment.operatingAirlineCode,
-    operatingAirlineDescription: segment.operatingAirlineName,
-    flightNumber: segment.flightNumber,
-    operatingFlightNumber: segment.operatingFlightNumber ?? null,
-    departureDate: toDateOnlyUtcString(segment.departureDateTime),
-    departureTime: toTimeOnlyString(segment.departureDateTime),
-    departureAirportCode: segment.departureAirportCode,
-    departureAirportDescription: segment.departureAirportName,
-    arrivalDate: toDateOnlyUtcString(segment.arrivalDateTime),
-    arrivalTime: toTimeOnlyString(segment.arrivalDateTime),
-    arrivalAirportCode: segment.arrivalAirportCode,
-    arrivalAirportDescription: segment.arrivalAirportName,
-    durationInTicks: segment.durationInTicks
-}));
-const buildTrajectFlightRequest = ({ node, line }, context, pax) => ({
-    transactionId: context.transactionId,
-    officeId: context.officeId,
-    catalogueId: context.catalogueId,
-    agentId: context.agentId ?? null,
-    language: context.language,
-    departureAirportCode: node.departureAirportCode ?? '',
-    arrivalAirportCode: node.arrivalAirportCode ?? '',
-    returnAirportCode: null,
-    luggageIncluded: null,
-    maxStops: null,
-    travelClass: null,
-    vendorConfigurationId: node.externalVendorId ?? null,
-    pax,
-    outward: { date: dateToDateStruct(new Date(line.from)) },
-    return: null
-});
-const pickCheapestFlight = (flights) => [...flights].sort((a, b) => a.price - b.price)[0] ?? null;
-const applyFlightToLine = (line, flight) => {
-    const segments = flight.outward?.segments ?? [];
-    if (!segments.length)
-        return line;
-    const firstSegment = segments[0];
-    const lastSegment = segments[segments.length - 1];
-    return {
-        ...line,
-        from: new Date(firstSegment.departureDateTime).toISOString(),
-        to: new Date(lastSegment.arrivalDateTime).toISOString(),
-        productName: `${firstSegment.departureAirportName} - ${lastSegment.arrivalAirportName} (${firstSegment.marketingAirlineName})`,
-        productCode: `${firstSegment.departureAirportCode} ${lastSegment.arrivalAirportCode}/${firstSegment.marketingAirlineCode}`,
-        accommodationName: firstSegment.metaData?.farePriceClassName ?? line.accommodationName,
-        accommodationCode: firstSegment.metaData?.fareCode ?? line.accommodationCode,
-        flightInformation: {
-            pnr: '',
-            flightLines: mapFlightSegmentsToFlightLines(segments)
-        },
-        isChanged: true
-    };
-};
-
-const getLocation = (result) => {
-    const place = result.locationName || result.regionName || result.oordName;
-    if (!place)
-        return result.countryName ?? '';
-    return result.countryName ? `${place}, ${result.countryName}` : place;
-};
-const toPlainText = (value) => {
-    if (!value)
-        return '';
-    return he
-        .decode(value.replace(/<[^>]*>/g, ' '))
-        .replace(/\s+/g, ' ')
-        .trim();
-};
-const TrajectNodeCard = ({ item, result, isSelected, languageCode, translations, onSelect, showNights }) => {
-    const { node } = item;
-    const selectedOption = lodash.first(result.rooms)?.options?.find((x) => x.isSelected) ?? lodash.first(result.rooms)?.options?.[0];
-    const price = formatPrice$3(result.price, result.currencyCode, languageCode);
-    const nights = calculateNights(new Date(result.fromDate), new Date(result.toDate));
-    const candidate = findCandidateForResult(node, result);
-    const image = candidate?.imageUrl ?? null;
-    const description = toPlainText(candidate?.description);
-    const title = candidate?.name ?? result.name;
-    const priceBlock = (React__default["default"].createElement("div", { className: "search__result-card__price__wrapper" },
-        React__default["default"].createElement("span", { className: "search__result-card__price__label" }, translations?.SHARED.TOTAL_PRICE),
-        React__default["default"].createElement("span", { className: "search__result-card__price" }, price)));
-    const selectButton = (React__default["default"].createElement("button", { type: "button", className: `cta ${isSelected ? 'cta--selected' : 'cta--select'}`, onClick: onSelect }, isSelected ? translations?.SHARED.SELECTED : translations?.SHARED.SELECT));
-    if (result.contents?.length) {
-        return (React__default["default"].createElement("div", { className: `search__result-card__wrapper search__result-card__wrapper--custom ${isSelected ? 'search__result-card__wrapper--selected' : ''}` },
-            React__default["default"].createElement("div", { className: "search__result-card__top", dangerouslySetInnerHTML: { __html: he.decode(result.contents) } }),
-            React__default["default"].createElement("div", { className: "search__result-card__footer" }, selectButton)));
-    }
-    return (React__default["default"].createElement("div", { className: `search__result-card__wrapper ${isSelected ? 'search__result-card__wrapper--selected' : ''}` },
-        image && (React__default["default"].createElement("div", { className: "search__result-card__img-wrapper" },
-            React__default["default"].createElement("img", { src: image, alt: title, className: "search__result-card__img" }),
-            priceBlock)),
-        React__default["default"].createElement("div", { className: "search__result-card__content" },
-            React__default["default"].createElement("div", { className: "search__result-card__content__wrapper" },
-                React__default["default"].createElement("div", { className: "search__result-card__header" },
-                    React__default["default"].createElement("div", { className: "search__result-card__header__wrapper" },
-                        !!result.stars && (React__default["default"].createElement("div", { className: "rating" }, [...Array(result.stars)].map((_, index) => (React__default["default"].createElement(Icon, { name: "ui-star", key: `rating-star-${index + 1}`, width: 14, height: 14 }))))),
-                        React__default["default"].createElement("h3", { className: "search__result-card__title" }, title)),
-                    !image && priceBlock),
-                React__default["default"].createElement("span", { className: "search__result-card__location" },
-                    React__default["default"].createElement(Icon, { name: "ui-location", height: 16 }),
-                    getLocation(result)),
-                React__default["default"].createElement("div", { className: "search__result-card__options" },
-                    showNights && nights > 0 && (React__default["default"].createElement("div", { className: "search__result-card__option" },
-                        React__default["default"].createElement(Icon, { name: "ui-moon", height: 16 }),
-                        nights,
-                        " ",
-                        translations?.SRP.NIGHTS)),
-                    selectedOption?.accommodationName && (React__default["default"].createElement("div", { className: "search__result-card__option" },
-                        React__default["default"].createElement(Icon, { name: "ui-bed", height: 16 }),
-                        selectedOption.accommodationName)),
-                    selectedOption?.regimeName && (React__default["default"].createElement("div", { className: "search__result-card__option" },
-                        React__default["default"].createElement(Icon, { name: "ui-utensils", height: 16 }),
-                        selectedOption.regimeName))),
-                description && React__default["default"].createElement("p", { className: "search__result-card__description" }, description)),
-            React__default["default"].createElement("div", { className: "search__result-card__footer" }, selectButton))));
-};
-
 const getNodeIcon = (node) => {
     if (isTrajectFlightNode(node))
         return 'ui-flight';
@@ -33235,13 +33325,28 @@ const TrajectResults = ({ isLoading }) => {
         if (!result)
             return;
         dispatch(setTrajectNodeSelection({ lineGuid: item.line.guid, code }));
-        dispatch(updateEditableEntryLine(applyResultToLine(item.line, result)));
+        applyResultToLines(item.lines, result).forEach((line) => dispatch(updateEditableEntryLine(line)));
+    };
+    const handleShowMore = (item) => {
+        dispatch(setTrajectEditLineGuid(item.line.guid));
+        dispatch(setFlyInType('acco-results'));
+        dispatch(setFlyInIsOpen(true));
+    };
+    const handleEditOptions = (item) => {
+        const availability = trajectNodeAvailability[item.line.guid];
+        const result = availability?.results.find((x) => x.code === availability?.selectedCode);
+        if (!result)
+            return;
+        dispatch(setPackagingAccoSearchDetails([result]));
+        dispatch(setSelectedPackagingAccoResult(result.code));
+        dispatch(setTrajectEditLineGuid(item.line.guid));
+        dispatch(setFlyInType('acco-details'));
+        dispatch(setFlyInIsOpen(true));
     };
     const renderServiceNode = (item) => {
         console.log('renderServiceNode', item);
         const { node, line } = item;
         const availability = trajectNodeAvailability[line.guid];
-        const isExpanded = !!expandedNodes[line.guid];
         const results = availability?.results ?? [];
         const selected = results.find((x) => x.code === availability?.selectedCode) ?? null;
         const configured = results.filter((x) => x.code !== selected?.code && !!findCandidateForResult(node, x));
@@ -33263,9 +33368,13 @@ const TrajectResults = ({ isLoading }) => {
                         node.preferredAccommodationName,
                         " \u2014 ",
                         translations.SRP.NO_RESULTS))),
-                React__default["default"].createElement("div", { className: "search__results__cards search__results__cards--extended" }, [selected, ...configured, ...(isExpanded ? others : [])].map((result) => (React__default["default"].createElement(TrajectNodeCard, { key: result.code, item: item, result: result, isSelected: result.code === selected.code, languageCode: context.languageCode, translations: translations, onSelect: () => handleSelect(item, result.code), showNights: node.serviceType === ACCOMMODATION_SERVICE_TYPE })))),
+                React__default["default"].createElement("div", { className: "search__results__cards search__results__cards--compact" }, [selected, ...configured].map((result) => (React__default["default"].createElement(TrajectNodeCard, { key: result.code, item: item, result: result, isSelected: result.code === selected.code, languageCode: context.languageCode, translations: translations, onSelect: () => handleSelect(item, result.code), onEditOptions: node.serviceType === ACCOMMODATION_SERVICE_TYPE ? () => handleEditOptions(item) : undefined, showNights: node.serviceType === ACCOMMODATION_SERVICE_TYPE })))),
                 others.length > 0 && (React__default["default"].createElement("div", { className: "search__results__cards__actions" },
-                    React__default["default"].createElement("button", { type: "button", className: "cta cta--secondary", onClick: () => toggleExpanded(line.guid) }, isExpanded ? translations.SRP.SHOW_LESS : `${translations.SRP.SHOW_MORE} (${others.length})`)))))));
+                    React__default["default"].createElement("button", { type: "button", className: "cta cta--secondary", onClick: () => handleShowMore(item) },
+                        translations.SRP.SHOW_MORE,
+                        " (",
+                        others.length,
+                        ")")))))));
     };
     const handleSelectFlight = (item, flight) => {
         dispatch(setTrajectFlightSelection({ lineGuid: item.line.guid, guid: flight.outwardGuid }));
@@ -33310,6 +33419,8 @@ const TrajectResults = ({ isLoading }) => {
         if (!dayNodes.length)
             return null;
         return (React__default["default"].createElement(React__default["default"].Fragment, { key: `day-${day.order}` }, dayNodes.map((node) => {
+            if (node.serviceType !== ACCOMMODATION_SERVICE_TYPE && node.serviceType !== EXCURSION_SERVICE_TYPE && node.serviceType !== FLIGHT_SERVICE_TYPE)
+                return null;
             // if (node.trajectNodeType === CONNECTING_TRAJECT_NODE_TYPE) return null;
             // if (node.trajectNodeType !== REGULAR_TRAJECT_NODE_TYPE) return renderContextNode(node);
             if (node.trajectNodeType !== REGULAR_TRAJECT_NODE_TYPE)
@@ -33327,6 +33438,7 @@ const useTrajectAvailability = () => {
     const context = React.useContext(SearchResultsConfigurationContext);
     const dispatch = reactRedux.useDispatch();
     const trajectEntry = context?.trajectEntry;
+    const showNonPreferredItems = !!context?.showNonPreferredItems;
     React.useEffect(() => {
         if (!context || !trajectEntry)
             return;
@@ -33371,18 +33483,20 @@ const useTrajectAvailability = () => {
                         return null;
                     }
                 }));
-                let results = attempts.filter((x) => !!x).filter((x, i, all) => all.findIndex((y) => y.code === x.code) === i);
-                let picked = results[0] ?? null;
+                const configuredResults = attempts
+                    .filter((x) => !!x)
+                    .filter((x, i, all) => all.findIndex((y) => y.code === x.code) === i);
                 const preferredCandidate = candidates.find((x) => x.isPreferred) ?? candidates[0];
-                let preferredUnavailable = !!preferredCandidate && !results.some((x) => matchesCode(x, preferredCandidate.code));
-                // Nothing configured was available — fall back to the cheapest result in the destination.
-                if (!picked) {
-                    results = (await search(config, buildTrajectNodeRequest(item, searchContext, ''), controller.signal)) ?? [];
-                    picked = pickCheapest(results);
+                let preferredUnavailable = !!preferredCandidate && !configuredResults.some((x) => matchesCode(x, preferredCandidate.code));
+                const destinationResults = showNonPreferredItems
+                    ? ((await search(config, buildTrajectNodeRequest(item, searchContext, ''), controller.signal)) ?? []).filter((x) => !configuredResults.some((configured) => configured.code === x.code))
+                    : [];
+                const results = [...configuredResults, ...destinationResults];
+                const picked = configuredResults[0] ?? pickCheapest(destinationResults);
+                if (!configuredResults.length)
                     preferredUnavailable = candidates.length > 0;
-                }
                 if (controller.signal.aborted)
-                    return null;
+                    return [];
                 dispatch(setTrajectNodeAvailability({
                     lineGuid,
                     results,
@@ -33390,58 +33504,58 @@ const useTrajectAvailability = () => {
                     preferredUnavailable
                 }));
                 if (!picked)
-                    return lineGuid;
-                dispatch(updateEditableEntryLine(applyResultToLine(item.line, picked)));
-                return null;
+                    return item.lines.map((x) => x.guid);
+                applyResultToLines(item.lines, picked).forEach((line) => dispatch(updateEditableEntryLine(line)));
+                return [];
             }
             catch (error) {
                 if (controller.signal.aborted)
-                    return null;
+                    return [];
                 console.error('Failed to resolve traject node availability', item.node.name, error);
                 dispatch(setTrajectNodeAvailability({ lineGuid, results: [], selectedCode: null, preferredUnavailable: false }));
-                return lineGuid;
+                return item.lines.map((x) => x.guid);
             }
         };
         const resolveFlightNode = async (item) => {
             const lineGuid = item.line.guid;
             if (!item.node.departureAirportCode || !item.node.arrivalAirportCode) {
                 dispatch(setTrajectFlightAvailability({ lineGuid, results: [], selectedGuid: null }));
-                return lineGuid;
+                return item.lines.map((x) => x.guid);
             }
             dispatch(setTrajectFlightLoading(lineGuid));
             try {
                 const flights = (await build.searchPackagingFlights(config, buildTrajectFlightRequest(item, searchContext, flightPax), controller.signal)) ?? [];
                 if (controller.signal.aborted)
-                    return null;
+                    return [];
                 const picked = pickCheapestFlight(flights);
                 dispatch(setTrajectFlightAvailability({ lineGuid, results: flights, selectedGuid: picked?.outwardGuid ?? null }));
                 if (!picked)
-                    return lineGuid;
+                    return item.lines.map((x) => x.guid);
                 dispatch(updateEditableEntryLine(applyFlightToLine(item.line, picked)));
-                return null;
+                return [];
             }
             catch (error) {
                 if (controller.signal.aborted)
-                    return null;
+                    return [];
                 console.error('Failed to resolve traject flight', item.node.name, error);
                 dispatch(setTrajectFlightAvailability({ lineGuid, results: [], selectedGuid: null }));
-                return lineGuid;
+                return item.lines.map((x) => x.guid);
             }
         };
         (async () => {
             const searchable = nodesWithLines.filter((x) => isSearchableTrajectNode(x.node));
             const flightNodes = nodesWithLines.filter((x) => isTrajectFlightNode(x.node));
-            const unresolved = await Promise.all([...searchable.map(resolveNode), ...flightNodes.map(resolveFlightNode)]);
+            const unresolved = (await Promise.all([...searchable.map(resolveNode), ...flightNodes.map(resolveFlightNode)])).flat();
             if (controller.signal.aborted)
                 return;
             // A node with no availability anywhere cannot be priced or booked, so its line comes off
             // the entry. The card stays visible and reports the gap.
-            const emptyLineGuids = unresolved.filter((guid) => !!guid);
+            const emptyLineGuids = unresolved.filter(Boolean);
             if (emptyLineGuids.length)
                 dispatch(removeEditableEntryLines(emptyLineGuids));
         })();
         return () => controller.abort();
-    }, [trajectEntry]);
+    }, [trajectEntry, showNonPreferredItems]);
 };
 
 const SearchResultsContainer = ({ onBookingStarted }) => {
@@ -33449,7 +33563,7 @@ const SearchResultsContainer = ({ onBookingStarted }) => {
     const dispatch = reactRedux.useDispatch();
     const context = React.useContext(SearchResultsConfigurationContext);
     const translations = getTranslations(context?.languageCode ?? 'en-GB');
-    const { results, filteredResults, packagingAccoResults, filteredPackagingAccoResults, isLoading, flightsLoading, initialFilters, filters, flightFilters, selectedSortType, selectedFlightSortType, selectedSearchResult, selectedPackagingAccoResultCode, flyInIsOpen, packagingAccoSearchDetails, editablePackagingEntry, transactionId, flyInType, packagingFlightResults, confirmedExcursionsByDay, bookPackagingEntry } = reactRedux.useSelector((state) => state.searchResults);
+    const { results, filteredResults, packagingAccoResults, filteredPackagingAccoResults, isLoading, flightsLoading, initialFilters, filters, flightFilters, selectedSortType, selectedFlightSortType, selectedSearchResult, selectedPackagingAccoResultCode, flyInIsOpen, packagingAccoSearchDetails, editablePackagingEntry, transactionId, flyInType, packagingFlightResults, confirmedExcursionsByDay, bookPackagingEntry, trajectEditLineGuid } = reactRedux.useSelector((state) => state.searchResults);
     const isMobile = useMediaQuery('(max-width: 1200px)');
     // Resolves live availability per traject node; no-op unless a traject entry is configured.
     useTrajectAvailability();
@@ -33738,6 +33852,20 @@ const SearchResultsContainer = ({ onBookingStarted }) => {
         setDetailsIsLoading(false);
     };
     const handleConfirmHotelSwap = () => {
+        if (context?.trajectEntry && trajectEditLineGuid) {
+            const item = getTrajectNodesWithLines(context.trajectEntry).find((x) => x.line.guid === trajectEditLineGuid);
+            const result = packagingAccoSearchDetails.find((x) => x.code === selectedPackagingAccoResultCode);
+            if (item && result) {
+                const currentLines = item.lines
+                    .map((line) => editablePackagingEntry?.lines?.find((x) => x.guid === line.guid))
+                    .filter((x) => !!x);
+                applyResultToLines(currentLines, result).forEach((line) => dispatch(updateEditableEntryLine(line)));
+                dispatch(updateTrajectNodeResult({ lineGuid: trajectEditLineGuid, result }));
+            }
+            dispatch(setTrajectEditLineGuid(null));
+            handleFlyInToggle(false);
+            return;
+        }
         const updatedEntry = swapHotelInPackagingEntry();
         if (!updatedEntry)
             return;
@@ -34086,6 +34214,10 @@ const SearchResultsContainer = ({ onBookingStarted }) => {
         const fetchPackagingAccoSearchDetails = async () => {
             if (!selectedPackagingAccoResultCode || !context)
                 return;
+            // A traject node already resolved its own availability, options per room included, and hands
+            // that result straight to the fly-in.
+            if (context.trajectEntry)
+                return;
             if (skipInitialPackagingAccoDetailsRef.current) {
                 skipInitialPackagingAccoDetailsRef.current = false;
                 return;
@@ -37600,20 +37732,20 @@ function ItineraryMapView({ destinations: propDestinations, adults = 2, dateFrom
             const isStartEnd = dest.isStart || dest.isEnd;
             let iconHtml;
             if (isStartEnd) {
-                iconHtml = `
-          <div class="map-view__marker map-view__marker--plane">
-            <svg viewBox="0 0 576 512" fill="currentColor" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
-              <path d="M482.3 192c34.2 0 93.7 29 93.7 64c0 36-59.5 64-93.7 64l-116.6 0L265.2 495.9c-5.7 10.1-16.3 16.1-27.8 16.1l-56.2 0c-10.6 0-18.3-10.3-15.8-20.6l49-196.3L112 288 68.8 377.6c-3 6.1-9.2 10.4-16 10.4l-2.8 0c-9.2 0-16-8.8-13.3-17.6L80 256L36.7 141.6C34 132.8 40.8 124 50 124l2.8 0c6.8 0 13 4.3 16 10.4L112 224l102.9 0-49-196.3C163.5 17.3 171.2 7 181.8 7l56.2 0c11.5 0 22.1 6 27.8 16.1L365.7 192l116.6 0z"/>
-            </svg>
+                iconHtml = `
+          <div class="map-view__marker map-view__marker--plane">
+            <svg viewBox="0 0 576 512" fill="currentColor" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
+              <path d="M482.3 192c34.2 0 93.7 29 93.7 64c0 36-59.5 64-93.7 64l-116.6 0L265.2 495.9c-5.7 10.1-16.3 16.1-27.8 16.1l-56.2 0c-10.6 0-18.3-10.3-15.8-20.6l49-196.3L112 288 68.8 377.6c-3 6.1-9.2 10.4-16 10.4l-2.8 0c-9.2 0-16-8.8-13.3-17.6L80 256L36.7 141.6C34 132.8 40.8 124 50 124l2.8 0c6.8 0 13 4.3 16 10.4L112 224l102.9 0-49-196.3C163.5 17.3 171.2 7 181.8 7l56.2 0c11.5 0 22.1 6 27.8 16.1L365.7 192l116.6 0z"/>
+            </svg>
           </div>`;
             }
             else {
                 stopIndex++;
                 const imgStyle = dest.imageUrl ? `style="background-image:url('${dest.imageUrl}')"` : '';
-                iconHtml = `
-          <div class="map-view__marker map-view__marker--stop" ${imgStyle}>
-            ${!dest.imageUrl ? `<span class="map-view__marker-number">${stopIndex}</span>` : ''}
-            <span class="map-view__marker-badge">${stopIndex}</span>
+                iconHtml = `
+          <div class="map-view__marker map-view__marker--stop" ${imgStyle}>
+            ${!dest.imageUrl ? `<span class="map-view__marker-number">${stopIndex}</span>` : ''}
+            <span class="map-view__marker-badge">${stopIndex}</span>
           </div>`;
             }
             const icon = L.divIcon({