@cuemath/leap 2.9.7-rj-3 → 2.9.8-as1

package/dist/features/chapters-v2/utils/node-card-utils.js

@@ -0,0 +1,177 @@
+import { jsx as e, jsxs as p } from "react/jsx-runtime";
+import I from "../../../assets/line-icons/icons/alarm.js";
+import f from "../../../assets/line-icons/icons/bulb2.js";
+import T from "../../../assets/line-icons/icons/check2.js";
+import u from "../../../assets/line-icons/icons/dart.js";
+import R from "../../../assets/line-icons/icons/exclamation.js";
+import A from "../../../assets/line-icons/icons/lock2.js";
+import h from "../../../assets/line-icons/icons/play2.js";
+import $ from "../../../assets/line-icons/icons/puzzle.js";
+import g from "../../../assets/line-icons/icons/recap.js";
+import D from "../../../assets/line-icons/icons/status.js";
+import C from "../../../assets/line-icons/icons/testtube.js";
+import { LOTTIE as t } from "../../../assets/lottie/lottie.js";
+import S from "../../ui/layout/flex-view.js";
+import a from "../../ui/arrow-tooltip/arrow-tooltip.js";
+import d from "../../ui/text/text.js";
+import { InProgressIconWrapper as l } from "../comps/node-card/node-card-styled.js";
+import E from "../comps/tag/tag.js";
+const P = 60 * 60 * 24, b = ["NOT_STARTED", "IN_PROGRESS"], O = (o) => {
+  if (!o)
+    return { isOverdue: !1, daysText: "", differenceInDays: 0 };
+  const i = Math.floor(Date.now() / 1e3), c = o - i, n = Math.ceil(c / P), s = n < 0, r = n > 0 ? `${Math.abs(n)}D` : "";
+  return { isOverdue: s, daysText: r, differenceInDays: n };
+}, B = (o, i, c, n) => {
+  const { isOverdue: s, daysText: r, differenceInDays: m } = O(n);
+  if (s && b.includes(o))
+    return {
+      icon: /* @__PURE__ */ e(
+        a,
+        {
+          renderAs: "primary",
+          position: "bottom",
+          tooltipItem: "Complete now",
+          zIndex: 10,
+          hidden: !i,
+          parentWidth: "fit-content",
+          children: /* @__PURE__ */ e(S, { $background: "RED", $borderRadius: 16, $gapX: 0.24, $gutterX: 0.5, children: /* @__PURE__ */ e(d, { $renderAs: "ac4-black", $color: "WHITE", children: "OVERDUE" }) })
+        }
+      ),
+      top: -10,
+      right: -10
+    };
+  switch (o) {
+    case "NOT_STARTED":
+      return {
+        icon: /* @__PURE__ */ e(
+          a,
+          {
+            renderAs: "primary",
+            position: "bottom",
+            tooltipItem: m > 1 ? `${m} days left` : "Complete it today",
+            zIndex: 10,
+            hidden: !i,
+            children: /* @__PURE__ */ e(
+              l,
+              {
+                $flexDirection: "row",
+                $alignItems: "center",
+                $justifyContent: "center",
+                $borderRadius: 16,
+                $paddingRight: 6,
+                $paddingLeft: 6,
+                children: r && /* @__PURE__ */ e(d, { $renderAs: "ub3-bold", $color: "WHITE", children: r })
+              }
+            )
+          }
+        ),
+        top: 0,
+        right: 0
+      };
+    case "LOCKED":
+      return {
+        icon: /* @__PURE__ */ e(A, { width: 32, height: 32 }),
+        top: -12,
+        right: -12
+      };
+    case "IN_PROGRESS":
+      return {
+        icon: /* @__PURE__ */ p(
+          l,
+          {
+            $flexDirection: "row",
+            $alignItems: "center",
+            $justifyContent: "center",
+            $borderRadius: 16,
+            $paddingRight: 0,
+            $paddingLeft: r ? 6 : 0,
+            children: [
+              r && /* @__PURE__ */ e(d, { $renderAs: "ub3-bold", $color: "WHITE", children: r }),
+              /* @__PURE__ */ e(D, {})
+            ]
+          }
+        )
+      };
+    case "COMPLETED":
+      return {
+        icon: /* @__PURE__ */ e(
+          E,
+          {
+            Icon: T,
+            label: typeof c == "number" ? `${c}%` : void 0
+          }
+        ),
+        top: -10,
+        right: -10
+      };
+    case "WAIT_FOR_REVIEW":
+      return {
+        icon: /* @__PURE__ */ e(
+          a,
+          {
+            renderAs: "primary",
+            position: "bottom",
+            tooltipItem: i ? "Waiting for teacher to review" : "Needs your review",
+            zIndex: 10,
+            children: /* @__PURE__ */ e(E, { Icon: R })
+          }
+        ),
+        top: -10,
+        right: -10
+      };
+    default:
+      return {
+        icon: void 0
+      };
+  }
+}, X = (o) => {
+  switch (o) {
+    case "LEARNING":
+      return {
+        lottie: t.LEARN,
+        icon: f
+      };
+    case "RECAP":
+      return {
+        lottie: t.RECAP,
+        icon: g
+      };
+    case "DYNAMIC":
+    case "ASSESSMENT":
+    case "CHAPTER_ASSESSMENT":
+      return {
+        lottie: t.TEST,
+        icon: I
+      };
+    case "PRACTICE":
+    case "EXTRA_PRACTICE":
+    case "TARGET_PRACTICE":
+    case "MASTERY":
+      return {
+        lottie: t.PRACTICE,
+        icon: u
+      };
+    case "PUZZLE_EASY":
+    case "PUZZLE_MEDIUM":
+    case "PUZZLE_HARD":
+      return {
+        lottie: t.PUZZLE,
+        icon: $
+      };
+    case "VIDEO":
+      return {
+        lottie: t.VIDEO,
+        icon: h
+      };
+    default:
+      return {
+        lottie: t.PROJECT,
+        icon: C
+      };
+  }
+};
+export {
+  X as getNodeCardBasedIcon,
+  B as getNodeStateBasedTagInfo
+};
+//# sourceMappingURL=node-card-utils.js.map

package/dist/features/chapters-v2/utils/node-card-utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"node-card-utils.js","sources":["../../../../src/features/chapters-v2/utils/node-card-utils.tsx"],"sourcesContent":["import type { INodeDataProps } from '../comps/node-card/node-card-types';\n\nimport AlarmIcon from '../../../assets/line-icons/icons/alarm';\nimport Bulb2Icon from '../../../assets/line-icons/icons/bulb2';\nimport Check2Icon from '../../../assets/line-icons/icons/check2';\nimport DartIcon from '../../../assets/line-icons/icons/dart';\nimport ExclamationIcon from '../../../assets/line-icons/icons/exclamation';\nimport Lock2Icon from '../../../assets/line-icons/icons/lock2';\nimport Play2Icon from '../../../assets/line-icons/icons/play2';\nimport PuzzleIcon from '../../../assets/line-icons/icons/puzzle';\nimport RecapIcon from '../../../assets/line-icons/icons/recap';\nimport StatusIcon from '../../../assets/line-icons/icons/status';\nimport TestTubeIcon from '../../../assets/line-icons/icons/testtube';\nimport { LOTTIE } from '../../../assets/lottie/lottie';\nimport FlexView from '../..//ui/layout/flex-view';\nimport ArrowTooltip from '../../ui/arrow-tooltip/arrow-tooltip';\nimport Text from '../../ui/text/text';\nimport { InProgressIconWrapper } from '../comps/node-card/node-card-styled';\nimport Tag from '../comps/tag/tag';\n\ninterface DueDateInfo {\n  isOverdue: boolean;\n  daysText: string;\n  differenceInDays: number;\n}\n\nconst SECONDS_PER_DAY = 60 * 60 * 24;\nconst OVERDUE_TAG_STATES: INodeDataProps['state'][] = ['NOT_STARTED', 'IN_PROGRESS'];\n\nconst calculateDueDateInfo = (dueDateTs?: number | null): DueDateInfo => {\n  if (!dueDateTs) {\n    return { isOverdue: false, daysText: '', differenceInDays: 0 };\n  }\n\n  const currentTimestamp = Math.floor(Date.now() / 1000);\n  const differenceInSeconds = dueDateTs - currentTimestamp;\n  const differenceInDays = Math.ceil(differenceInSeconds / SECONDS_PER_DAY);\n\n  const isOverdue = differenceInDays < 0;\n\n  const daysText = differenceInDays > 0 ? `${Math.abs(differenceInDays)}D` : '';\n\n  return { isOverdue, daysText, differenceInDays };\n};\n\nconst getNodeStateBasedTagInfo = (\n  nodeState: INodeDataProps['state'],\n  isStudent: boolean,\n  accuracy?: number | null,\n  dueDateTs?: number | null,\n) => {\n  const { isOverdue, daysText, differenceInDays } = calculateDueDateInfo(dueDateTs);\n\n  if (isOverdue && OVERDUE_TAG_STATES.includes(nodeState)) {\n    return {\n      icon: (\n        <ArrowTooltip\n          renderAs=\"primary\"\n          position=\"bottom\"\n          tooltipItem=\"Complete now\"\n          zIndex={10}\n          hidden={!isStudent}\n          parentWidth=\"fit-content\"\n        >\n          <FlexView $background=\"RED\" $borderRadius={16} $gapX={0.24} $gutterX={0.5}>\n            <Text $renderAs=\"ac4-black\" $color=\"WHITE\">\n              OVERDUE\n            </Text>\n          </FlexView>\n        </ArrowTooltip>\n      ),\n      top: -10,\n      right: -10,\n    };\n  }\n\n  switch (nodeState) {\n    case 'NOT_STARTED':\n      return {\n        icon: (\n          <ArrowTooltip\n            renderAs=\"primary\"\n            position=\"bottom\"\n            tooltipItem={\n              differenceInDays > 1 ? `${differenceInDays} days left` : 'Complete it today'\n            }\n            zIndex={10}\n            hidden={!isStudent}\n          >\n            <InProgressIconWrapper\n              $flexDirection=\"row\"\n              $alignItems=\"center\"\n              $justifyContent=\"center\"\n              $borderRadius={16}\n              $paddingRight={6}\n              $paddingLeft={6}\n            >\n              {daysText && (\n                <Text $renderAs=\"ub3-bold\" $color=\"WHITE\">\n                  {daysText}\n                </Text>\n              )}\n            </InProgressIconWrapper>\n          </ArrowTooltip>\n        ),\n        top: 0,\n        right: 0,\n      };\n    case 'LOCKED':\n      return {\n        icon: <Lock2Icon width={32} height={32} />,\n        top: -12,\n        right: -12,\n      };\n    case 'IN_PROGRESS':\n      return {\n        icon: (\n          <InProgressIconWrapper\n            $flexDirection=\"row\"\n            $alignItems=\"center\"\n            $justifyContent=\"center\"\n            $borderRadius={16}\n            $paddingRight={0}\n            $paddingLeft={daysText ? 6 : 0}\n          >\n            {daysText && (\n              <Text $renderAs=\"ub3-bold\" $color=\"WHITE\">\n                {daysText}\n              </Text>\n            )}\n            <StatusIcon />\n          </InProgressIconWrapper>\n        ),\n      };\n    case 'COMPLETED':\n      return {\n        icon: (\n          <Tag\n            Icon={Check2Icon}\n            label={typeof accuracy === 'number' ? `${accuracy}%` : undefined}\n          />\n        ),\n        top: -10,\n        right: -10,\n      };\n    case 'WAIT_FOR_REVIEW':\n      return {\n        icon: (\n          <ArrowTooltip\n            renderAs=\"primary\"\n            position=\"bottom\"\n            tooltipItem={isStudent ? 'Waiting for teacher to review' : 'Needs your review'}\n            zIndex={10}\n          >\n            <Tag Icon={ExclamationIcon} />\n          </ArrowTooltip>\n        ),\n        top: -10,\n        right: -10,\n      };\n\n    default:\n      return {\n        icon: undefined,\n      };\n  }\n};\n\nconst getNodeCardBasedIcon = (nodeType: INodeDataProps['node_type']) => {\n  switch (nodeType) {\n    case 'LEARNING':\n      return {\n        lottie: LOTTIE.LEARN,\n        icon: Bulb2Icon,\n      };\n    case 'RECAP':\n      return {\n        lottie: LOTTIE.RECAP,\n        icon: RecapIcon,\n      };\n    case 'DYNAMIC':\n    case 'ASSESSMENT':\n    case 'CHAPTER_ASSESSMENT':\n      return {\n        lottie: LOTTIE.TEST,\n        icon: AlarmIcon,\n      };\n    case 'PRACTICE':\n    case 'EXTRA_PRACTICE':\n    case 'TARGET_PRACTICE':\n    case 'MASTERY':\n      return {\n        lottie: LOTTIE.PRACTICE,\n        icon: DartIcon,\n      };\n    case 'PUZZLE_EASY':\n    case 'PUZZLE_MEDIUM':\n    case 'PUZZLE_HARD':\n      return {\n        lottie: LOTTIE.PUZZLE,\n        icon: PuzzleIcon,\n      };\n    case 'VIDEO':\n      return {\n        lottie: LOTTIE.VIDEO,\n        icon: Play2Icon,\n      };\n    default:\n      return {\n        lottie: LOTTIE.PROJECT,\n        icon: TestTubeIcon,\n      };\n  }\n};\n\nexport { getNodeStateBasedTagInfo, getNodeCardBasedIcon };\n"],"names":["SECONDS_PER_DAY","OVERDUE_TAG_STATES","calculateDueDateInfo","dueDateTs","currentTimestamp","differenceInSeconds","differenceInDays","isOverdue","daysText","getNodeStateBasedTagInfo","nodeState","isStudent","accuracy","jsx","ArrowTooltip","FlexView","Text","InProgressIconWrapper","Lock2Icon","jsxs","StatusIcon","Tag","Check2Icon","ExclamationIcon","getNodeCardBasedIcon","nodeType","LOTTIE","Bulb2Icon","RecapIcon","AlarmIcon","DartIcon","PuzzleIcon","Play2Icon","TestTubeIcon"],"mappings":"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"}

package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.js

@@ -1,125 +1,126 @@
-import { jsx as t, Fragment as R } from "react/jsx-runtime";
-import { useRef as L, useCallback as E, useMemo as de, useEffect as se } from "react";
-import te from "../../../../../assets/line-icons/icons/carat-right.js";
-import { PLATFORM_EVENTS_STUDENT as re } from "../../../../analytics-events/platform-events-student.js";
-import { JOURNEY_ID_STUDENT as me } from "../../../../journey/journey-id/journey-id-student.js";
+import { jsx as t, Fragment as O } from "react/jsx-runtime";
+import { useRef as A, useCallback as T, useMemo as le, useEffect as ce } from "react";
+import z from "../../../../../assets/line-icons/icons/carat-right.js";
+import { PLATFORM_EVENTS_STUDENT as ee } from "../../../../analytics-events/platform-events-student.js";
+import { JOURNEY_ID_STUDENT as ae } from "../../../../journey/journey-id/journey-id-student.js";
 import { IndicatorType as c } from "../../../../journey/use-journey/constants.js";
-import { useJourney as Te } from "../../../../journey/use-journey/use-journey.js";
-import ne from "../../../../ui/buttons/icon-button/icon-button.js";
-import { useUIContext as ue } from "../../../../ui/context/context.js";
-import y from "../../../../ui/layout/flex-view.js";
+import { useJourney as de } from "../../../../journey/use-journey/use-journey.js";
+import te from "../../../../ui/buttons/icon-button/icon-button.js";
+import { useUIContext as he } from "../../../../ui/context/context.js";
+import L from "../../../../ui/layout/flex-view.js";
 import a from "../../../../ui/text/text.js";
-import { getTheme as he } from "../../../../ui/theme/get-theme.js";
-import { CIRCLE_ONBOARDING_ANALYTICS_STEPS as p } from "../../../enum/circle-onboarding-steps.js";
-import { useCircleSounds as ge } from "../../../hooks/use-circle-sounds/use-circle-sounds.js";
-import { SegmentedGameCard as Ee } from "../../comps/segmented-game-card/segmented-game-card.js";
-import { GAME_LAUNCHER_ANALYTICS_EVENTS as oe } from "../../game-launcher-analytics-events.js";
-import { GO_TO_NEXT_SLIDE_AFTER_MS as pe, SHOW_LABEL_HIGHLIGHT_AFTER_MS as Ie, SHOW_NUDGE_AFTER_MS as _e, SLIDE_TO_LESSON_MS as Ce } from "./constants.js";
-import { ProjectType as fe } from "../../../games/web-view/enums/project-type-enum.js";
-const xe = ({
+import { CIRCLE_ONBOARDING_ANALYTICS_STEPS as E } from "../../../enum/circle-onboarding-steps.js";
+import { useCircleSounds as se } from "../../../hooks/use-circle-sounds/use-circle-sounds.js";
+import { SegmentedGameCard as me } from "../../comps/segmented-game-card/segmented-game-card.js";
+import { GAME_LAUNCHER_ANALYTICS_EVENTS as re } from "../../game-launcher-analytics-events.js";
+import { GO_TO_NEXT_SLIDE_AFTER_MS as ue, SHOW_LABEL_HIGHLIGHT_AFTER_MS as ge, SHOW_NUDGE_AFTER_MS as Te, SLIDE_TO_LESSON_MS as Ee } from "./constants.js";
+import { ProjectType as pe } from "../../../games/web-view/enums/project-type-enum.js";
+const ke = ({
   carouselRefs: n,
-  onSegmentClick: S,
-  onJourneyComplete: N
+  onSegmentClick: R,
+  onJourneyComplete: y
 }) => {
-  const o = me.CIRCLE_ACTIVITIES_INTRO_JOURNEY, { breakpoints: ie } = he(), { isMobile: d } = ie, I = d ? "ab3-bold" : "ab2-bold", i = L(null), r = L(null), l = L(null), _ = L([]), { playButtonSound: b } = ge(), { nextCoachmark: s, setJourney: P, endJourney: H } = Te(), { onEvent: C } = ue(), k = E(
+  const i = ae.CIRCLE_ACTIVITIES_INTRO_JOURNEY, o = A(null), r = A(null), l = A(null), p = A([]), { playButtonSound: S } = se(), { nextCoachmark: d, setJourney: N, endJourney: b } = de(), { onEvent: I } = he(), P = T(
     (e) => {
-      C(re.ONBOARDING_STEP_VIEWED, {
+      I(ee.ONBOARDING_STEP_VIEWED, {
         step: e
       });
     },
-    [C]
-  ), G = E(
+    [I]
+  ), H = T(
     (e) => {
-      C(re.ONBOARDING_STEP_COMPLETED, {
+      I(ee.ONBOARDING_STEP_COMPLETED, {
         step: e
       });
     },
-    [C]
-  ), m = E(
-    (e, f, A, O = !1) => {
-      var u, h;
-      O || (b(), (h = n.current) == null || h.goToIndex(((u = n.current) == null ? void 0 : u.currentIndex) + 1), s(o, !1, pe)), k(e);
-      const T = setTimeout(() => {
-        clearTimeout(T), f.startLabelAnimation(A);
-      }, Ie);
-      _.current.push(T), s(o, !0, _e);
+    [I]
+  ), h = T(
+    (e, _, C, f = !1) => {
+      var m, u;
+      f || (S(), (u = n.current) == null || u.goToIndex(((m = n.current) == null ? void 0 : m.currentIndex) + 1), d(i, !1, ue)), P(e);
+      const s = setTimeout(() => {
+        clearTimeout(s), _.startLabelAnimation(C);
+      }, ge);
+      p.current.push(s), d(i, !0, Te);
     },
-    [n, o, s, b, k]
-  ), U = E(
+    [n, i, d, S, P]
+  ), G = T(
     (e) => {
-      S(e, fe.PUZZLE), G(p.PUZZLE_ACTIVITY), H(o), N(o);
+      R(e, pe.PUZZLE), H(E.PUZZLE_ACTIVITY), b(i), y(i);
     },
-    [H, o, N, S, G]
-  ), Y = E(
-    (e, f) => {
-      var B, V, w, x, D, M, J, W, X, $, F, Z, j, K, q, Q, z, ee;
-      if (!((B = n == null ? void 0 : n.current) != null && B.nextBtnRef.current) || !((V = r == null ? void 0 : r.current) != null && V.segmentedCardWrapperRef.current) || !((w = i == null ? void 0 : i.current) != null && w.labelRef.current) || !((x = r == null ? void 0 : r.current) != null && x.labelRef.current) || !e)
+    [b, i, y, R, H]
+  ), U = T(
+    (e, _) => {
+      var k, w, v, B, V, x, D, M, J, W, X, $, F, Z, j, K, q, Q;
+      if (!((k = n == null ? void 0 : n.current) != null && k.nextBtnRef.current) || !((w = r == null ? void 0 : r.current) != null && w.segmentedCardWrapperRef.current) || !((v = o == null ? void 0 : o.current) != null && v.labelRef.current) || !((B = r == null ? void 0 : r.current) != null && B.labelRef.current) || !e)
         return;
-      const A = ((J = (M = (D = l.current) == null ? void 0 : D.labelRef) == null ? void 0 : M.current) == null ? void 0 : J.getBoundingClientRect()) || {
+      const C = ((D = (x = (V = l.current) == null ? void 0 : V.labelRef) == null ? void 0 : x.current) == null ? void 0 : D.getBoundingClientRect()) || {
         height: 0,
         width: 0
-      }, O = (($ = (X = (W = i.current) == null ? void 0 : W.labelRef) == null ? void 0 : X.current) == null ? void 0 : $.getBoundingClientRect()) || {
+      }, f = ((W = (J = (M = o.current) == null ? void 0 : M.labelRef) == null ? void 0 : J.current) == null ? void 0 : W.getBoundingClientRect()) || {
         height: 0,
         width: 0
-      }, T = ((j = (Z = (F = r.current) == null ? void 0 : F.labelRef) == null ? void 0 : Z.current) == null ? void 0 : j.getBoundingClientRect()) || {
+      }, s = ((F = ($ = (X = r.current) == null ? void 0 : X.labelRef) == null ? void 0 : $.current) == null ? void 0 : F.getBoundingClientRect()) || {
         height: 0,
         width: 0
-      }, u = ((Q = (q = (K = r.current) == null ? void 0 : K.segmentedCardWrapperRef) == null ? void 0 : q.current) == null ? void 0 : Q.getBoundingClientRect()) || {
+      }, m = ((K = (j = (Z = r.current) == null ? void 0 : Z.segmentedCardWrapperRef) == null ? void 0 : j.current) == null ? void 0 : K.getBoundingClientRect()) || {
         height: 0,
         width: 0
       };
-      let h = [];
-      f && l.current && (h = [
+      let u = [];
+      _ && l.current && (u = [
         {
           originalElementToHighlightRef: l.current.labelRef,
           isActive: !1,
           type: c.TOOLTIP,
-          elementToHighlight: /* @__PURE__ */ t(R, {}),
+          elementToHighlight: /* @__PURE__ */ t(O, {}),
           indicator: {
-            position: "top",
+            position: "right",
             backgroundColor: "BLUE_4",
-            tooltipItem: /* @__PURE__ */ t(y, { children: /* @__PURE__ */ t(a, { $renderAs: I, children: "Get faster & stay ahead in school. Practice 3 new skills everyday." }) }),
-            tooltipXCoOrdinates: A.width / 2,
-            tooltipYCoOrdinates: A.height + 10
+            width: 264,
+            tooltipItem: /* @__PURE__ */ t(L, { children: /* @__PURE__ */ t(a, { $renderAs: "ab2-bold", children: "Get faster & stay ahead in school. Practice 3 new skills everyday." }) }),
+            tooltipXCoOrdinates: C.width + 50,
+            tooltipYCoOrdinates: C.height / 2
           }
         },
         {
-          originalElementToHighlightRef: (z = n.current) == null ? void 0 : z.nextBtnRef,
+          originalElementToHighlightRef: (q = n.current) == null ? void 0 : q.nextBtnRef,
           isActive: !1,
           type: c.NUDGE,
           elementToHighlight: /* @__PURE__ */ t(
-            ne,
+            te,
             {
               renderAs: "secondary",
-              Icon: te,
-              onClick: () => m(
-                p.GAMES_ACTIVITY,
-                i.current,
+              Icon: z,
+              onClick: () => h(
+                E.GAMES_ACTIVITY,
+                o.current,
                 "ORANGE_4"
               ),
-              analyticsLabel: oe.JOURNEY_NEXT_ACTIVITY
+              analyticsLabel: re.JOURNEY_NEXT_ACTIVITY
             }
           ),
           indicator: {
             nudge: "click",
-            content: !d && /* @__PURE__ */ t(a, { $renderAs: "ab1", $color: "WHITE", children: "Click to proceed" }),
+            content: /* @__PURE__ */ t(a, { $renderAs: "ab1", $color: "WHITE", children: "Click to proceed" }),
             nudgePointerX: 0,
             nudgePointerY: 0
           }
         }
       ]);
-      const ce = [
+      const ie = [
         {
-          originalElementToHighlightRef: i.current.labelRef,
+          originalElementToHighlightRef: o.current.labelRef,
           isActive: !1,
           type: c.TOOLTIP,
-          elementToHighlight: /* @__PURE__ */ t(R, {}),
+          elementToHighlight: /* @__PURE__ */ t(O, {}),
           indicator: {
-            position: "top",
+            position: "right",
             backgroundColor: "ORANGE_4",
-            tooltipItem: /* @__PURE__ */ t(y, { children: /* @__PURE__ */ t(a, { $renderAs: I, children: "Train to think deeper & plan ahead. Play 3 new games everyday." }) }),
-            tooltipXCoOrdinates: O.width / 2,
-            tooltipYCoOrdinates: O.height + 10
+            width: 264,
+            tooltipItem: /* @__PURE__ */ t(L, { children: /* @__PURE__ */ t(a, { $renderAs: "ab2-bold", children: "Train to think deeper & plan ahead. Play 3 new games everyday." }) }),
+            tooltipXCoOrdinates: f.width + 50,
+            tooltipYCoOrdinates: f.height / 2
           }
         },
         {
@@ -127,37 +128,38 @@ const xe = ({
           isActive: !1,
           type: c.NUDGE,
           elementToHighlight: /* @__PURE__ */ t(
-            ne,
+            te,
             {
               renderAs: "secondary",
-              Icon: te,
-              onClick: () => m(
-                p.PUZZLE_ACTIVITY,
+              Icon: z,
+              onClick: () => h(
+                E.PUZZLE_ACTIVITY,
                 r.current,
                 "PURPLE_4"
               ),
-              analyticsLabel: oe.JOURNEY_NEXT_ACTIVITY
+              analyticsLabel: re.JOURNEY_NEXT_ACTIVITY
             }
           ),
           indicator: {
             nudge: "click",
-            content: !d && /* @__PURE__ */ t(a, { $renderAs: "ab1", $color: "WHITE", children: "Click to proceed" }),
+            content: /* @__PURE__ */ t(a, { $renderAs: "ab1", $color: "WHITE", children: "Click to proceed" }),
             nudgePointerX: 0,
             nudgePointerY: 0
           }
         }
-      ], ae = [
+      ], oe = [
         {
           originalElementToHighlightRef: r.current.labelRef,
           isActive: !1,
           type: c.TOOLTIP,
-          elementToHighlight: /* @__PURE__ */ t(R, {}),
+          elementToHighlight: /* @__PURE__ */ t(O, {}),
           indicator: {
-            position: "top",
+            position: "right",
             backgroundColor: "PURPLE_4",
-            tooltipItem: /* @__PURE__ */ t(y, { children: /* @__PURE__ */ t(a, { $renderAs: I, children: "Think in new ways & stay sharp. Solve 3 new puzzles everyday." }) }),
-            tooltipXCoOrdinates: T.width / 2,
-            tooltipYCoOrdinates: T.height + 10
+            width: 264,
+            tooltipItem: /* @__PURE__ */ t(L, { children: /* @__PURE__ */ t(a, { $renderAs: "ab2-bold", children: "Think in new ways & stay sharp. Solve 3 new puzzles everyday." }) }),
+            tooltipXCoOrdinates: s.width + 50,
+            tooltipYCoOrdinates: s.height / 2
           }
         },
         {
@@ -165,7 +167,7 @@ const xe = ({
           isActive: !1,
           type: c.NUDGE,
           elementToHighlight: /* @__PURE__ */ t(
-            Ee,
+            me,
             {
               label: "",
               value: e.data.filter((g) => g.solved).length,
@@ -176,48 +178,39 @@ const xe = ({
                 name: "",
                 // We dont want to show the name of the puzzle in onboarding
                 isCompleted: g.solved,
-                onPress: () => U(g)
+                onPress: () => G(g)
               }))
             }
           ),
           indicator: {
             nudge: "click",
-            content: !d && /* @__PURE__ */ t(a, { $renderAs: "ab1", $color: "WHITE", children: "Click to solve a puzzle" }),
-            nudgePointerX: u.width * 0.6,
-            nudgePointerY: u.height * 0.4
+            content: /* @__PURE__ */ t(a, { $renderAs: "ab1", $color: "WHITE", children: "Click to solve a puzzle" }),
+            nudgePointerX: m.width * 0.6,
+            nudgePointerY: m.height * 0.4
           }
         }
       ];
-      P(o, [...h, ...ce, ...ae]), (ee = n.current) == null || ee.goToIndex(0);
-      const v = setTimeout(() => {
-        clearTimeout(v), s(o);
-      }, Ce);
-      _.current.push(v), f && l.current ? m(p.SKILL_ACTIVITY, l.current, "BLUE_4", !0) : m(p.GAMES_ACTIVITY, i.current, "ORANGE_4", !0);
+      N(i, [...u, ...ie, ...oe]), (Q = n.current) == null || Q.goToIndex(0);
+      const Y = setTimeout(() => {
+        clearTimeout(Y), d(i);
+      }, Ee);
+      p.current.push(Y), _ && l.current ? h(E.SKILL_ACTIVITY, l.current, "BLUE_4", !0) : h(E.GAMES_ACTIVITY, o.current, "ORANGE_4", !0);
     },
-    [
-      n,
-      I,
-      d,
-      P,
-      o,
-      m,
-      U,
-      s
-    ]
-  ), le = de(
+    [n, N, i, h, G, d]
+  ), ne = le(
     () => ({
-      gameRefs: i,
+      gameRefs: o,
       puzzleRefs: r,
       lessonRefs: l,
-      startJourney: Y
+      startJourney: U
     }),
-    [Y]
+    [U]
   );
-  return se(() => () => {
-    _.current.forEach((e) => clearTimeout(e)), _.current = [];
-  }, [n]), le;
+  return ce(() => () => {
+    p.current.forEach((e) => clearTimeout(e)), p.current = [];
+  }, [n]), ne;
 };
 export {
-  xe as useGameLauncherJourney
+  ke as useGameLauncherJourney
 };
 //# sourceMappingURL=use-game-launcher-journey.js.map

package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-game-launcher-journey.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.tsx"],"sourcesContent":["import type { ICoachmarkProps } from '../../../../journey/use-journey/journey-context-types';\nimport type { IArrowTooltipProps } from '../../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { INudgeProps } from '../../../../ui/nudge/nudge-types';\nimport type { TColorNames } from '../../../../ui/types';\nimport type { ISegmentedGameCardRefs } from '../../comps/segmented-game-card/segmented-game-card-types';\nimport type {\n  IProject,\n  Puzzle,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { IUseGameLauncherJourneyProps } from './use-game-launcher-journey-types';\n\nimport { useCallback, useEffect, useMemo, useRef } from 'react';\n\nimport CaratRightIcon from '../../../../../assets/line-icons/icons/carat-right';\nimport { PLATFORM_EVENTS_STUDENT as AnalyticsLabel } from '../../../../analytics-events/platform-events-student';\nimport { JOURNEY_ID_STUDENT } from '../../../../journey/journey-id/journey-id-student';\nimport { IndicatorType } from '../../../../journey/use-journey/constants';\nimport { useJourney } from '../../../../journey/use-journey/use-journey';\nimport IconButton from '../../../../ui/buttons/icon-button/icon-button';\nimport { useUIContext } from '../../../../ui/context/context';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\nimport { getTheme } from '../../../../ui/theme/get-theme';\nimport { CIRCLE_ONBOARDING_ANALYTICS_STEPS as ActionEvent } from '../../../enum/circle-onboarding-steps';\nimport { ProjectType } from '../../../games/web-view/enums';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { SegmentedGameCard } from '../../comps/segmented-game-card/segmented-game-card';\nimport { GAME_LAUNCHER_ANALYTICS_EVENTS } from '../../game-launcher-analytics-events';\nimport {\n  GO_TO_NEXT_SLIDE_AFTER_MS,\n  SHOW_LABEL_HIGHLIGHT_AFTER_MS,\n  SHOW_NUDGE_AFTER_MS,\n  SLIDE_TO_LESSON_MS,\n} from './constants';\n\nexport const useGameLauncherJourney = ({\n  carouselRefs,\n  onSegmentClick,\n  onJourneyComplete,\n}: IUseGameLauncherJourneyProps) => {\n  const journeyId = JOURNEY_ID_STUDENT.CIRCLE_ACTIVITIES_INTRO_JOURNEY;\n\n  const { breakpoints } = getTheme();\n  const { isMobile } = breakpoints;\n  const tooltipTextRenderAs = isMobile ? 'ab3-bold' : 'ab2-bold';\n\n  const gameRefs = useRef<ISegmentedGameCardRefs>(null);\n  const puzzleRefs = useRef<ISegmentedGameCardRefs>(null);\n  const lessonRefs = useRef<ISegmentedGameCardRefs>(null);\n  const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n  const { playButtonSound } = useCircleSounds();\n  const { nextCoachmark, setJourney, endJourney } = useJourney();\n  const { onEvent: trackAnalytics } = useUIContext();\n\n  const trackEventViewed = useCallback(\n    (step: ActionEvent) => {\n      trackAnalytics(AnalyticsLabel.ONBOARDING_STEP_VIEWED, {\n        step,\n      });\n    },\n    [trackAnalytics],\n  );\n  const trackEventCompleted = useCallback(\n    (step: ActionEvent) => {\n      trackAnalytics(AnalyticsLabel.ONBOARDING_STEP_COMPLETED, {\n        step,\n      });\n    },\n    [trackAnalytics],\n  );\n\n  const goToNextCard = useCallback(\n    (\n      analyticsLabelViewed: ActionEvent,\n      refOfNextSlide: ISegmentedGameCardRefs,\n      color: TColorNames,\n      isFirstSlide: boolean = false,\n    ) => {\n      if (!isFirstSlide) {\n        playButtonSound();\n        carouselRefs.current?.goToIndex(carouselRefs.current?.currentIndex + 1);\n        nextCoachmark(journeyId, false, GO_TO_NEXT_SLIDE_AFTER_MS);\n      }\n\n      trackEventViewed(analyticsLabelViewed);\n\n      const animateLabelTimer = setTimeout(() => {\n        clearTimeout(animateLabelTimer);\n        refOfNextSlide.startLabelAnimation(color);\n      }, SHOW_LABEL_HIGHLIGHT_AFTER_MS);\n\n      timerRefs.current.push(animateLabelTimer); // Store to cleanup later\n\n      nextCoachmark(journeyId, true, SHOW_NUDGE_AFTER_MS);\n    },\n    [carouselRefs, journeyId, nextCoachmark, playButtonSound, trackEventViewed],\n  );\n\n  const handleEndJourney = useCallback(\n    (puzzlesData: Puzzle) => {\n      onSegmentClick(puzzlesData, ProjectType.PUZZLE);\n      trackEventCompleted(ActionEvent.PUZZLE_ACTIVITY);\n      endJourney(journeyId);\n      onJourneyComplete(journeyId);\n    },\n    [endJourney, journeyId, onJourneyComplete, onSegmentClick, trackEventCompleted],\n  );\n\n  const startJourney = useCallback(\n    (puzzlesData: IProject<Puzzle>, isLessonAvailable: boolean) => {\n      // If element refs are not available return, this is just for type safety\n      if (\n        !carouselRefs?.current?.nextBtnRef.current ||\n        !puzzleRefs?.current?.segmentedCardWrapperRef.current ||\n        !gameRefs?.current?.labelRef.current ||\n        !puzzleRefs?.current?.labelRef.current ||\n        !puzzlesData\n      ) {\n        return;\n      }\n\n      const lessonLabelDims = lessonRefs.current?.labelRef?.current?.getBoundingClientRect() || {\n        height: 0,\n        width: 0,\n      };\n      const gameLabelDims = gameRefs.current?.labelRef?.current?.getBoundingClientRect() || {\n        height: 0,\n        width: 0,\n      };\n      const puzzleLabelDims = puzzleRefs.current?.labelRef?.current?.getBoundingClientRect() || {\n        height: 0,\n        width: 0,\n      };\n\n      const launcherDims =\n        puzzleRefs.current?.segmentedCardWrapperRef?.current?.getBoundingClientRect() || {\n          height: 0,\n          width: 0,\n        };\n\n      let lessonSteps: ICoachmarkProps[] = [];\n\n      if (isLessonAvailable && lessonRefs.current) {\n        lessonSteps = [\n          {\n            originalElementToHighlightRef: lessonRefs.current.labelRef,\n            isActive: false,\n            type: IndicatorType.TOOLTIP,\n            elementToHighlight: <></>,\n            indicator: {\n              position: 'top',\n              backgroundColor: 'BLUE_4',\n              tooltipItem: (\n                <FlexView>\n                  <Text $renderAs={tooltipTextRenderAs}>\n                    Get faster & stay ahead in school. Practice 3 new skills everyday.\n                  </Text>\n                </FlexView>\n              ),\n              tooltipXCoOrdinates: lessonLabelDims.width / 2,\n              tooltipYCoOrdinates: lessonLabelDims.height + 10,\n            } as IArrowTooltipProps,\n          },\n          {\n            originalElementToHighlightRef: carouselRefs.current?.nextBtnRef,\n            isActive: false,\n            type: IndicatorType.NUDGE,\n            elementToHighlight: (\n              <IconButton\n                renderAs=\"secondary\"\n                Icon={CaratRightIcon}\n                onClick={() =>\n                  goToNextCard(\n                    ActionEvent.GAMES_ACTIVITY,\n                    gameRefs.current as ISegmentedGameCardRefs,\n                    'ORANGE_4',\n                  )\n                }\n                analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n              />\n            ),\n            indicator: {\n              nudge: 'click',\n              content: !isMobile && (\n                <Text $renderAs=\"ab1\" $color=\"WHITE\">\n                  Click to proceed\n                </Text>\n              ),\n              nudgePointerX: 0,\n              nudgePointerY: 0,\n            } as INudgeProps,\n          },\n        ];\n      }\n\n      const gameSteps: ICoachmarkProps[] = [\n        {\n          originalElementToHighlightRef: gameRefs.current.labelRef,\n          isActive: false,\n          type: IndicatorType.TOOLTIP,\n          elementToHighlight: <></>,\n          indicator: {\n            position: 'top',\n            backgroundColor: 'ORANGE_4',\n            tooltipItem: (\n              <FlexView>\n                <Text $renderAs={tooltipTextRenderAs}>\n                  Train to think deeper & plan ahead. Play 3 new games everyday.\n                </Text>\n              </FlexView>\n            ),\n            tooltipXCoOrdinates: gameLabelDims.width / 2,\n            tooltipYCoOrdinates: gameLabelDims.height + 10,\n          } as IArrowTooltipProps,\n        },\n        {\n          originalElementToHighlightRef: carouselRefs.current.nextBtnRef,\n          isActive: false,\n          type: IndicatorType.NUDGE,\n          elementToHighlight: (\n            <IconButton\n              renderAs=\"secondary\"\n              Icon={CaratRightIcon}\n              onClick={() =>\n                goToNextCard(\n                  ActionEvent.PUZZLE_ACTIVITY,\n                  puzzleRefs.current as ISegmentedGameCardRefs,\n                  'PURPLE_4',\n                )\n              }\n              analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n            />\n          ),\n          indicator: {\n            nudge: 'click',\n            content: !isMobile && (\n              <Text $renderAs=\"ab1\" $color=\"WHITE\">\n                Click to proceed\n              </Text>\n            ),\n            nudgePointerX: 0,\n            nudgePointerY: 0,\n          } as INudgeProps,\n        },\n      ];\n\n      const puzzleSteps: ICoachmarkProps[] = [\n        {\n          originalElementToHighlightRef: puzzleRefs.current.labelRef,\n          isActive: false,\n          type: IndicatorType.TOOLTIP,\n          elementToHighlight: <></>,\n          indicator: {\n            position: 'top',\n            backgroundColor: 'PURPLE_4',\n            tooltipItem: (\n              <FlexView>\n                <Text $renderAs={tooltipTextRenderAs}>\n                  Think in new ways & stay sharp. Solve 3 new puzzles everyday.\n                </Text>\n              </FlexView>\n            ),\n            tooltipXCoOrdinates: puzzleLabelDims.width / 2,\n            tooltipYCoOrdinates: puzzleLabelDims.height + 10,\n          } as IArrowTooltipProps,\n        },\n        {\n          originalElementToHighlightRef: puzzleRefs.current.segmentedCardWrapperRef,\n          isActive: false,\n          type: IndicatorType.NUDGE,\n          elementToHighlight: (\n            <SegmentedGameCard\n              label={''} // This is intentionally left blank to avoid showing the label\n              value={puzzlesData.data.filter(puzzle => puzzle.solved).length}\n              maxValue={puzzlesData.data.length}\n              initialValue={puzzlesData.initialProgressValue}\n              data={puzzlesData.data.map(puzzle => ({\n                card: puzzle.cardLottie,\n                name: '', // We dont want to show the name of the puzzle in onboarding\n                isCompleted: puzzle.solved,\n                onPress: () => handleEndJourney(puzzle),\n              }))}\n            />\n          ),\n          indicator: {\n            nudge: 'click',\n            content: !isMobile && (\n              <Text $renderAs=\"ab1\" $color=\"WHITE\">\n                Click to solve a puzzle\n              </Text>\n            ),\n            nudgePointerX: launcherDims.width * 0.6,\n            nudgePointerY: launcherDims.height * 0.4,\n          } as INudgeProps,\n        },\n      ];\n\n      setJourney(journeyId, [...lessonSteps, ...gameSteps, ...puzzleSteps]);\n\n      carouselRefs.current?.goToIndex(0); // Always start from 0th Index no matter what the current index is\n\n      const delayBeforeStart = setTimeout(() => {\n        clearTimeout(delayBeforeStart);\n        nextCoachmark(journeyId);\n      }, SLIDE_TO_LESSON_MS);\n\n      timerRefs.current.push(delayBeforeStart); // Store to cleanup later\n\n      if (isLessonAvailable && lessonRefs.current) {\n        goToNextCard(ActionEvent.SKILL_ACTIVITY, lessonRefs.current, 'BLUE_4', true);\n      } else {\n        goToNextCard(ActionEvent.GAMES_ACTIVITY, gameRefs.current, 'ORANGE_4', true);\n      }\n    },\n    [\n      carouselRefs,\n      tooltipTextRenderAs,\n      isMobile,\n      setJourney,\n      journeyId,\n      goToNextCard,\n      handleEndJourney,\n      nextCoachmark,\n    ],\n  );\n\n  const data = useMemo(\n    () => ({\n      gameRefs,\n      puzzleRefs,\n      lessonRefs,\n      startJourney,\n    }),\n    [startJourney],\n  );\n\n  // Cleanup on unmount\n  useEffect(() => {\n    return () => {\n      timerRefs.current.forEach(timer => clearTimeout(timer));\n      timerRefs.current = [];\n    };\n  }, [carouselRefs]);\n\n  return data;\n};\n"],"names":["useGameLauncherJourney","carouselRefs","onSegmentClick","onJourneyComplete","journeyId","JOURNEY_ID_STUDENT","breakpoints","getTheme","isMobile","tooltipTextRenderAs","gameRefs","useRef","puzzleRefs","lessonRefs","timerRefs","playButtonSound","useCircleSounds","nextCoachmark","setJourney","endJourney","useJourney","trackAnalytics","useUIContext","trackEventViewed","useCallback","step","AnalyticsLabel","trackEventCompleted","goToNextCard","analyticsLabelViewed","refOfNextSlide","color","isFirstSlide","_b","_a","GO_TO_NEXT_SLIDE_AFTER_MS","animateLabelTimer","SHOW_LABEL_HIGHLIGHT_AFTER_MS","SHOW_NUDGE_AFTER_MS","handleEndJourney","puzzlesData","ProjectType","ActionEvent","startJourney","isLessonAvailable","_c","_d","lessonLabelDims","_g","_f","_e","gameLabelDims","_j","_i","_h","puzzleLabelDims","_m","_l","_k","launcherDims","_p","_o","_n","lessonSteps","IndicatorType","jsx","Fragment","FlexView","Text","_q","IconButton","CaratRightIcon","GAME_LAUNCHER_ANALYTICS_EVENTS","gameSteps","puzzleSteps","SegmentedGameCard","puzzle","_r","delayBeforeStart","SLIDE_TO_LESSON_MS","data","useMemo","useEffect","timer"],"mappings":";;;;;;;;;;;;;;;;;;AAmCO,MAAMA,KAAyB,CAAC;AAAA,EACrC,cAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,mBAAAC;AACF,MAAoC;AAClC,QAAMC,IAAYC,GAAmB,iCAE/B,EAAE,aAAAC,OAAgBC,MAClB,EAAE,UAAAC,EAAa,IAAAF,IACfG,IAAsBD,IAAW,aAAa,YAE9CE,IAAWC,EAA+B,IAAI,GAC9CC,IAAaD,EAA+B,IAAI,GAChDE,IAAaF,EAA+B,IAAI,GAChDG,IAAYH,EAAwC,CAAA,CAAE,GAEtD,EAAE,iBAAAI,MAAoBC,MACtB,EAAE,eAAAC,GAAe,YAAAC,GAAY,YAAAC,MAAeC,GAAW,GACvD,EAAE,SAASC,EAAe,IAAIC,GAAa,GAE3CC,IAAmBC;AAAA,IACvB,CAACC,MAAsB;AACrB,MAAAJ,EAAeK,GAAe,wBAAwB;AAAA,QACpD,MAAAD;AAAA,MAAA,CACD;AAAA,IACH;AAAA,IACA,CAACJ,CAAc;AAAA,EAAA,GAEXM,IAAsBH;AAAA,IAC1B,CAACC,MAAsB;AACrB,MAAAJ,EAAeK,GAAe,2BAA2B;AAAA,QACvD,MAAAD;AAAA,MAAA,CACD;AAAA,IACH;AAAA,IACA,CAACJ,CAAc;AAAA,EAAA,GAGXO,IAAeJ;AAAA,IACnB,CACEK,GACAC,GACAC,GACAC,IAAwB,OACrB;;AACH,MAAKA,MACajB,MAChBkB,IAAAhC,EAAa,YAAb,QAAAgC,EAAsB,YAAUC,IAAAjC,EAAa,YAAb,gBAAAiC,EAAsB,gBAAe,IACvDjB,EAAAb,GAAW,IAAO+B,EAAyB,IAG3DZ,EAAiBM,CAAoB;AAE/B,YAAAO,IAAoB,WAAW,MAAM;AACzC,qBAAaA,CAAiB,GAC9BN,EAAe,oBAAoBC,CAAK;AAAA,SACvCM,EAA6B;AAEtB,MAAAvB,EAAA,QAAQ,KAAKsB,CAAiB,GAE1BnB,EAAAb,GAAW,IAAMkC,EAAmB;AAAA,IACpD;AAAA,IACA,CAACrC,GAAcG,GAAWa,GAAeF,GAAiBQ,CAAgB;AAAA,EAAA,GAGtEgB,IAAmBf;AAAA,IACvB,CAACgB,MAAwB;AACR,MAAAtC,EAAAsC,GAAaC,GAAY,MAAM,GAC9Cd,EAAoBe,EAAY,eAAe,GAC/CvB,EAAWf,CAAS,GACpBD,EAAkBC,CAAS;AAAA,IAC7B;AAAA,IACA,CAACe,GAAYf,GAAWD,GAAmBD,GAAgByB,CAAmB;AAAA,EAAA,GAG1EgB,IAAenB;AAAA,IACnB,CAACgB,GAA+BI,MAA+B;;AAG3D,UAAA,GAACV,IAAAjC,KAAA,gBAAAA,EAAc,YAAd,QAAAiC,EAAuB,WAAW,YACnC,GAACD,IAAArB,KAAA,gBAAAA,EAAY,YAAZ,QAAAqB,EAAqB,wBAAwB,YAC9C,GAACY,IAAAnC,KAAA,gBAAAA,EAAU,YAAV,QAAAmC,EAAmB,SAAS,YAC7B,GAACC,IAAAlC,KAAA,gBAAAA,EAAY,YAAZ,QAAAkC,EAAqB,SAAS,YAC/B,CAACN;AAED;AAGF,YAAMO,MAAkBC,KAAAC,KAAAC,IAAArC,EAAW,YAAX,gBAAAqC,EAAoB,aAApB,gBAAAD,EAA8B,YAA9B,gBAAAD,EAAuC,4BAA2B;AAAA,QACxF,QAAQ;AAAA,QACR,OAAO;AAAA,MAAA,GAEHG,MAAgBC,KAAAC,KAAAC,IAAA5C,EAAS,YAAT,gBAAA4C,EAAkB,aAAlB,gBAAAD,EAA4B,YAA5B,gBAAAD,EAAqC,4BAA2B;AAAA,QACpF,QAAQ;AAAA,QACR,OAAO;AAAA,MAAA,GAEHG,MAAkBC,KAAAC,KAAAC,IAAA9C,EAAW,YAAX,gBAAA8C,EAAoB,aAApB,gBAAAD,EAA8B,YAA9B,gBAAAD,EAAuC,4BAA2B;AAAA,QACxF,QAAQ;AAAA,QACR,OAAO;AAAA,MAAA,GAGHG,MACJC,KAAAC,KAAAC,IAAAlD,EAAW,YAAX,gBAAAkD,EAAoB,4BAApB,gBAAAD,EAA6C,YAA7C,gBAAAD,EAAsD,4BAA2B;AAAA,QAC/E,QAAQ;AAAA,QACR,OAAO;AAAA,MAAA;AAGX,UAAIG,IAAiC,CAAA;AAEjC,MAAAnB,KAAqB/B,EAAW,YACpBkD,IAAA;AAAA,QACZ;AAAA,UACE,+BAA+BlD,EAAW,QAAQ;AAAA,UAClD,UAAU;AAAA,UACV,MAAMmD,EAAc;AAAA,UACpB,oBAAsB,gBAAAC,EAAAC,GAAA,EAAA;AAAA,UACtB,WAAW;AAAA,YACT,UAAU;AAAA,YACV,iBAAiB;AAAA,YACjB,+BACGC,GACC,EAAA,UAAA,gBAAAF,EAACG,KAAK,WAAW3D,GAAqB,gFAEtC,EACF,CAAA;AAAA,YAEF,qBAAqBsC,EAAgB,QAAQ;AAAA,YAC7C,qBAAqBA,EAAgB,SAAS;AAAA,UAChD;AAAA,QACF;AAAA,QACA;AAAA,UACE,gCAA+BsB,IAAApE,EAAa,YAAb,gBAAAoE,EAAsB;AAAA,UACrD,UAAU;AAAA,UACV,MAAML,EAAc;AAAA,UACpB,oBACE,gBAAAC;AAAA,YAACK;AAAA,YAAA;AAAA,cACC,UAAS;AAAA,cACT,MAAMC;AAAA,cACN,SAAS,MACP3C;AAAA,gBACEc,EAAY;AAAA,gBACZhC,EAAS;AAAA,gBACT;AAAA,cACF;AAAA,cAEF,gBAAgB8D,GAA+B;AAAA,YAAA;AAAA,UACjD;AAAA,UAEF,WAAW;AAAA,YACT,OAAO;AAAA,YACP,SAAS,CAAChE,KACR,gBAAAyD,EAACG,KAAK,WAAU,OAAM,QAAO,SAAQ,UAErC,mBAAA,CAAA;AAAA,YAEF,eAAe;AAAA,YACf,eAAe;AAAA,UACjB;AAAA,QACF;AAAA,MAAA;AAIJ,YAAMK,KAA+B;AAAA,QACnC;AAAA,UACE,+BAA+B/D,EAAS,QAAQ;AAAA,UAChD,UAAU;AAAA,UACV,MAAMsD,EAAc;AAAA,UACpB,oBAAsB,gBAAAC,EAAAC,GAAA,EAAA;AAAA,UACtB,WAAW;AAAA,YACT,UAAU;AAAA,YACV,iBAAiB;AAAA,YACjB,+BACGC,GACC,EAAA,UAAA,gBAAAF,EAACG,KAAK,WAAW3D,GAAqB,4EAEtC,EACF,CAAA;AAAA,YAEF,qBAAqB0C,EAAc,QAAQ;AAAA,YAC3C,qBAAqBA,EAAc,SAAS;AAAA,UAC9C;AAAA,QACF;AAAA,QACA;AAAA,UACE,+BAA+BlD,EAAa,QAAQ;AAAA,UACpD,UAAU;AAAA,UACV,MAAM+D,EAAc;AAAA,UACpB,oBACE,gBAAAC;AAAA,YAACK;AAAA,YAAA;AAAA,cACC,UAAS;AAAA,cACT,MAAMC;AAAA,cACN,SAAS,MACP3C;AAAA,gBACEc,EAAY;AAAA,gBACZ9B,EAAW;AAAA,gBACX;AAAA,cACF;AAAA,cAEF,gBAAgB4D,GAA+B;AAAA,YAAA;AAAA,UACjD;AAAA,UAEF,WAAW;AAAA,YACT,OAAO;AAAA,YACP,SAAS,CAAChE,KACR,gBAAAyD,EAACG,KAAK,WAAU,OAAM,QAAO,SAAQ,UAErC,mBAAA,CAAA;AAAA,YAEF,eAAe;AAAA,YACf,eAAe;AAAA,UACjB;AAAA,QACF;AAAA,MAAA,GAGIM,KAAiC;AAAA,QACrC;AAAA,UACE,+BAA+B9D,EAAW,QAAQ;AAAA,UAClD,UAAU;AAAA,UACV,MAAMoD,EAAc;AAAA,UACpB,oBAAsB,gBAAAC,EAAAC,GAAA,EAAA;AAAA,UACtB,WAAW;AAAA,YACT,UAAU;AAAA,YACV,iBAAiB;AAAA,YACjB,+BACGC,GACC,EAAA,UAAA,gBAAAF,EAACG,KAAK,WAAW3D,GAAqB,2EAEtC,EACF,CAAA;AAAA,YAEF,qBAAqB8C,EAAgB,QAAQ;AAAA,YAC7C,qBAAqBA,EAAgB,SAAS;AAAA,UAChD;AAAA,QACF;AAAA,QACA;AAAA,UACE,+BAA+B3C,EAAW,QAAQ;AAAA,UAClD,UAAU;AAAA,UACV,MAAMoD,EAAc;AAAA,UACpB,oBACE,gBAAAC;AAAA,YAACU;AAAA,YAAA;AAAA,cACC,OAAO;AAAA,cACP,OAAOnC,EAAY,KAAK,OAAO,CAAUoC,MAAAA,EAAO,MAAM,EAAE;AAAA,cACxD,UAAUpC,EAAY,KAAK;AAAA,cAC3B,cAAcA,EAAY;AAAA,cAC1B,MAAMA,EAAY,KAAK,IAAI,CAAWoC,OAAA;AAAA,gBACpC,MAAMA,EAAO;AAAA,gBACb,MAAM;AAAA;AAAA,gBACN,aAAaA,EAAO;AAAA,gBACpB,SAAS,MAAMrC,EAAiBqC,CAAM;AAAA,cAAA,EACtC;AAAA,YAAA;AAAA,UACJ;AAAA,UAEF,WAAW;AAAA,YACT,OAAO;AAAA,YACP,SAAS,CAACpE,KACR,gBAAAyD,EAACG,KAAK,WAAU,OAAM,QAAO,SAAQ,UAErC,0BAAA,CAAA;AAAA,YAEF,eAAeT,EAAa,QAAQ;AAAA,YACpC,eAAeA,EAAa,SAAS;AAAA,UACvC;AAAA,QACF;AAAA,MAAA;AAGS,MAAAzC,EAAAd,GAAW,CAAC,GAAG2D,GAAa,GAAGU,IAAW,GAAGC,EAAW,CAAC,IAEvDG,KAAA5E,EAAA,YAAA,QAAA4E,GAAS,UAAU;AAE1B,YAAAC,IAAmB,WAAW,MAAM;AACxC,qBAAaA,CAAgB,GAC7B7D,EAAcb,CAAS;AAAA,SACtB2E,EAAkB;AAEX,MAAAjE,EAAA,QAAQ,KAAKgE,CAAgB,GAEnClC,KAAqB/B,EAAW,UAClCe,EAAac,EAAY,gBAAgB7B,EAAW,SAAS,UAAU,EAAI,IAE3Ee,EAAac,EAAY,gBAAgBhC,EAAS,SAAS,YAAY,EAAI;AAAA,IAE/E;AAAA,IACA;AAAA,MACET;AAAA,MACAQ;AAAA,MACAD;AAAA,MACAU;AAAA,MACAd;AAAA,MACAwB;AAAA,MACAW;AAAA,MACAtB;AAAA,IACF;AAAA,EAAA,GAGI+D,KAAOC;AAAA,IACX,OAAO;AAAA,MACL,UAAAvE;AAAA,MACA,YAAAE;AAAA,MACA,YAAAC;AAAA,MACA,cAAA8B;AAAA,IAAA;AAAA,IAEF,CAACA,CAAY;AAAA,EAAA;AAIf,SAAAuC,GAAU,MACD,MAAM;AACX,IAAApE,EAAU,QAAQ,QAAQ,CAASqE,MAAA,aAAaA,CAAK,CAAC,GACtDrE,EAAU,UAAU;EAAC,GAEtB,CAACb,CAAY,CAAC,GAEV+E;AACT;"}
+{"version":3,"file":"use-game-launcher-journey.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.tsx"],"sourcesContent":["import type { ICoachmarkProps } from '../../../../journey/use-journey/journey-context-types';\nimport type { IArrowTooltipProps } from '../../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { INudgeProps } from '../../../../ui/nudge/nudge-types';\nimport type { TColorNames } from '../../../../ui/types';\nimport type { ISegmentedGameCardRefs } from '../../comps/segmented-game-card/segmented-game-card-types';\nimport type {\n  IProject,\n  Puzzle,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { IUseGameLauncherJourneyProps } from './use-game-launcher-journey-types';\n\nimport { useCallback, useEffect, useMemo, useRef } from 'react';\n\nimport CaratRightIcon from '../../../../../assets/line-icons/icons/carat-right';\nimport { PLATFORM_EVENTS_STUDENT as AnalyticsLabel } from '../../../../analytics-events/platform-events-student';\nimport { JOURNEY_ID_STUDENT } from '../../../../journey/journey-id/journey-id-student';\nimport { IndicatorType } from '../../../../journey/use-journey/constants';\nimport { useJourney } from '../../../../journey/use-journey/use-journey';\nimport IconButton from '../../../../ui/buttons/icon-button/icon-button';\nimport { useUIContext } from '../../../../ui/context/context';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\nimport { CIRCLE_ONBOARDING_ANALYTICS_STEPS as ActionEvent } from '../../../enum/circle-onboarding-steps';\nimport { ProjectType } from '../../../games/web-view/enums';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { SegmentedGameCard } from '../../comps/segmented-game-card/segmented-game-card';\nimport { GAME_LAUNCHER_ANALYTICS_EVENTS } from '../../game-launcher-analytics-events';\nimport {\n  GO_TO_NEXT_SLIDE_AFTER_MS,\n  SHOW_LABEL_HIGHLIGHT_AFTER_MS,\n  SHOW_NUDGE_AFTER_MS,\n  SLIDE_TO_LESSON_MS,\n} from './constants';\n\nexport const useGameLauncherJourney = ({\n  carouselRefs,\n  onSegmentClick,\n  onJourneyComplete,\n}: IUseGameLauncherJourneyProps) => {\n  const journeyId = JOURNEY_ID_STUDENT.CIRCLE_ACTIVITIES_INTRO_JOURNEY;\n\n  const gameRefs = useRef<ISegmentedGameCardRefs>(null);\n  const puzzleRefs = useRef<ISegmentedGameCardRefs>(null);\n  const lessonRefs = useRef<ISegmentedGameCardRefs>(null);\n  const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n  const { playButtonSound } = useCircleSounds();\n  const { nextCoachmark, setJourney, endJourney } = useJourney();\n  const { onEvent: trackAnalytics } = useUIContext();\n\n  const trackEventViewed = useCallback(\n    (step: ActionEvent) => {\n      trackAnalytics(AnalyticsLabel.ONBOARDING_STEP_VIEWED, {\n        step,\n      });\n    },\n    [trackAnalytics],\n  );\n  const trackEventCompleted = useCallback(\n    (step: ActionEvent) => {\n      trackAnalytics(AnalyticsLabel.ONBOARDING_STEP_COMPLETED, {\n        step,\n      });\n    },\n    [trackAnalytics],\n  );\n\n  const goToNextCard = useCallback(\n    (\n      analyticsLabelViewed: ActionEvent,\n      refOfNextSlide: ISegmentedGameCardRefs,\n      color: TColorNames,\n      isFirstSlide: boolean = false,\n    ) => {\n      if (!isFirstSlide) {\n        playButtonSound();\n        carouselRefs.current?.goToIndex(carouselRefs.current?.currentIndex + 1);\n        nextCoachmark(journeyId, false, GO_TO_NEXT_SLIDE_AFTER_MS);\n      }\n\n      trackEventViewed(analyticsLabelViewed);\n\n      const animateLabelTimer = setTimeout(() => {\n        clearTimeout(animateLabelTimer);\n        refOfNextSlide.startLabelAnimation(color);\n      }, SHOW_LABEL_HIGHLIGHT_AFTER_MS);\n\n      timerRefs.current.push(animateLabelTimer); // Store to cleanup later\n\n      nextCoachmark(journeyId, true, SHOW_NUDGE_AFTER_MS);\n    },\n    [carouselRefs, journeyId, nextCoachmark, playButtonSound, trackEventViewed],\n  );\n\n  const handleEndJourney = useCallback(\n    (puzzlesData: Puzzle) => {\n      onSegmentClick(puzzlesData, ProjectType.PUZZLE);\n      trackEventCompleted(ActionEvent.PUZZLE_ACTIVITY);\n      endJourney(journeyId);\n      onJourneyComplete(journeyId);\n    },\n    [endJourney, journeyId, onJourneyComplete, onSegmentClick, trackEventCompleted],\n  );\n\n  const startJourney = useCallback(\n    (puzzlesData: IProject<Puzzle>, isLessonAvailable: boolean) => {\n      // If element refs are not available return, this is just for type safety\n      if (\n        !carouselRefs?.current?.nextBtnRef.current ||\n        !puzzleRefs?.current?.segmentedCardWrapperRef.current ||\n        !gameRefs?.current?.labelRef.current ||\n        !puzzleRefs?.current?.labelRef.current ||\n        !puzzlesData\n      ) {\n        return;\n      }\n\n      const lessonLabelDims = lessonRefs.current?.labelRef?.current?.getBoundingClientRect() || {\n        height: 0,\n        width: 0,\n      };\n      const gameLabelDims = gameRefs.current?.labelRef?.current?.getBoundingClientRect() || {\n        height: 0,\n        width: 0,\n      };\n      const puzzleLabelDims = puzzleRefs.current?.labelRef?.current?.getBoundingClientRect() || {\n        height: 0,\n        width: 0,\n      };\n\n      const launcherDims =\n        puzzleRefs.current?.segmentedCardWrapperRef?.current?.getBoundingClientRect() || {\n          height: 0,\n          width: 0,\n        };\n\n      let lessonSteps: ICoachmarkProps[] = [];\n\n      if (isLessonAvailable && lessonRefs.current) {\n        lessonSteps = [\n          {\n            originalElementToHighlightRef: lessonRefs.current.labelRef,\n            isActive: false,\n            type: IndicatorType.TOOLTIP,\n            elementToHighlight: <></>,\n            indicator: {\n              position: 'right',\n              backgroundColor: 'BLUE_4',\n              width: 264,\n              tooltipItem: (\n                <FlexView>\n                  <Text $renderAs=\"ab2-bold\">\n                    Get faster & stay ahead in school. Practice 3 new skills everyday.\n                  </Text>\n                </FlexView>\n              ),\n              tooltipXCoOrdinates: lessonLabelDims.width + 50,\n              tooltipYCoOrdinates: lessonLabelDims.height / 2,\n            } as IArrowTooltipProps,\n          },\n          {\n            originalElementToHighlightRef: carouselRefs.current?.nextBtnRef,\n            isActive: false,\n            type: IndicatorType.NUDGE,\n            elementToHighlight: (\n              <IconButton\n                renderAs=\"secondary\"\n                Icon={CaratRightIcon}\n                onClick={() =>\n                  goToNextCard(\n                    ActionEvent.GAMES_ACTIVITY,\n                    gameRefs.current as ISegmentedGameCardRefs,\n                    'ORANGE_4',\n                  )\n                }\n                analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n              />\n            ),\n            indicator: {\n              nudge: 'click',\n              content: (\n                <Text $renderAs=\"ab1\" $color=\"WHITE\">\n                  Click to proceed\n                </Text>\n              ),\n              nudgePointerX: 0,\n              nudgePointerY: 0,\n            } as INudgeProps,\n          },\n        ];\n      }\n\n      const gameSteps: ICoachmarkProps[] = [\n        {\n          originalElementToHighlightRef: gameRefs.current.labelRef,\n          isActive: false,\n          type: IndicatorType.TOOLTIP,\n          elementToHighlight: <></>,\n          indicator: {\n            position: 'right',\n            backgroundColor: 'ORANGE_4',\n            width: 264,\n            tooltipItem: (\n              <FlexView>\n                <Text $renderAs=\"ab2-bold\">\n                  Train to think deeper & plan ahead. Play 3 new games everyday.\n                </Text>\n              </FlexView>\n            ),\n            tooltipXCoOrdinates: gameLabelDims.width + 50,\n            tooltipYCoOrdinates: gameLabelDims.height / 2,\n          } as IArrowTooltipProps,\n        },\n        {\n          originalElementToHighlightRef: carouselRefs.current.nextBtnRef,\n          isActive: false,\n          type: IndicatorType.NUDGE,\n          elementToHighlight: (\n            <IconButton\n              renderAs=\"secondary\"\n              Icon={CaratRightIcon}\n              onClick={() =>\n                goToNextCard(\n                  ActionEvent.PUZZLE_ACTIVITY,\n                  puzzleRefs.current as ISegmentedGameCardRefs,\n                  'PURPLE_4',\n                )\n              }\n              analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n            />\n          ),\n          indicator: {\n            nudge: 'click',\n            content: (\n              <Text $renderAs=\"ab1\" $color=\"WHITE\">\n                Click to proceed\n              </Text>\n            ),\n            nudgePointerX: 0,\n            nudgePointerY: 0,\n          } as INudgeProps,\n        },\n      ];\n\n      const puzzleSteps: ICoachmarkProps[] = [\n        {\n          originalElementToHighlightRef: puzzleRefs.current.labelRef,\n          isActive: false,\n          type: IndicatorType.TOOLTIP,\n          elementToHighlight: <></>,\n          indicator: {\n            position: 'right',\n            backgroundColor: 'PURPLE_4',\n            width: 264,\n            tooltipItem: (\n              <FlexView>\n                <Text $renderAs=\"ab2-bold\">\n                  Think in new ways & stay sharp. Solve 3 new puzzles everyday.\n                </Text>\n              </FlexView>\n            ),\n            tooltipXCoOrdinates: puzzleLabelDims.width + 50,\n            tooltipYCoOrdinates: puzzleLabelDims.height / 2,\n          } as IArrowTooltipProps,\n        },\n        {\n          originalElementToHighlightRef: puzzleRefs.current.segmentedCardWrapperRef,\n          isActive: false,\n          type: IndicatorType.NUDGE,\n          elementToHighlight: (\n            <SegmentedGameCard\n              label={''} // This is intentionally left blank to avoid showing the label\n              value={puzzlesData.data.filter(puzzle => puzzle.solved).length}\n              maxValue={puzzlesData.data.length}\n              initialValue={puzzlesData.initialProgressValue}\n              data={puzzlesData.data.map(puzzle => ({\n                card: puzzle.cardLottie,\n                name: '', // We dont want to show the name of the puzzle in onboarding\n                isCompleted: puzzle.solved,\n                onPress: () => handleEndJourney(puzzle),\n              }))}\n            />\n          ),\n          indicator: {\n            nudge: 'click',\n            content: (\n              <Text $renderAs=\"ab1\" $color=\"WHITE\">\n                Click to solve a puzzle\n              </Text>\n            ),\n            nudgePointerX: launcherDims.width * 0.6,\n            nudgePointerY: launcherDims.height * 0.4,\n          } as INudgeProps,\n        },\n      ];\n\n      setJourney(journeyId, [...lessonSteps, ...gameSteps, ...puzzleSteps]);\n\n      carouselRefs.current?.goToIndex(0); // Always start from 0th Index no matter what the current index is\n\n      const delayBeforeStart = setTimeout(() => {\n        clearTimeout(delayBeforeStart);\n        nextCoachmark(journeyId);\n      }, SLIDE_TO_LESSON_MS);\n\n      timerRefs.current.push(delayBeforeStart); // Store to cleanup later\n\n      if (isLessonAvailable && lessonRefs.current) {\n        goToNextCard(ActionEvent.SKILL_ACTIVITY, lessonRefs.current, 'BLUE_4', true);\n      } else {\n        goToNextCard(ActionEvent.GAMES_ACTIVITY, gameRefs.current, 'ORANGE_4', true);\n      }\n    },\n    [carouselRefs, setJourney, journeyId, goToNextCard, handleEndJourney, nextCoachmark],\n  );\n\n  const data = useMemo(\n    () => ({\n      gameRefs,\n      puzzleRefs,\n      lessonRefs,\n      startJourney,\n    }),\n    [startJourney],\n  );\n\n  // Cleanup on unmount\n  useEffect(() => {\n    return () => {\n      timerRefs.current.forEach(timer => clearTimeout(timer));\n      timerRefs.current = [];\n    };\n  }, [carouselRefs]);\n\n  return data;\n};\n"],"names":["useGameLauncherJourney","carouselRefs","onSegmentClick","onJourneyComplete","journeyId","JOURNEY_ID_STUDENT","gameRefs","useRef","puzzleRefs","lessonRefs","timerRefs","playButtonSound","useCircleSounds","nextCoachmark","setJourney","endJourney","useJourney","trackAnalytics","useUIContext","trackEventViewed","useCallback","step","AnalyticsLabel","trackEventCompleted","goToNextCard","analyticsLabelViewed","refOfNextSlide","color","isFirstSlide","_b","_a","GO_TO_NEXT_SLIDE_AFTER_MS","animateLabelTimer","SHOW_LABEL_HIGHLIGHT_AFTER_MS","SHOW_NUDGE_AFTER_MS","handleEndJourney","puzzlesData","ProjectType","ActionEvent","startJourney","isLessonAvailable","_c","_d","lessonLabelDims","_g","_f","_e","gameLabelDims","_j","_i","_h","puzzleLabelDims","_m","_l","_k","launcherDims","_p","_o","_n","lessonSteps","IndicatorType","jsx","Fragment","FlexView","Text","_q","IconButton","CaratRightIcon","GAME_LAUNCHER_ANALYTICS_EVENTS","gameSteps","puzzleSteps","SegmentedGameCard","puzzle","_r","delayBeforeStart","SLIDE_TO_LESSON_MS","data","useMemo","useEffect","timer"],"mappings":"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"}