@qite/tide-booking-component 0.0.2-preview.58 → 0.0.2-preview.60

package/build/build-cjs/booking-wizard/features/booking/booking-slice.d.ts

@@ -15,8 +15,10 @@ export interface BookingState {
     skipPaymentWithAgent: boolean;
     generatePaymentUrl: boolean;
     isUnavailable?: boolean;
+    tagIds?: number[];
+    agentAdressId?: number;
 }
 export declare const fetchPackage: import("@reduxjs/toolkit").AsyncThunk<void, void, {}>;
-export declare const setOfficeId: import("@reduxjs/toolkit").ActionCreatorWithPayload<number, string>, setEntryStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<number, string>, setCustomEntryStatusId: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload<number | undefined, string>, setProductAttributes: import("@reduxjs/toolkit").ActionCreatorWithPayload<ProductAttributes, string>, setBookingAttributes: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingAttributes, string>, setCalculateDeposit: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setBookingNumber: import("@reduxjs/toolkit").ActionCreatorWithPayload<string, string>, setIsRetry: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setFetchingPackage: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setPackage: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingPackage, string>, setPackageRooms: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingPackageRoom[], string>, setPackageOptionPax: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingOptionPax[], string>, setPackageOptionUnits: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingOptionUnit[], string>, setPackageGroups: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingOptionGroup<PerBookingPackageOption>[], string>, setSkipPayment: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setGeneratePaymentUrl: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>;
+export declare const setOfficeId: import("@reduxjs/toolkit").ActionCreatorWithPayload<number, string>, setEntryStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<number, string>, setCustomEntryStatusId: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload<number | undefined, string>, setProductAttributes: import("@reduxjs/toolkit").ActionCreatorWithPayload<ProductAttributes, string>, setBookingAttributes: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingAttributes, string>, setCalculateDeposit: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setBookingNumber: import("@reduxjs/toolkit").ActionCreatorWithPayload<string, string>, setIsRetry: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setFetchingPackage: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setPackage: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingPackage, string>, setPackageRooms: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingPackageRoom[], string>, setPackageOptionPax: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingOptionPax[], string>, setPackageOptionUnits: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingOptionUnit[], string>, setPackageGroups: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingOptionGroup<PerBookingPackageOption>[], string>, setSkipPayment: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setGeneratePaymentUrl: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setTagIds: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload<number[] | undefined, string>, setAgentAdressId: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload<number | undefined, string>;
 declare const _default: import("redux").Reducer<BookingState, import("redux").AnyAction>;
 export default _default;

package/build/build-cjs/booking-wizard/features/booking/selectors.d.ts

@@ -17,6 +17,8 @@ export declare const selectRequestRooms: (state: RootState) => import("@qite/tid
 export declare const selectOfficeId: (state: RootState) => number;
 export declare const selectEntryStatus: (state: RootState) => number;
 export declare const selectCustomEntryStatusId: (state: RootState) => number | undefined;
+export declare const selectTagIds: (state: RootState) => number[] | undefined;
+export declare const selectAgentAdressId: (state: RootState) => number | undefined;
 export declare const selectProductAttributes: (state: RootState) => import("../../types").ProductAttributes | undefined;
 export declare const selectBookingAttributes: (state: RootState) => import("../../types").BookingAttributes | undefined;
 export declare const selectBookingNumber: (state: RootState) => string | undefined;
@@ -71,7 +73,7 @@ export declare const selectBookingPackageBookRequest: ((state: {
     travelersForm: import("../travelers-form/travelers-form-slice").TravelersFormState;
     priceDetails: import("../price-details/price-details-slice").PriceDetailsState;
     summary: import("../summary/summary-slice").SummaryState;
-}) => BookingPackageRequest<BookingPackageBookRequest> | null) & import("reselect").OutputSelectorFields<(args_0: number, args_1: number, args_2: number | undefined, args_3: BookingPackagePax[], args_4: BookingPackageAddress | undefined, args_5: import("@qite/tide-client/build/types/offer").BookingPackage | undefined, args_6: boolean, args_7: number | undefined, args_8: boolean, args_9: boolean, args_10: import("@qite/tide-client/build/types/offer").BookingProductNotification[]) => BookingPackageRequest<BookingPackageBookRequest> & {
+}) => BookingPackageRequest<BookingPackageBookRequest> | null) & import("reselect").OutputSelectorFields<(args_0: number, args_1: number, args_2: number | undefined, args_3: BookingPackagePax[], args_4: BookingPackageAddress | undefined, args_5: import("@qite/tide-client/build/types/offer").BookingPackage | undefined, args_6: boolean, args_7: number | undefined, args_8: boolean, args_9: boolean, args_10: import("@qite/tide-client/build/types/offer").BookingProductNotification[], args_11: number[] | undefined, args_12: number | undefined) => BookingPackageRequest<BookingPackageBookRequest> & {
     clearCache: () => void;
 }> & {
     clearCache: () => void;

package/build/build-cjs/booking-wizard/types.d.ts

@@ -30,6 +30,8 @@ export interface Settings {
     sidebarFooterComponent?: JSX.Element | null;
     loaderComponent?: JSX.Element | null;
     icons?: string | null;
+    tagIds?: number[];
+    agentAdressId?: number;
 }
 export interface SummaryCheckbox {
     id: string;

package/build/build-cjs/index.js

@@ -6800,6 +6800,10 @@ var selectEntryStatus = function (state) {
 var selectCustomEntryStatusId = function (state) {
     return state.booking.customEntryStatusId;
 };
+var selectTagIds = function (state) { return state.booking.tagIds; };
+var selectAgentAdressId = function (state) {
+    return state.booking.agentAdressId;
+};
 var selectProductAttributes = function (state) {
     return state.booking.productAttributes;
 };
@@ -6877,7 +6881,7 @@ var selectBookingAddress = toolkit.createSelector(selectTravelersFormValues, sel
         email: formValues === null || formValues === void 0 ? void 0 : formValues.email,
     };
 });
-var selectBookingPackageBookRequest = toolkit.createSelector(selectOfficeId, selectEntryStatus, selectCustomEntryStatusId, selectBookingPackagePax, selectBookingAddress, selectPackageDetails, selectCalculateDeposit, selectAgentId, selectGeneratePaymentUrl, selectSkipPaymentWithAgent, selectNotifications, function (officeId, entryStatus, customEntryStatusId, pax, address, packageDetails, calculateDeposit, agentId, generatePaymentUrl, skipPaymentWithAgent, notifications) {
+var selectBookingPackageBookRequest = toolkit.createSelector(selectOfficeId, selectEntryStatus, selectCustomEntryStatusId, selectBookingPackagePax, selectBookingAddress, selectPackageDetails, selectCalculateDeposit, selectAgentId, selectGeneratePaymentUrl, selectSkipPaymentWithAgent, selectNotifications, selectTagIds, selectAgentAdressId, function (officeId, entryStatus, customEntryStatusId, pax, address, packageDetails, calculateDeposit, agentId, generatePaymentUrl, skipPaymentWithAgent, notifications, tagIds, agentAdressId) {
     if (!packageDetails || (pax === null || pax === void 0 ? void 0 : pax.length) == 0)
         return null;
     var returnPaymentUrl = false;
@@ -6896,6 +6900,7 @@ var selectBookingPackageBookRequest = toolkit.createSelector(selectOfficeId, sel
             calculateDeposit: calculateDeposit,
             returnPaymentUrl: returnPaymentUrl,
             notifications: notifications,
+            tagIds: tagIds,
         },
     };
 });
@@ -6974,6 +6979,8 @@ var initialState$1 = {
     isBusy: false,
     skipPaymentWithAgent: false,
     generatePaymentUrl: false,
+    tagIds: [],
+    agentAdressId: undefined,
 };
 var fetchPackage = toolkit.createAsyncThunk("booking/fetchPackage", function (_, _a) {
     var dispatch = _a.dispatch;
@@ -7132,6 +7139,12 @@ var bookingSlice = toolkit.createSlice({
             if (option)
                 option.groups = action.payload;
         },
+        setTagIds: function (state, action) {
+            state.tagIds = action.payload;
+        },
+        setAgentAdressId: function (state, action) {
+            state.agentAdressId = action.payload;
+        },
     },
     extraReducers: function (builder) {
         builder.addCase(fetchPackageDetails.fulfilled, function (state, action) {
@@ -7168,7 +7181,7 @@ var bookingSlice = toolkit.createSlice({
         });
     },
 });
-var setOfficeId = (_a = bookingSlice.actions, _a.setOfficeId), setEntryStatus = _a.setEntryStatus, setCustomEntryStatusId = _a.setCustomEntryStatusId, setProductAttributes = _a.setProductAttributes, setBookingAttributes = _a.setBookingAttributes, setCalculateDeposit = _a.setCalculateDeposit, setBookingNumber = _a.setBookingNumber, setIsRetry = _a.setIsRetry, setFetchingPackage = _a.setFetchingPackage, setPackage = _a.setPackage, setPackageRooms = _a.setPackageRooms, setPackageOptionPax = _a.setPackageOptionPax, setPackageOptionUnits = _a.setPackageOptionUnits, setPackageGroups = _a.setPackageGroups, setSkipPayment = _a.setSkipPayment, setGeneratePaymentUrl = _a.setGeneratePaymentUrl;
+var setOfficeId = (_a = bookingSlice.actions, _a.setOfficeId), setEntryStatus = _a.setEntryStatus, setCustomEntryStatusId = _a.setCustomEntryStatusId, setProductAttributes = _a.setProductAttributes, setBookingAttributes = _a.setBookingAttributes, setCalculateDeposit = _a.setCalculateDeposit, setBookingNumber = _a.setBookingNumber, setIsRetry = _a.setIsRetry, setFetchingPackage = _a.setFetchingPackage, setPackage = _a.setPackage, setPackageRooms = _a.setPackageRooms, setPackageOptionPax = _a.setPackageOptionPax, setPackageOptionUnits = _a.setPackageOptionUnits, setPackageGroups = _a.setPackageGroups, setSkipPayment = _a.setSkipPayment, setGeneratePaymentUrl = _a.setGeneratePaymentUrl, setTagIds = _a.setTagIds, setAgentAdressId = _a.setAgentAdressId;
 var bookingReducer = bookingSlice.reducer;
 
 var initialState = {
@@ -7206,6 +7219,8 @@ var SettingsContext = React__default["default"].createContext({
     officeId: 1,
     entryStatus: 0,
     customEntryStatusId: null,
+    tagIds: [],
+    agentAdressId: undefined,
     productPath: "/",
     basePath: "/boeken",
     options: {
@@ -8326,7 +8341,7 @@ var OptionsForm = function () {
 var ProductCard = function (_a) {
     var productName = _a.productName, thumbnailUrl = _a.thumbnailUrl, handleToggleClick = _a.handleToggleClick;
     return (React__default["default"].createElement("div", { className: "booking__product" },
-        React__default["default"].createElement("div", { className: "booking__product-image" }, thumbnailUrl && (React__default["default"].createElement("img", { src: "".concat(thumbnailUrl, "?height=100&width=100"), alt: productName, className: "mediacontent" }))),
+        React__default["default"].createElement("div", { className: "booking__product-image" }, thumbnailUrl && (React__default["default"].createElement("img", { src: "".concat(thumbnailUrl, "?height=400&width=400"), alt: productName, className: "mediacontent" }))),
         React__default["default"].createElement("div", { className: "booking__product-text" },
             React__default["default"].createElement("h3", { className: "booking__product-heading" }, productName)),
         React__default["default"].createElement("button", { type: "button", className: "booking__product-toggle", onClick: handleToggleClick })));
@@ -8958,8 +8973,15 @@ var TravelersForm = function () {
     var adultIds = reactRedux.useSelector(selectAdultIds);
     var childIds = reactRedux.useSelector(selectChildIds);
     var agents = reactRedux.useSelector(selectAgents);
+    var agentAdressId = reactRedux.useSelector(selectAgentAdressId);
+    console.log("agentAdressId", agentAdressId);
+    React.useEffect(function () {
+        if (agentAdressId) {
+            formik$1.setFieldValue("travelAgentId", agentAdressId);
+        }
+    }, [agentAdressId]);
     var initialValues = (_a = reactRedux.useSelector(selectTravelersFormValues)) !== null && _a !== void 0 ? _a : createInitialValues(adultIds, childIds, startDate);
-    var _c = React.useState(initialValues.travelAgentId > 0), showAgents = _c[0], setShowAgents = _c[1];
+    var _c = React.useState(initialValues.travelAgentId > 0 || agentAdressId != undefined), showAgents = _c[0], setShowAgents = _c[1];
     var typeaheadAgents = (_b = lodash.sortBy(agents === null || agents === void 0 ? void 0 : agents.map(function (x) { return ({
         key: "".concat(x.id),
         value: "".concat(x.name, " (").concat(x.postalCode, " ").concat(x.location, ")"),
@@ -9180,7 +9202,7 @@ var TravelersForm = function () {
 
 var Booking = function (_a) {
     var productCode = _a.productCode, productName = _a.productName, thumbnailUrl = _a.thumbnailUrl;
-    var _b = React.useContext(SettingsContext), officeId = _b.officeId, entryStatus = _b.entryStatus, customEntryStatusId = _b.customEntryStatusId, basePath = _b.basePath, options = _b.options, summary = _b.summary, confirmation = _b.confirmation, error = _b.error, showSidebarDeposit = _b.showSidebarDeposit, includeFlights = _b.includeFlights, loaderComponent = _b.loaderComponent, skipPaymentWithAgent = _b.skipPaymentWithAgent, generatePaymentUrl = _b.generatePaymentUrl;
+    var _b = React.useContext(SettingsContext), officeId = _b.officeId, entryStatus = _b.entryStatus, customEntryStatusId = _b.customEntryStatusId, basePath = _b.basePath, options = _b.options, summary = _b.summary, confirmation = _b.confirmation, error = _b.error, showSidebarDeposit = _b.showSidebarDeposit, includeFlights = _b.includeFlights, loaderComponent = _b.loaderComponent, skipPaymentWithAgent = _b.skipPaymentWithAgent, generatePaymentUrl = _b.generatePaymentUrl, tagIds = _b.tagIds, agentAdressId = _b.agentAdressId;
     var dispatch = useAppDispatch();
     var location = router.useLocation();
     var productAttributes = reactRedux.useSelector(selectProductAttributes);
@@ -9259,6 +9281,8 @@ var Booking = function (_a) {
         dispatch(setEntryStatus(entryStatus));
         dispatch(setCustomEntryStatusId(customEntryStatusId !== null && customEntryStatusId !== void 0 ? customEntryStatusId : undefined));
         dispatch(setCalculateDeposit(showSidebarDeposit));
+        dispatch(setTagIds(tagIds !== null && tagIds !== void 0 ? tagIds : undefined));
+        dispatch(setAgentAdressId(agentAdressId !== null && agentAdressId !== void 0 ? agentAdressId : undefined));
     }, [
         officeId,
         entryStatus,
@@ -9268,6 +9292,8 @@ var Booking = function (_a) {
         setEntryStatus,
         setCustomEntryStatusId,
         setCalculateDeposit,
+        tagIds,
+        agentAdressId,
     ]);
     React.useEffect(function () {
         if (!productAttributes ||

package/build/build-esm/booking-wizard/features/booking/booking-slice.d.ts

@@ -15,8 +15,10 @@ export interface BookingState {
     skipPaymentWithAgent: boolean;
     generatePaymentUrl: boolean;
     isUnavailable?: boolean;
+    tagIds?: number[];
+    agentAdressId?: number;
 }
 export declare const fetchPackage: import("@reduxjs/toolkit").AsyncThunk<void, void, {}>;
-export declare const setOfficeId: import("@reduxjs/toolkit").ActionCreatorWithPayload<number, string>, setEntryStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<number, string>, setCustomEntryStatusId: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload<number | undefined, string>, setProductAttributes: import("@reduxjs/toolkit").ActionCreatorWithPayload<ProductAttributes, string>, setBookingAttributes: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingAttributes, string>, setCalculateDeposit: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setBookingNumber: import("@reduxjs/toolkit").ActionCreatorWithPayload<string, string>, setIsRetry: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setFetchingPackage: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setPackage: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingPackage, string>, setPackageRooms: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingPackageRoom[], string>, setPackageOptionPax: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingOptionPax[], string>, setPackageOptionUnits: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingOptionUnit[], string>, setPackageGroups: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingOptionGroup<PerBookingPackageOption>[], string>, setSkipPayment: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setGeneratePaymentUrl: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>;
+export declare const setOfficeId: import("@reduxjs/toolkit").ActionCreatorWithPayload<number, string>, setEntryStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<number, string>, setCustomEntryStatusId: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload<number | undefined, string>, setProductAttributes: import("@reduxjs/toolkit").ActionCreatorWithPayload<ProductAttributes, string>, setBookingAttributes: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingAttributes, string>, setCalculateDeposit: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setBookingNumber: import("@reduxjs/toolkit").ActionCreatorWithPayload<string, string>, setIsRetry: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setFetchingPackage: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setPackage: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingPackage, string>, setPackageRooms: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingPackageRoom[], string>, setPackageOptionPax: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingOptionPax[], string>, setPackageOptionUnits: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingOptionUnit[], string>, setPackageGroups: import("@reduxjs/toolkit").ActionCreatorWithPayload<BookingOptionGroup<PerBookingPackageOption>[], string>, setSkipPayment: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setGeneratePaymentUrl: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, setTagIds: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload<number[] | undefined, string>, setAgentAdressId: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload<number | undefined, string>;
 declare const _default: import("redux").Reducer<BookingState, import("redux").AnyAction>;
 export default _default;

package/build/build-esm/booking-wizard/features/booking/selectors.d.ts

@@ -17,6 +17,8 @@ export declare const selectRequestRooms: (state: RootState) => import("@qite/tid
 export declare const selectOfficeId: (state: RootState) => number;
 export declare const selectEntryStatus: (state: RootState) => number;
 export declare const selectCustomEntryStatusId: (state: RootState) => number | undefined;
+export declare const selectTagIds: (state: RootState) => number[] | undefined;
+export declare const selectAgentAdressId: (state: RootState) => number | undefined;
 export declare const selectProductAttributes: (state: RootState) => import("../../types").ProductAttributes | undefined;
 export declare const selectBookingAttributes: (state: RootState) => import("../../types").BookingAttributes | undefined;
 export declare const selectBookingNumber: (state: RootState) => string | undefined;
@@ -71,7 +73,7 @@ export declare const selectBookingPackageBookRequest: ((state: {
     travelersForm: import("../travelers-form/travelers-form-slice").TravelersFormState;
     priceDetails: import("../price-details/price-details-slice").PriceDetailsState;
     summary: import("../summary/summary-slice").SummaryState;
-}) => BookingPackageRequest<BookingPackageBookRequest> | null) & import("reselect").OutputSelectorFields<(args_0: number, args_1: number, args_2: number | undefined, args_3: BookingPackagePax[], args_4: BookingPackageAddress | undefined, args_5: import("@qite/tide-client/build/types/offer").BookingPackage | undefined, args_6: boolean, args_7: number | undefined, args_8: boolean, args_9: boolean, args_10: import("@qite/tide-client/build/types/offer").BookingProductNotification[]) => BookingPackageRequest<BookingPackageBookRequest> & {
+}) => BookingPackageRequest<BookingPackageBookRequest> | null) & import("reselect").OutputSelectorFields<(args_0: number, args_1: number, args_2: number | undefined, args_3: BookingPackagePax[], args_4: BookingPackageAddress | undefined, args_5: import("@qite/tide-client/build/types/offer").BookingPackage | undefined, args_6: boolean, args_7: number | undefined, args_8: boolean, args_9: boolean, args_10: import("@qite/tide-client/build/types/offer").BookingProductNotification[], args_11: number[] | undefined, args_12: number | undefined) => BookingPackageRequest<BookingPackageBookRequest> & {
     clearCache: () => void;
 }> & {
     clearCache: () => void;

package/build/build-esm/booking-wizard/types.d.ts

@@ -30,6 +30,8 @@ export interface Settings {
     sidebarFooterComponent?: JSX.Element | null;
     loaderComponent?: JSX.Element | null;
     icons?: string | null;
+    tagIds?: number[];
+    agentAdressId?: number;
 }
 export interface SummaryCheckbox {
     id: string;

package/build/build-esm/index.js

@@ -6789,6 +6789,10 @@ var selectEntryStatus = function (state) {
 var selectCustomEntryStatusId = function (state) {
     return state.booking.customEntryStatusId;
 };
+var selectTagIds = function (state) { return state.booking.tagIds; };
+var selectAgentAdressId = function (state) {
+    return state.booking.agentAdressId;
+};
 var selectProductAttributes = function (state) {
     return state.booking.productAttributes;
 };
@@ -6866,7 +6870,7 @@ var selectBookingAddress = createSelector(selectTravelersFormValues, selectBooki
         email: formValues === null || formValues === void 0 ? void 0 : formValues.email,
     };
 });
-var selectBookingPackageBookRequest = createSelector(selectOfficeId, selectEntryStatus, selectCustomEntryStatusId, selectBookingPackagePax, selectBookingAddress, selectPackageDetails, selectCalculateDeposit, selectAgentId, selectGeneratePaymentUrl, selectSkipPaymentWithAgent, selectNotifications, function (officeId, entryStatus, customEntryStatusId, pax, address, packageDetails, calculateDeposit, agentId, generatePaymentUrl, skipPaymentWithAgent, notifications) {
+var selectBookingPackageBookRequest = createSelector(selectOfficeId, selectEntryStatus, selectCustomEntryStatusId, selectBookingPackagePax, selectBookingAddress, selectPackageDetails, selectCalculateDeposit, selectAgentId, selectGeneratePaymentUrl, selectSkipPaymentWithAgent, selectNotifications, selectTagIds, selectAgentAdressId, function (officeId, entryStatus, customEntryStatusId, pax, address, packageDetails, calculateDeposit, agentId, generatePaymentUrl, skipPaymentWithAgent, notifications, tagIds, agentAdressId) {
     if (!packageDetails || (pax === null || pax === void 0 ? void 0 : pax.length) == 0)
         return null;
     var returnPaymentUrl = false;
@@ -6885,6 +6889,7 @@ var selectBookingPackageBookRequest = createSelector(selectOfficeId, selectEntry
             calculateDeposit: calculateDeposit,
             returnPaymentUrl: returnPaymentUrl,
             notifications: notifications,
+            tagIds: tagIds,
         },
     };
 });
@@ -6963,6 +6968,8 @@ var initialState$1 = {
     isBusy: false,
     skipPaymentWithAgent: false,
     generatePaymentUrl: false,
+    tagIds: [],
+    agentAdressId: undefined,
 };
 var fetchPackage = createAsyncThunk("booking/fetchPackage", function (_, _a) {
     var dispatch = _a.dispatch;
@@ -7121,6 +7128,12 @@ var bookingSlice = createSlice({
             if (option)
                 option.groups = action.payload;
         },
+        setTagIds: function (state, action) {
+            state.tagIds = action.payload;
+        },
+        setAgentAdressId: function (state, action) {
+            state.agentAdressId = action.payload;
+        },
     },
     extraReducers: function (builder) {
         builder.addCase(fetchPackageDetails.fulfilled, function (state, action) {
@@ -7157,7 +7170,7 @@ var bookingSlice = createSlice({
         });
     },
 });
-var setOfficeId = (_a = bookingSlice.actions, _a.setOfficeId), setEntryStatus = _a.setEntryStatus, setCustomEntryStatusId = _a.setCustomEntryStatusId, setProductAttributes = _a.setProductAttributes, setBookingAttributes = _a.setBookingAttributes, setCalculateDeposit = _a.setCalculateDeposit, setBookingNumber = _a.setBookingNumber, setIsRetry = _a.setIsRetry, setFetchingPackage = _a.setFetchingPackage, setPackage = _a.setPackage, setPackageRooms = _a.setPackageRooms, setPackageOptionPax = _a.setPackageOptionPax, setPackageOptionUnits = _a.setPackageOptionUnits, setPackageGroups = _a.setPackageGroups, setSkipPayment = _a.setSkipPayment, setGeneratePaymentUrl = _a.setGeneratePaymentUrl;
+var setOfficeId = (_a = bookingSlice.actions, _a.setOfficeId), setEntryStatus = _a.setEntryStatus, setCustomEntryStatusId = _a.setCustomEntryStatusId, setProductAttributes = _a.setProductAttributes, setBookingAttributes = _a.setBookingAttributes, setCalculateDeposit = _a.setCalculateDeposit, setBookingNumber = _a.setBookingNumber, setIsRetry = _a.setIsRetry, setFetchingPackage = _a.setFetchingPackage, setPackage = _a.setPackage, setPackageRooms = _a.setPackageRooms, setPackageOptionPax = _a.setPackageOptionPax, setPackageOptionUnits = _a.setPackageOptionUnits, setPackageGroups = _a.setPackageGroups, setSkipPayment = _a.setSkipPayment, setGeneratePaymentUrl = _a.setGeneratePaymentUrl, setTagIds = _a.setTagIds, setAgentAdressId = _a.setAgentAdressId;
 var bookingReducer = bookingSlice.reducer;
 
 var initialState = {
@@ -7195,6 +7208,8 @@ var SettingsContext = React.createContext({
     officeId: 1,
     entryStatus: 0,
     customEntryStatusId: null,
+    tagIds: [],
+    agentAdressId: undefined,
     productPath: "/",
     basePath: "/boeken",
     options: {
@@ -8315,7 +8330,7 @@ var OptionsForm = function () {
 var ProductCard = function (_a) {
     var productName = _a.productName, thumbnailUrl = _a.thumbnailUrl, handleToggleClick = _a.handleToggleClick;
     return (React.createElement("div", { className: "booking__product" },
-        React.createElement("div", { className: "booking__product-image" }, thumbnailUrl && (React.createElement("img", { src: "".concat(thumbnailUrl, "?height=100&width=100"), alt: productName, className: "mediacontent" }))),
+        React.createElement("div", { className: "booking__product-image" }, thumbnailUrl && (React.createElement("img", { src: "".concat(thumbnailUrl, "?height=400&width=400"), alt: productName, className: "mediacontent" }))),
         React.createElement("div", { className: "booking__product-text" },
             React.createElement("h3", { className: "booking__product-heading" }, productName)),
         React.createElement("button", { type: "button", className: "booking__product-toggle", onClick: handleToggleClick })));
@@ -8947,8 +8962,15 @@ var TravelersForm = function () {
     var adultIds = useSelector(selectAdultIds);
     var childIds = useSelector(selectChildIds);
     var agents = useSelector(selectAgents);
+    var agentAdressId = useSelector(selectAgentAdressId);
+    console.log("agentAdressId", agentAdressId);
+    useEffect(function () {
+        if (agentAdressId) {
+            formik.setFieldValue("travelAgentId", agentAdressId);
+        }
+    }, [agentAdressId]);
     var initialValues = (_a = useSelector(selectTravelersFormValues)) !== null && _a !== void 0 ? _a : createInitialValues(adultIds, childIds, startDate);
-    var _c = useState(initialValues.travelAgentId > 0), showAgents = _c[0], setShowAgents = _c[1];
+    var _c = useState(initialValues.travelAgentId > 0 || agentAdressId != undefined), showAgents = _c[0], setShowAgents = _c[1];
     var typeaheadAgents = (_b = sortBy(agents === null || agents === void 0 ? void 0 : agents.map(function (x) { return ({
         key: "".concat(x.id),
         value: "".concat(x.name, " (").concat(x.postalCode, " ").concat(x.location, ")"),
@@ -9169,7 +9191,7 @@ var TravelersForm = function () {
 
 var Booking = function (_a) {
     var productCode = _a.productCode, productName = _a.productName, thumbnailUrl = _a.thumbnailUrl;
-    var _b = useContext(SettingsContext), officeId = _b.officeId, entryStatus = _b.entryStatus, customEntryStatusId = _b.customEntryStatusId, basePath = _b.basePath, options = _b.options, summary = _b.summary, confirmation = _b.confirmation, error = _b.error, showSidebarDeposit = _b.showSidebarDeposit, includeFlights = _b.includeFlights, loaderComponent = _b.loaderComponent, skipPaymentWithAgent = _b.skipPaymentWithAgent, generatePaymentUrl = _b.generatePaymentUrl;
+    var _b = useContext(SettingsContext), officeId = _b.officeId, entryStatus = _b.entryStatus, customEntryStatusId = _b.customEntryStatusId, basePath = _b.basePath, options = _b.options, summary = _b.summary, confirmation = _b.confirmation, error = _b.error, showSidebarDeposit = _b.showSidebarDeposit, includeFlights = _b.includeFlights, loaderComponent = _b.loaderComponent, skipPaymentWithAgent = _b.skipPaymentWithAgent, generatePaymentUrl = _b.generatePaymentUrl, tagIds = _b.tagIds, agentAdressId = _b.agentAdressId;
     var dispatch = useAppDispatch();
     var location = useLocation();
     var productAttributes = useSelector(selectProductAttributes);
@@ -9248,6 +9270,8 @@ var Booking = function (_a) {
         dispatch(setEntryStatus(entryStatus));
         dispatch(setCustomEntryStatusId(customEntryStatusId !== null && customEntryStatusId !== void 0 ? customEntryStatusId : undefined));
         dispatch(setCalculateDeposit(showSidebarDeposit));
+        dispatch(setTagIds(tagIds !== null && tagIds !== void 0 ? tagIds : undefined));
+        dispatch(setAgentAdressId(agentAdressId !== null && agentAdressId !== void 0 ? agentAdressId : undefined));
     }, [
         officeId,
         entryStatus,
@@ -9257,6 +9281,8 @@ var Booking = function (_a) {
         setEntryStatus,
         setCustomEntryStatusId,
         setCalculateDeposit,
+        tagIds,
+        agentAdressId,
     ]);
     useEffect(function () {
         if (!productAttributes ||

package/package.json

@@ -1,71 +1,71 @@
-{
-  "name": "@qite/tide-booking-component",
-  "version": "0.0.2-preview.58",
-  "description": "React BookingWizard component for Tide",
-  "main": "build/build-cjs/index.js",
-  "module": "build/build-esm/index.js",
-  "scripts": {
-    "start": "rollup -c -w",
-    "build": "rollup -c",
-    "tsc": "tsc --noEmit",
-    "format": "prettier --write ."
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+ssh://git@bitbucket.org/qitegeneral/tide-booking-component.git"
-  },
-  "keywords": [
-    "tide",
-    "booking",
-    "react",
-    "component"
-  ],
-  "author": "Kristof Colpaert <kristof.colpaert@qite.be>",
-  "license": "OBSD",
-  "homepage": "https://bitbucket.org/qitegeneral/tide-booking-component#readme",
-  "devDependencies": {
-    "@jsonurl/jsonurl": "^1.1.4",
-    "@reach/router": "^1.3.4",
-    "@reduxjs/toolkit": "^1.6.0",
-    "@rollup/plugin-commonjs": "^19.0.1",
-    "@rollup/plugin-json": "^4.1.0",
-    "@rollup/plugin-node-resolve": "^13.0.2",
-    "@types/flat": "^5.0.2",
-    "@types/lodash": "^4.14.171",
-    "@types/reach__router": "^1.3.9",
-    "@types/react-dom": "^17.0.11",
-    "@types/uuid": "^8.3.1",
-    "date-fns": "^2.22.1",
-    "flat": "^5.0.2",
-    "formik": "^2.2.9",
-    "lodash": "^4.17.21",
-    "prettier": "^2.3.2",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "react-redux": "^7.2.4",
-    "rollup": "^2.53.2",
-    "rollup-plugin-delete": "^2.0.0",
-    "rollup-plugin-peer-deps-external": "^2.2.4",
-    "rollup-plugin-typescript2": "^0.30.0",
-    "tslib": "^2.3.1",
-    "typescript": "^4.3.5",
-    "uuid": "^8.3.2"
-  },
-  "peerDependencies": {
-    "@jsonurl/jsonurl": "^1.1.4",
-    "@reach/router": "^1.3.4",
-    "@reduxjs/toolkit": "^1.6.0",
-    "date-fns": "^2.22.1",
-    "flat": "^5.0.2",
-    "formik": "^2.2.9",
-    "immer": "^9.0.5",
-    "lodash": "^4.17.21",
-    "react": "^16.12.0",
-    "react-dom": "^16.12.0",
-    "react-redux": "^7.2.4",
-    "uuid": "^8.3.2"
-  },
-  "dependencies": {
-    "@qite/tide-client": "1.0.83"
-  }
-}
+{
+  "name": "@qite/tide-booking-component",
+  "version": "0.0.2-preview.60",
+  "description": "React BookingWizard component for Tide",
+  "main": "build/build-cjs/index.js",
+  "module": "build/build-esm/index.js",
+  "scripts": {
+    "start": "rollup -c -w",
+    "build": "rollup -c",
+    "tsc": "tsc --noEmit",
+    "format": "prettier --write ."
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+ssh://git@bitbucket.org/qitegeneral/tide-booking-component.git"
+  },
+  "keywords": [
+    "tide",
+    "booking",
+    "react",
+    "component"
+  ],
+  "author": "Kristof Colpaert <kristof.colpaert@qite.be>",
+  "license": "OBSD",
+  "homepage": "https://bitbucket.org/qitegeneral/tide-booking-component#readme",
+  "devDependencies": {
+    "@jsonurl/jsonurl": "^1.1.4",
+    "@reach/router": "^1.3.4",
+    "@reduxjs/toolkit": "^1.6.0",
+    "@rollup/plugin-commonjs": "^19.0.1",
+    "@rollup/plugin-json": "^4.1.0",
+    "@rollup/plugin-node-resolve": "^13.0.2",
+    "@types/flat": "^5.0.2",
+    "@types/lodash": "^4.14.171",
+    "@types/reach__router": "^1.3.9",
+    "@types/react-dom": "^17.0.11",
+    "@types/uuid": "^8.3.1",
+    "date-fns": "^2.22.1",
+    "flat": "^5.0.2",
+    "formik": "^2.2.9",
+    "lodash": "^4.17.21",
+    "prettier": "^2.3.2",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-redux": "^7.2.4",
+    "rollup": "^2.53.2",
+    "rollup-plugin-delete": "^2.0.0",
+    "rollup-plugin-peer-deps-external": "^2.2.4",
+    "rollup-plugin-typescript2": "^0.30.0",
+    "tslib": "^2.3.1",
+    "typescript": "^4.3.5",
+    "uuid": "^8.3.2"
+  },
+  "peerDependencies": {
+    "@jsonurl/jsonurl": "^1.1.4",
+    "@reach/router": "^1.3.4",
+    "@reduxjs/toolkit": "^1.6.0",
+    "date-fns": "^2.22.1",
+    "flat": "^5.0.2",
+    "formik": "^2.2.9",
+    "immer": "^9.0.5",
+    "lodash": "^4.17.21",
+    "react": "^16.12.0",
+    "react-dom": "^16.12.0",
+    "react-redux": "^7.2.4",
+    "uuid": "^8.3.2"
+  },
+  "dependencies": {
+    "@qite/tide-client": "1.0.83"
+  }
+}

package/src/booking-wizard/components/product-card.tsx

@@ -16,7 +16,7 @@ const ProductCard: React.FC<ProductCardProps> = ({
       <div className="booking__product-image">
         {thumbnailUrl && (
           <img
-            src={`${thumbnailUrl}?height=100&width=100`}
+            src={`${thumbnailUrl}?height=400&width=400`}
             alt={productName}
             className="mediacontent"
           />