ublo-lib 1.8.3 → 1.8.5

package/es/common/components/plausible/plausible.js

@@ -10,11 +10,9 @@ const {
   plausibleDomain,
   disableClientRouting
 } = publicRuntimeConfig;
-console.log(publicRuntimeConfig);
 const DEFAULT_SOURCE = "https://plausible.io/js/script.file-downloads.outbound-links.js";
 const PlausibleScript = ({
   lang,
-  domain,
   source = DEFAULT_SOURCE
 }) => {
   const [loaded, setLoaded] = React.useState(false);
@@ -23,7 +21,7 @@ const PlausibleScript = ({
   if (hasI18n && !lang) {
     console.warn("PlausibleScript: the lang props is mandatory if you want to use a specific domain for each lang");
   }
-  const _domain = domain || hasI18n ? plausibleDomain[lang] : plausibleDomain;
+  const domain = hasI18n ? plausibleDomain[lang] : plausibleDomain;
   const sendPageView = React.useCallback(() => {
     window.plausible("pageview", {
       url: window.location.href,
@@ -44,7 +42,7 @@ const PlausibleScript = ({
     return null;
   }
   return _jsx(Script, {
-    "data-domain": _domain,
+    "data-domain": domain,
     src: source,
     onLoad: () => setLoaded(true)
   });

package/es/esf/components/levels/levels.js

@@ -2,7 +2,7 @@ import * as React from "react";
 import classnames from "classnames";
 import Detail from "./detail";
 import { useUbloContext } from "ublo/with-ublo";
-import { fetchMenus, fetchZones } from "ublo/fetcher";
+import { fetchMenus } from "ublo/fetcher";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const LEVELS = {
@@ -18,10 +18,16 @@ const LEVELS = {
   "bronze-star": "ALPETB",
   "silver-star": "ALPETA",
   "gold-star": "ALPETO",
-  "1-ski": "ALPCL1",
-  "1-degree": "ALPCL2",
-  "2-degree": "ALPCL3",
-  "3-degree": "ALPCL4",
+  "1-ski": "ALPDEB",
+  "1-degree": "ALPCL1",
+  "2-degree": "ALPCL2",
+  "3-degree": "ALPCL3",
+  chamois: "",
+  fleche: "",
+  fusee: "",
+  record: "",
+  "saut-bronze": "",
+  skiercross: "",
   "goomie-rider": "SNOGOO",
   "rookie-rider": "SNOROO",
   "izzy-rider": "SNOIZZ",
@@ -30,6 +36,9 @@ const LEVELS = {
   "2-snowboard": "SNOEN2",
   "3-snowboard": "SNOEN3",
   "snowboard-expert": "SNOEXP",
+  "x-boarder": "",
+  "ptit-freestyler": "",
+  "freestyler-inter": "",
   freestyler: "FREE",
   "freestyler-expert": "FREEXP",
   "freestyler-pro": "FREPRO",
@@ -44,28 +53,12 @@ const LEVELS = {
   "1-degree-nordic": "NORCL1",
   "2-degree-nordic": "NORCL2",
   "3-degree-nordic": "NORCL3",
-  "biathlon-level": "BIAAR"
+  "biathlon-level": "BIAAR",
+  "nordic-cross": ""
 };
-
 const LevelDetail = ({
-  code
+  detail
 }) => {
-  const {
-    lang
-  } = useUbloContext();
-  const [detail, setDetail] = React.useState();
-  const levelLang = lang === "fr" ? lang : "en";
-  React.useEffect(() => {
-    if (code) {
-      const getDetail = async () => {
-        const endpoint = `https://services.msem.tech/api/esf-wiki/${levelLang}/niveau/${code}`;
-        const result = await fetch(endpoint);
-        const json = await result.json();
-        setDetail(json);
-      };
-      getDetail();
-    }
-  }, [code, levelLang]);
   if (!detail) return null;
   return _jsx(Detail, {
     detail: detail
@@ -73,17 +66,16 @@ const LevelDetail = ({
 };
 const Level = ({
   level,
-  contents,
-  setSelectedLevel,
-  selectedLevel,
+  content,
+  detail,
+  setDetail,
   levelRef
 }) => {
+  if (!content) return null;
   const {
     name,
     title
   } = level;
-  const zoneId = `photo-${name}`;
-  const content = contents[zoneId];
   const clicked = name => e => {
     if (levelRef.current) {
       levelRef.current.scrollIntoView({
@@ -92,18 +84,19 @@ const Level = ({
         inline: "center"
       });
     }
-    setSelectedLevel(name);
+    setDetail(content);
   };
-  const selected = name === selectedLevel;
+  const selected = name === detail?.code;
   const levelClasses = classnames("evaluate-level__level", {
     "evaluate-level__level--selected": selected
   });
-  const hasContent = (name in LEVELS);
+  const hasContent = name in LEVELS && Boolean(LEVELS[name]);
   const styles = hasContent ? undefined : {
     pointerEvents: "none",
     touchAction: "none"
   };
   const onClick = hasContent ? clicked(name) : undefined;
+  const image = content.image ? `https://widget.msem.tech/images/esf/level/${content.image}` : "https://widget.msem.tech/images/esf/product/default.svg";
   return _jsxs("div", {
     className: levelClasses,
     style: styles,
@@ -111,23 +104,53 @@ const Level = ({
     children: [_jsx("h3", {
       className: "evaluate-level__level-title",
       children: title
-    }), _jsx("div", {
-      className: "evaluate-level__level-medal",
-      dangerouslySetInnerHTML: {
-        __html: content
-      }
+    }), _jsx("img", {
+      src: image,
+      alt: title
     })]
   });
 };
 const Levels = ({
   levels,
-  contents,
   selectedActivity,
   selectedAge,
-  setSelectedLevel,
-  selectedLevel,
+  detail,
+  setDetail,
   levelRef
 }) => {
+  const {
+    lang
+  } = useUbloContext();
+  const [ready, setReady] = React.useState(false);
+  const [contents, setContents] = React.useState({});
+  const levelLang = lang === "fr" ? lang : "en";
+  const getContents = React.useCallback(async () => {
+    const contents = levels.reduce(async (promiseAcc, level) => {
+      const acc = await promiseAcc;
+      const code = level.name in LEVELS && LEVELS[level.name];
+      if (code) {
+        const endpoint = `https://services.msem.tech/api/esf-wiki/${levelLang}/niveau/${code}`;
+        const result = await fetch(endpoint);
+        const json = await result.json();
+        return {
+          ...acc,
+          code,
+          [level.name]: json
+        };
+      }
+      return acc;
+    }, Promise.resolve({}));
+    return contents;
+  }, [levelLang, levels]);
+  React.useEffect(() => {
+    const runEffect = async () => {
+      const result = await getContents();
+      setContents(result);
+      setReady(true);
+    };
+    runEffect();
+  }, [getContents]);
+  if (!ready) return null;
   return _jsxs("div", {
     className: "evaluate-level__levels",
     children: [_jsxs("div", {
@@ -141,9 +164,9 @@ const Levels = ({
       children: levels.map(level => {
         return _jsx(Level, {
           level: level,
-          contents: contents,
-          setSelectedLevel: setSelectedLevel,
-          selectedLevel: selectedLevel,
+          content: contents[level.name],
+          detail: detail,
+          setDetail: setDetail,
           levelRef: levelRef
         }, level.name);
       })
@@ -232,10 +255,9 @@ const EvaluateLevel = ({
   const levelRef = React.useRef(null);
   const [activities, setActivities] = React.useState([]);
   const [levels, setLevels] = React.useState([]);
-  const [contents, setContents] = React.useState({});
+  const [detail, setDetail] = React.useState();
   const [selectedActivity, setSelectedActivity] = React.useState({});
   const [selectedAge, setSelectedAge] = React.useState({});
-  const [selectedLevel, setSelectedLevel] = React.useState();
   const activityChanged = activity => {
     const {
       name
@@ -244,12 +266,12 @@ const EvaluateLevel = ({
     setSelectedActivity(activity);
     setSelectedAge(isFreestyle ? activity : {});
     setLevels([]);
-    setSelectedLevel();
+    setDetail(undefined);
   };
   const ageChanged = age => {
     setSelectedAge(age);
     setLevels([]);
-    setSelectedLevel();
+    setDetail(undefined);
   };
   React.useEffect(() => {
     const activitiesLoaded = activities.length > 0;
@@ -286,14 +308,12 @@ const EvaluateLevel = ({
     } = selectedAge;
     if (menu !== undefined) {
       const getLevels = async () => {
-        const [levels, contents] = await Promise.all([fetchMenus(ubloApi, site, lang, menu), fetchZones(ubloApi, site, lang, menu)]);
+        const levels = await fetchMenus(ubloApi, site, lang, menu);
         setLevels(levels);
-        setContents(contents);
       };
       getLevels();
     }
   }, [lang, selectedAge, site, ubloApi]);
-  const selectedLevelCode = LEVELS[selectedLevel];
   return _jsxs("div", {
     className: "evaluate-level",
     children: [!menu && _jsx(Activities, {
@@ -304,14 +324,13 @@ const EvaluateLevel = ({
       ageChanged: ageChanged
     }), selectedAge.path && _jsx(Levels, {
       levels: levels,
-      contents: contents,
       selectedActivity: selectedActivity,
       selectedAge: selectedAge,
-      setSelectedLevel: setSelectedLevel,
-      selectedLevel: selectedLevel,
+      detail: detail,
+      setDetail: setDetail,
       levelRef: levelRef
-    }), selectedLevel && _jsx(LevelDetail, {
-      code: selectedLevelCode
+    }), detail && _jsx(LevelDetail, {
+      detail: detail
     })]
   });
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ublo-lib",
-  "version": "1.8.3",
+  "version": "1.8.5",
   "peerDependencies": {
     "dt-design-system": "^2.1.0",
     "next": "^12.0.0 || ^13.0.0",