@qite/tide-booking-component 0.0.2-preview.51 → 0.0.2-preview.54
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/build-cjs/booking-wizard/features/price-details/price-details-slice.d.ts +2 -8
- package/build/build-cjs/index.js +41 -42
- package/build/build-esm/booking-wizard/features/price-details/price-details-slice.d.ts +2 -8
- package/build/build-esm/index.js +43 -44
- package/package.json +1 -1
- package/src/booking-wizard/features/price-details/price-details-slice.ts +7 -33
- package/src/booking-wizard/features/product-options/option-booking-group.tsx +6 -2
- package/src/booking-wizard/features/product-options/option-item.tsx +31 -16
- package/src/booking-wizard/features/product-options/option-pax-group.tsx +6 -2
- package/src/booking-wizard/features/product-options/option-unit-group.tsx +6 -2
- package/src/booking-wizard/features/sidebar/sidebar-util.ts +4 -4
- package/src/booking-wizard/features/sidebar/sidebar.tsx +15 -9
|
@@ -1,18 +1,12 @@
|
|
|
1
1
|
import { RootState } from "../../store";
|
|
2
|
-
import { EntityState } from "@reduxjs/toolkit";
|
|
3
2
|
import { BookingPriceDetail } from "@qite/tide-client/build/types";
|
|
4
3
|
export interface PriceDetailsState {
|
|
5
|
-
priceDetails:
|
|
4
|
+
priceDetails: BookingPriceDetail[];
|
|
6
5
|
deposit?: number;
|
|
7
6
|
isBusy: boolean;
|
|
8
7
|
}
|
|
9
8
|
export declare const fetchPriceDetails: import("@reduxjs/toolkit").AsyncThunk<import("@qite/tide-client/build/types").BookingPriceDetails, void, {}>;
|
|
10
|
-
export declare const selectPriceDetails: (state:
|
|
11
|
-
booking: import("../booking/booking-slice").BookingState;
|
|
12
|
-
travelersForm: import("../travelers-form/travelers-form-slice").TravelersFormState;
|
|
13
|
-
priceDetails: PriceDetailsState;
|
|
14
|
-
summary: import("../summary/summary-slice").SummaryState;
|
|
15
|
-
}) => BookingPriceDetail[];
|
|
9
|
+
export declare const selectPriceDetails: (state: RootState) => BookingPriceDetail[];
|
|
16
10
|
export declare const selectPackagePriceDetails: import("reselect").OutputSelector<{
|
|
17
11
|
booking: import("../booking/booking-slice").BookingState;
|
|
18
12
|
travelersForm: import("../travelers-form/travelers-form-slice").TravelersFormState;
|
package/build/build-cjs/index.js
CHANGED
|
@@ -6974,30 +6974,10 @@ var fetchPriceDetails = toolkit.createAsyncThunk("priceDetails/fetchPriceDetails
|
|
|
6974
6974
|
});
|
|
6975
6975
|
});
|
|
6976
6976
|
});
|
|
6977
|
-
var buildPriceDetailId = function (priceDetail) {
|
|
6978
|
-
return lodash.compact([
|
|
6979
|
-
priceDetail.productCode,
|
|
6980
|
-
priceDetail.accommodationCode,
|
|
6981
|
-
priceDetail.priceDescription,
|
|
6982
|
-
priceDetail.total,
|
|
6983
|
-
priceDetail.pricePerPax
|
|
6984
|
-
.filter(function (x) { return x.price; })
|
|
6985
|
-
.map(function (x) { return "" + x.paxId; })
|
|
6986
|
-
.join("_"),
|
|
6987
|
-
]).join("_");
|
|
6988
|
-
};
|
|
6989
|
-
var priceDetailsAdapter = toolkit.createEntityAdapter({
|
|
6990
|
-
selectId: buildPriceDetailId,
|
|
6991
|
-
sortComparer: function (left, right) {
|
|
6992
|
-
var leftId = buildPriceDetailId(left);
|
|
6993
|
-
var rightId = buildPriceDetailId(right);
|
|
6994
|
-
return leftId.localeCompare(rightId);
|
|
6995
|
-
},
|
|
6996
|
-
});
|
|
6997
6977
|
var priceDetailsSlice = toolkit.createSlice({
|
|
6998
6978
|
name: "priceDetails",
|
|
6999
6979
|
initialState: {
|
|
7000
|
-
priceDetails:
|
|
6980
|
+
priceDetails: [],
|
|
7001
6981
|
isBusy: false,
|
|
7002
6982
|
},
|
|
7003
6983
|
reducers: {
|
|
@@ -7005,20 +6985,21 @@ var priceDetailsSlice = toolkit.createSlice({
|
|
|
7005
6985
|
state.isBusy = action.payload;
|
|
7006
6986
|
},
|
|
7007
6987
|
resetPriceDetails: function (state, _) {
|
|
7008
|
-
state.priceDetails =
|
|
6988
|
+
state.priceDetails = [];
|
|
7009
6989
|
},
|
|
7010
6990
|
},
|
|
7011
6991
|
extraReducers: function (builder) {
|
|
7012
6992
|
builder.addCase(fetchPriceDetails.fulfilled, function (state, action) {
|
|
7013
6993
|
if (action.payload) {
|
|
7014
6994
|
state.deposit = action.payload.deposit;
|
|
7015
|
-
|
|
6995
|
+
state.priceDetails = action.payload.details;
|
|
7016
6996
|
}
|
|
7017
6997
|
});
|
|
7018
6998
|
},
|
|
7019
6999
|
});
|
|
7020
|
-
var
|
|
7021
|
-
|
|
7000
|
+
var selectPriceDetails = function (state) {
|
|
7001
|
+
return state.priceDetails.priceDetails;
|
|
7002
|
+
};
|
|
7022
7003
|
var selectPackagePriceDetails = toolkit.createSelector(selectPriceDetails, function (priceDetails) {
|
|
7023
7004
|
return priceDetails.filter(function (priceDetail) { return priceDetail.isInPackage; });
|
|
7024
7005
|
});
|
|
@@ -7402,7 +7383,7 @@ var getDatePeriodText = function (from, to) {
|
|
|
7402
7383
|
var fromDate = dateFns.parseISO(from);
|
|
7403
7384
|
var toDate = dateFns.parseISO(to);
|
|
7404
7385
|
var dayDifference = dateFns.differenceInDays(toDate, fromDate);
|
|
7405
|
-
return dayDifference + " " + translations.OPTIONS_FORM.DAYS + ", " +
|
|
7386
|
+
return dayDifference + 1 + " " + translations.OPTIONS_FORM.DAYS + ", " + dayDifference + " " + translations.OPTIONS_FORM.NIGHTS;
|
|
7406
7387
|
}
|
|
7407
7388
|
catch (_a) {
|
|
7408
7389
|
return undefined;
|
|
@@ -7445,7 +7426,7 @@ var parseFlightLineDateTime = function (date, time) {
|
|
|
7445
7426
|
if (parsedTimeHours != NaN && parsedTimeMinutes != NaN) {
|
|
7446
7427
|
parsedDate.setUTCHours(parsedTimeHours, parsedTimeMinutes);
|
|
7447
7428
|
}
|
|
7448
|
-
return parsedDate.toISOString();
|
|
7429
|
+
return parsedDate.toISOString().slice(0, -1);
|
|
7449
7430
|
}
|
|
7450
7431
|
catch (_a) {
|
|
7451
7432
|
// Parsing failed
|
|
@@ -7755,6 +7736,10 @@ var OptionItem = function (_a) {
|
|
|
7755
7736
|
}
|
|
7756
7737
|
};
|
|
7757
7738
|
return (React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
7739
|
+
option.requirementType === 0 && (React__default["default"].createElement("input", { type: "checkbox", id: parentId + "_" + index, className: buildClassName([
|
|
7740
|
+
"checkbox__input",
|
|
7741
|
+
"checkbox__input--parent",
|
|
7742
|
+
]), defaultChecked: true, disabled: true })),
|
|
7758
7743
|
option.requirementType === 1 && (React__default["default"].createElement("input", { type: "checkbox", id: parentId + "_" + index, className: buildClassName([
|
|
7759
7744
|
"checkbox__input",
|
|
7760
7745
|
"checkbox__input--parent",
|
|
@@ -7785,12 +7770,11 @@ var OptionItem = function (_a) {
|
|
|
7785
7770
|
" ",
|
|
7786
7771
|
getAccommodationPriceDifference(accommodation))); }))))),
|
|
7787
7772
|
React__default["default"].createElement("div", { className: "tree__column" },
|
|
7788
|
-
React__default["default"].createElement("div", { className: "select-wrapper" },
|
|
7789
|
-
React__default["default"].createElement("
|
|
7790
|
-
|
|
7791
|
-
|
|
7792
|
-
|
|
7793
|
-
getRegimePriceDifference(regime))); }))))))),
|
|
7773
|
+
React__default["default"].createElement("div", { className: "select-wrapper" }, (regimes === null || regimes === void 0 ? void 0 : regimes.length) > 1 && (React__default["default"].createElement("div", { className: "select-wrapper__select" },
|
|
7774
|
+
React__default["default"].createElement("select", { defaultValue: option.line.regimeCode, onChange: handleRegimeChange, disabled: regimes.length === 1 }, regimes.map(function (regime) { return (React__default["default"].createElement("option", { key: regime.regimeCode, value: regime.regimeCode },
|
|
7775
|
+
regime.regimeName,
|
|
7776
|
+
" ",
|
|
7777
|
+
getRegimePriceDifference(regime))); })))))))),
|
|
7794
7778
|
React__default["default"].createElement("div", { className: buildClassName(["tree__column", "tree__column--price"]) }, !option.isSelected && (React__default["default"].createElement("span", { className: buildClassName([
|
|
7795
7779
|
"price",
|
|
7796
7780
|
priceDifference > 0 && "price--increase",
|
|
@@ -7844,11 +7828,15 @@ var OptionPaxGroup = function (_a) {
|
|
|
7844
7828
|
React__default["default"].createElement("div", { className: "tree__header" },
|
|
7845
7829
|
React__default["default"].createElement("div", { className: "tree__description-collapse" },
|
|
7846
7830
|
React__default["default"].createElement("div", { className: buildClassName([
|
|
7847
|
-
option.requirementType ===
|
|
7831
|
+
(option.requirementType === 0 ||
|
|
7832
|
+
option.requirementType === 1) &&
|
|
7833
|
+
"checkbox",
|
|
7848
7834
|
option.requirementType === 2 && "radiobutton",
|
|
7849
7835
|
]) },
|
|
7850
7836
|
React__default["default"].createElement("label", { htmlFor: parentId + "_" + index, className: buildClassName([
|
|
7851
|
-
option.requirementType ===
|
|
7837
|
+
(option.requirementType === 0 ||
|
|
7838
|
+
option.requirementType === 1) &&
|
|
7839
|
+
"checkbox__label",
|
|
7852
7840
|
option.requirementType === 2 &&
|
|
7853
7841
|
"radiobutton__label",
|
|
7854
7842
|
]) },
|
|
@@ -7951,11 +7939,15 @@ var OptionUnitGroup = function (_a) {
|
|
|
7951
7939
|
React__default["default"].createElement("div", { className: "tree__header" },
|
|
7952
7940
|
React__default["default"].createElement("div", { className: "tree__description-collapse" },
|
|
7953
7941
|
React__default["default"].createElement("div", { className: buildClassName([
|
|
7954
|
-
option.requirementType ===
|
|
7942
|
+
(option.requirementType === 0 ||
|
|
7943
|
+
option.requirementType === 1) &&
|
|
7944
|
+
"checkbox",
|
|
7955
7945
|
option.requirementType === 2 && "radiobutton",
|
|
7956
7946
|
]) },
|
|
7957
7947
|
React__default["default"].createElement("label", { htmlFor: parentId + "_" + index, className: buildClassName([
|
|
7958
|
-
option.requirementType ===
|
|
7948
|
+
(option.requirementType === 0 ||
|
|
7949
|
+
option.requirementType === 1) &&
|
|
7950
|
+
"checkbox__label",
|
|
7959
7951
|
option.requirementType === 2 &&
|
|
7960
7952
|
"radiobutton__label",
|
|
7961
7953
|
]) },
|
|
@@ -8068,11 +8060,15 @@ var OptionBookingGroup = function (_a) {
|
|
|
8068
8060
|
React__default["default"].createElement("div", { className: "tree__header" },
|
|
8069
8061
|
React__default["default"].createElement("div", { className: "tree__description-collapse" },
|
|
8070
8062
|
React__default["default"].createElement("div", { className: buildClassName([
|
|
8071
|
-
option.requirementType ===
|
|
8063
|
+
(option.requirementType === 0 ||
|
|
8064
|
+
option.requirementType === 1) &&
|
|
8065
|
+
"checkbox",
|
|
8072
8066
|
option.requirementType === 2 && "radiobutton",
|
|
8073
8067
|
]) },
|
|
8074
8068
|
React__default["default"].createElement("label", { htmlFor: parentId + "_" + index, className: buildClassName([
|
|
8075
|
-
option.requirementType ===
|
|
8069
|
+
(option.requirementType === 0 ||
|
|
8070
|
+
option.requirementType === 1) &&
|
|
8071
|
+
"checkbox__label",
|
|
8076
8072
|
option.requirementType === 2 &&
|
|
8077
8073
|
"radiobutton__label",
|
|
8078
8074
|
]) },
|
|
@@ -8264,9 +8260,12 @@ var Sidebar = function (_a) {
|
|
|
8264
8260
|
React__default["default"].createElement("h6", { className: "pricing-summary__title" }, translations.SIDEBAR.ACCOMMODATION),
|
|
8265
8261
|
accommodations.map(function (accommodation) {
|
|
8266
8262
|
var option = accommodation.options.find(function (x) { return x.isSelected; });
|
|
8267
|
-
return (React__default["default"].createElement("div", {
|
|
8268
|
-
React__default["default"].createElement("div", { className: "pricing-
|
|
8269
|
-
|
|
8263
|
+
return (React__default["default"].createElement("div", { key: accommodation.index },
|
|
8264
|
+
React__default["default"].createElement("div", { className: "pricing-summary__row" },
|
|
8265
|
+
React__default["default"].createElement("div", { className: "pricing-summary__property" }, option === null || option === void 0 ? void 0 : option.accommodationName),
|
|
8266
|
+
React__default["default"].createElement("div", { className: "pricing-summary__value" }, (option === null || option === void 0 ? void 0 : option.price) && formatPrice(option === null || option === void 0 ? void 0 : option.price))),
|
|
8267
|
+
(option === null || option === void 0 ? void 0 : option.regimeName) && (React__default["default"].createElement("div", { className: "pricing-summary__row" },
|
|
8268
|
+
React__default["default"].createElement("div", { className: "price-summarty__property" }, option === null || option === void 0 ? void 0 : option.regimeName)))));
|
|
8270
8269
|
})))),
|
|
8271
8270
|
!isLoading && canShowPriceBreakdownSection && (React__default["default"].createElement("div", { className: "pricing-summary__region" },
|
|
8272
8271
|
!lodash.isEmpty(includedCosts) && (React__default["default"].createElement("div", { className: "pricing-summary__group" },
|
|
@@ -1,18 +1,12 @@
|
|
|
1
1
|
import { RootState } from "../../store";
|
|
2
|
-
import { EntityState } from "@reduxjs/toolkit";
|
|
3
2
|
import { BookingPriceDetail } from "@qite/tide-client/build/types";
|
|
4
3
|
export interface PriceDetailsState {
|
|
5
|
-
priceDetails:
|
|
4
|
+
priceDetails: BookingPriceDetail[];
|
|
6
5
|
deposit?: number;
|
|
7
6
|
isBusy: boolean;
|
|
8
7
|
}
|
|
9
8
|
export declare const fetchPriceDetails: import("@reduxjs/toolkit").AsyncThunk<import("@qite/tide-client/build/types").BookingPriceDetails, void, {}>;
|
|
10
|
-
export declare const selectPriceDetails: (state:
|
|
11
|
-
booking: import("../booking/booking-slice").BookingState;
|
|
12
|
-
travelersForm: import("../travelers-form/travelers-form-slice").TravelersFormState;
|
|
13
|
-
priceDetails: PriceDetailsState;
|
|
14
|
-
summary: import("../summary/summary-slice").SummaryState;
|
|
15
|
-
}) => BookingPriceDetail[];
|
|
9
|
+
export declare const selectPriceDetails: (state: RootState) => BookingPriceDetail[];
|
|
16
10
|
export declare const selectPackagePriceDetails: import("reselect").OutputSelector<{
|
|
17
11
|
booking: import("../booking/booking-slice").BookingState;
|
|
18
12
|
travelersForm: import("../travelers-form/travelers-form-slice").TravelersFormState;
|
package/build/build-esm/index.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/* eslint-disable */
|
|
2
2
|
import React, { useContext, useState, useEffect } from 'react';
|
|
3
3
|
import { useDispatch, useSelector, Provider } from 'react-redux';
|
|
4
|
-
import { createSlice, createSelector, createAsyncThunk,
|
|
5
|
-
import { omit, isNil, range,
|
|
4
|
+
import { createSlice, createSelector, createAsyncThunk, configureStore } from '@reduxjs/toolkit';
|
|
5
|
+
import { omit, isNil, range, sum, isArray, isEmpty, compact, orderBy, uniq, uniqBy, first, sortBy, last, findIndex, set, get as get$2 } from 'lodash';
|
|
6
6
|
import JsonURL from '@jsonurl/jsonurl';
|
|
7
7
|
import { differenceInYears, format, parseISO, differenceInDays, parse } from 'date-fns';
|
|
8
8
|
import { navigate, Link, useLocation, Router } from '@reach/router';
|
|
@@ -6963,30 +6963,10 @@ var fetchPriceDetails = createAsyncThunk("priceDetails/fetchPriceDetails", funct
|
|
|
6963
6963
|
});
|
|
6964
6964
|
});
|
|
6965
6965
|
});
|
|
6966
|
-
var buildPriceDetailId = function (priceDetail) {
|
|
6967
|
-
return compact([
|
|
6968
|
-
priceDetail.productCode,
|
|
6969
|
-
priceDetail.accommodationCode,
|
|
6970
|
-
priceDetail.priceDescription,
|
|
6971
|
-
priceDetail.total,
|
|
6972
|
-
priceDetail.pricePerPax
|
|
6973
|
-
.filter(function (x) { return x.price; })
|
|
6974
|
-
.map(function (x) { return "" + x.paxId; })
|
|
6975
|
-
.join("_"),
|
|
6976
|
-
]).join("_");
|
|
6977
|
-
};
|
|
6978
|
-
var priceDetailsAdapter = createEntityAdapter({
|
|
6979
|
-
selectId: buildPriceDetailId,
|
|
6980
|
-
sortComparer: function (left, right) {
|
|
6981
|
-
var leftId = buildPriceDetailId(left);
|
|
6982
|
-
var rightId = buildPriceDetailId(right);
|
|
6983
|
-
return leftId.localeCompare(rightId);
|
|
6984
|
-
},
|
|
6985
|
-
});
|
|
6986
6966
|
var priceDetailsSlice = createSlice({
|
|
6987
6967
|
name: "priceDetails",
|
|
6988
6968
|
initialState: {
|
|
6989
|
-
priceDetails:
|
|
6969
|
+
priceDetails: [],
|
|
6990
6970
|
isBusy: false,
|
|
6991
6971
|
},
|
|
6992
6972
|
reducers: {
|
|
@@ -6994,20 +6974,21 @@ var priceDetailsSlice = createSlice({
|
|
|
6994
6974
|
state.isBusy = action.payload;
|
|
6995
6975
|
},
|
|
6996
6976
|
resetPriceDetails: function (state, _) {
|
|
6997
|
-
state.priceDetails =
|
|
6977
|
+
state.priceDetails = [];
|
|
6998
6978
|
},
|
|
6999
6979
|
},
|
|
7000
6980
|
extraReducers: function (builder) {
|
|
7001
6981
|
builder.addCase(fetchPriceDetails.fulfilled, function (state, action) {
|
|
7002
6982
|
if (action.payload) {
|
|
7003
6983
|
state.deposit = action.payload.deposit;
|
|
7004
|
-
|
|
6984
|
+
state.priceDetails = action.payload.details;
|
|
7005
6985
|
}
|
|
7006
6986
|
});
|
|
7007
6987
|
},
|
|
7008
6988
|
});
|
|
7009
|
-
var
|
|
7010
|
-
|
|
6989
|
+
var selectPriceDetails = function (state) {
|
|
6990
|
+
return state.priceDetails.priceDetails;
|
|
6991
|
+
};
|
|
7011
6992
|
var selectPackagePriceDetails = createSelector(selectPriceDetails, function (priceDetails) {
|
|
7012
6993
|
return priceDetails.filter(function (priceDetail) { return priceDetail.isInPackage; });
|
|
7013
6994
|
});
|
|
@@ -7391,7 +7372,7 @@ var getDatePeriodText = function (from, to) {
|
|
|
7391
7372
|
var fromDate = parseISO(from);
|
|
7392
7373
|
var toDate = parseISO(to);
|
|
7393
7374
|
var dayDifference = differenceInDays(toDate, fromDate);
|
|
7394
|
-
return dayDifference + " " + translations.OPTIONS_FORM.DAYS + ", " +
|
|
7375
|
+
return dayDifference + 1 + " " + translations.OPTIONS_FORM.DAYS + ", " + dayDifference + " " + translations.OPTIONS_FORM.NIGHTS;
|
|
7395
7376
|
}
|
|
7396
7377
|
catch (_a) {
|
|
7397
7378
|
return undefined;
|
|
@@ -7434,7 +7415,7 @@ var parseFlightLineDateTime = function (date, time) {
|
|
|
7434
7415
|
if (parsedTimeHours != NaN && parsedTimeMinutes != NaN) {
|
|
7435
7416
|
parsedDate.setUTCHours(parsedTimeHours, parsedTimeMinutes);
|
|
7436
7417
|
}
|
|
7437
|
-
return parsedDate.toISOString();
|
|
7418
|
+
return parsedDate.toISOString().slice(0, -1);
|
|
7438
7419
|
}
|
|
7439
7420
|
catch (_a) {
|
|
7440
7421
|
// Parsing failed
|
|
@@ -7744,6 +7725,10 @@ var OptionItem = function (_a) {
|
|
|
7744
7725
|
}
|
|
7745
7726
|
};
|
|
7746
7727
|
return (React.createElement(React.Fragment, null,
|
|
7728
|
+
option.requirementType === 0 && (React.createElement("input", { type: "checkbox", id: parentId + "_" + index, className: buildClassName([
|
|
7729
|
+
"checkbox__input",
|
|
7730
|
+
"checkbox__input--parent",
|
|
7731
|
+
]), defaultChecked: true, disabled: true })),
|
|
7747
7732
|
option.requirementType === 1 && (React.createElement("input", { type: "checkbox", id: parentId + "_" + index, className: buildClassName([
|
|
7748
7733
|
"checkbox__input",
|
|
7749
7734
|
"checkbox__input--parent",
|
|
@@ -7774,12 +7759,11 @@ var OptionItem = function (_a) {
|
|
|
7774
7759
|
" ",
|
|
7775
7760
|
getAccommodationPriceDifference(accommodation))); }))))),
|
|
7776
7761
|
React.createElement("div", { className: "tree__column" },
|
|
7777
|
-
React.createElement("div", { className: "select-wrapper" },
|
|
7778
|
-
React.createElement("
|
|
7779
|
-
|
|
7780
|
-
|
|
7781
|
-
|
|
7782
|
-
getRegimePriceDifference(regime))); }))))))),
|
|
7762
|
+
React.createElement("div", { className: "select-wrapper" }, (regimes === null || regimes === void 0 ? void 0 : regimes.length) > 1 && (React.createElement("div", { className: "select-wrapper__select" },
|
|
7763
|
+
React.createElement("select", { defaultValue: option.line.regimeCode, onChange: handleRegimeChange, disabled: regimes.length === 1 }, regimes.map(function (regime) { return (React.createElement("option", { key: regime.regimeCode, value: regime.regimeCode },
|
|
7764
|
+
regime.regimeName,
|
|
7765
|
+
" ",
|
|
7766
|
+
getRegimePriceDifference(regime))); })))))))),
|
|
7783
7767
|
React.createElement("div", { className: buildClassName(["tree__column", "tree__column--price"]) }, !option.isSelected && (React.createElement("span", { className: buildClassName([
|
|
7784
7768
|
"price",
|
|
7785
7769
|
priceDifference > 0 && "price--increase",
|
|
@@ -7833,11 +7817,15 @@ var OptionPaxGroup = function (_a) {
|
|
|
7833
7817
|
React.createElement("div", { className: "tree__header" },
|
|
7834
7818
|
React.createElement("div", { className: "tree__description-collapse" },
|
|
7835
7819
|
React.createElement("div", { className: buildClassName([
|
|
7836
|
-
option.requirementType ===
|
|
7820
|
+
(option.requirementType === 0 ||
|
|
7821
|
+
option.requirementType === 1) &&
|
|
7822
|
+
"checkbox",
|
|
7837
7823
|
option.requirementType === 2 && "radiobutton",
|
|
7838
7824
|
]) },
|
|
7839
7825
|
React.createElement("label", { htmlFor: parentId + "_" + index, className: buildClassName([
|
|
7840
|
-
option.requirementType ===
|
|
7826
|
+
(option.requirementType === 0 ||
|
|
7827
|
+
option.requirementType === 1) &&
|
|
7828
|
+
"checkbox__label",
|
|
7841
7829
|
option.requirementType === 2 &&
|
|
7842
7830
|
"radiobutton__label",
|
|
7843
7831
|
]) },
|
|
@@ -7940,11 +7928,15 @@ var OptionUnitGroup = function (_a) {
|
|
|
7940
7928
|
React.createElement("div", { className: "tree__header" },
|
|
7941
7929
|
React.createElement("div", { className: "tree__description-collapse" },
|
|
7942
7930
|
React.createElement("div", { className: buildClassName([
|
|
7943
|
-
option.requirementType ===
|
|
7931
|
+
(option.requirementType === 0 ||
|
|
7932
|
+
option.requirementType === 1) &&
|
|
7933
|
+
"checkbox",
|
|
7944
7934
|
option.requirementType === 2 && "radiobutton",
|
|
7945
7935
|
]) },
|
|
7946
7936
|
React.createElement("label", { htmlFor: parentId + "_" + index, className: buildClassName([
|
|
7947
|
-
option.requirementType ===
|
|
7937
|
+
(option.requirementType === 0 ||
|
|
7938
|
+
option.requirementType === 1) &&
|
|
7939
|
+
"checkbox__label",
|
|
7948
7940
|
option.requirementType === 2 &&
|
|
7949
7941
|
"radiobutton__label",
|
|
7950
7942
|
]) },
|
|
@@ -8057,11 +8049,15 @@ var OptionBookingGroup = function (_a) {
|
|
|
8057
8049
|
React.createElement("div", { className: "tree__header" },
|
|
8058
8050
|
React.createElement("div", { className: "tree__description-collapse" },
|
|
8059
8051
|
React.createElement("div", { className: buildClassName([
|
|
8060
|
-
option.requirementType ===
|
|
8052
|
+
(option.requirementType === 0 ||
|
|
8053
|
+
option.requirementType === 1) &&
|
|
8054
|
+
"checkbox",
|
|
8061
8055
|
option.requirementType === 2 && "radiobutton",
|
|
8062
8056
|
]) },
|
|
8063
8057
|
React.createElement("label", { htmlFor: parentId + "_" + index, className: buildClassName([
|
|
8064
|
-
option.requirementType ===
|
|
8058
|
+
(option.requirementType === 0 ||
|
|
8059
|
+
option.requirementType === 1) &&
|
|
8060
|
+
"checkbox__label",
|
|
8065
8061
|
option.requirementType === 2 &&
|
|
8066
8062
|
"radiobutton__label",
|
|
8067
8063
|
]) },
|
|
@@ -8253,9 +8249,12 @@ var Sidebar = function (_a) {
|
|
|
8253
8249
|
React.createElement("h6", { className: "pricing-summary__title" }, translations.SIDEBAR.ACCOMMODATION),
|
|
8254
8250
|
accommodations.map(function (accommodation) {
|
|
8255
8251
|
var option = accommodation.options.find(function (x) { return x.isSelected; });
|
|
8256
|
-
return (React.createElement("div", {
|
|
8257
|
-
React.createElement("div", { className: "pricing-
|
|
8258
|
-
|
|
8252
|
+
return (React.createElement("div", { key: accommodation.index },
|
|
8253
|
+
React.createElement("div", { className: "pricing-summary__row" },
|
|
8254
|
+
React.createElement("div", { className: "pricing-summary__property" }, option === null || option === void 0 ? void 0 : option.accommodationName),
|
|
8255
|
+
React.createElement("div", { className: "pricing-summary__value" }, (option === null || option === void 0 ? void 0 : option.price) && formatPrice(option === null || option === void 0 ? void 0 : option.price))),
|
|
8256
|
+
(option === null || option === void 0 ? void 0 : option.regimeName) && (React.createElement("div", { className: "pricing-summary__row" },
|
|
8257
|
+
React.createElement("div", { className: "price-summarty__property" }, option === null || option === void 0 ? void 0 : option.regimeName)))));
|
|
8259
8258
|
})))),
|
|
8260
8259
|
!isLoading && canShowPriceBreakdownSection && (React.createElement("div", { className: "pricing-summary__region" },
|
|
8261
8260
|
!isEmpty(includedCosts) && (React.createElement("div", { className: "pricing-summary__group" },
|
package/package.json
CHANGED
|
@@ -1,13 +1,11 @@
|
|
|
1
1
|
import { RootState } from "../../store";
|
|
2
2
|
import {
|
|
3
3
|
createAsyncThunk,
|
|
4
|
-
createEntityAdapter,
|
|
5
4
|
createSelector,
|
|
6
5
|
createSlice,
|
|
7
|
-
EntityState,
|
|
8
6
|
PayloadAction,
|
|
9
7
|
} from "@reduxjs/toolkit";
|
|
10
|
-
import {
|
|
8
|
+
import { sum } from "lodash";
|
|
11
9
|
|
|
12
10
|
import priceDetailsApi from "./price-details-api";
|
|
13
11
|
import { setPackage } from "../booking/booking-slice";
|
|
@@ -19,7 +17,7 @@ import { BookingPriceDetail } from "@qite/tide-client/build/types";
|
|
|
19
17
|
import { updatePackageDetails } from "./util";
|
|
20
18
|
|
|
21
19
|
export interface PriceDetailsState {
|
|
22
|
-
priceDetails:
|
|
20
|
+
priceDetails: BookingPriceDetail[];
|
|
23
21
|
deposit?: number;
|
|
24
22
|
isBusy: boolean;
|
|
25
23
|
}
|
|
@@ -58,31 +56,10 @@ export const fetchPriceDetails = createAsyncThunk(
|
|
|
58
56
|
}
|
|
59
57
|
);
|
|
60
58
|
|
|
61
|
-
const buildPriceDetailId = (priceDetail: BookingPriceDetail) =>
|
|
62
|
-
compact([
|
|
63
|
-
priceDetail.productCode,
|
|
64
|
-
priceDetail.accommodationCode,
|
|
65
|
-
priceDetail.priceDescription,
|
|
66
|
-
priceDetail.total,
|
|
67
|
-
priceDetail.pricePerPax
|
|
68
|
-
.filter((x) => x.price)
|
|
69
|
-
.map((x) => `${x.paxId}`)
|
|
70
|
-
.join("_"),
|
|
71
|
-
]).join("_");
|
|
72
|
-
|
|
73
|
-
const priceDetailsAdapter = createEntityAdapter<BookingPriceDetail>({
|
|
74
|
-
selectId: buildPriceDetailId,
|
|
75
|
-
sortComparer: (left, right) => {
|
|
76
|
-
const leftId = buildPriceDetailId(left);
|
|
77
|
-
const rightId = buildPriceDetailId(right);
|
|
78
|
-
return leftId.localeCompare(rightId);
|
|
79
|
-
},
|
|
80
|
-
});
|
|
81
|
-
|
|
82
59
|
const priceDetailsSlice = createSlice({
|
|
83
60
|
name: "priceDetails",
|
|
84
61
|
initialState: <PriceDetailsState>{
|
|
85
|
-
priceDetails:
|
|
62
|
+
priceDetails: [],
|
|
86
63
|
isBusy: false,
|
|
87
64
|
},
|
|
88
65
|
reducers: {
|
|
@@ -90,24 +67,21 @@ const priceDetailsSlice = createSlice({
|
|
|
90
67
|
state.isBusy = action.payload;
|
|
91
68
|
},
|
|
92
69
|
resetPriceDetails(state, _: PayloadAction<void>) {
|
|
93
|
-
state.priceDetails =
|
|
70
|
+
state.priceDetails = [];
|
|
94
71
|
},
|
|
95
72
|
},
|
|
96
73
|
extraReducers: (builder) => {
|
|
97
74
|
builder.addCase(fetchPriceDetails.fulfilled, (state, action) => {
|
|
98
75
|
if (action.payload) {
|
|
99
76
|
state.deposit = action.payload.deposit;
|
|
100
|
-
|
|
77
|
+
state.priceDetails = action.payload.details;
|
|
101
78
|
}
|
|
102
79
|
});
|
|
103
80
|
},
|
|
104
81
|
});
|
|
105
82
|
|
|
106
|
-
const
|
|
107
|
-
|
|
108
|
-
);
|
|
109
|
-
|
|
110
|
-
export const selectPriceDetails = priceDetailsSelectors.selectAll;
|
|
83
|
+
export const selectPriceDetails = (state: RootState) =>
|
|
84
|
+
state.priceDetails.priceDetails;
|
|
111
85
|
|
|
112
86
|
export const selectPackagePriceDetails = createSelector(
|
|
113
87
|
selectPriceDetails,
|
|
@@ -136,14 +136,18 @@ const OptionBookingGroup: React.FC<OptionBookingGroupProps> = ({
|
|
|
136
136
|
<div className="tree__description-collapse">
|
|
137
137
|
<div
|
|
138
138
|
className={buildClassName([
|
|
139
|
-
option.requirementType ===
|
|
139
|
+
(option.requirementType === 0 ||
|
|
140
|
+
option.requirementType === 1) &&
|
|
141
|
+
"checkbox",
|
|
140
142
|
option.requirementType === 2 && "radiobutton",
|
|
141
143
|
])}
|
|
142
144
|
>
|
|
143
145
|
<label
|
|
144
146
|
htmlFor={`${parentId}_${index}`}
|
|
145
147
|
className={buildClassName([
|
|
146
|
-
option.requirementType ===
|
|
148
|
+
(option.requirementType === 0 ||
|
|
149
|
+
option.requirementType === 1) &&
|
|
150
|
+
"checkbox__label",
|
|
147
151
|
option.requirementType === 2 &&
|
|
148
152
|
"radiobutton__label",
|
|
149
153
|
])}
|
|
@@ -177,6 +177,18 @@ const OptionItem: React.FC<OptionItemProps> = ({
|
|
|
177
177
|
|
|
178
178
|
return (
|
|
179
179
|
<>
|
|
180
|
+
{option.requirementType === 0 && (
|
|
181
|
+
<input
|
|
182
|
+
type="checkbox"
|
|
183
|
+
id={`${parentId}_${index}`}
|
|
184
|
+
className={buildClassName([
|
|
185
|
+
"checkbox__input",
|
|
186
|
+
"checkbox__input--parent",
|
|
187
|
+
])}
|
|
188
|
+
defaultChecked={true}
|
|
189
|
+
disabled={true}
|
|
190
|
+
></input>
|
|
191
|
+
)}
|
|
180
192
|
{option.requirementType === 1 && (
|
|
181
193
|
<input
|
|
182
194
|
type="checkbox"
|
|
@@ -254,22 +266,25 @@ const OptionItem: React.FC<OptionItemProps> = ({
|
|
|
254
266
|
</div>
|
|
255
267
|
<div className="tree__column">
|
|
256
268
|
<div className="select-wrapper">
|
|
257
|
-
|
|
258
|
-
<select
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
269
|
+
{regimes?.length > 1 && (
|
|
270
|
+
<div className="select-wrapper__select">
|
|
271
|
+
<select
|
|
272
|
+
defaultValue={option.line.regimeCode}
|
|
273
|
+
onChange={handleRegimeChange}
|
|
274
|
+
disabled={regimes.length === 1}
|
|
275
|
+
>
|
|
276
|
+
{regimes.map((regime) => (
|
|
277
|
+
<option
|
|
278
|
+
key={regime.regimeCode}
|
|
279
|
+
value={regime.regimeCode}
|
|
280
|
+
>
|
|
281
|
+
{regime.regimeName}{" "}
|
|
282
|
+
{getRegimePriceDifference(regime)}
|
|
283
|
+
</option>
|
|
284
|
+
))}
|
|
285
|
+
</select>
|
|
286
|
+
</div>
|
|
287
|
+
)}
|
|
273
288
|
</div>
|
|
274
289
|
</div>
|
|
275
290
|
</>
|
|
@@ -108,14 +108,18 @@ const OptionPaxGroup: React.FC<OptionPaxGroupProps> = ({
|
|
|
108
108
|
<div className="tree__description-collapse">
|
|
109
109
|
<div
|
|
110
110
|
className={buildClassName([
|
|
111
|
-
option.requirementType ===
|
|
111
|
+
(option.requirementType === 0 ||
|
|
112
|
+
option.requirementType === 1) &&
|
|
113
|
+
"checkbox",
|
|
112
114
|
option.requirementType === 2 && "radiobutton",
|
|
113
115
|
])}
|
|
114
116
|
>
|
|
115
117
|
<label
|
|
116
118
|
htmlFor={`${parentId}_${index}`}
|
|
117
119
|
className={buildClassName([
|
|
118
|
-
option.requirementType ===
|
|
120
|
+
(option.requirementType === 0 ||
|
|
121
|
+
option.requirementType === 1) &&
|
|
122
|
+
"checkbox__label",
|
|
119
123
|
option.requirementType === 2 &&
|
|
120
124
|
"radiobutton__label",
|
|
121
125
|
])}
|
|
@@ -124,14 +124,18 @@ const OptionUnitGroup: React.FC<OptionUnitGroupProps> = ({
|
|
|
124
124
|
<div className="tree__description-collapse">
|
|
125
125
|
<div
|
|
126
126
|
className={buildClassName([
|
|
127
|
-
option.requirementType ===
|
|
127
|
+
(option.requirementType === 0 ||
|
|
128
|
+
option.requirementType === 1) &&
|
|
129
|
+
"checkbox",
|
|
128
130
|
option.requirementType === 2 && "radiobutton",
|
|
129
131
|
])}
|
|
130
132
|
>
|
|
131
133
|
<label
|
|
132
134
|
htmlFor={`${parentId}_${index}`}
|
|
133
135
|
className={buildClassName([
|
|
134
|
-
option.requirementType ===
|
|
136
|
+
(option.requirementType === 0 ||
|
|
137
|
+
option.requirementType === 1) &&
|
|
138
|
+
"checkbox__label",
|
|
135
139
|
option.requirementType === 2 &&
|
|
136
140
|
"radiobutton__label",
|
|
137
141
|
])}
|
|
@@ -45,9 +45,9 @@ export const getDatePeriodText = (from?: string, to?: string) => {
|
|
|
45
45
|
const toDate = parseISO(to);
|
|
46
46
|
|
|
47
47
|
const dayDifference = differenceInDays(toDate, fromDate);
|
|
48
|
-
return `${dayDifference
|
|
49
|
-
|
|
50
|
-
} ${translations.OPTIONS_FORM.NIGHTS}`;
|
|
48
|
+
return `${dayDifference + 1} ${
|
|
49
|
+
translations.OPTIONS_FORM.DAYS
|
|
50
|
+
}, ${dayDifference} ${translations.OPTIONS_FORM.NIGHTS}`;
|
|
51
51
|
} catch {
|
|
52
52
|
return undefined;
|
|
53
53
|
}
|
|
@@ -145,7 +145,7 @@ const parseFlightLineDateTime = (
|
|
|
145
145
|
parsedDate.setUTCHours(parsedTimeHours, parsedTimeMinutes);
|
|
146
146
|
}
|
|
147
147
|
|
|
148
|
-
return parsedDate.toISOString();
|
|
148
|
+
return parsedDate.toISOString().slice(0, -1);
|
|
149
149
|
} catch {
|
|
150
150
|
// Parsing failed
|
|
151
151
|
return undefined;
|
|
@@ -139,16 +139,22 @@ const Sidebar: React.FC<SidebarProps> = ({
|
|
|
139
139
|
{accommodations.map((accommodation) => {
|
|
140
140
|
let option = accommodation.options.find((x) => x.isSelected);
|
|
141
141
|
return (
|
|
142
|
-
<div
|
|
143
|
-
className="pricing-summary__row"
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
{option?.price && formatPrice(option?.price)}
|
|
142
|
+
<div key={accommodation.index}>
|
|
143
|
+
<div className="pricing-summary__row">
|
|
144
|
+
<div className="pricing-summary__property">
|
|
145
|
+
{option?.accommodationName}
|
|
146
|
+
</div>
|
|
147
|
+
<div className="pricing-summary__value">
|
|
148
|
+
{option?.price && formatPrice(option?.price)}
|
|
149
|
+
</div>
|
|
151
150
|
</div>
|
|
151
|
+
{option?.regimeName && (
|
|
152
|
+
<div className="pricing-summary__row">
|
|
153
|
+
<div className="price-summarty__property">
|
|
154
|
+
{option?.regimeName}
|
|
155
|
+
</div>
|
|
156
|
+
</div>
|
|
157
|
+
)}
|
|
152
158
|
</div>
|
|
153
159
|
);
|
|
154
160
|
})}
|