@qite/tide-booking-component 1.2.5 → 1.3.0
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/.vs/ProjectSettings.json +3 -3
- package/.vs/VSWorkspaceState.json +5 -5
- package/README.md +8 -8
- package/build/build-cjs/booking-wizard/components/print-offer-button.d.ts +17 -0
- package/build/build-cjs/booking-wizard/types.d.ts +7 -0
- package/build/build-cjs/booking-wizard/use-offer-printer.d.ts +13 -0
- package/build/build-cjs/index.js +223 -72
- package/build/build-cjs/shared/utils/localization-util.d.ts +5 -0
- package/build/build-cjs/shared/utils/tide-api-utils.d.ts +1 -0
- package/build/build-esm/booking-wizard/components/print-offer-button.d.ts +17 -0
- package/build/build-esm/booking-wizard/types.d.ts +7 -0
- package/build/build-esm/booking-wizard/use-offer-printer.d.ts +13 -0
- package/build/build-esm/index.js +224 -73
- package/build/build-esm/shared/utils/localization-util.d.ts +5 -0
- package/build/build-esm/shared/utils/tide-api-utils.d.ts +1 -0
- package/package.json +75 -75
- package/rollup.config.js +23 -23
- package/src/booking-product/components/age-select.tsx +35 -35
- package/src/booking-product/components/amount-input.tsx +78 -78
- package/src/booking-product/components/date-range-picker/calendar-day.tsx +58 -58
- package/src/booking-product/components/date-range-picker/calendar.tsx +178 -178
- package/src/booking-product/components/date-range-picker/index.tsx +196 -196
- package/src/booking-product/components/dates.tsx +136 -136
- package/src/booking-product/components/footer.tsx +69 -69
- package/src/booking-product/components/header.tsx +79 -79
- package/src/booking-product/components/icon.tsx +251 -251
- package/src/booking-product/components/product.tsx +314 -314
- package/src/booking-product/components/rating.tsx +21 -21
- package/src/booking-product/components/rooms.tsx +195 -195
- package/src/booking-product/index.tsx +30 -30
- package/src/booking-product/settings-context.ts +14 -14
- package/src/booking-product/types.ts +28 -28
- package/src/booking-product/utils/api.ts +25 -25
- package/src/booking-product/utils/price.ts +29 -29
- package/src/booking-wizard/api-settings-slice.ts +24 -24
- package/src/booking-wizard/components/icon.tsx +508 -508
- package/src/booking-wizard/components/labeled-input.tsx +64 -64
- package/src/booking-wizard/components/labeled-select.tsx +69 -69
- package/src/booking-wizard/components/message.tsx +34 -34
- package/src/booking-wizard/components/multi-range-filter.tsx +113 -113
- package/src/booking-wizard/components/print-offer-button.tsx +66 -0
- package/src/booking-wizard/components/product-card.tsx +37 -37
- package/src/booking-wizard/components/step-indicator.tsx +51 -51
- package/src/booking-wizard/components/step-route.tsx +27 -27
- package/src/booking-wizard/declarations.d.ts +4 -4
- package/src/booking-wizard/features/booking/api.ts +49 -49
- package/src/booking-wizard/features/booking/booking-self-contained.tsx +384 -384
- package/src/booking-wizard/features/booking/booking-slice.ts +662 -662
- package/src/booking-wizard/features/booking/booking.tsx +356 -356
- package/src/booking-wizard/features/booking/constants.ts +16 -16
- package/src/booking-wizard/features/booking/selectors.ts +441 -441
- package/src/booking-wizard/features/confirmation/confirmation.tsx +97 -97
- package/src/booking-wizard/features/error/error.tsx +78 -78
- package/src/booking-wizard/features/flight-options/flight-filter.tsx +432 -432
- package/src/booking-wizard/features/flight-options/flight-option-flight.tsx +385 -385
- package/src/booking-wizard/features/flight-options/flight-option-modal.tsx +229 -229
- package/src/booking-wizard/features/flight-options/flight-option.tsx +81 -81
- package/src/booking-wizard/features/flight-options/flight-utils.ts +516 -516
- package/src/booking-wizard/features/flight-options/index.tsx +196 -196
- package/src/booking-wizard/features/price-details/price-details-api.ts +24 -24
- package/src/booking-wizard/features/price-details/price-details-slice.ts +178 -178
- package/src/booking-wizard/features/price-details/util.ts +155 -155
- package/src/booking-wizard/features/product-options/no-options.tsx +21 -21
- package/src/booking-wizard/features/product-options/none-option.tsx +120 -120
- package/src/booking-wizard/features/product-options/option-booking-airline-group.tsx +64 -64
- package/src/booking-wizard/features/product-options/option-booking-group.tsx +216 -216
- package/src/booking-wizard/features/product-options/option-item.tsx +317 -317
- package/src/booking-wizard/features/product-options/option-pax-card.tsx +201 -201
- package/src/booking-wizard/features/product-options/option-pax-group.tsx +175 -175
- package/src/booking-wizard/features/product-options/option-room.tsx +321 -321
- package/src/booking-wizard/features/product-options/option-unit-group.tsx +198 -198
- package/src/booking-wizard/features/product-options/option-units-card.tsx +185 -185
- package/src/booking-wizard/features/product-options/options-form.tsx +563 -459
- package/src/booking-wizard/features/room-options/index.tsx +187 -187
- package/src/booking-wizard/features/room-options/room-utils.ts +190 -190
- package/src/booking-wizard/features/room-options/room.tsx +160 -160
- package/src/booking-wizard/features/room-options/traveler-rooms.tsx +75 -75
- package/src/booking-wizard/features/sidebar/index.tsx +76 -76
- package/src/booking-wizard/features/sidebar/sidebar-flight.tsx +68 -68
- package/src/booking-wizard/features/sidebar/sidebar-util.ts +177 -177
- package/src/booking-wizard/features/sidebar/sidebar.tsx +364 -364
- package/src/booking-wizard/features/summary/summary-booking-option-pax.tsx +25 -25
- package/src/booking-wizard/features/summary/summary-booking-option-unit.tsx +25 -25
- package/src/booking-wizard/features/summary/summary-flight.tsx +39 -39
- package/src/booking-wizard/features/summary/summary-per-booking-option-group.tsx +69 -69
- package/src/booking-wizard/features/summary/summary-per-pax-option-group.tsx +63 -63
- package/src/booking-wizard/features/summary/summary-per-unit-option-group.tsx +66 -66
- package/src/booking-wizard/features/summary/summary-slice.ts +28 -28
- package/src/booking-wizard/features/summary/summary.tsx +674 -674
- package/src/booking-wizard/features/travelers-form/travelers-form-slice.ts +164 -164
- package/src/booking-wizard/features/travelers-form/travelers-form.tsx +754 -754
- package/src/booking-wizard/features/travelers-form/type-ahead-input.tsx +101 -101
- package/src/booking-wizard/features/travelers-form/validate-form.ts +245 -245
- package/src/booking-wizard/index.tsx +36 -36
- package/src/booking-wizard/settings-context.ts +67 -60
- package/src/booking-wizard/store.ts +31 -31
- package/src/booking-wizard/types.ts +283 -276
- package/src/booking-wizard/use-offer-printer.ts +136 -0
- package/src/index.ts +4 -4
- package/src/shared/components/loader.tsx +16 -16
- package/src/shared/translations/en-GB.json +237 -232
- package/src/shared/translations/fr-BE.json +238 -233
- package/src/shared/translations/nl-BE.json +237 -232
- package/src/shared/types.ts +4 -4
- package/src/shared/utils/class-util.ts +9 -9
- package/src/shared/utils/localization-util.ts +62 -62
- package/src/shared/utils/query-string-util.ts +119 -119
- package/src/shared/utils/tide-api-utils.ts +36 -36
- package/styles/booking-product-variables.scss +394 -394
- package/styles/booking-product.scss +446 -446
- package/styles/booking-wizard-variables.scss +873 -871
- package/styles/booking-wizard.scss +59 -59
- package/styles/components/_animations.scss +39 -39
- package/styles/components/_base.scss +107 -107
- package/styles/components/_booking.scss +879 -879
- package/styles/components/_button.scss +238 -238
- package/styles/components/_checkbox.scss +219 -219
- package/styles/components/_cta.scss +208 -208
- package/styles/components/_date-list.scss +41 -41
- package/styles/components/_date-range-picker.scss +225 -225
- package/styles/components/_decrement-increment.scss +35 -35
- package/styles/components/_dropdown.scss +72 -72
- package/styles/components/_flight-option.scss +1429 -1429
- package/styles/components/_form.scss +1583 -1583
- package/styles/components/_info-message.scss +71 -71
- package/styles/components/_input.scss +25 -25
- package/styles/components/_list.scss +187 -187
- package/styles/components/_loader.scss +72 -72
- package/styles/components/_mixins.scss +550 -550
- package/styles/components/_placeholders.scss +166 -166
- package/styles/components/_pricing-summary.scss +155 -155
- package/styles/components/_qsm.scss +17 -17
- package/styles/components/_radiobutton.scss +170 -170
- package/styles/components/_select-wrapper.scss +80 -80
- package/styles/components/_spinner.scss +29 -29
- package/styles/components/_step-indicators.scss +168 -168
- package/styles/components/_table.scss +81 -81
- package/styles/components/_tree.scss +530 -530
- package/styles/components/_typeahead.scss +281 -281
- package/styles/components/_variables.scss +89 -89
- package/tsconfig.json +24 -24
|
@@ -1,25 +1,25 @@
|
|
|
1
|
-
import { BookingOptionPax } from "@qite/tide-client/build/types";
|
|
2
|
-
import { isEmpty } from "lodash";
|
|
3
|
-
import React from "react";
|
|
4
|
-
import SummaryPerPaxOptionGroup from "./summary-per-pax-option-group";
|
|
5
|
-
|
|
6
|
-
interface SummaryBookingOptionPaxProps {
|
|
7
|
-
pax: BookingOptionPax;
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
const SummaryBookingOptionPax: React.FC<SummaryBookingOptionPaxProps> = ({
|
|
11
|
-
pax,
|
|
12
|
-
}) => {
|
|
13
|
-
return (
|
|
14
|
-
<>
|
|
15
|
-
{pax.groups.map((y) => {
|
|
16
|
-
const paxOptions = y.options.filter((y) => y.isSelected);
|
|
17
|
-
if (isEmpty(paxOptions)) return;
|
|
18
|
-
|
|
19
|
-
return <SummaryPerPaxOptionGroup group={y} />;
|
|
20
|
-
})}
|
|
21
|
-
</>
|
|
22
|
-
);
|
|
23
|
-
};
|
|
24
|
-
|
|
25
|
-
export default SummaryBookingOptionPax;
|
|
1
|
+
import { BookingOptionPax } from "@qite/tide-client/build/types";
|
|
2
|
+
import { isEmpty } from "lodash";
|
|
3
|
+
import React from "react";
|
|
4
|
+
import SummaryPerPaxOptionGroup from "./summary-per-pax-option-group";
|
|
5
|
+
|
|
6
|
+
interface SummaryBookingOptionPaxProps {
|
|
7
|
+
pax: BookingOptionPax;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
const SummaryBookingOptionPax: React.FC<SummaryBookingOptionPaxProps> = ({
|
|
11
|
+
pax,
|
|
12
|
+
}) => {
|
|
13
|
+
return (
|
|
14
|
+
<>
|
|
15
|
+
{pax.groups.map((y) => {
|
|
16
|
+
const paxOptions = y.options.filter((y) => y.isSelected);
|
|
17
|
+
if (isEmpty(paxOptions)) return;
|
|
18
|
+
|
|
19
|
+
return <SummaryPerPaxOptionGroup group={y} />;
|
|
20
|
+
})}
|
|
21
|
+
</>
|
|
22
|
+
);
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
export default SummaryBookingOptionPax;
|
|
@@ -1,25 +1,25 @@
|
|
|
1
|
-
import { BookingOptionUnit } from "@qite/tide-client/build/types";
|
|
2
|
-
import { isEmpty } from "lodash";
|
|
3
|
-
import React from "react";
|
|
4
|
-
import SummaryPerUnitOptionGroup from "./summary-per-unit-option-group";
|
|
5
|
-
|
|
6
|
-
interface SummaryBookingOptionUnitProps {
|
|
7
|
-
unit: BookingOptionUnit;
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
const SummaryBookingOptionUnit: React.FC<SummaryBookingOptionUnitProps> = ({
|
|
11
|
-
unit,
|
|
12
|
-
}) => {
|
|
13
|
-
return (
|
|
14
|
-
<>
|
|
15
|
-
{unit.groups.map((y) => {
|
|
16
|
-
const unitOptions = y.options.filter((y) => y.isSelected);
|
|
17
|
-
if (isEmpty(unitOptions)) return;
|
|
18
|
-
|
|
19
|
-
return <SummaryPerUnitOptionGroup group={y} />;
|
|
20
|
-
})}
|
|
21
|
-
</>
|
|
22
|
-
);
|
|
23
|
-
};
|
|
24
|
-
|
|
25
|
-
export default SummaryBookingOptionUnit;
|
|
1
|
+
import { BookingOptionUnit } from "@qite/tide-client/build/types";
|
|
2
|
+
import { isEmpty } from "lodash";
|
|
3
|
+
import React from "react";
|
|
4
|
+
import SummaryPerUnitOptionGroup from "./summary-per-unit-option-group";
|
|
5
|
+
|
|
6
|
+
interface SummaryBookingOptionUnitProps {
|
|
7
|
+
unit: BookingOptionUnit;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
const SummaryBookingOptionUnit: React.FC<SummaryBookingOptionUnitProps> = ({
|
|
11
|
+
unit,
|
|
12
|
+
}) => {
|
|
13
|
+
return (
|
|
14
|
+
<>
|
|
15
|
+
{unit.groups.map((y) => {
|
|
16
|
+
const unitOptions = y.options.filter((y) => y.isSelected);
|
|
17
|
+
if (isEmpty(unitOptions)) return;
|
|
18
|
+
|
|
19
|
+
return <SummaryPerUnitOptionGroup group={y} />;
|
|
20
|
+
})}
|
|
21
|
+
</>
|
|
22
|
+
);
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
export default SummaryBookingOptionUnit;
|
|
@@ -1,39 +1,39 @@
|
|
|
1
|
-
import { BookingPackageFlight } from "@qite/tide-client/build/types";
|
|
2
|
-
import React from "react";
|
|
3
|
-
import { useSelector } from "react-redux";
|
|
4
|
-
import { selectTranslations } from "../booking/selectors";
|
|
5
|
-
import { getDateText, parseFlightLines } from "../sidebar/sidebar-util";
|
|
6
|
-
|
|
7
|
-
interface SummaryFlightProps {
|
|
8
|
-
flight: BookingPackageFlight;
|
|
9
|
-
header: string;
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
const SummaryFlight: React.FC<SummaryFlightProps> = ({ flight, header }) => {
|
|
13
|
-
const translations = useSelector(selectTranslations);
|
|
14
|
-
|
|
15
|
-
return (
|
|
16
|
-
<li>
|
|
17
|
-
<h6>{header}</h6>
|
|
18
|
-
{parseFlightLines(flight.flightMetaData)?.map((flightLine) => (
|
|
19
|
-
<p key={flightLine.departureAirportIata}>
|
|
20
|
-
{flightLine.departureAirportDescription} (
|
|
21
|
-
{flightLine.departureAirportIata}) >{" "}
|
|
22
|
-
{flightLine.arrivalAirportDescription} (
|
|
23
|
-
{flightLine.arrivalAirportIata}) {" - "}
|
|
24
|
-
{flightLine.travelClass}
|
|
25
|
-
<br />
|
|
26
|
-
{getDateText(flightLine.departureDate)} {flightLine.departureTime}{" "}
|
|
27
|
-
> {getDateText(flightLine.arrivalDate)} {flightLine.arrivalTime}
|
|
28
|
-
<br />
|
|
29
|
-
{flightLine.airlineDescription}
|
|
30
|
-
</p>
|
|
31
|
-
))}
|
|
32
|
-
{flight.flightMetaData.luggageIncluded && (
|
|
33
|
-
<p>{translations.SIDEBAR.LUGGAGE_INCLUDED}</p>
|
|
34
|
-
)}
|
|
35
|
-
</li>
|
|
36
|
-
);
|
|
37
|
-
};
|
|
38
|
-
|
|
39
|
-
export default SummaryFlight;
|
|
1
|
+
import { BookingPackageFlight } from "@qite/tide-client/build/types";
|
|
2
|
+
import React from "react";
|
|
3
|
+
import { useSelector } from "react-redux";
|
|
4
|
+
import { selectTranslations } from "../booking/selectors";
|
|
5
|
+
import { getDateText, parseFlightLines } from "../sidebar/sidebar-util";
|
|
6
|
+
|
|
7
|
+
interface SummaryFlightProps {
|
|
8
|
+
flight: BookingPackageFlight;
|
|
9
|
+
header: string;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
const SummaryFlight: React.FC<SummaryFlightProps> = ({ flight, header }) => {
|
|
13
|
+
const translations = useSelector(selectTranslations);
|
|
14
|
+
|
|
15
|
+
return (
|
|
16
|
+
<li>
|
|
17
|
+
<h6>{header}</h6>
|
|
18
|
+
{parseFlightLines(flight.flightMetaData)?.map((flightLine) => (
|
|
19
|
+
<p key={flightLine.departureAirportIata}>
|
|
20
|
+
{flightLine.departureAirportDescription} (
|
|
21
|
+
{flightLine.departureAirportIata}) >{" "}
|
|
22
|
+
{flightLine.arrivalAirportDescription} (
|
|
23
|
+
{flightLine.arrivalAirportIata}) {" - "}
|
|
24
|
+
{flightLine.travelClass}
|
|
25
|
+
<br />
|
|
26
|
+
{getDateText(flightLine.departureDate)} {flightLine.departureTime}{" "}
|
|
27
|
+
> {getDateText(flightLine.arrivalDate)} {flightLine.arrivalTime}
|
|
28
|
+
<br />
|
|
29
|
+
{flightLine.airlineDescription}
|
|
30
|
+
</p>
|
|
31
|
+
))}
|
|
32
|
+
{flight.flightMetaData.luggageIncluded && (
|
|
33
|
+
<p>{translations.SIDEBAR.LUGGAGE_INCLUDED}</p>
|
|
34
|
+
)}
|
|
35
|
+
</li>
|
|
36
|
+
);
|
|
37
|
+
};
|
|
38
|
+
|
|
39
|
+
export default SummaryFlight;
|
|
@@ -1,69 +1,69 @@
|
|
|
1
|
-
import {
|
|
2
|
-
BookingOptionGroup,
|
|
3
|
-
PerBookingPackageOption,
|
|
4
|
-
} from "@qite/tide-client/build/types";
|
|
5
|
-
import { isEmpty, isNil } from "lodash";
|
|
6
|
-
import React from "react";
|
|
7
|
-
import { getDateText } from "../sidebar/sidebar-util";
|
|
8
|
-
import SummaryBookingOptionPax from "./summary-booking-option-pax";
|
|
9
|
-
import SummaryBookingOptionUnit from "./summary-booking-option-unit";
|
|
10
|
-
|
|
11
|
-
interface SummaryPerBookingOptionGroupProps {
|
|
12
|
-
group: BookingOptionGroup<PerBookingPackageOption>;
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
const SummaryPerBookingOptionGroup: React.FC<
|
|
16
|
-
SummaryPerBookingOptionGroupProps
|
|
17
|
-
> = ({ group }) => {
|
|
18
|
-
const groupOptions = group.options.filter((x) => x.isSelected);
|
|
19
|
-
|
|
20
|
-
const renderOptions = () => (
|
|
21
|
-
<>
|
|
22
|
-
{groupOptions.map((opt) => (
|
|
23
|
-
<li key={opt.line.entryLineGuid} className="list__item">
|
|
24
|
-
{opt.line.productName}
|
|
25
|
-
<ul>
|
|
26
|
-
<li>
|
|
27
|
-
{opt.line.accommodationName}
|
|
28
|
-
{!isNil(opt.line?.regimeName) && ", "}
|
|
29
|
-
{opt.line.regimeName}
|
|
30
|
-
</li>
|
|
31
|
-
</ul>
|
|
32
|
-
{getDateText(opt.line.startDate)}
|
|
33
|
-
{opt.line.startDate != opt.line.endDate
|
|
34
|
-
? ` > ${getDateText(opt.line.endDate)}`
|
|
35
|
-
: ""}
|
|
36
|
-
|
|
37
|
-
<ul>
|
|
38
|
-
{!isEmpty(opt?.groups) &&
|
|
39
|
-
opt?.groups.map((x) => {
|
|
40
|
-
if (!x.options.some((y) => y.isSelected)) return;
|
|
41
|
-
|
|
42
|
-
return <SummaryPerBookingOptionGroup group={x} />;
|
|
43
|
-
})}
|
|
44
|
-
{!isEmpty(opt?.units) &&
|
|
45
|
-
opt?.units.map((x) => <SummaryBookingOptionUnit unit={x} />)}
|
|
46
|
-
{!isEmpty(opt?.pax) &&
|
|
47
|
-
opt?.pax.map((x) => <SummaryBookingOptionPax pax={x} />)}
|
|
48
|
-
</ul>
|
|
49
|
-
</li>
|
|
50
|
-
))}
|
|
51
|
-
</>
|
|
52
|
-
);
|
|
53
|
-
|
|
54
|
-
return (
|
|
55
|
-
<>
|
|
56
|
-
{group.title ? (
|
|
57
|
-
<li className="list__item">
|
|
58
|
-
<h6>{group.title}</h6>
|
|
59
|
-
|
|
60
|
-
<ul className="list">{renderOptions()}</ul>
|
|
61
|
-
</li>
|
|
62
|
-
) : (
|
|
63
|
-
<>{renderOptions()}</>
|
|
64
|
-
)}
|
|
65
|
-
</>
|
|
66
|
-
);
|
|
67
|
-
};
|
|
68
|
-
|
|
69
|
-
export default SummaryPerBookingOptionGroup;
|
|
1
|
+
import {
|
|
2
|
+
BookingOptionGroup,
|
|
3
|
+
PerBookingPackageOption,
|
|
4
|
+
} from "@qite/tide-client/build/types";
|
|
5
|
+
import { isEmpty, isNil } from "lodash";
|
|
6
|
+
import React from "react";
|
|
7
|
+
import { getDateText } from "../sidebar/sidebar-util";
|
|
8
|
+
import SummaryBookingOptionPax from "./summary-booking-option-pax";
|
|
9
|
+
import SummaryBookingOptionUnit from "./summary-booking-option-unit";
|
|
10
|
+
|
|
11
|
+
interface SummaryPerBookingOptionGroupProps {
|
|
12
|
+
group: BookingOptionGroup<PerBookingPackageOption>;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
const SummaryPerBookingOptionGroup: React.FC<
|
|
16
|
+
SummaryPerBookingOptionGroupProps
|
|
17
|
+
> = ({ group }) => {
|
|
18
|
+
const groupOptions = group.options.filter((x) => x.isSelected);
|
|
19
|
+
|
|
20
|
+
const renderOptions = () => (
|
|
21
|
+
<>
|
|
22
|
+
{groupOptions.map((opt) => (
|
|
23
|
+
<li key={opt.line.entryLineGuid} className="list__item">
|
|
24
|
+
{opt.line.productName}
|
|
25
|
+
<ul>
|
|
26
|
+
<li>
|
|
27
|
+
{opt.line.accommodationName}
|
|
28
|
+
{!isNil(opt.line?.regimeName) && ", "}
|
|
29
|
+
{opt.line.regimeName}
|
|
30
|
+
</li>
|
|
31
|
+
</ul>
|
|
32
|
+
{getDateText(opt.line.startDate)}
|
|
33
|
+
{opt.line.startDate != opt.line.endDate
|
|
34
|
+
? ` > ${getDateText(opt.line.endDate)}`
|
|
35
|
+
: ""}
|
|
36
|
+
|
|
37
|
+
<ul>
|
|
38
|
+
{!isEmpty(opt?.groups) &&
|
|
39
|
+
opt?.groups.map((x) => {
|
|
40
|
+
if (!x.options.some((y) => y.isSelected)) return;
|
|
41
|
+
|
|
42
|
+
return <SummaryPerBookingOptionGroup group={x} />;
|
|
43
|
+
})}
|
|
44
|
+
{!isEmpty(opt?.units) &&
|
|
45
|
+
opt?.units.map((x) => <SummaryBookingOptionUnit unit={x} />)}
|
|
46
|
+
{!isEmpty(opt?.pax) &&
|
|
47
|
+
opt?.pax.map((x) => <SummaryBookingOptionPax pax={x} />)}
|
|
48
|
+
</ul>
|
|
49
|
+
</li>
|
|
50
|
+
))}
|
|
51
|
+
</>
|
|
52
|
+
);
|
|
53
|
+
|
|
54
|
+
return (
|
|
55
|
+
<>
|
|
56
|
+
{group.title ? (
|
|
57
|
+
<li className="list__item">
|
|
58
|
+
<h6>{group.title}</h6>
|
|
59
|
+
|
|
60
|
+
<ul className="list">{renderOptions()}</ul>
|
|
61
|
+
</li>
|
|
62
|
+
) : (
|
|
63
|
+
<>{renderOptions()}</>
|
|
64
|
+
)}
|
|
65
|
+
</>
|
|
66
|
+
);
|
|
67
|
+
};
|
|
68
|
+
|
|
69
|
+
export default SummaryPerBookingOptionGroup;
|
|
@@ -1,63 +1,63 @@
|
|
|
1
|
-
import {
|
|
2
|
-
BookingOptionGroup,
|
|
3
|
-
PerPaxPackageOption,
|
|
4
|
-
} from "@qite/tide-client/build/types";
|
|
5
|
-
import { isEmpty, isNil } from "lodash";
|
|
6
|
-
import React from "react";
|
|
7
|
-
import { getDateText } from "../sidebar/sidebar-util";
|
|
8
|
-
|
|
9
|
-
interface SummaryPerPaxOptionGroupProps {
|
|
10
|
-
group: BookingOptionGroup<PerPaxPackageOption>;
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
const SummaryPerPaxOptionGroup: React.FC<SummaryPerPaxOptionGroupProps> = ({
|
|
14
|
-
group,
|
|
15
|
-
}) => {
|
|
16
|
-
const groupOptions = group.options.filter((x) => x.isSelected);
|
|
17
|
-
|
|
18
|
-
const renderOptions = () => (
|
|
19
|
-
<>
|
|
20
|
-
{groupOptions.map((opt) => (
|
|
21
|
-
<li key={opt.line.entryLineGuid} className="list__item">
|
|
22
|
-
{opt.line.productName}
|
|
23
|
-
<ul>
|
|
24
|
-
<li>
|
|
25
|
-
{opt.line.accommodationName}
|
|
26
|
-
{!isNil(opt.line?.regimeName) && ", "}
|
|
27
|
-
{opt.line.regimeName}
|
|
28
|
-
</li>
|
|
29
|
-
</ul>
|
|
30
|
-
{getDateText(opt.line.startDate)}
|
|
31
|
-
{opt.line.startDate != opt.line.endDate
|
|
32
|
-
? ` > ${getDateText(opt.line.endDate)}`
|
|
33
|
-
: ""}
|
|
34
|
-
|
|
35
|
-
<ul className="list">
|
|
36
|
-
{!isEmpty(opt?.groups) &&
|
|
37
|
-
opt?.groups.map((x) => {
|
|
38
|
-
if (!x.options.some((y) => y.isSelected)) return;
|
|
39
|
-
|
|
40
|
-
return <SummaryPerPaxOptionGroup group={x} />;
|
|
41
|
-
})}
|
|
42
|
-
</ul>
|
|
43
|
-
</li>
|
|
44
|
-
))}
|
|
45
|
-
</>
|
|
46
|
-
);
|
|
47
|
-
|
|
48
|
-
return (
|
|
49
|
-
<>
|
|
50
|
-
{group.title ? (
|
|
51
|
-
<li className="list__item">
|
|
52
|
-
<h6>{group.title}</h6>
|
|
53
|
-
|
|
54
|
-
<ul className="list">{renderOptions()}</ul>
|
|
55
|
-
</li>
|
|
56
|
-
) : (
|
|
57
|
-
<>{renderOptions()}</>
|
|
58
|
-
)}
|
|
59
|
-
</>
|
|
60
|
-
);
|
|
61
|
-
};
|
|
62
|
-
|
|
63
|
-
export default SummaryPerPaxOptionGroup;
|
|
1
|
+
import {
|
|
2
|
+
BookingOptionGroup,
|
|
3
|
+
PerPaxPackageOption,
|
|
4
|
+
} from "@qite/tide-client/build/types";
|
|
5
|
+
import { isEmpty, isNil } from "lodash";
|
|
6
|
+
import React from "react";
|
|
7
|
+
import { getDateText } from "../sidebar/sidebar-util";
|
|
8
|
+
|
|
9
|
+
interface SummaryPerPaxOptionGroupProps {
|
|
10
|
+
group: BookingOptionGroup<PerPaxPackageOption>;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
const SummaryPerPaxOptionGroup: React.FC<SummaryPerPaxOptionGroupProps> = ({
|
|
14
|
+
group,
|
|
15
|
+
}) => {
|
|
16
|
+
const groupOptions = group.options.filter((x) => x.isSelected);
|
|
17
|
+
|
|
18
|
+
const renderOptions = () => (
|
|
19
|
+
<>
|
|
20
|
+
{groupOptions.map((opt) => (
|
|
21
|
+
<li key={opt.line.entryLineGuid} className="list__item">
|
|
22
|
+
{opt.line.productName}
|
|
23
|
+
<ul>
|
|
24
|
+
<li>
|
|
25
|
+
{opt.line.accommodationName}
|
|
26
|
+
{!isNil(opt.line?.regimeName) && ", "}
|
|
27
|
+
{opt.line.regimeName}
|
|
28
|
+
</li>
|
|
29
|
+
</ul>
|
|
30
|
+
{getDateText(opt.line.startDate)}
|
|
31
|
+
{opt.line.startDate != opt.line.endDate
|
|
32
|
+
? ` > ${getDateText(opt.line.endDate)}`
|
|
33
|
+
: ""}
|
|
34
|
+
|
|
35
|
+
<ul className="list">
|
|
36
|
+
{!isEmpty(opt?.groups) &&
|
|
37
|
+
opt?.groups.map((x) => {
|
|
38
|
+
if (!x.options.some((y) => y.isSelected)) return;
|
|
39
|
+
|
|
40
|
+
return <SummaryPerPaxOptionGroup group={x} />;
|
|
41
|
+
})}
|
|
42
|
+
</ul>
|
|
43
|
+
</li>
|
|
44
|
+
))}
|
|
45
|
+
</>
|
|
46
|
+
);
|
|
47
|
+
|
|
48
|
+
return (
|
|
49
|
+
<>
|
|
50
|
+
{group.title ? (
|
|
51
|
+
<li className="list__item">
|
|
52
|
+
<h6>{group.title}</h6>
|
|
53
|
+
|
|
54
|
+
<ul className="list">{renderOptions()}</ul>
|
|
55
|
+
</li>
|
|
56
|
+
) : (
|
|
57
|
+
<>{renderOptions()}</>
|
|
58
|
+
)}
|
|
59
|
+
</>
|
|
60
|
+
);
|
|
61
|
+
};
|
|
62
|
+
|
|
63
|
+
export default SummaryPerPaxOptionGroup;
|
|
@@ -1,66 +1,66 @@
|
|
|
1
|
-
import {
|
|
2
|
-
BookingOptionGroup,
|
|
3
|
-
PerUnitPackageOption,
|
|
4
|
-
} from "@qite/tide-client/build/types";
|
|
5
|
-
import { isEmpty, isNil } from "lodash";
|
|
6
|
-
import React from "react";
|
|
7
|
-
import { getDateText } from "../sidebar/sidebar-util";
|
|
8
|
-
import SummaryBookingOptionPax from "./summary-booking-option-pax";
|
|
9
|
-
|
|
10
|
-
interface SummaryPerUnitOptionGroupProps {
|
|
11
|
-
group: BookingOptionGroup<PerUnitPackageOption>;
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
const SummaryPerUnitOptionGroup: React.FC<SummaryPerUnitOptionGroupProps> = ({
|
|
15
|
-
group,
|
|
16
|
-
}) => {
|
|
17
|
-
const groupOptions = group.options.filter((x) => x.isSelected);
|
|
18
|
-
|
|
19
|
-
const renderOptions = () => (
|
|
20
|
-
<>
|
|
21
|
-
{groupOptions.map((opt) => (
|
|
22
|
-
<li key={opt.line.entryLineGuid} className="list__item">
|
|
23
|
-
{opt.line.productName}
|
|
24
|
-
<ul>
|
|
25
|
-
<li>
|
|
26
|
-
{opt.line.accommodationName}
|
|
27
|
-
{!isNil(opt.line?.regimeName) && ", "}
|
|
28
|
-
{opt.line.regimeName}
|
|
29
|
-
</li>
|
|
30
|
-
</ul>
|
|
31
|
-
{getDateText(opt.line.startDate)}
|
|
32
|
-
{opt.line.startDate != opt.line.endDate
|
|
33
|
-
? ` > ${getDateText(opt.line.endDate)}`
|
|
34
|
-
: ""}
|
|
35
|
-
|
|
36
|
-
<ul>
|
|
37
|
-
{!isEmpty(opt?.groups) &&
|
|
38
|
-
opt?.groups.map((x) => {
|
|
39
|
-
if (!x.options.some((y) => y.isSelected)) return;
|
|
40
|
-
|
|
41
|
-
return <SummaryPerUnitOptionGroup group={x} />;
|
|
42
|
-
})}
|
|
43
|
-
{!isEmpty(opt?.pax) &&
|
|
44
|
-
opt?.pax.map((x) => <SummaryBookingOptionPax pax={x} />)}
|
|
45
|
-
</ul>
|
|
46
|
-
</li>
|
|
47
|
-
))}
|
|
48
|
-
</>
|
|
49
|
-
);
|
|
50
|
-
|
|
51
|
-
return (
|
|
52
|
-
<>
|
|
53
|
-
{group.title ? (
|
|
54
|
-
<li className="list__item">
|
|
55
|
-
<h6>{group.title}</h6>
|
|
56
|
-
|
|
57
|
-
<ul className="list">{renderOptions()}</ul>
|
|
58
|
-
</li>
|
|
59
|
-
) : (
|
|
60
|
-
<>{renderOptions()}</>
|
|
61
|
-
)}
|
|
62
|
-
</>
|
|
63
|
-
);
|
|
64
|
-
};
|
|
65
|
-
|
|
66
|
-
export default SummaryPerUnitOptionGroup;
|
|
1
|
+
import {
|
|
2
|
+
BookingOptionGroup,
|
|
3
|
+
PerUnitPackageOption,
|
|
4
|
+
} from "@qite/tide-client/build/types";
|
|
5
|
+
import { isEmpty, isNil } from "lodash";
|
|
6
|
+
import React from "react";
|
|
7
|
+
import { getDateText } from "../sidebar/sidebar-util";
|
|
8
|
+
import SummaryBookingOptionPax from "./summary-booking-option-pax";
|
|
9
|
+
|
|
10
|
+
interface SummaryPerUnitOptionGroupProps {
|
|
11
|
+
group: BookingOptionGroup<PerUnitPackageOption>;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
const SummaryPerUnitOptionGroup: React.FC<SummaryPerUnitOptionGroupProps> = ({
|
|
15
|
+
group,
|
|
16
|
+
}) => {
|
|
17
|
+
const groupOptions = group.options.filter((x) => x.isSelected);
|
|
18
|
+
|
|
19
|
+
const renderOptions = () => (
|
|
20
|
+
<>
|
|
21
|
+
{groupOptions.map((opt) => (
|
|
22
|
+
<li key={opt.line.entryLineGuid} className="list__item">
|
|
23
|
+
{opt.line.productName}
|
|
24
|
+
<ul>
|
|
25
|
+
<li>
|
|
26
|
+
{opt.line.accommodationName}
|
|
27
|
+
{!isNil(opt.line?.regimeName) && ", "}
|
|
28
|
+
{opt.line.regimeName}
|
|
29
|
+
</li>
|
|
30
|
+
</ul>
|
|
31
|
+
{getDateText(opt.line.startDate)}
|
|
32
|
+
{opt.line.startDate != opt.line.endDate
|
|
33
|
+
? ` > ${getDateText(opt.line.endDate)}`
|
|
34
|
+
: ""}
|
|
35
|
+
|
|
36
|
+
<ul>
|
|
37
|
+
{!isEmpty(opt?.groups) &&
|
|
38
|
+
opt?.groups.map((x) => {
|
|
39
|
+
if (!x.options.some((y) => y.isSelected)) return;
|
|
40
|
+
|
|
41
|
+
return <SummaryPerUnitOptionGroup group={x} />;
|
|
42
|
+
})}
|
|
43
|
+
{!isEmpty(opt?.pax) &&
|
|
44
|
+
opt?.pax.map((x) => <SummaryBookingOptionPax pax={x} />)}
|
|
45
|
+
</ul>
|
|
46
|
+
</li>
|
|
47
|
+
))}
|
|
48
|
+
</>
|
|
49
|
+
);
|
|
50
|
+
|
|
51
|
+
return (
|
|
52
|
+
<>
|
|
53
|
+
{group.title ? (
|
|
54
|
+
<li className="list__item">
|
|
55
|
+
<h6>{group.title}</h6>
|
|
56
|
+
|
|
57
|
+
<ul className="list">{renderOptions()}</ul>
|
|
58
|
+
</li>
|
|
59
|
+
) : (
|
|
60
|
+
<>{renderOptions()}</>
|
|
61
|
+
)}
|
|
62
|
+
</>
|
|
63
|
+
);
|
|
64
|
+
};
|
|
65
|
+
|
|
66
|
+
export default SummaryPerUnitOptionGroup;
|
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
import { PayloadAction, createSlice } from "@reduxjs/toolkit";
|
|
2
|
-
|
|
3
|
-
import { RootState } from "../../store";
|
|
4
|
-
|
|
5
|
-
export interface SummaryState {
|
|
6
|
-
userValidated: boolean;
|
|
7
|
-
}
|
|
8
|
-
|
|
9
|
-
const initialState: SummaryState = {
|
|
10
|
-
userValidated: false,
|
|
11
|
-
};
|
|
12
|
-
|
|
13
|
-
const summarySlice = createSlice({
|
|
14
|
-
name: "summary",
|
|
15
|
-
initialState,
|
|
16
|
-
reducers: {
|
|
17
|
-
setUserValidated(state, action: PayloadAction<boolean>) {
|
|
18
|
-
state.userValidated = action.payload;
|
|
19
|
-
},
|
|
20
|
-
},
|
|
21
|
-
});
|
|
22
|
-
|
|
23
|
-
export const { setUserValidated } = summarySlice.actions;
|
|
24
|
-
|
|
25
|
-
export const selectUserValidated = (state: RootState) =>
|
|
26
|
-
state.summary.userValidated;
|
|
27
|
-
|
|
28
|
-
export default summarySlice.reducer;
|
|
1
|
+
import { PayloadAction, createSlice } from "@reduxjs/toolkit";
|
|
2
|
+
|
|
3
|
+
import { RootState } from "../../store";
|
|
4
|
+
|
|
5
|
+
export interface SummaryState {
|
|
6
|
+
userValidated: boolean;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
const initialState: SummaryState = {
|
|
10
|
+
userValidated: false,
|
|
11
|
+
};
|
|
12
|
+
|
|
13
|
+
const summarySlice = createSlice({
|
|
14
|
+
name: "summary",
|
|
15
|
+
initialState,
|
|
16
|
+
reducers: {
|
|
17
|
+
setUserValidated(state, action: PayloadAction<boolean>) {
|
|
18
|
+
state.userValidated = action.payload;
|
|
19
|
+
},
|
|
20
|
+
},
|
|
21
|
+
});
|
|
22
|
+
|
|
23
|
+
export const { setUserValidated } = summarySlice.actions;
|
|
24
|
+
|
|
25
|
+
export const selectUserValidated = (state: RootState) =>
|
|
26
|
+
state.summary.userValidated;
|
|
27
|
+
|
|
28
|
+
export default summarySlice.reducer;
|