ublo-lib 1.31.42 → 1.31.44

package/es/common/components/cross-selling-editor/override.jsx

@@ -0,0 +1,102 @@
+import * as React from "react";
+import classNames from "classnames";
+import Popover from "dt-design-system/es/popover";
+import Button from "dt-design-system/es/button";
+import Input from "dt-design-system/es/input";
+import Tooltip from "dt-design-system/es/tooltip";
+import * as Icons from "dt-design-system/es/icons";
+import OverrideTriggerForm from "./override-trigger-form";
+import styles from "./override.module.css";
+export default function Override({ index, currentOffer, overrides, override, currentOverride, setCurrentOverride, config, setConfig, closeCreationForm, durations, }) {
+    const [formOpen, setFormOpen] = React.useState(false);
+    const isFirst = index === 0;
+    const isLast = index === overrides.length - 1;
+    const toggleFormOpen = (e) => {
+        e.stopPropagation();
+        setFormOpen((formOpen) => !formOpen);
+    };
+    const updateFormOpen = (open) => {
+        setFormOpen(open);
+    };
+    const updateCurrentOverride = () => {
+        const isSelected = currentOverride && override.id === currentOverride.id;
+        setCurrentOverride(isSelected ? null : override);
+        closeCreationForm();
+    };
+    const sort = (direction) => (e) => {
+        e.stopPropagation();
+        setConfig((config = {}) => {
+            const itemConfig = (config[currentOffer] || {});
+            const itemOverrides = itemConfig.overrides || [];
+            const currentIndex = itemOverrides.findIndex((o) => o.id === override.id);
+            const newIndex = direction === "up" ? currentIndex - 1 : currentIndex + 1;
+            const newOverrides = [...itemOverrides];
+            newOverrides.splice(currentIndex, 1);
+            newOverrides.splice(newIndex, 0, override);
+            const newConfig = Object.assign(Object.assign({}, config), { [currentOffer]: Object.assign(Object.assign({}, itemConfig), { overrides: newOverrides }) });
+            return newConfig;
+        });
+    };
+    const removeOverride = () => {
+        if (currentOverride === override) {
+            setCurrentOverride(null);
+        }
+        setConfig((config = {}) => {
+            const itemConfig = (config[currentOffer] || {});
+            const itemOverrides = itemConfig.overrides || [];
+            const newConfig = Object.assign(Object.assign({}, config), { [currentOffer]: Object.assign(Object.assign({}, itemConfig), { overrides: itemOverrides.filter((o) => o.id !== override.id) }) });
+            return newConfig;
+        });
+        closeCreationForm();
+    };
+    const stopPropagation = (e) => {
+        e.stopPropagation();
+    };
+    const updateOverrideName = (e) => {
+        e.stopPropagation();
+        const target = e.target;
+        const allOverrides = config[currentOffer].overrides;
+        const isADuplicate = allOverrides.some((o) => o.name === target.value);
+        if (isADuplicate) {
+            e.preventDefault();
+        }
+        else {
+            setConfig((config = {}) => {
+                const itemConfig = (config[currentOffer] || {});
+                const itemOverrides = itemConfig.overrides || [];
+                const newConfig = Object.assign(Object.assign({}, config), { [currentOffer]: Object.assign(Object.assign({}, itemConfig), { overrides: itemOverrides.map((o) => {
+                            if (o.id === override.id) {
+                                return Object.assign(Object.assign({}, o), { name: target.value });
+                            }
+                            return o;
+                        }) }) });
+                return newConfig;
+            });
+        }
+        closeCreationForm();
+    };
+    const classes = classNames(styles.override, {
+        [styles.current]: currentOverride && override.id === currentOverride.id,
+    });
+    return (<div className={classes} onClick={updateCurrentOverride}>
+      <div className={styles.sortControls}>
+        <Button variant="transparent" className={styles.sortControl} disabled={isFirst} onClick={sort("up")} compact>
+          <Icons.ChevronUp />
+        </Button>
+        <Button variant="transparent" className={styles.sortControl} disabled={isLast} onClick={sort("down")} compact>
+          <Icons.ChevronDown />
+        </Button>
+      </div>
+      <Input className={styles.input} value={override.name} onChange={updateOverrideName} onClick={stopPropagation} onBlur={updateOverrideName} compact/>
+      <Popover trigger={<Button className={styles.edit} compact onClick={toggleFormOpen}>
+            <Icons.Tune />
+          </Button>} open={formOpen} onOpenChange={updateFormOpen}>
+        <OverrideTriggerForm currentOffer={currentOffer} override={override} setConfig={setConfig} durations={durations}/>
+      </Popover>
+      <Tooltip content="Supprimer">
+        <Button className={styles.delete} variant="danger" compact onClick={removeOverride}>
+          <Icons.Bin />
+        </Button>
+      </Tooltip>
+    </div>);
+}

package/es/common/components/cross-selling-editor/overrides-list.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+import type { Config, Durations, Override as OverrideType } from "./types";
+type Props = {
+    currentOffer: string;
+    overrides: OverrideType[];
+    currentOverride: OverrideType;
+    setCurrentOverride: React.Dispatch<React.SetStateAction<OverrideType>>;
+    config: Config;
+    setConfig: React.Dispatch<React.SetStateAction<Config>>;
+    durations: Durations;
+};
+export default function OverridesList({ currentOffer, overrides, currentOverride, setCurrentOverride, config, setConfig, durations, }: Props): React.JSX.Element;
+export {};

package/es/common/components/cross-selling-editor/overrides-list.jsx

@@ -0,0 +1,74 @@
+import * as React from "react";
+import Button from "dt-design-system/es/button";
+import Collapsible from "dt-design-system/es/collapsible";
+import Popover from "dt-design-system/es/popover";
+import Input from "dt-design-system/es/input";
+import * as Icons from "dt-design-system/es/icons";
+import Override from "./override";
+import styles from "./overrides-list.module.css";
+export default function OverridesList({ currentOffer, overrides, currentOverride, setCurrentOverride, config, setConfig, durations, }) {
+    const [opened, setOpened] = React.useState(false);
+    const [newOverride, setNewOverride] = React.useState("");
+    const [creationFormOpened, setCreationFormOpened] = React.useState(false);
+    const hasOverrides = overrides.length > 0;
+    const newOverrideAlreadyExists = overrides.some((o) => o.name === newOverride);
+    const newOverrideIsEmpty = newOverride.trim() === "";
+    const newOverrideIsInvalid = newOverrideAlreadyExists || newOverrideIsEmpty;
+    const error = newOverrideAlreadyExists && "Ce nom est déjà utilisé";
+    const closeCreationForm = () => {
+        setCreationFormOpened(false);
+    };
+    const toggleCreationForm = () => {
+        setCreationFormOpened(!creationFormOpened);
+    };
+    const createOverride = (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        setConfig((config = {}) => {
+            const itemConfig = (config[currentOffer] || {});
+            const itemOverrides = itemConfig.overrides || [];
+            const newId = itemOverrides.length
+                ? Math.max(...itemOverrides.map(({ id }) => id)) + 1
+                : 0;
+            const newOverrideName = newOverride.trim();
+            const newConfig = Object.assign(Object.assign({}, config), { [currentOffer]: Object.assign(Object.assign({}, itemConfig), { overrides: [
+                        ...itemOverrides,
+                        { id: newId, name: newOverrideName, trigger: {}, rules: {} },
+                    ] }) });
+            return newConfig;
+        });
+        setOpened(true);
+        setNewOverride("");
+        closeCreationForm();
+    };
+    const title = (<span className={styles.title}>
+      {overrides.length} surcharges
+      <Popover className={styles.titlePopover} trigger={<Button variant="transparent" compact>
+            <Icons.Info />
+          </Button>}>
+        <b>Si plusieurs surcharges</b> correspondent au contenu du panier,{" "}
+        <b>seule la première est appliquée</b>.
+        <br />
+        Vous pouvez changer l'ordre des surcharges à l'aide des flèches
+        visibible à gauche de chaque surcharge au survol de ces dernières.
+      </Popover>
+    </span>);
+    return (<div className={styles.overrides}>
+      {hasOverrides ? (<Collapsible title={title} className={styles.collapsible} compact open={opened} toggleTooltip="Afficher toutes les surcharges" onOpenChange={setOpened} hiddenContent={overrides.map((override, index) => {
+                return (<Override key={override.id} index={index} currentOffer={currentOffer} overrides={overrides} override={override} currentOverride={currentOverride} setCurrentOverride={setCurrentOverride} config={config} setConfig={setConfig} closeCreationForm={closeCreationForm} durations={durations}/>);
+            })}/>) : null}
+      <div className={styles.addOverride}>
+        Ajouter une surcharge{" "}
+        <Popover className={styles.popover} trigger={<Button compact onClick={toggleCreationForm}>
+              <Icons.Plus />
+            </Button>} open={creationFormOpened}>
+          <form className={styles.createForm} onSubmit={createOverride}>
+            <Input placeholder="Nom" value={newOverride} onValueChange={setNewOverride} error={error} compact autoFocus/>
+            <Button className={styles.createSubmit} type="submit" disabled={newOverrideIsInvalid}>
+              Ajouter
+            </Button>
+          </form>
+        </Popover>
+      </div>
+    </div>);
+}

package/es/common/components/cross-selling-editor/rule.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+import type { Config, Override } from "./types";
+type Props = {
+    title: string;
+    uuid: string;
+    uuids: string[];
+    currentOffer: string;
+    currentOverride: null | Override;
+    config: Config;
+    setConfig: React.Dispatch<React.SetStateAction<Config>>;
+};
+export default function Rule({ title, uuid, uuids, currentOffer, currentOverride, config, setConfig, }: Props): React.JSX.Element;
+export {};

package/es/common/components/cross-selling-editor/rule.jsx

@@ -0,0 +1,55 @@
+import * as React from "react";
+import classNames from "classnames";
+import Checkbox from "dt-design-system/es/checkbox";
+import NumberPicker from "dt-design-system/es/number-picker";
+import styles from "./rule.module.css";
+export default function Rule({ title, uuid, uuids, currentOffer, currentOverride, config, setConfig, }) {
+    var _a, _b, _c, _d, _e, _f, _g;
+    const defaultConfig = (_a = config[currentOffer]) === null || _a === void 0 ? void 0 : _a.default;
+    const isDefault = currentOverride === null;
+    const override = isDefault
+        ? defaultConfig
+        : (_c = (_b = config[currentOffer]) === null || _b === void 0 ? void 0 : _b.overrides) === null || _c === void 0 ? void 0 : _c.find((o) => o.id === (currentOverride === null || currentOverride === void 0 ? void 0 : currentOverride.id));
+    const currentValue = ((_e = (_d = override === null || override === void 0 ? void 0 : override.rules) === null || _d === void 0 ? void 0 : _d[uuid]) === null || _e === void 0 ? void 0 : _e.weight) || 0;
+    const currentHidden = ((_g = (_f = override === null || override === void 0 ? void 0 : override.rules) === null || _f === void 0 ? void 0 : _f[uuid]) === null || _g === void 0 ? void 0 : _g.hidden) || false;
+    const updateConfig = (key, value) => {
+        setConfig((config = {}) => {
+            const itemConfig = (config[currentOffer] || {});
+            const newValue = key === "hidden" ? !value : Number(value);
+            if (isDefault) {
+                const defaultRules = (defaultConfig === null || defaultConfig === void 0 ? void 0 : defaultConfig.rules) || {};
+                const newConfig = Object.assign(Object.assign({}, config), { [currentOffer]: Object.assign(Object.assign({}, itemConfig), { default: Object.assign(Object.assign({}, defaultConfig), { rules: Object.assign(Object.assign({}, defaultRules), { [uuid]: Object.assign(Object.assign({}, defaultRules === null || defaultRules === void 0 ? void 0 : defaultRules[uuid]), { [key]: newValue }) }) }) }) });
+                return newConfig;
+            }
+            else {
+                const itemOverrides = itemConfig.overrides || [];
+                const overrideConfig = itemOverrides.find((o) => o.id === override.id);
+                const rulesConfig = (overrideConfig === null || overrideConfig === void 0 ? void 0 : overrideConfig.rules) || {};
+                const offerConfig = (overrideConfig === null || overrideConfig === void 0 ? void 0 : overrideConfig[uuid]) || {};
+                const cleanedRulesConfig = Object.keys(rulesConfig).reduce((acc, key) => {
+                    if (uuids.includes(key)) {
+                        return Object.assign(Object.assign({}, acc), { [key]: rulesConfig[key] });
+                    }
+                    return acc;
+                }, {});
+                const newConfig = Object.assign(Object.assign({}, config), { [currentOffer]: Object.assign(Object.assign({}, itemConfig), { overrides: [
+                            ...itemOverrides.map((o) => {
+                                if (o.id === override.id) {
+                                    return Object.assign(Object.assign({}, o), { rules: Object.assign(Object.assign({}, cleanedRulesConfig), { [uuid]: Object.assign(Object.assign({}, offerConfig), { [key]: newValue }) }) });
+                                }
+                                return o;
+                            }),
+                        ] }) });
+                return newConfig;
+            }
+        });
+    };
+    const classes = classNames(styles.rule, {
+        [styles.disabled]: currentHidden,
+    });
+    return (<div key={uuid} className={classes}>
+      <Checkbox className={styles.checkbox} checked={!currentHidden} onCheckedChange={(value) => updateConfig("hidden", value)}/>
+      <div className={styles.title}>{title}</div>
+      <NumberPicker className={styles.valuePicker} value={currentValue} onChange={(value) => updateConfig("weight", value)} min={-10} max={10} disabled={!currentOffer}/>
+    </div>);
+}

package/es/common/components/cross-selling-editor/rules.d.ts

@@ -0,0 +1,11 @@
+import * as React from "react";
+import type { Config, Durations } from "./types";
+type Props = {
+    container: HTMLElement;
+    config: Config;
+    setConfig: React.Dispatch<React.SetStateAction<Config>>;
+    tunnelOffers: Record<string, string>;
+    durations: Durations;
+};
+export default function Rules({ container, config, setConfig, tunnelOffers, durations, }: Props): React.JSX.Element;
+export {};

package/es/common/components/cross-selling-editor/rules.jsx

@@ -0,0 +1,53 @@
+import * as React from "react";
+import Select from "dt-design-system/es/select";
+import Popover from "dt-design-system/es/popover";
+import Button from "dt-design-system/es/button";
+import * as Icons from "dt-design-system/es/icons";
+import Rule from "./rule";
+import OverridesList from "./overrides-list";
+import * as Utils from "./services/utils";
+import styles from "./rules.module.css";
+export default function Rules({ container, config, setConfig, tunnelOffers, durations, }) {
+    var _a;
+    const [currentOffer, setCurrentOffer] = React.useState("");
+    const [currentOverride, setCurrentOverride] = React.useState(null);
+    const overrides = ((_a = config[currentOffer]) === null || _a === void 0 ? void 0 : _a.overrides) || [];
+    const showOverrides = currentOffer && Utils.hasAllowedOverrides(currentOffer);
+    const sections = Array.from(container.querySelectorAll(".tunnel-offer"));
+    const uuids = sections.map((section) => section.getAttribute("data-uuid"));
+    const updateCurrentOffer = (newCurrentOffer) => {
+        setCurrentOffer(newCurrentOffer);
+        setCurrentOverride(null);
+    };
+    const tunnelOptions = Object.keys(tunnelOffers).map((key) => {
+        const label = tunnelOffers[key];
+        return { value: key, label };
+    });
+    return (<div className={styles.container}>
+      <div className={styles.title}>
+        Configuration
+        <Popover className={styles.popover} trigger={<Button variant="transparent">
+              <Icons.Info />
+            </Button>}>
+          La configuration vous permet de personnaliser l'ordre d'affichage des
+          produits suggérés dans le panier en fonction des produits présents
+          dans le panier de l'utilisateur.
+        </Popover>
+      </div>
+      <div className={styles.explanation}>
+        Configurez les suggestions de produit en fonction du contenu du panier
+      </div>
+      <Select className={styles.select} label="Produit ajouté au panier" placeholder="Sélectionnez un produit" value={currentOffer} options={tunnelOptions} onValueChange={updateCurrentOffer}/>
+      {showOverrides && (<OverridesList currentOffer={currentOffer} overrides={overrides} currentOverride={currentOverride} setCurrentOverride={setCurrentOverride} config={config} setConfig={setConfig} durations={durations}/>)}
+      {currentOffer && (<>
+          <div className={styles.subTitle}>
+            Priorisation par types de produit
+          </div>
+          {sections.map((section) => {
+                const uuid = section.getAttribute("data-uuid");
+                const title = section.querySelector(".tunnel-offer__title").textContent;
+                return (<Rule key={title} uuid={uuid} uuids={uuids} title={title} currentOffer={currentOffer} currentOverride={currentOverride} config={config} setConfig={setConfig}/>);
+            })}
+        </>)}
+    </div>);
+}

package/es/common/components/cross-selling-editor/services/api.d.ts

@@ -0,0 +1,2 @@
+export declare function fetchTunnelOffers(lang: string, facet: 0 | 1): Promise<any>;
+export declare function fetchMseMCart(cartId: string, lang: string): Promise<any>;

package/es/common/components/cross-selling-editor/services/api.js

@@ -1,30 +1,30 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 import getConfig from "next/config";
+// import * as Fetcher from "ublo-lib/es/common/utils/fetcher";
 import * as Fetcher from "../../../utils/fetcher";
-const {
-  publicRuntimeConfig
-} = getConfig();
-const {
-  msemServicesUrl,
-  esfplusUrl,
-  channel,
-  resort
-} = publicRuntimeConfig;
-export async function fetchTunnelOffers(lang, facet) {
-  const endpoint = `${msemServicesUrl}/api/tunnel/offers/${channel}/${resort}`;
-  const result = await Fetcher.get(endpoint, {
-    lang,
-    facet
-  });
-  return result;
+const { publicRuntimeConfig } = getConfig();
+const { msemServicesUrl, esfplusUrl, channel, resort } = publicRuntimeConfig;
+export function fetchTunnelOffers(lang, facet) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const endpoint = `${msemServicesUrl}/api/tunnel/offers/${channel}/${resort}`;
+        const result = yield Fetcher.get(endpoint, { lang, facet });
+        return result;
+    });
+}
+export function fetchMseMCart(cartId, lang) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const endpoint = `${esfplusUrl}/api/esfplus/cart`;
+        const id = JSON.parse(cartId);
+        const payload = { cartId: id, lang, resort };
+        const result = yield Fetcher.post(endpoint, payload);
+        return result;
+    });
 }
-export async function fetchMseMCart(cartId, lang) {
-  const endpoint = `${esfplusUrl}/api/esfplus/cart`;
-  const id = JSON.parse(cartId);
-  const payload = {
-    cartId: id,
-    lang,
-    resort
-  };
-  const result = await Fetcher.post(endpoint, payload);
-  return result;
-}

package/es/common/components/cross-selling-editor/services/utils.d.ts

@@ -0,0 +1,61 @@
+import type { Config, Override } from "../types";
+type Stay = {
+    from?: string;
+    to?: string;
+    duration?: number | string;
+};
+type CartContent = {
+    items: Record<string, number>;
+    merchants?: string[];
+    stay?: Stay;
+    skiPassDurations?: number[];
+    durationTags?: string[];
+};
+export declare const tunnelOffers: {
+    HOT: string;
+    LIFT: string;
+    SKI_RENTAL: string;
+    ESF: string;
+    CONCIERGERIE: string;
+    STAND: string;
+};
+type OrderKey = keyof typeof tunnelOffers;
+export declare function getSortedOffers(container: HTMLElement, cartContent: CartContent, config: Config): {
+    title: string;
+    weight: number;
+    elementHTML: string;
+    isHidden: boolean;
+}[];
+export declare function getActiveOverride(key: string | OrderKey, cartContent: CartContent, config: Config): Override;
+export declare const allowedOverrides: string[];
+export declare function hasAllowedOverrides(kind: string): boolean;
+type Inscription = {
+    skipassCatalog: string;
+    duration: string;
+    durationTags?: string[];
+};
+type Order = {
+    merchant: string;
+    inscriptions: Inscription[];
+};
+type Cart = {
+    orders?: Record<OrderKey, Order[]>;
+    stayFrom?: string;
+    stayTo?: string;
+};
+export declare function formatCartContent(cart: Cart): {};
+export declare function getMerchantsFromCart(cart: Cart): string[];
+export declare function getStayFromCart(cart: Cart): {
+    from?: undefined;
+    to?: undefined;
+    duration?: undefined;
+} | {
+    from: string;
+    to: string;
+    duration: number;
+};
+export declare function getSkiPassDurationFromCart(cart: Cart): Promise<number[]>;
+export declare function getDurationTagsFromCart(cart: Cart): Promise<string[]>;
+export declare const CONFIG_ID = "cross-selling-editor";
+export declare function getConfig(container: HTMLElement): any;
+export {};