ublo-lib 1.37.9 → 1.37.11
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/es/common/components/cross-selling-editor/services/utils.js +10 -10
- package/es/esf/components/magic-box/filter.module.css +1 -0
- package/es/esf/components/magic-box/filters.d.ts +4 -1
- package/es/esf/components/magic-box/filters.d.ts.map +1 -1
- package/es/esf/components/magic-box/filters.js +9 -5
- package/es/esf/components/magic-box/filters.module.css +18 -0
- package/es/esf/components/magic-box/magic-box.d.ts +6 -1
- package/es/esf/components/magic-box/magic-box.d.ts.map +1 -1
- package/es/esf/components/magic-box/magic-box.js +61 -42
- package/es/esf/components/magic-box/magic-box.module.css +5 -0
- package/es/esf/components/magic-box/messages.d.ts.map +1 -1
- package/es/esf/components/magic-box/messages.js +4 -0
- package/package.json +1 -1
|
@@ -68,20 +68,20 @@ function getMatchingOverrides(item, cartContent, forcedEsfOverride) {
|
|
|
68
68
|
if (merchants?.length > 0) {
|
|
69
69
|
isMatching = isMerchantMatching;
|
|
70
70
|
}
|
|
71
|
-
if (
|
|
72
|
-
isMatching = isDurationTagMatching;
|
|
71
|
+
if (durationTags?.length > 0) {
|
|
72
|
+
isMatching = isDurationTagMatching || isMatching;
|
|
73
73
|
}
|
|
74
|
-
if (
|
|
75
|
-
isMatching = isEllohaGroupMatching;
|
|
74
|
+
if (ellohaGroups?.length > 0) {
|
|
75
|
+
isMatching = isEllohaGroupMatching || isMatching;
|
|
76
76
|
}
|
|
77
|
-
if (
|
|
78
|
-
isMatching = isSkiPassDurationMatching;
|
|
77
|
+
if (skiPassDurations?.length > 0) {
|
|
78
|
+
isMatching = isSkiPassDurationMatching || isMatching;
|
|
79
79
|
}
|
|
80
|
-
if (
|
|
81
|
-
isMatching = isEsfProductMatching;
|
|
80
|
+
if (esfOffersContent?.length > 0) {
|
|
81
|
+
isMatching = isEsfProductMatching || isMatching;
|
|
82
82
|
}
|
|
83
|
-
if (
|
|
84
|
-
isMatching = isStayMatching;
|
|
83
|
+
if (stay) {
|
|
84
|
+
isMatching = isStayMatching || isMatching;
|
|
85
85
|
}
|
|
86
86
|
return isMatching ? [...acc, override.id] : acc;
|
|
87
87
|
}, []);
|
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
export default Filters;
|
|
2
|
-
declare function Filters({ filters, values, setValues }: {
|
|
2
|
+
declare function Filters({ filters, values, setValues, customSubmit, customSubmitChecked, setCustomSubmitChecked, }: {
|
|
3
3
|
filters: any;
|
|
4
4
|
values: any;
|
|
5
5
|
setValues: any;
|
|
6
|
+
customSubmit: any;
|
|
7
|
+
customSubmitChecked: any;
|
|
8
|
+
setCustomSubmitChecked: any;
|
|
6
9
|
}): import("react/jsx-runtime").JSX.Element;
|
|
7
10
|
//# sourceMappingURL=filters.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filters.d.ts","sourceRoot":"","sources":["../../../../src/esf/components/magic-box/filters.js"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"filters.d.ts","sourceRoot":"","sources":["../../../../src/esf/components/magic-box/filters.js"],"names":[],"mappings":";AAKA;;;;;;;4CAkCC"}
|
|
@@ -1,9 +1,13 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import * as React from "react";
|
|
3
3
|
import Filter from "./filter";
|
|
4
|
+
import Checkbox from "dt-design-system/es/checkbox";
|
|
4
5
|
import css from "./filters.module.css";
|
|
5
|
-
const Filters = ({ filters, values, setValues
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
6
|
+
const Filters = ({ filters, values, setValues, customSubmit, customSubmitChecked, setCustomSubmitChecked, }) => {
|
|
7
|
+
const { label } = customSubmit || {};
|
|
8
|
+
return (_jsxs("div", { className: css.filters, children: [Object.keys(filters).map((key) => {
|
|
9
|
+
const filter = filters[key];
|
|
10
|
+
return (_jsx(Filter, { code: key, filter: filter, values: values, setValues: setValues }, key));
|
|
11
|
+
}), customSubmit && (_jsx(Checkbox, { className: css.customCheckbox, label: label, checked: customSubmitChecked, onCheckedChange: setCustomSubmitChecked }))] }));
|
|
12
|
+
};
|
|
9
13
|
export default Filters;
|
|
@@ -5,6 +5,7 @@
|
|
|
5
5
|
flex-wrap: wrap;
|
|
6
6
|
gap: 40px 1ch;
|
|
7
7
|
margin: 30px auto;
|
|
8
|
+
color: inherit;
|
|
8
9
|
}
|
|
9
10
|
|
|
10
11
|
[data-align="left"] .filters {
|
|
@@ -14,3 +15,20 @@
|
|
|
14
15
|
[data-align="right"] .filters {
|
|
15
16
|
justify-content: flex-end;
|
|
16
17
|
}
|
|
18
|
+
|
|
19
|
+
.customCheckbox {
|
|
20
|
+
flex: 1 1 100%;
|
|
21
|
+
justify-content: center;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.customCheckbox > div {
|
|
25
|
+
flex: 0 1 auto;
|
|
26
|
+
font-size: 15px;
|
|
27
|
+
color: inherit;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
@media (min-width: 990px) {
|
|
31
|
+
.customCheckbox > div {
|
|
32
|
+
font-size: 20px;
|
|
33
|
+
}
|
|
34
|
+
}
|
|
@@ -21,8 +21,13 @@ type Props = {
|
|
|
21
21
|
msemWidgetHost?: MseMWidgetHost;
|
|
22
22
|
msemApiHost?: MseMApiHost;
|
|
23
23
|
msemAdminHost?: MseMAdminHost;
|
|
24
|
+
customSubmit?: {
|
|
25
|
+
label: string;
|
|
26
|
+
destination: string;
|
|
27
|
+
forwardFieldValues: boolean;
|
|
28
|
+
};
|
|
24
29
|
};
|
|
25
30
|
declare const _default: React.MemoExoticComponent<typeof MagicBox>;
|
|
26
31
|
export default _default;
|
|
27
|
-
declare function MagicBox({ stay, cartUrl, channel, className, alignContent, maxCPDuration, minDays, maxDays, allowedActivities, categories, msemWidgetHost, msemApiHost, msemAdminHost, children, }: Props): import("react/jsx-runtime").JSX.Element;
|
|
32
|
+
declare function MagicBox({ stay, cartUrl, channel, className, alignContent, maxCPDuration, minDays, maxDays, allowedActivities, categories, msemWidgetHost, msemApiHost, msemAdminHost, customSubmit, children, }: Props): import("react/jsx-runtime").JSX.Element;
|
|
28
33
|
//# sourceMappingURL=magic-box.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"magic-box.d.ts","sourceRoot":"","sources":["../../../../src/esf/components/magic-box/magic-box.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"magic-box.d.ts","sourceRoot":"","sources":["../../../../src/esf/components/magic-box/magic-box.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,KAAK,IAAI,GAAG;IACV,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;CACZ,CAAC;AAEF,KAAK,cAAc,GACf,0BAA0B,GAC1B,sCAAsC,CAAC;AAC3C,KAAK,WAAW,GACZ,oCAAoC,GACpC,gDAAgD,CAAC;AACrD,KAAK,aAAa,GACd,oDAAoD,GACpD,gEAAgE,CAAC;AAErE,KAAK,KAAK,GAAG;IACX,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,KAAK,GAAG,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC3C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,iBAAiB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC7B,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,YAAY,CAAC,EAAE;QACb,KAAK,EAAE,MAAM,CAAC;QACd,WAAW,EAAE,MAAM,CAAC;QACpB,kBAAkB,EAAE,OAAO,CAAC;KAC7B,CAAC;CACH,CAAC;;AAIF,wBAAoC;AAEpC,iBAAS,QAAQ,CAAC,EAChB,IAAI,EACJ,OAAO,EACP,OAAe,EACf,SAAS,EACT,YAAY,EACZ,aAAa,EACb,OAAW,EACX,OAAkB,EAClB,iBAAiB,EACjB,UAAU,EACV,cAA2C,EAC3C,WAAkD,EAClD,aAAoE,EACpE,YAAY,EACZ,QAAQ,GACT,EAAE,KAAK,2CA6MP"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import * as React from "react";
|
|
3
3
|
import classNames from "classnames";
|
|
4
|
+
import Router from "next/router";
|
|
4
5
|
import { useUbloContext } from "ublo/with-ublo";
|
|
5
6
|
import Button from "dt-design-system/es/button";
|
|
6
7
|
import * as Icons from "dt-design-system/es/icons";
|
|
@@ -10,10 +11,12 @@ import { message } from "./messages";
|
|
|
10
11
|
import * as API from "./services/api";
|
|
11
12
|
import css from "./magic-box.module.css";
|
|
12
13
|
export default React.memo(MagicBox);
|
|
13
|
-
function MagicBox({ stay, cartUrl, channel = "ESF", className, alignContent, maxCPDuration, minDays = 0, maxDays = Infinity, allowedActivities, categories, msemWidgetHost = "https://widget.msem.tech", msemApiHost = "https://services.msem.tech/api/esf", msemAdminHost = "https://admin.mon-sejour-en-montagne.com/api/gesco", children, }) {
|
|
14
|
+
function MagicBox({ stay, cartUrl, channel = "ESF", className, alignContent, maxCPDuration, minDays = 0, maxDays = Infinity, allowedActivities, categories, msemWidgetHost = "https://widget.msem.tech", msemApiHost = "https://services.msem.tech/api/esf", msemAdminHost = "https://admin.mon-sejour-en-montagne.com/api/gesco", customSubmit, children, }) {
|
|
14
15
|
const [filters, setFilters] = React.useState();
|
|
15
16
|
const [values, setValues] = React.useState();
|
|
16
17
|
const [currentStep, setCurrentStep] = React.useState(0);
|
|
18
|
+
const [VELClosed] = React.useState(false);
|
|
19
|
+
const [customSubmitChecked, setCustomSubmitChecked] = React.useState(false);
|
|
17
20
|
const { lang, config } = useUbloContext();
|
|
18
21
|
const { resort, merchant } = config;
|
|
19
22
|
const valuesKeys = React.useMemo(() => (values ? Object.keys(values) : []), [values]);
|
|
@@ -28,6 +31,19 @@ function MagicBox({ stay, cartUrl, channel = "ESF", className, alignContent, max
|
|
|
28
31
|
});
|
|
29
32
|
}, [filtersKeys.length, values, valuesKeys]);
|
|
30
33
|
const isValid = validate();
|
|
34
|
+
const submit = () => {
|
|
35
|
+
if (customSubmitChecked) {
|
|
36
|
+
const params = encodeURIComponent(JSON.stringify(values));
|
|
37
|
+
Router.push({
|
|
38
|
+
pathname: customSubmit?.destination,
|
|
39
|
+
query: { values: params },
|
|
40
|
+
hash: "prestige-form",
|
|
41
|
+
});
|
|
42
|
+
}
|
|
43
|
+
else {
|
|
44
|
+
setCurrentStep(1);
|
|
45
|
+
}
|
|
46
|
+
};
|
|
31
47
|
const refreshFilters = React.useCallback(async () => {
|
|
32
48
|
if (stay) {
|
|
33
49
|
const { from: stayFrom, to: stayTo } = stay;
|
|
@@ -42,46 +58,48 @@ function MagicBox({ stay, cartUrl, channel = "ESF", className, alignContent, max
|
|
|
42
58
|
API.fetchParams(msemAdminHost, lang, resort, merchant, channel, categories),
|
|
43
59
|
]);
|
|
44
60
|
const { season: currentSeason, availableSeasons } = welcomeResult;
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
const
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
item.
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
61
|
+
if (true) {
|
|
62
|
+
const { categories: categoryList } = paramsResult;
|
|
63
|
+
const season = currentSeason || availableSeasons[0] || "2025";
|
|
64
|
+
const filtersResult = await API.fetchFilters({
|
|
65
|
+
msemApiHost,
|
|
66
|
+
lang,
|
|
67
|
+
resort,
|
|
68
|
+
season,
|
|
69
|
+
stayFrom,
|
|
70
|
+
stayTo,
|
|
71
|
+
});
|
|
72
|
+
const newFilters = Object.keys(filtersResult.filters).reduce((acc, key) => {
|
|
73
|
+
const filter = filtersResult.filters[key];
|
|
74
|
+
if (key === "days") {
|
|
75
|
+
const days = filter.filter((item) => {
|
|
76
|
+
return (!item.restricted &&
|
|
77
|
+
item.value >= minDays &&
|
|
78
|
+
item.value <= maxDays);
|
|
79
|
+
});
|
|
80
|
+
return { ...acc, [key]: days };
|
|
81
|
+
}
|
|
82
|
+
if (key === "activities") {
|
|
83
|
+
const mustFilterActivities = allowedActivities && allowedActivities.length > 0;
|
|
84
|
+
const activities = filter.filter((item) => {
|
|
85
|
+
if (mustFilterActivities) {
|
|
86
|
+
return (!item.restricted && allowedActivities.includes(item.value));
|
|
87
|
+
}
|
|
88
|
+
return !item.restricted;
|
|
89
|
+
});
|
|
90
|
+
return { ...acc, activities };
|
|
91
|
+
}
|
|
92
|
+
const filterWithoutRestricted = filter.filter((item) => !item.restricted);
|
|
93
|
+
return { ...acc, [key]: filterWithoutRestricted };
|
|
94
|
+
}, {});
|
|
95
|
+
const formattedCategories = categoryList?.map(({ code, label }) => {
|
|
96
|
+
return { value: code, libelle: label };
|
|
97
|
+
});
|
|
98
|
+
const allFilters = categories
|
|
99
|
+
? { ...newFilters, categories: formattedCategories }
|
|
100
|
+
: newFilters;
|
|
101
|
+
setFilters(allFilters);
|
|
102
|
+
}
|
|
85
103
|
}
|
|
86
104
|
}, [
|
|
87
105
|
allowedActivities,
|
|
@@ -109,8 +127,9 @@ function MagicBox({ stay, cartUrl, channel = "ESF", className, alignContent, max
|
|
|
109
127
|
refreshFilters();
|
|
110
128
|
}, [refreshFilters, stay]);
|
|
111
129
|
const showFilter = stay && filters && values;
|
|
130
|
+
const SubmitIcon = customSubmitChecked ? Icons.ArrowRight : Icons.Search;
|
|
112
131
|
const classes = classNames(css.root, className);
|
|
113
|
-
return (_jsx("div", { className: classes, "data-align": alignContent, children: _jsxs("div", { className: css.top, children: [children, currentStep === 0 && (_jsxs(_Fragment, { children: [!filters && _jsx("div", { className: css.loader }), showFilter && (_jsx(Filters, { filters: filters, values: values, setValues: setValues })), _jsxs(Button, { className: css.confirm, onClick:
|
|
132
|
+
return (_jsx("div", { className: classes, "data-align": alignContent, children: _jsxs("div", { className: css.top, children: [children, VELClosed && (_jsx("div", { className: css.closedMessage, children: message(lang, "vel-closed") })), !VELClosed && currentStep === 0 && (_jsxs(_Fragment, { children: [!filters && _jsx("div", { className: css.loader }), showFilter && (_jsx(Filters, { filters: filters, values: values, setValues: setValues, customSubmit: customSubmit, customSubmitChecked: customSubmitChecked, setCustomSubmitChecked: setCustomSubmitChecked })), _jsxs(Button, { className: css.confirm, onClick: submit, disabled: !isValid, children: [message(lang, customSubmitChecked ? "proceed" : "confirm"), _jsx(SubmitIcon, {})] })] })), currentStep === 1 && (_jsx(Booking, { stay: stay, cartUrl: cartUrl, channel: channel, values: values, maxCPDuration: maxCPDuration, setCurrentStep: setCurrentStep, msemWidgetHost: msemWidgetHost }))] }) }));
|
|
114
133
|
}
|
|
115
134
|
function getDefaultValues(filters) {
|
|
116
135
|
return Object.keys(filters || {}).reduce((acc, key) => {
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
position: relative;
|
|
3
3
|
display: flex;
|
|
4
4
|
flex-direction: column;
|
|
5
|
+
color: inherit;
|
|
5
6
|
background-color: var(--ds-grey-200, #efefef);
|
|
6
7
|
}
|
|
7
8
|
|
|
@@ -26,6 +27,10 @@
|
|
|
26
27
|
}
|
|
27
28
|
}
|
|
28
29
|
|
|
30
|
+
.closedMessage {
|
|
31
|
+
text-align: center;
|
|
32
|
+
}
|
|
33
|
+
|
|
29
34
|
.loader {
|
|
30
35
|
display: table;
|
|
31
36
|
width: 42px;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"messages.d.ts","sourceRoot":"","sources":["../../../../src/esf/components/magic-box/messages.js"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"messages.d.ts","sourceRoot":"","sources":["../../../../src/esf/components/magic-box/messages.js"],"names":[],"mappings":"AA6BO,iDAIN"}
|
|
@@ -9,6 +9,8 @@ const locales = {
|
|
|
9
9
|
days: " pendant ",
|
|
10
10
|
durations: " sur des cours de ",
|
|
11
11
|
categories: " à ",
|
|
12
|
+
"vel-closed": "La vente en ligne est fermée pour le moment.",
|
|
13
|
+
proceed: "Finaliser ma demande",
|
|
12
14
|
},
|
|
13
15
|
en: {
|
|
14
16
|
confirm: "Find an instructor",
|
|
@@ -20,6 +22,8 @@ const locales = {
|
|
|
20
22
|
days: " for ",
|
|
21
23
|
durations: " with lessons of ",
|
|
22
24
|
categories: " at ",
|
|
25
|
+
"vel-closed": "Online sales are closed for now.",
|
|
26
|
+
proceed: "Finalize my request",
|
|
23
27
|
},
|
|
24
28
|
};
|
|
25
29
|
export const message = (lang, id) => {
|