@cuemath/leap 2.8.62-rj-1 → 2.8.62-rj-4
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/dist/features/circle-games/game-launcher/comps/carousel/carousel.js +49 -51
- package/dist/features/circle-games/game-launcher/comps/carousel/carousel.js.map +1 -1
- package/dist/features/circle-games/game-launcher/game-launcher.js +67 -73
- package/dist/features/circle-games/game-launcher/game-launcher.js.map +1 -1
- package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.js +78 -79
- package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.js.map +1 -1
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js +108 -110
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js.map +1 -1
- package/dist/features/journey/use-journey/journey-context-provider.js +46 -46
- package/dist/features/journey/use-journey/journey-context-provider.js.map +1 -1
- package/dist/index.d.ts +0 -1
- package/package.json +1 -1
@@ -1,121 +1,119 @@
|
|
1
|
-
import { jsx as r, Fragment as
|
2
|
-
import { useRef as
|
3
|
-
import
|
4
|
-
import { PLATFORM_EVENTS_STUDENT as
|
5
|
-
import { JOURNEY_ID_STUDENT as
|
6
|
-
import { IndicatorType as
|
7
|
-
import { useJourney as
|
8
|
-
import
|
9
|
-
import { useUIContext as
|
10
|
-
import
|
1
|
+
import { jsx as r, Fragment as b } from "react/jsx-runtime";
|
2
|
+
import { useRef as O, useCallback as A, useEffect as J } from "react";
|
3
|
+
import V from "../../../../../assets/line-icons/icons/carat-right.js";
|
4
|
+
import { PLATFORM_EVENTS_STUDENT as U } from "../../../../analytics-events/platform-events-student.js";
|
5
|
+
import { JOURNEY_ID_STUDENT as X } from "../../../../journey/journey-id/journey-id-student.js";
|
6
|
+
import { IndicatorType as d } from "../../../../journey/use-journey/constants.js";
|
7
|
+
import { useJourney as K } from "../../../../journey/use-journey/use-journey.js";
|
8
|
+
import j from "../../../../ui/buttons/icon-button/icon-button.js";
|
9
|
+
import { useUIContext as Z } from "../../../../ui/context/context.js";
|
10
|
+
import R from "../../../../ui/layout/flex-view.js";
|
11
11
|
import m from "../../../../ui/text/text.js";
|
12
|
-
import { CIRCLE_ONBOARDING_ANALYTICS_STEPS as
|
13
|
-
import { useCircleSounds as
|
14
|
-
import { TablesCard as
|
15
|
-
import { GAME_LAUNCHER_ANALYTICS_EVENTS as
|
16
|
-
import { SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS as
|
17
|
-
import { Indicator as
|
18
|
-
const
|
19
|
-
carouselRefs:
|
20
|
-
onTableSegmentClick:
|
12
|
+
import { CIRCLE_ONBOARDING_ANALYTICS_STEPS as G } from "../../../enum/circle-onboarding-steps.js";
|
13
|
+
import { useCircleSounds as q } from "../../../hooks/use-circle-sounds/use-circle-sounds.js";
|
14
|
+
import { TablesCard as v } from "../../comps/tables-card/tables-card.js";
|
15
|
+
import { GAME_LAUNCHER_ANALYTICS_EVENTS as z } from "../../game-launcher-analytics-events.js";
|
16
|
+
import { SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS as Q, SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS as ee, START_ANIMATING_CLONED_ELEM as M, TABLE_CARD_INDEX as $, GO_TO_TABLE_LAUNCHER_DURATION_MS as te, SHOW_CLICK_TABLE_NUDGE_AFTER_MS as re, PUZZLE_CARD_INDEX as ne, SHOW_INITIAL_COACHMARK_AFTER_MS as x, LESSON_CARD_INDEX as oe, SHOW_INITIAL_TOOLTIP_AFTER_MS as ie } from "./constants.js";
|
17
|
+
import { Indicator as le } from "./use-table-launcher-journey-styled.js";
|
18
|
+
const be = ({
|
19
|
+
carouselRefs: a,
|
20
|
+
onTableSegmentClick: N
|
21
21
|
}) => {
|
22
|
-
const t =
|
23
|
-
(
|
24
|
-
var
|
25
|
-
|
26
|
-
step:
|
27
|
-
}), (
|
22
|
+
const t = X.CIRCLE_TABLES_INTRO_JOURNEY, e = O(null), _ = O(null), T = O([]), { playButtonSound: S } = q(), { nextCoachmark: l, setJourney: C, addCoachmark: u, endJourney: P } = K(), { onEvent: f } = Z(), L = A(
|
23
|
+
(n) => {
|
24
|
+
var c, o;
|
25
|
+
n && N(n), f(U.ONBOARDING_STEP_COMPLETED, {
|
26
|
+
step: G.TABLES
|
27
|
+
}), (c = e == null ? void 0 : e.current) == null || c.setLabelVisiblity(!0), (o = e == null ? void 0 : e.current) == null || o.stopLabelAnimation(), P(t);
|
28
28
|
},
|
29
|
-
[
|
30
|
-
), H =
|
31
|
-
(
|
29
|
+
[P, t, N, f]
|
30
|
+
), H = A(
|
31
|
+
(n, c) => {
|
32
32
|
var g, E, h;
|
33
33
|
if (!((g = e.current) != null && g.segmentedCardWrapperRef.current) || !((E = e.current) != null && E.labelRef.current))
|
34
34
|
return;
|
35
|
-
const
|
36
|
-
|
35
|
+
const o = e.current.labelRef.current.getBoundingClientRect(), i = (h = e.current) == null ? void 0 : h.segmentedCardWrapperRef.current.getBoundingClientRect();
|
36
|
+
u(t, {
|
37
37
|
originalElementToHighlightRef: e.current.segmentedCardWrapperRef,
|
38
38
|
isActive: !1,
|
39
|
-
type:
|
39
|
+
type: d.TOOLTIP,
|
40
40
|
elementToHighlight: /* @__PURE__ */ r(
|
41
|
-
|
41
|
+
v,
|
42
42
|
{
|
43
|
-
ref:
|
44
|
-
defaultTable:
|
45
|
-
label:
|
46
|
-
data:
|
47
|
-
onPress:
|
48
|
-
onGoBackFromTableLevel:
|
43
|
+
ref: _,
|
44
|
+
defaultTable: c,
|
45
|
+
label: n.label,
|
46
|
+
data: n.data,
|
47
|
+
onPress: L,
|
48
|
+
onGoBackFromTableLevel: L
|
49
49
|
}
|
50
50
|
),
|
51
51
|
indicator: {
|
52
52
|
position: "left",
|
53
53
|
backgroundColor: "YELLOW_4",
|
54
54
|
width: 236,
|
55
|
-
tooltipItem: /* @__PURE__ */ r(
|
55
|
+
tooltipItem: /* @__PURE__ */ r(R, { children: /* @__PURE__ */ r(m, { $renderAs: "ab2-bold", children: "Each table has 3 levels—clear them and earn 3 stars!" }) }),
|
56
56
|
tooltipXCoOrdinates: 0,
|
57
|
-
tooltipYCoOrdinates:
|
57
|
+
tooltipYCoOrdinates: o.height * 0.35
|
58
58
|
}
|
59
|
-
}),
|
59
|
+
}), u(t, {
|
60
60
|
originalElementToHighlightRef: e.current.segmentedCardWrapperRef,
|
61
61
|
isActive: !1,
|
62
|
-
type:
|
62
|
+
type: d.NUDGE,
|
63
63
|
indicator: {
|
64
64
|
nudge: "click",
|
65
65
|
content: /* @__PURE__ */ r(m, { $renderAs: "ab1", $color: "WHITE", children: "Pick a level" }),
|
66
|
-
nudgePointerX:
|
67
|
-
nudgePointerY:
|
66
|
+
nudgePointerX: i.width / 2 + 50,
|
67
|
+
nudgePointerY: i.height * 0.4
|
68
68
|
},
|
69
|
-
elementToHighlight: /* @__PURE__ */ r(
|
70
|
-
}),
|
71
|
-
const
|
72
|
-
var
|
73
|
-
clearTimeout(
|
74
|
-
},
|
75
|
-
T.current.push(
|
69
|
+
elementToHighlight: /* @__PURE__ */ r(b, {})
|
70
|
+
}), l(t, !1, Q), l(t, !0, ee);
|
71
|
+
const s = setTimeout(() => {
|
72
|
+
var p;
|
73
|
+
clearTimeout(s), (p = _.current) == null || p.startLabelAnimation("YELLOW_4");
|
74
|
+
}, M);
|
75
|
+
T.current.push(s);
|
76
76
|
},
|
77
|
-
[
|
78
|
-
),
|
79
|
-
|
80
|
-
|
77
|
+
[u, L, t, l]
|
78
|
+
), I = A(() => {
|
79
|
+
var o;
|
80
|
+
S(), (o = a.current) == null || o.goToIndex($), l(t, !1, te), f(U.ONBOARDING_STEP_VIEWED, {
|
81
|
+
step: G.TABLES
|
81
82
|
});
|
82
|
-
const
|
83
|
-
var
|
84
|
-
clearTimeout(
|
85
|
-
},
|
86
|
-
T.current.push(
|
87
|
-
const
|
88
|
-
var
|
89
|
-
clearTimeout(
|
90
|
-
},
|
91
|
-
T.current.push(
|
92
|
-
}, [
|
93
|
-
(
|
94
|
-
var h,
|
95
|
-
|
83
|
+
const n = setTimeout(() => {
|
84
|
+
var i;
|
85
|
+
clearTimeout(n), (i = e.current) == null || i.setLabelVisiblity(!1), l(t, !0);
|
86
|
+
}, re);
|
87
|
+
T.current.push(n);
|
88
|
+
const c = setTimeout(() => {
|
89
|
+
var i;
|
90
|
+
clearTimeout(c), (i = _.current) == null || i.startLabelAnimation("YELLOW_4");
|
91
|
+
}, M);
|
92
|
+
T.current.push(c);
|
93
|
+
}, [a, t, l, S, f]), w = A(
|
94
|
+
(n, c = !1) => {
|
95
|
+
var h, p, y, D, W, Y, k, B;
|
96
|
+
const o = (h = a.current) == null ? void 0 : h.indicatorRefs, i = (p = a.current) == null ? void 0 : p.nextBtnRef, s = o == null ? void 0 : o[$];
|
97
|
+
if (!((y = e.current) != null && y.segmentedCardWrapperRef.current) || !((D = e.current) != null && D.labelRef.current) || !o || !(i != null && i.current) || !s || !s.current)
|
96
98
|
return;
|
97
|
-
const
|
98
|
-
|
99
|
-
return;
|
100
|
-
L.current = !0;
|
101
|
-
const g = e.current.labelRef.current.getBoundingClientRect(), E = (D = e.current) == null ? void 0 : D.segmentedCardWrapperRef.current.getBoundingClientRect();
|
102
|
-
l ? (I(t, [
|
99
|
+
const g = e.current.labelRef.current.getBoundingClientRect(), E = (W = e.current) == null ? void 0 : W.segmentedCardWrapperRef.current.getBoundingClientRect();
|
100
|
+
c ? (C(t, [
|
103
101
|
{
|
104
|
-
originalElementToHighlightRef:
|
102
|
+
originalElementToHighlightRef: s,
|
105
103
|
isActive: !1,
|
106
|
-
type:
|
107
|
-
elementToHighlight: /* @__PURE__ */ r(
|
104
|
+
type: d.TOOLTIP,
|
105
|
+
elementToHighlight: /* @__PURE__ */ r(le, { $isActive: !1 }),
|
108
106
|
indicator: {
|
109
107
|
position: "bottom",
|
110
108
|
backgroundColor: "YELLOW_4",
|
111
109
|
width: 52,
|
112
110
|
tooltipItem: /* @__PURE__ */ r(
|
113
|
-
|
111
|
+
R,
|
114
112
|
{
|
115
113
|
$position: "absolute",
|
116
114
|
$flexDirection: "row",
|
117
115
|
style: { top: 6, left: 8, cursor: "pointer" },
|
118
|
-
onClick:
|
116
|
+
onClick: I,
|
119
117
|
children: /* @__PURE__ */ r(m, { $renderAs: "ab2-bold", children: "NEW" })
|
120
118
|
}
|
121
119
|
),
|
@@ -124,21 +122,21 @@ const Ae = ({
|
|
124
122
|
}
|
125
123
|
},
|
126
124
|
{
|
127
|
-
originalElementToHighlightRef:
|
125
|
+
originalElementToHighlightRef: s,
|
128
126
|
isActive: !1,
|
129
|
-
type:
|
127
|
+
type: d.NUDGE,
|
130
128
|
indicator: {
|
131
129
|
nudge: "click",
|
132
130
|
content: "",
|
133
131
|
nudgePointerY: 20
|
134
132
|
},
|
135
|
-
elementToHighlight: /* @__PURE__ */ r(
|
133
|
+
elementToHighlight: /* @__PURE__ */ r(b, {})
|
136
134
|
}
|
137
|
-
]),
|
135
|
+
]), (B = a.current) == null || B.goToIndex(oe), l(t, !1, x), l(t, !0, ie)) : (C(t, [
|
138
136
|
{
|
139
|
-
originalElementToHighlightRef:
|
137
|
+
originalElementToHighlightRef: (Y = a.current) == null ? void 0 : Y.nextBtnRef,
|
140
138
|
isActive: !1,
|
141
|
-
type:
|
139
|
+
type: d.NUDGE,
|
142
140
|
indicator: {
|
143
141
|
nudge: "click",
|
144
142
|
content: /* @__PURE__ */ r(m, { $renderAs: "ab1", $color: "WHITE", children: "Click to proceed" }),
|
@@ -146,32 +144,32 @@ const Ae = ({
|
|
146
144
|
nudgePointerY: 0
|
147
145
|
},
|
148
146
|
elementToHighlight: /* @__PURE__ */ r(
|
149
|
-
|
147
|
+
j,
|
150
148
|
{
|
151
149
|
renderAs: "secondary",
|
152
|
-
Icon:
|
153
|
-
onClick:
|
154
|
-
analyticsLabel:
|
150
|
+
Icon: V,
|
151
|
+
onClick: I,
|
152
|
+
analyticsLabel: z.JOURNEY_NEXT_ACTIVITY
|
155
153
|
}
|
156
154
|
)
|
157
155
|
}
|
158
|
-
]),
|
156
|
+
]), (k = a.current) == null || k.goToIndex(ne), l(t, !1, x)), u(t, {
|
159
157
|
originalElementToHighlightRef: e.current.labelRef,
|
160
158
|
isActive: !1,
|
161
|
-
type:
|
162
|
-
elementToHighlight: /* @__PURE__ */ r(
|
159
|
+
type: d.TOOLTIP,
|
160
|
+
elementToHighlight: /* @__PURE__ */ r(b, {}),
|
163
161
|
indicator: {
|
164
162
|
position: "right",
|
165
163
|
backgroundColor: "YELLOW_4",
|
166
164
|
width: 264,
|
167
|
-
tooltipItem: /* @__PURE__ */ r(
|
165
|
+
tooltipItem: /* @__PURE__ */ r(R, { children: /* @__PURE__ */ r(m, { $renderAs: "ab2-bold", children: "Get faster at multiplication! Practice everyday and become a Tables champ." }) }),
|
168
166
|
tooltipXCoOrdinates: g.width + 50,
|
169
167
|
tooltipYCoOrdinates: g.height / 2
|
170
168
|
}
|
171
|
-
}),
|
169
|
+
}), u(t, {
|
172
170
|
originalElementToHighlightRef: e.current.segmentedCardWrapperRef,
|
173
171
|
isActive: !1,
|
174
|
-
type:
|
172
|
+
type: d.NUDGE,
|
175
173
|
indicator: {
|
176
174
|
nudge: "click",
|
177
175
|
content: /* @__PURE__ */ r(m, { $renderAs: "ab1", $color: "WHITE", children: "Pick a table to start" }),
|
@@ -179,36 +177,36 @@ const Ae = ({
|
|
179
177
|
nudgePointerY: E.height / 2
|
180
178
|
},
|
181
179
|
elementToHighlight: /* @__PURE__ */ r(
|
182
|
-
|
180
|
+
v,
|
183
181
|
{
|
184
|
-
ref:
|
185
|
-
label:
|
186
|
-
data:
|
182
|
+
ref: _,
|
183
|
+
label: n.label,
|
184
|
+
data: n.data,
|
187
185
|
onPress: () => {
|
188
186
|
},
|
189
|
-
onPressTableSegment: (
|
187
|
+
onPressTableSegment: (F) => H(n, F)
|
190
188
|
}
|
191
189
|
)
|
192
190
|
});
|
193
191
|
},
|
194
192
|
[
|
195
|
-
|
196
|
-
|
197
|
-
|
193
|
+
u,
|
194
|
+
a,
|
195
|
+
I,
|
198
196
|
H,
|
199
197
|
t,
|
200
|
-
|
201
|
-
|
198
|
+
l,
|
199
|
+
C
|
202
200
|
]
|
203
201
|
);
|
204
|
-
return
|
205
|
-
T.current.forEach((
|
202
|
+
return J(() => () => {
|
203
|
+
T.current.forEach((n) => clearTimeout(n)), T.current = [];
|
206
204
|
}, [t]), {
|
207
205
|
tableRef: e,
|
208
|
-
startJourney:
|
206
|
+
startJourney: w
|
209
207
|
};
|
210
208
|
};
|
211
209
|
export {
|
212
|
-
|
210
|
+
be as useTableLauncherJourney
|
213
211
|
};
|
214
212
|
//# sourceMappingURL=use-table-launcher-journey.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"use-table-launcher-journey.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.tsx"],"sourcesContent":["/* eslint-disable react-native/no-inline-styles */\nimport type { IArrowTooltipProps } from '../../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { INudgeProps } from '../../../../ui/nudge/nudge-types';\nimport type { ITableCardRef, ITableDetails } from '../../comps/tables-card/tables-card-types';\nimport type {\n ITableInfo,\n ITables,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { IUseTableJourneyProps } from './use-table-launcher-journey-types';\n\nimport { useCallback, useEffect, useRef } from 'react';\n\nimport CaratRightIcon from '../../../../../assets/line-icons/icons/carat-right';\nimport { PLATFORM_EVENTS_STUDENT } 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 Action } from '../../../enum/circle-onboarding-steps';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { TablesCard } from '../../comps/tables-card/tables-card';\nimport { GAME_LAUNCHER_ANALYTICS_EVENTS } from '../../game-launcher-analytics-events';\nimport {\n LESSON_CARD_INDEX,\n PUZZLE_CARD_INDEX,\n SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS,\n SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS,\n TABLE_CARD_INDEX,\n} from './constants';\nimport {\n GO_TO_TABLE_LAUNCHER_DURATION_MS,\n SHOW_CLICK_TABLE_NUDGE_AFTER_MS,\n SHOW_INITIAL_COACHMARK_AFTER_MS,\n SHOW_INITIAL_TOOLTIP_AFTER_MS,\n START_ANIMATING_CLONED_ELEM,\n} from './constants';\nimport * as S from './use-table-launcher-journey-styled';\n\nexport const useTableLauncherJourney = ({\n carouselRefs,\n onTableSegmentClick,\n}: IUseTableJourneyProps) => {\n const journeyId = JOURNEY_ID_STUDENT.CIRCLE_TABLES_INTRO_JOURNEY;\n const originalTableRef = useRef<ITableCardRef>(null);\n const highlightedTableRef = useRef<ITableCardRef>(null);\n const isJourneyInProgress = useRef(false);\n\n const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n const { playButtonSound } = useCircleSounds();\n const { nextCoachmark, setJourney, addCoachmark, endJourney } = useJourney();\n const { onEvent: trackAnalytics } = useUIContext();\n\n const handleEndJourney = useCallback(\n (tableDetails?: ITableDetails) => {\n // Only when User clicked on play\n if (tableDetails) {\n onTableSegmentClick(tableDetails);\n }\n trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_COMPLETED, {\n step: Action.TABLES,\n });\n\n // Reset original table card ref label\n originalTableRef?.current?.setLabelVisiblity(true);\n originalTableRef?.current?.stopLabelAnimation();\n endJourney(journeyId);\n },\n [endJourney, journeyId, onTableSegmentClick, trackAnalytics],\n );\n\n const handleTableSegmentClick = useCallback(\n (launcherData: ITables, tableData: ITableInfo) => {\n if (\n !originalTableRef.current?.segmentedCardWrapperRef.current ||\n !originalTableRef.current?.labelRef.current\n ) {\n return;\n }\n\n const segmentedCardDims = originalTableRef.current.labelRef.current.getBoundingClientRect();\n const tableCardDims =\n originalTableRef.current?.segmentedCardWrapperRef.current.getBoundingClientRect();\n\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: (\n <TablesCard\n ref={highlightedTableRef}\n defaultTable={tableData}\n label={launcherData.label}\n data={launcherData.data}\n onPress={handleEndJourney}\n onGoBackFromTableLevel={handleEndJourney}\n />\n ),\n indicator: {\n position: 'left',\n backgroundColor: 'YELLOW_4',\n width: 236,\n tooltipItem: (\n <FlexView>\n <Text $renderAs=\"ab2-bold\">Each table has 3 levels—clear them and earn 3 stars!</Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: 0,\n tooltipYCoOrdinates: segmentedCardDims.height * 0.35,\n } as IArrowTooltipProps,\n });\n\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n Pick a level\n </Text>\n ),\n nudgePointerX: tableCardDims.width / 2 + 50,\n nudgePointerY: tableCardDims.height * 0.4,\n } as INudgeProps,\n elementToHighlight: <></>,\n });\n\n nextCoachmark(journeyId, false, SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS); // Show coachmark => Each table has 3... and Hide the previous two\n nextCoachmark(journeyId, true, SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS); // Show nudge => Pick a level\n\n const startAnimationOnLabelAgain = setTimeout(() => {\n clearTimeout(startAnimationOnLabelAgain);\n highlightedTableRef.current?.startLabelAnimation('YELLOW_4');\n }, START_ANIMATING_CLONED_ELEM);\n\n timerRefs.current.push(startAnimationOnLabelAgain);\n },\n [addCoachmark, handleEndJourney, journeyId, nextCoachmark],\n );\n\n const goToTableLauncher = useCallback(() => {\n playButtonSound();\n carouselRefs.current.goToIndex(TABLE_CARD_INDEX);\n nextCoachmark(journeyId, false, GO_TO_TABLE_LAUNCHER_DURATION_MS);\n\n trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_VIEWED, {\n step: Action.TABLES,\n });\n\n const showNudge = setTimeout(() => {\n clearTimeout(showNudge);\n originalTableRef.current?.setLabelVisiblity(false);\n nextCoachmark(journeyId, true);\n }, SHOW_CLICK_TABLE_NUDGE_AFTER_MS);\n\n timerRefs.current.push(showNudge);\n\n const animateLabel = setTimeout(() => {\n clearTimeout(animateLabel);\n highlightedTableRef.current?.startLabelAnimation('YELLOW_4');\n }, START_ANIMATING_CLONED_ELEM);\n\n timerRefs.current.push(animateLabel);\n }, [carouselRefs, journeyId, nextCoachmark, playButtonSound, trackAnalytics]);\n\n const startJourney = useCallback(\n (tablesData: ITables, isTutorialOnboardingDone: boolean = false) => {\n if (isJourneyInProgress.current) {\n return;\n }\n\n const paginationList = carouselRefs.current.indicatorRefs;\n const carouselNextBtnRef = carouselRefs.current.nextBtnRef;\n const tablePaginationRef = paginationList?.[TABLE_CARD_INDEX];\n\n if (\n !originalTableRef.current?.segmentedCardWrapperRef.current ||\n !originalTableRef.current?.labelRef.current ||\n !paginationList ||\n !carouselNextBtnRef?.current ||\n !tablePaginationRef ||\n !tablePaginationRef.current\n ) {\n return;\n }\n\n isJourneyInProgress.current = true;\n\n const labelDims = originalTableRef.current.labelRef.current.getBoundingClientRect();\n const tableCardDims =\n originalTableRef.current?.segmentedCardWrapperRef.current.getBoundingClientRect();\n\n // TAKE THE USER TO THE TABLE CARD\n if (!isTutorialOnboardingDone) {\n setJourney(journeyId, [\n {\n originalElementToHighlightRef: carouselRefs.current.nextBtnRef,\n isActive: false,\n type: IndicatorType.NUDGE,\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 elementToHighlight: (\n <IconButton\n renderAs=\"secondary\"\n Icon={CaratRightIcon}\n onClick={goToTableLauncher}\n analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n />\n ),\n },\n ]);\n carouselRefs.current.goToIndex(PUZZLE_CARD_INDEX);\n nextCoachmark(journeyId, false, SHOW_INITIAL_COACHMARK_AFTER_MS); // Show nudge => Click to proceed\n } else {\n setJourney(journeyId, [\n {\n originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <S.Indicator $isActive={false} />,\n indicator: {\n position: 'bottom',\n backgroundColor: 'YELLOW_4',\n width: 52,\n tooltipItem: (\n <FlexView\n $position=\"absolute\"\n $flexDirection=\"row\"\n style={{ top: 6, left: 8, cursor: 'pointer' }}\n onClick={goToTableLauncher}\n >\n <Text $renderAs=\"ab2-bold\">NEW</Text>\n </FlexView>\n ),\n tooltipYCoOrdinates: 14, // Need some offset in Y direction from top\n } as IArrowTooltipProps,\n },\n {\n originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: '',\n nudgePointerY: 20,\n } as INudgeProps,\n elementToHighlight: <></>,\n },\n ]);\n carouselRefs.current.goToIndex(LESSON_CARD_INDEX);\n nextCoachmark(journeyId, false, SHOW_INITIAL_COACHMARK_AFTER_MS); // Show Coachmark => NEW\n nextCoachmark(journeyId, true, SHOW_INITIAL_TOOLTIP_AFTER_MS); // Show Nudge over Coachmark\n }\n\n // SHOW THE USER SELECT A TABLE\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.labelRef,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <></>,\n indicator: {\n position: 'right',\n backgroundColor: 'YELLOW_4',\n width: 264,\n tooltipItem: (\n <FlexView>\n <Text $renderAs=\"ab2-bold\">\n Get faster at multiplication! Practice everyday and become a Tables champ.\n </Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: labelDims.width + 50,\n tooltipYCoOrdinates: labelDims.height / 2,\n } as IArrowTooltipProps,\n });\n\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n {'Pick a table to start'}\n </Text>\n ),\n nudgePointerX: tableCardDims.width / 2 + 50,\n nudgePointerY: tableCardDims.height / 2,\n } as INudgeProps,\n elementToHighlight: (\n <TablesCard\n ref={highlightedTableRef}\n label={tablesData.label}\n data={tablesData.data}\n onPress={() => {}}\n onPressTableSegment={tableInfo => handleTableSegmentClick(tablesData, tableInfo)}\n />\n ),\n });\n },\n [\n addCoachmark,\n carouselRefs,\n goToTableLauncher,\n handleTableSegmentClick,\n journeyId,\n nextCoachmark,\n setJourney,\n ],\n );\n\n // Cleanup on unmount\n useEffect(() => {\n return () => {\n timerRefs.current.forEach(timer => clearTimeout(timer));\n timerRefs.current = [];\n isJourneyInProgress.current = false;\n };\n }, [journeyId]);\n\n return {\n tableRef: originalTableRef,\n startJourney,\n };\n};\n"],"names":["useTableLauncherJourney","carouselRefs","onTableSegmentClick","journeyId","JOURNEY_ID_STUDENT","originalTableRef","useRef","highlightedTableRef","isJourneyInProgress","timerRefs","playButtonSound","useCircleSounds","nextCoachmark","setJourney","addCoachmark","endJourney","useJourney","trackAnalytics","useUIContext","handleEndJourney","useCallback","tableDetails","PLATFORM_EVENTS_STUDENT","Action","_a","_b","handleTableSegmentClick","launcherData","tableData","segmentedCardDims","tableCardDims","_c","IndicatorType","jsx","TablesCard","FlexView","Text","Fragment","SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS","SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS","startAnimationOnLabelAgain","START_ANIMATING_CLONED_ELEM","goToTableLauncher","TABLE_CARD_INDEX","GO_TO_TABLE_LAUNCHER_DURATION_MS","showNudge","SHOW_CLICK_TABLE_NUDGE_AFTER_MS","animateLabel","startJourney","tablesData","isTutorialOnboardingDone","paginationList","carouselNextBtnRef","tablePaginationRef","labelDims","S.Indicator","LESSON_CARD_INDEX","SHOW_INITIAL_COACHMARK_AFTER_MS","SHOW_INITIAL_TOOLTIP_AFTER_MS","IconButton","CaratRightIcon","GAME_LAUNCHER_ANALYTICS_EVENTS","PUZZLE_CARD_INDEX","tableInfo","useEffect","timer"],"mappings":";;;;;;;;;;;;;;;;;AAyCO,MAAMA,KAA0B,CAAC;AAAA,EACtC,cAAAC;AAAA,EACA,qBAAAC;AACF,MAA6B;AAC3B,QAAMC,IAAYC,EAAmB,6BAC/BC,IAAmBC,EAAsB,IAAI,GAC7CC,IAAsBD,EAAsB,IAAI,GAChDE,IAAsBF,EAAO,EAAK,GAElCG,IAAYH,EAAwC,CAAA,CAAE,GAEtD,EAAE,iBAAAI,MAAoBC,KACtB,EAAE,eAAAC,GAAe,YAAAC,GAAY,cAAAC,GAAc,YAAAC,EAAA,IAAeC,KAC1D,EAAE,SAASC,EAAe,IAAIC,EAAa,GAE3CC,IAAmBC;AAAA,IACvB,CAACC,MAAiC;;AAEhC,MAAIA,KACFnB,EAAoBmB,CAAY,GAElCJ,EAAeK,EAAwB,2BAA2B;AAAA,QAChE,MAAMC,EAAO;AAAA,MAAA,CACd,IAGiBC,IAAAnB,KAAA,gBAAAA,EAAA,YAAA,QAAAmB,EAAS,kBAAkB,MAC7CC,IAAApB,KAAA,gBAAAA,EAAkB,YAAlB,QAAAoB,EAA2B,sBAC3BV,EAAWZ,CAAS;AAAA,IACtB;AAAA,IACA,CAACY,GAAYZ,GAAWD,GAAqBe,CAAc;AAAA,EAAA,GAGvDS,IAA0BN;AAAA,IAC9B,CAACO,GAAuBC,MAA0B;;AAE9C,UAAA,GAACJ,IAAAnB,EAAiB,YAAjB,QAAAmB,EAA0B,wBAAwB,YACnD,GAACC,IAAApB,EAAiB,YAAjB,QAAAoB,EAA0B,SAAS;AAEpC;AAGF,YAAMI,IAAoBxB,EAAiB,QAAQ,SAAS,QAAQ,yBAC9DyB,KACJC,IAAA1B,EAAiB,YAAjB,gBAAA0B,EAA0B,wBAAwB,QAAQ;AAE5D,MAAAjB,EAAaX,GAAW;AAAA,QACtB,+BAA+BE,EAAiB,QAAQ;AAAA,QACxD,UAAU;AAAA,QACV,MAAM2B,EAAc;AAAA,QACpB,oBACE,gBAAAC;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,KAAK3B;AAAA,YACL,cAAcqB;AAAA,YACd,OAAOD,EAAa;AAAA,YACpB,MAAMA,EAAa;AAAA,YACnB,SAASR;AAAA,YACT,wBAAwBA;AAAA,UAAA;AAAA,QAC1B;AAAA,QAEF,WAAW;AAAA,UACT,UAAU;AAAA,UACV,iBAAiB;AAAA,UACjB,OAAO;AAAA,UACP,+BACGgB,GACC,EAAA,UAAA,gBAAAF,EAACG,KAAK,WAAU,YAAW,kEAAoD,EACjF,CAAA;AAAA,UAEF,qBAAqB;AAAA,UACrB,qBAAqBP,EAAkB,SAAS;AAAA,QAClD;AAAA,MAAA,CACD,GAEDf,EAAaX,GAAW;AAAA,QACtB,+BAA+BE,EAAiB,QAAQ;AAAA,QACxD,UAAU;AAAA,QACV,MAAM2B,EAAc;AAAA,QACpB,WAAW;AAAA,UACT,OAAO;AAAA,UACP,SACG,gBAAAC,EAAAG,GAAA,EAAK,WAAU,OAAM,QAAO,SAAQ,UAErC,gBAAA;AAAA,UAEF,eAAeN,EAAc,QAAQ,IAAI;AAAA,UACzC,eAAeA,EAAc,SAAS;AAAA,QACxC;AAAA,QACA,oBAAsB,gBAAAG,EAAAI,GAAA,EAAA;AAAA,MAAA,CACvB,GAEazB,EAAAT,GAAW,IAAOmC,CAAkC,GACpD1B,EAAAT,GAAW,IAAMoC,CAAgC;AAEzD,YAAAC,IAA6B,WAAW,MAAM;;AAClD,qBAAaA,CAA0B,IACnBhB,IAAAjB,EAAA,YAAA,QAAAiB,EAAS,oBAAoB;AAAA,SAChDiB,CAA2B;AAEpB,MAAAhC,EAAA,QAAQ,KAAK+B,CAA0B;AAAA,IACnD;AAAA,IACA,CAAC1B,GAAcK,GAAkBhB,GAAWS,CAAa;AAAA,EAAA,GAGrD8B,IAAoBtB,EAAY,MAAM;AAC1B,IAAAV,KACHT,EAAA,QAAQ,UAAU0C,CAAgB,GACjC/B,EAAAT,GAAW,IAAOyC,CAAgC,GAEhE3B,EAAeK,EAAwB,wBAAwB;AAAA,MAC7D,MAAMC,EAAO;AAAA,IAAA,CACd;AAEK,UAAAsB,IAAY,WAAW,MAAM;;AACjC,mBAAaA,CAAS,IACLrB,IAAAnB,EAAA,YAAA,QAAAmB,EAAS,kBAAkB,KAC5CZ,EAAcT,GAAW,EAAI;AAAA,OAC5B2C,CAA+B;AAExB,IAAArC,EAAA,QAAQ,KAAKoC,CAAS;AAE1B,UAAAE,IAAe,WAAW,MAAM;;AACpC,mBAAaA,CAAY,IACLvB,IAAAjB,EAAA,YAAA,QAAAiB,EAAS,oBAAoB;AAAA,OAChDiB,CAA2B;AAEpB,IAAAhC,EAAA,QAAQ,KAAKsC,CAAY;AAAA,EAAA,GAClC,CAAC9C,GAAcE,GAAWS,GAAeF,GAAiBO,CAAc,CAAC,GAEtE+B,IAAe5B;AAAA,IACnB,CAAC6B,GAAqBC,IAAoC,OAAU;;AAClE,UAAI1C,EAAoB;AACtB;AAGI,YAAA2C,IAAiBlD,EAAa,QAAQ,eACtCmD,IAAqBnD,EAAa,QAAQ,YAC1CoD,IAAqBF,KAAA,gBAAAA,EAAiBR;AAE5C,UACE,GAACnB,IAAAnB,EAAiB,YAAjB,QAAAmB,EAA0B,wBAAwB,YACnD,GAACC,IAAApB,EAAiB,YAAjB,QAAAoB,EAA0B,SAAS,YACpC,CAAC0B,KACD,EAACC,KAAA,QAAAA,EAAoB,YACrB,CAACC,KACD,CAACA,EAAmB;AAEpB;AAGF,MAAA7C,EAAoB,UAAU;AAE9B,YAAM8C,IAAYjD,EAAiB,QAAQ,SAAS,QAAQ,yBACtDyB,KACJC,IAAA1B,EAAiB,YAAjB,gBAAA0B,EAA0B,wBAAwB,QAAQ;AAG5D,MAAKmB,KA6BHrC,EAAWV,GAAW;AAAA,QACpB;AAAA,UACE,+BAA+BkD;AAAA,UAC/B,UAAU;AAAA,UACV,MAAMrB,EAAc;AAAA,UACpB,oBAAqB,gBAAAC,EAAAsB,IAAA,EAAY,WAAW,GAAO,CAAA;AAAA,UACnD,WAAW;AAAA,YACT,UAAU;AAAA,YACV,iBAAiB;AAAA,YACjB,OAAO;AAAA,YACP,aACE,gBAAAtB;AAAA,cAACE;AAAA,cAAA;AAAA,gBACC,WAAU;AAAA,gBACV,gBAAe;AAAA,gBACf,OAAO,EAAE,KAAK,GAAG,MAAM,GAAG,QAAQ,UAAU;AAAA,gBAC5C,SAASO;AAAA,gBAET,UAAC,gBAAAT,EAAAG,GAAA,EAAK,WAAU,YAAW,UAAG,OAAA;AAAA,cAAA;AAAA,YAChC;AAAA,YAEF,qBAAqB;AAAA;AAAA,UACvB;AAAA,QACF;AAAA,QACA;AAAA,UACE,+BAA+BiB;AAAA,UAC/B,UAAU;AAAA,UACV,MAAMrB,EAAc;AAAA,UACpB,WAAW;AAAA,YACT,OAAO;AAAA,YACP,SAAS;AAAA,YACT,eAAe;AAAA,UACjB;AAAA,UACA,oBAAsB,gBAAAC,EAAAI,GAAA,EAAA;AAAA,QACxB;AAAA,MAAA,CACD,GACYpC,EAAA,QAAQ,UAAUuD,EAAiB,GAClC5C,EAAAT,GAAW,IAAOsD,CAA+B,GACjD7C,EAAAT,GAAW,IAAMuD,EAA6B,MAjE5D7C,EAAWV,GAAW;AAAA,QACpB;AAAA,UACE,+BAA+BF,EAAa,QAAQ;AAAA,UACpD,UAAU;AAAA,UACV,MAAM+B,EAAc;AAAA,UACpB,WAAW;AAAA,YACT,OAAO;AAAA,YACP,SACG,gBAAAC,EAAAG,GAAA,EAAK,WAAU,OAAM,QAAO,SAAQ,UAErC,oBAAA;AAAA,YAEF,eAAe;AAAA,YACf,eAAe;AAAA,UACjB;AAAA,UACA,oBACE,gBAAAH;AAAA,YAAC0B;AAAA,YAAA;AAAA,cACC,UAAS;AAAA,cACT,MAAMC;AAAA,cACN,SAASlB;AAAA,cACT,gBAAgBmB,EAA+B;AAAA,YAAA;AAAA,UACjD;AAAA,QAEJ;AAAA,MAAA,CACD,GACY5D,EAAA,QAAQ,UAAU6D,CAAiB,GAClClD,EAAAT,GAAW,IAAOsD,CAA+B,IA2CjE3C,EAAaX,GAAW;AAAA,QACtB,+BAA+BE,EAAiB,QAAQ;AAAA,QACxD,UAAU;AAAA,QACV,MAAM2B,EAAc;AAAA,QACpB,oBAAsB,gBAAAC,EAAAI,GAAA,EAAA;AAAA,QACtB,WAAW;AAAA,UACT,UAAU;AAAA,UACV,iBAAiB;AAAA,UACjB,OAAO;AAAA,UACP,+BACGF,GACC,EAAA,UAAA,gBAAAF,EAACG,KAAK,WAAU,YAAW,wFAE3B,EACF,CAAA;AAAA,UAEF,qBAAqBkB,EAAU,QAAQ;AAAA,UACvC,qBAAqBA,EAAU,SAAS;AAAA,QAC1C;AAAA,MAAA,CACD,GAEDxC,EAAaX,GAAW;AAAA,QACtB,+BAA+BE,EAAiB,QAAQ;AAAA,QACxD,UAAU;AAAA,QACV,MAAM2B,EAAc;AAAA,QACpB,WAAW;AAAA,UACT,OAAO;AAAA,UACP,SACG,gBAAAC,EAAAG,GAAA,EAAK,WAAU,OAAM,QAAO,SAC1B,UACH,yBAAA;AAAA,UAEF,eAAeN,EAAc,QAAQ,IAAI;AAAA,UACzC,eAAeA,EAAc,SAAS;AAAA,QACxC;AAAA,QACA,oBACE,gBAAAG;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,KAAK3B;AAAA,YACL,OAAO0C,EAAW;AAAA,YAClB,MAAMA,EAAW;AAAA,YACjB,SAAS,MAAM;AAAA,YAAC;AAAA,YAChB,qBAAqB,CAAAc,MAAarC,EAAwBuB,GAAYc,CAAS;AAAA,UAAA;AAAA,QACjF;AAAA,MAAA,CAEH;AAAA,IACH;AAAA,IACA;AAAA,MACEjD;AAAA,MACAb;AAAA,MACAyC;AAAA,MACAhB;AAAA,MACAvB;AAAA,MACAS;AAAA,MACAC;AAAA,IACF;AAAA,EAAA;AAIF,SAAAmD,EAAU,MACD,MAAM;AACX,IAAAvD,EAAU,QAAQ,QAAQ,CAASwD,MAAA,aAAaA,CAAK,CAAC,GACtDxD,EAAU,UAAU,IACpBD,EAAoB,UAAU;AAAA,EAAA,GAE/B,CAACL,CAAS,CAAC,GAEP;AAAA,IACL,UAAUE;AAAA,IACV,cAAA2C;AAAA,EAAA;AAEJ;"}
|
1
|
+
{"version":3,"file":"use-table-launcher-journey.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.tsx"],"sourcesContent":["/* eslint-disable react-native/no-inline-styles */\nimport type { IArrowTooltipProps } from '../../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { INudgeProps } from '../../../../ui/nudge/nudge-types';\nimport type { ITableCardRef, ITableDetails } from '../../comps/tables-card/tables-card-types';\nimport type {\n ITableInfo,\n ITables,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { IUseTableJourneyProps } from './use-table-launcher-journey-types';\n\nimport { useCallback, useEffect, useRef } from 'react';\n\nimport CaratRightIcon from '../../../../../assets/line-icons/icons/carat-right';\nimport { PLATFORM_EVENTS_STUDENT } 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 Action } from '../../../enum/circle-onboarding-steps';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { TablesCard } from '../../comps/tables-card/tables-card';\nimport { GAME_LAUNCHER_ANALYTICS_EVENTS } from '../../game-launcher-analytics-events';\nimport {\n LESSON_CARD_INDEX,\n PUZZLE_CARD_INDEX,\n SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS,\n SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS,\n TABLE_CARD_INDEX,\n} from './constants';\nimport {\n GO_TO_TABLE_LAUNCHER_DURATION_MS,\n SHOW_CLICK_TABLE_NUDGE_AFTER_MS,\n SHOW_INITIAL_COACHMARK_AFTER_MS,\n SHOW_INITIAL_TOOLTIP_AFTER_MS,\n START_ANIMATING_CLONED_ELEM,\n} from './constants';\nimport * as S from './use-table-launcher-journey-styled';\n\nexport const useTableLauncherJourney = ({\n carouselRefs,\n onTableSegmentClick,\n}: IUseTableJourneyProps) => {\n const journeyId = JOURNEY_ID_STUDENT.CIRCLE_TABLES_INTRO_JOURNEY;\n const originalTableRef = useRef<ITableCardRef>(null);\n const highlightedTableRef = useRef<ITableCardRef>(null);\n\n const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n const { playButtonSound } = useCircleSounds();\n const { nextCoachmark, setJourney, addCoachmark, endJourney } = useJourney();\n const { onEvent: trackAnalytics } = useUIContext();\n\n const handleEndJourney = useCallback(\n (tableDetails?: ITableDetails) => {\n // Only when User clicked on play\n if (tableDetails) {\n onTableSegmentClick(tableDetails);\n }\n trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_COMPLETED, {\n step: Action.TABLES,\n });\n\n // Reset original table card ref label\n originalTableRef?.current?.setLabelVisiblity(true);\n originalTableRef?.current?.stopLabelAnimation();\n endJourney(journeyId);\n },\n [endJourney, journeyId, onTableSegmentClick, trackAnalytics],\n );\n\n const handleTableSegmentClick = useCallback(\n (launcherData: ITables, tableData: ITableInfo) => {\n if (\n !originalTableRef.current?.segmentedCardWrapperRef.current ||\n !originalTableRef.current?.labelRef.current\n ) {\n return;\n }\n\n const segmentedCardDims = originalTableRef.current.labelRef.current.getBoundingClientRect();\n const tableCardDims =\n originalTableRef.current?.segmentedCardWrapperRef.current.getBoundingClientRect();\n\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: (\n <TablesCard\n ref={highlightedTableRef}\n defaultTable={tableData}\n label={launcherData.label}\n data={launcherData.data}\n onPress={handleEndJourney}\n onGoBackFromTableLevel={handleEndJourney}\n />\n ),\n indicator: {\n position: 'left',\n backgroundColor: 'YELLOW_4',\n width: 236,\n tooltipItem: (\n <FlexView>\n <Text $renderAs=\"ab2-bold\">Each table has 3 levels—clear them and earn 3 stars!</Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: 0,\n tooltipYCoOrdinates: segmentedCardDims.height * 0.35,\n } as IArrowTooltipProps,\n });\n\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n Pick a level\n </Text>\n ),\n nudgePointerX: tableCardDims.width / 2 + 50,\n nudgePointerY: tableCardDims.height * 0.4,\n } as INudgeProps,\n elementToHighlight: <></>,\n });\n\n nextCoachmark(journeyId, false, SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS); // Show coachmark => Each table has 3... and Hide the previous two\n nextCoachmark(journeyId, true, SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS); // Show nudge => Pick a level\n\n const startAnimationOnLabelAgain = setTimeout(() => {\n clearTimeout(startAnimationOnLabelAgain);\n highlightedTableRef.current?.startLabelAnimation('YELLOW_4');\n }, START_ANIMATING_CLONED_ELEM);\n\n timerRefs.current.push(startAnimationOnLabelAgain);\n },\n [addCoachmark, handleEndJourney, journeyId, nextCoachmark],\n );\n\n const goToTableLauncher = useCallback(() => {\n playButtonSound();\n carouselRefs.current?.goToIndex(TABLE_CARD_INDEX);\n nextCoachmark(journeyId, false, GO_TO_TABLE_LAUNCHER_DURATION_MS);\n\n trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_VIEWED, {\n step: Action.TABLES,\n });\n\n const showNudge = setTimeout(() => {\n clearTimeout(showNudge);\n originalTableRef.current?.setLabelVisiblity(false);\n nextCoachmark(journeyId, true);\n }, SHOW_CLICK_TABLE_NUDGE_AFTER_MS);\n\n timerRefs.current.push(showNudge);\n\n const animateLabel = setTimeout(() => {\n clearTimeout(animateLabel);\n highlightedTableRef.current?.startLabelAnimation('YELLOW_4');\n }, START_ANIMATING_CLONED_ELEM);\n\n timerRefs.current.push(animateLabel);\n }, [carouselRefs, journeyId, nextCoachmark, playButtonSound, trackAnalytics]);\n\n const startJourney = useCallback(\n (tablesData: ITables, isTutorialOnboardingDone: boolean = false) => {\n const paginationList = carouselRefs.current?.indicatorRefs;\n const carouselNextBtnRef = carouselRefs.current?.nextBtnRef;\n const tablePaginationRef = paginationList?.[TABLE_CARD_INDEX];\n\n if (\n !originalTableRef.current?.segmentedCardWrapperRef.current ||\n !originalTableRef.current?.labelRef.current ||\n !paginationList ||\n !carouselNextBtnRef?.current ||\n !tablePaginationRef ||\n !tablePaginationRef.current\n ) {\n return;\n }\n\n const labelDims = originalTableRef.current.labelRef.current.getBoundingClientRect();\n const tableCardDims =\n originalTableRef.current?.segmentedCardWrapperRef.current.getBoundingClientRect();\n\n // TAKE THE USER TO THE TABLE CARD\n if (!isTutorialOnboardingDone) {\n setJourney(journeyId, [\n {\n originalElementToHighlightRef: carouselRefs.current?.nextBtnRef,\n isActive: false,\n type: IndicatorType.NUDGE,\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 elementToHighlight: (\n <IconButton\n renderAs=\"secondary\"\n Icon={CaratRightIcon}\n onClick={goToTableLauncher}\n analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n />\n ),\n },\n ]);\n carouselRefs.current?.goToIndex(PUZZLE_CARD_INDEX);\n nextCoachmark(journeyId, false, SHOW_INITIAL_COACHMARK_AFTER_MS); // Show nudge => Click to proceed\n } else {\n setJourney(journeyId, [\n {\n originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <S.Indicator $isActive={false} />,\n indicator: {\n position: 'bottom',\n backgroundColor: 'YELLOW_4',\n width: 52,\n tooltipItem: (\n <FlexView\n $position=\"absolute\"\n $flexDirection=\"row\"\n style={{ top: 6, left: 8, cursor: 'pointer' }}\n onClick={goToTableLauncher}\n >\n <Text $renderAs=\"ab2-bold\">NEW</Text>\n </FlexView>\n ),\n tooltipYCoOrdinates: 14, // Need some offset in Y direction from top\n } as IArrowTooltipProps,\n },\n {\n originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: '',\n nudgePointerY: 20,\n } as INudgeProps,\n elementToHighlight: <></>,\n },\n ]);\n carouselRefs.current?.goToIndex(LESSON_CARD_INDEX);\n nextCoachmark(journeyId, false, SHOW_INITIAL_COACHMARK_AFTER_MS); // Show Coachmark => NEW\n nextCoachmark(journeyId, true, SHOW_INITIAL_TOOLTIP_AFTER_MS); // Show Nudge over Coachmark\n }\n\n // SHOW THE USER SELECT A TABLE\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.labelRef,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <></>,\n indicator: {\n position: 'right',\n backgroundColor: 'YELLOW_4',\n width: 264,\n tooltipItem: (\n <FlexView>\n <Text $renderAs=\"ab2-bold\">\n Get faster at multiplication! Practice everyday and become a Tables champ.\n </Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: labelDims.width + 50,\n tooltipYCoOrdinates: labelDims.height / 2,\n } as IArrowTooltipProps,\n });\n\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n {'Pick a table to start'}\n </Text>\n ),\n nudgePointerX: tableCardDims.width / 2 + 50,\n nudgePointerY: tableCardDims.height / 2,\n } as INudgeProps,\n elementToHighlight: (\n <TablesCard\n ref={highlightedTableRef}\n label={tablesData.label}\n data={tablesData.data}\n onPress={() => {}}\n onPressTableSegment={tableInfo => handleTableSegmentClick(tablesData, tableInfo)}\n />\n ),\n });\n },\n [\n addCoachmark,\n carouselRefs,\n goToTableLauncher,\n handleTableSegmentClick,\n journeyId,\n nextCoachmark,\n setJourney,\n ],\n );\n\n // Cleanup on unmount\n useEffect(() => {\n return () => {\n timerRefs.current.forEach(timer => clearTimeout(timer));\n timerRefs.current = [];\n };\n }, [journeyId]);\n\n return {\n tableRef: originalTableRef,\n startJourney,\n };\n};\n"],"names":["useTableLauncherJourney","carouselRefs","onTableSegmentClick","journeyId","JOURNEY_ID_STUDENT","originalTableRef","useRef","highlightedTableRef","timerRefs","playButtonSound","useCircleSounds","nextCoachmark","setJourney","addCoachmark","endJourney","useJourney","trackAnalytics","useUIContext","handleEndJourney","useCallback","tableDetails","PLATFORM_EVENTS_STUDENT","Action","_a","_b","handleTableSegmentClick","launcherData","tableData","segmentedCardDims","tableCardDims","_c","IndicatorType","jsx","TablesCard","FlexView","Text","Fragment","SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS","SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS","startAnimationOnLabelAgain","START_ANIMATING_CLONED_ELEM","goToTableLauncher","TABLE_CARD_INDEX","GO_TO_TABLE_LAUNCHER_DURATION_MS","showNudge","SHOW_CLICK_TABLE_NUDGE_AFTER_MS","animateLabel","startJourney","tablesData","isTutorialOnboardingDone","paginationList","carouselNextBtnRef","tablePaginationRef","_d","labelDims","_e","S.Indicator","_h","LESSON_CARD_INDEX","SHOW_INITIAL_COACHMARK_AFTER_MS","SHOW_INITIAL_TOOLTIP_AFTER_MS","_f","IconButton","CaratRightIcon","GAME_LAUNCHER_ANALYTICS_EVENTS","_g","PUZZLE_CARD_INDEX","tableInfo","useEffect","timer"],"mappings":"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"}
|
@@ -1,39 +1,39 @@
|
|
1
|
-
import { jsxs as
|
2
|
-
import { createContext as
|
1
|
+
import { jsxs as q, jsx as j } from "react/jsx-runtime";
|
2
|
+
import { createContext as D, useState as h, useRef as C, useCallback as l, useMemo as L, useEffect as R } from "react";
|
3
3
|
import { Coachmark as N } from "../comps/coachmark/coachmark.js";
|
4
4
|
import { usePostUserJourney as M, useGetUserJourney as z } from "../user-journey-api/user-journey-api.js";
|
5
5
|
import { Overlay as G } from "./journey-styled.js";
|
6
|
-
const S =
|
7
|
-
const [
|
8
|
-
data:
|
9
|
-
get:
|
10
|
-
isProcessing:
|
11
|
-
} = z(),
|
6
|
+
const S = D(null), Q = ({ children: T, appId: u, userId: s }) => {
|
7
|
+
const [k, v] = h([]), [n, c] = h([]), [g, p] = h(!1), a = C(-1), r = C(), f = C([]), { post: x } = M(), {
|
8
|
+
data: m = null,
|
9
|
+
get: _,
|
10
|
+
isProcessing: O
|
11
|
+
} = z(), U = (u === "" || m && !O) && n.length > 0, A = l(
|
12
12
|
(e, t) => {
|
13
|
-
if (
|
13
|
+
if (n.length > 0) {
|
14
14
|
console.error(
|
15
15
|
`setJourney: Other Journey is already active, Current Journey: ${r.current}, New Journey Request: ${e}`
|
16
16
|
);
|
17
17
|
return;
|
18
18
|
}
|
19
|
-
|
19
|
+
p(!0), r.current = e, a.current = -1, c([...t]);
|
20
20
|
},
|
21
|
-
[
|
22
|
-
),
|
21
|
+
[n.length]
|
22
|
+
), y = l(() => {
|
23
23
|
f.current.forEach((e) => {
|
24
24
|
clearTimeout(e);
|
25
25
|
}), f.current = [], r.current = void 0, a.current = -1, c([]), p(!1);
|
26
|
-
}, []),
|
26
|
+
}, []), P = l(
|
27
27
|
(e) => {
|
28
|
-
|
28
|
+
v((t) => [...t, e]), x({
|
29
29
|
app_id: u,
|
30
30
|
user_id: s,
|
31
31
|
journey_id: e,
|
32
32
|
journey_status: "COMPLETED"
|
33
|
-
}),
|
33
|
+
}), y();
|
34
34
|
},
|
35
|
-
[u,
|
36
|
-
),
|
35
|
+
[u, y, x, s]
|
36
|
+
), $ = l((e, t) => {
|
37
37
|
if (!r.current || e !== r.current) {
|
38
38
|
console.error(
|
39
39
|
r.current ? `A Journey is already active, Current Journey: ${r.current}, New Journey Request: ${e}` : "addCoachmark was called before setJourney and Journey ID is undefined"
|
@@ -49,57 +49,57 @@ const S = q(null), Q = ({ children: R, appId: u, userId: s }) => {
|
|
49
49
|
);
|
50
50
|
return;
|
51
51
|
}
|
52
|
-
J !== 0 && c((
|
52
|
+
J !== 0 && c((o) => o.map((i) => ({ ...i, isActive: !1 })));
|
53
53
|
const E = setTimeout(() => {
|
54
54
|
clearTimeout(E);
|
55
|
-
const
|
55
|
+
const o = a.current + 1;
|
56
56
|
c((i) => {
|
57
|
-
if (
|
57
|
+
if (o >= i.length || i.length === 0)
|
58
58
|
return r.current = void 0, a.current = -1, [];
|
59
|
-
a.current =
|
60
|
-
const
|
61
|
-
return
|
59
|
+
a.current = o;
|
60
|
+
const d = [...i];
|
61
|
+
return d[o].isActive = !0, o > 0 && (d[o - 1].isActive = t), d;
|
62
62
|
});
|
63
63
|
}, J);
|
64
64
|
f.current.push(E);
|
65
65
|
},
|
66
66
|
[]
|
67
|
-
),
|
67
|
+
), b = L(
|
68
68
|
() => ({
|
69
69
|
nextCoachmark: w,
|
70
|
-
setJourney:
|
71
|
-
addCoachmark:
|
72
|
-
clearJourney:
|
73
|
-
endJourney:
|
74
|
-
coachmarks:
|
75
|
-
userCompletedJourneyIds:
|
76
|
-
isJourneyActive:
|
70
|
+
setJourney: A,
|
71
|
+
addCoachmark: $,
|
72
|
+
clearJourney: y,
|
73
|
+
endJourney: P,
|
74
|
+
coachmarks: n,
|
75
|
+
userCompletedJourneyIds: k,
|
76
|
+
isJourneyActive: g
|
77
77
|
}),
|
78
78
|
[
|
79
79
|
w,
|
80
|
-
_,
|
81
|
-
P,
|
82
|
-
m,
|
83
80
|
A,
|
84
|
-
|
85
|
-
|
86
|
-
|
81
|
+
$,
|
82
|
+
y,
|
83
|
+
P,
|
84
|
+
n,
|
85
|
+
k,
|
86
|
+
g
|
87
87
|
]
|
88
88
|
);
|
89
|
-
return
|
90
|
-
u && s &&
|
89
|
+
return R(() => {
|
90
|
+
u && s && _(s, {
|
91
91
|
app_id: u,
|
92
92
|
user_id: s,
|
93
93
|
journey_status: "COMPLETED"
|
94
94
|
});
|
95
|
-
}, [u,
|
96
|
-
if (
|
97
|
-
const e =
|
98
|
-
|
95
|
+
}, [u, _, s]), R(() => {
|
96
|
+
if (m) {
|
97
|
+
const e = m.map((t) => t.journey_id);
|
98
|
+
v(e);
|
99
99
|
}
|
100
|
-
}, [
|
101
|
-
|
102
|
-
|
100
|
+
}, [m]), /* @__PURE__ */ q(S.Provider, { value: b, children: [
|
101
|
+
U && /* @__PURE__ */ j(G, { children: n.map((e, t) => /* @__PURE__ */ j(N, { coachmark: e }, `coachmark-${t}`)) }),
|
102
|
+
T
|
103
103
|
] });
|
104
104
|
};
|
105
105
|
export {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"journey-context-provider.js","sources":["../../../../src/features/journey/use-journey/journey-context-provider.tsx"],"sourcesContent":["/* eslint-disable no-console */\nimport type { TJourneyId } from '../journey-id/journey-id-types';\nimport type {\n ICoachmarkProps,\n IJourneyContext,\n IJourneyProviderProps,\n} from './journey-context-types';\nimport type { FC } from 'react';\n\nimport { createContext, useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { Coachmark } from '../comps/coachmark/coachmark';\nimport { useGetUserJourney, usePostUserJourney } from '../user-journey-api/user-journey-api';\nimport * as S from './journey-styled';\n\nexport const JourneyContext = createContext<IJourneyContext | null>(null);\n\nexport const JourneyProvider: FC<IJourneyProviderProps> = ({ children, appId, userId }) => {\n const [userCompletedJourneyIds, setUserCompletedJourneyIds] = useState<TJourneyId[]>([]);\n const [coachmarkList, setCoachmarkList] = useState<ICoachmarkProps[]>([]);\n const [isJourneyActive, setIsJourneyActive] = useState(false);\n const currentIndex = useRef(-1);\n const currentJourneyId = useRef<TJourneyId | undefined>();\n const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n const { post: postJourneyCompletion } = usePostUserJourney();\n const {\n data: userCompletedJourneys = null,\n get: getJourneyProgress,\n isProcessing,\n } = useGetUserJourney();\n\n const showCoachmarks =\n appId === '' // Otherwise coachmark stories wont work\n ? coachmarkList.length > 0\n : userCompletedJourneys && !isProcessing && coachmarkList.length > 0;\n\n const setJourney = useCallback(\n (id: TJourneyId, coachmarks: ICoachmarkProps[]) => {\n console.log(`setJourney: Journey ID: ${id}`);\n if (coachmarkList.length > 0) {\n console.error(\n `setJourney: Other Journey is already active, Current Journey: ${currentJourneyId.current}, New Journey Request: ${id}`,\n );\n\n return;\n }\n console.log(`setJourney: Journey ID: ${id}`);\n\n setIsJourneyActive(true);\n currentJourneyId.current = id;\n currentIndex.current = -1;\n setCoachmarkList([...coachmarks]);\n },\n [coachmarkList.length],\n );\n\n const clearJourney = useCallback(() => {\n // Clear all timers\n timerRefs.current.forEach(timer => {\n clearTimeout(timer);\n });\n timerRefs.current = [];\n currentJourneyId.current = undefined;\n currentIndex.current = -1;\n setCoachmarkList([]);\n setIsJourneyActive(false);\n }, []);\n\n const endJourney = useCallback(\n (journeyId: TJourneyId) => {\n setUserCompletedJourneyIds(prev => [...prev, journeyId]);\n postJourneyCompletion({\n app_id: appId,\n user_id: userId,\n journey_id: journeyId,\n journey_status: 'COMPLETED',\n });\n clearJourney();\n },\n [appId, clearJourney, postJourneyCompletion, userId],\n );\n\n const addCoachmark = useCallback((id: TJourneyId, coachmark: ICoachmarkProps) => {\n if (!currentJourneyId.current || id !== currentJourneyId.current) {\n console.error(\n currentJourneyId.current\n ? `A Journey is already active, Current Journey: ${currentJourneyId.current}, New Journey Request: ${id}`\n : `addCoachmark was called before setJourney and Journey ID is undefined`,\n );\n\n return;\n }\n\n setCoachmarkList(prev => [...prev, coachmark]);\n }, []);\n\n const nextCoachmark = useCallback(\n (id: TJourneyId, keepPrevActive: boolean = false, delayInMs: number = 0) => {\n if (!currentJourneyId.current || id !== currentJourneyId.current) {\n console.error(\n currentJourneyId.current\n ? `nextCoachmark was called before setJourney`\n : `A Journey is already active, Current Journey: ${currentJourneyId.current}, New Journey Request: ${id}`,\n );\n\n return;\n }\n\n if (delayInMs !== 0) {\n // If delay is not 0, we will hide all them coachmarks and reveal only after the delay\n setCoachmarkList(prevList => {\n return prevList.map((item: ICoachmarkProps) => {\n return { ...item, isActive: false };\n });\n });\n }\n\n const timer = setTimeout(() => {\n clearTimeout(timer);\n const currIndex = currentIndex.current + 1;\n\n setCoachmarkList(prevList => {\n // Finish onboarding\n if (currIndex >= prevList.length || prevList.length === 0) {\n currentJourneyId.current = undefined;\n currentIndex.current = -1;\n\n return [];\n }\n\n currentIndex.current = currIndex;\n const updatedCoachmarkList = [...prevList];\n\n (updatedCoachmarkList[currIndex] as ICoachmarkProps).isActive = true;\n\n if (currIndex > 0) {\n (updatedCoachmarkList[currIndex - 1] as ICoachmarkProps).isActive = keepPrevActive;\n }\n\n return updatedCoachmarkList;\n });\n }, delayInMs);\n\n timerRefs.current.push(timer);\n },\n [],\n );\n\n const memoizedContextValue: IJourneyContext = useMemo(\n () => ({\n nextCoachmark,\n setJourney,\n addCoachmark,\n clearJourney,\n endJourney,\n coachmarks: coachmarkList,\n userCompletedJourneyIds,\n isJourneyActive,\n }),\n [\n nextCoachmark,\n setJourney,\n addCoachmark,\n clearJourney,\n endJourney,\n coachmarkList,\n userCompletedJourneyIds,\n isJourneyActive,\n ],\n );\n\n // Get the initial state of incompleteJourneys\n useEffect(() => {\n if (appId && userId) {\n getJourneyProgress(userId, {\n app_id: appId,\n user_id: userId,\n journey_status: 'COMPLETED',\n });\n }\n }, [appId, getJourneyProgress, userId]);\n\n // Set the data to context state initially\n useEffect(() => {\n if (userCompletedJourneys) {\n const completedUserJourneysIds = userCompletedJourneys.map(journey => journey.journey_id);\n\n setUserCompletedJourneyIds(completedUserJourneysIds);\n }\n }, [userCompletedJourneys]);\n\n return (\n <JourneyContext.Provider value={memoizedContextValue}>\n {showCoachmarks && (\n <S.Overlay>\n {coachmarkList.map((coachmark, index) => (\n <Coachmark key={`coachmark-${index}`} coachmark={coachmark} />\n ))}\n </S.Overlay>\n )}\n {children}\n </JourneyContext.Provider>\n );\n};\n"],"names":["JourneyContext","createContext","JourneyProvider","children","appId","userId","userCompletedJourneyIds","setUserCompletedJourneyIds","useState","coachmarkList","setCoachmarkList","isJourneyActive","setIsJourneyActive","currentIndex","useRef","currentJourneyId","timerRefs","postJourneyCompletion","usePostUserJourney","userCompletedJourneys","getJourneyProgress","isProcessing","useGetUserJourney","showCoachmarks","setJourney","useCallback","id","coachmarks","clearJourney","timer","endJourney","journeyId","prev","addCoachmark","coachmark","nextCoachmark","keepPrevActive","delayInMs","prevList","item","currIndex","updatedCoachmarkList","memoizedContextValue","useMemo","useEffect","completedUserJourneysIds","journey","jsxs","S.Overlay","index","jsx","Coachmark"],"mappings":";;;;;AAea,MAAAA,IAAiBC,EAAsC,IAAI,GAE3DC,IAA6C,CAAC,EAAE,UAAAC,GAAU,OAAAC,GAAO,QAAAC,QAAa;AACzF,QAAM,CAACC,GAAyBC,CAA0B,IAAIC,EAAuB,CAAE,CAAA,GACjF,CAACC,GAAeC,CAAgB,IAAIF,EAA4B,CAAE,CAAA,GAClE,CAACG,GAAiBC,CAAkB,IAAIJ,EAAS,EAAK,GACtDK,IAAeC,EAAO,EAAE,GACxBC,IAAmBD,KACnBE,IAAYF,EAAwC,CAAA,CAAE,GAEtD,EAAE,MAAMG,EAAsB,IAAIC,EAAmB,GACrD;AAAA,IACJ,MAAMC,IAAwB;AAAA,IAC9B,KAAKC;AAAA,IACL,cAAAC;AAAA,MACEC,EAAkB,GAEhBC,KACJnB,MAAU,MAENe,KAAyB,CAACE,MAAgBZ,EAAc,SAAS,GAEjEe,IAAaC;AAAA,IACjB,CAACC,GAAgBC,MAAkC;AAE7C,UADI,QAAA,IAAI,2BAA2BD,CAAE,EAAE,GACvCjB,EAAc,SAAS,GAAG;AACpB,gBAAA;AAAA,UACN,iEAAiEM,EAAiB,OAAO,0BAA0BW,CAAE;AAAA,QAAA;AAGvH;AAAA,MACF;AACQ,cAAA,IAAI,2BAA2BA,CAAE,EAAE,GAE3Cd,EAAmB,EAAI,GACvBG,EAAiB,UAAUW,GAC3Bb,EAAa,UAAU,IACNH,EAAA,CAAC,GAAGiB,CAAU,CAAC;AAAA,IAClC;AAAA,IACA,CAAClB,EAAc,MAAM;AAAA,EAAA,GAGjBmB,IAAeH,EAAY,MAAM;AAE3B,IAAAT,EAAA,QAAQ,QAAQ,CAASa,MAAA;AACjC,mBAAaA,CAAK;AAAA,IAAA,CACnB,GACDb,EAAU,UAAU,IACpBD,EAAiB,UAAU,QAC3BF,EAAa,UAAU,IACvBH,EAAiB,CAAE,CAAA,GACnBE,EAAmB,EAAK;AAAA,EAC1B,GAAG,CAAE,CAAA,GAECkB,IAAaL;AAAA,IACjB,CAACM,MAA0B;AACzB,MAAAxB,EAA2B,CAAQyB,MAAA,CAAC,GAAGA,GAAMD,CAAS,CAAC,GACjCd,EAAA;AAAA,QACpB,QAAQb;AAAA,QACR,SAASC;AAAA,QACT,YAAY0B;AAAA,QACZ,gBAAgB;AAAA,MAAA,CACjB,GACYH;IACf;AAAA,IACA,CAACxB,GAAOwB,GAAcX,GAAuBZ,CAAM;AAAA,EAAA,GAG/C4B,IAAeR,EAAY,CAACC,GAAgBQ,MAA+B;AAC/E,QAAI,CAACnB,EAAiB,WAAWW,MAAOX,EAAiB,SAAS;AACxD,cAAA;AAAA,QACNA,EAAiB,UACb,iDAAiDA,EAAiB,OAAO,0BAA0BW,CAAE,KACrG;AAAA,MAAA;AAGN;AAAA,IACF;AAEA,IAAAhB,EAAiB,CAAQsB,MAAA,CAAC,GAAGA,GAAME,CAAS,CAAC;AAAA,EAC/C,GAAG,CAAE,CAAA,GAECC,IAAgBV;AAAA,IACpB,CAACC,GAAgBU,IAA0B,IAAOC,IAAoB,MAAM;AAC1E,UAAI,CAACtB,EAAiB,WAAWW,MAAOX,EAAiB,SAAS;AACxD,gBAAA;AAAA,UACNA,EAAiB,UACb,+CACA,iDAAiDA,EAAiB,OAAO,0BAA0BW,CAAE;AAAA,QAAA;AAG3G;AAAA,MACF;AAEA,MAAIW,MAAc,KAEhB3B,EAAiB,CAAY4B,MACpBA,EAAS,IAAI,CAACC,OACZ,EAAE,GAAGA,GAAM,UAAU,GAAM,EACnC,CACF;AAGG,YAAAV,IAAQ,WAAW,MAAM;AAC7B,qBAAaA,CAAK;AACZ,cAAAW,IAAY3B,EAAa,UAAU;AAEzC,QAAAH,EAAiB,CAAY4B,MAAA;AAE3B,cAAIE,KAAaF,EAAS,UAAUA,EAAS,WAAW;AACtD,mBAAAvB,EAAiB,UAAU,QAC3BF,EAAa,UAAU,IAEhB;AAGT,UAAAA,EAAa,UAAU2B;AACjB,gBAAAC,IAAuB,CAAC,GAAGH,CAAQ;AAExC,iBAAAG,EAAqBD,CAAS,EAAsB,WAAW,IAE5DA,IAAY,MACbC,EAAqBD,IAAY,CAAC,EAAsB,WAAWJ,IAG/DK;AAAA,QAAA,CACR;AAAA,SACAJ,CAAS;AAEF,MAAArB,EAAA,QAAQ,KAAKa,CAAK;AAAA,IAC9B;AAAA,IACA,CAAC;AAAA,EAAA,GAGGa,IAAwCC;AAAA,IAC5C,OAAO;AAAA,MACL,eAAAR;AAAA,MACA,YAAAX;AAAA,MACA,cAAAS;AAAA,MACA,cAAAL;AAAA,MACA,YAAAE;AAAA,MACA,YAAYrB;AAAA,MACZ,yBAAAH;AAAA,MACA,iBAAAK;AAAA,IAAA;AAAA,IAEF;AAAA,MACEwB;AAAA,MACAX;AAAA,MACAS;AAAA,MACAL;AAAA,MACAE;AAAA,MACArB;AAAA,MACAH;AAAA,MACAK;AAAA,IACF;AAAA,EAAA;AAIF,SAAAiC,EAAU,MAAM;AACd,IAAIxC,KAASC,KACXe,EAAmBf,GAAQ;AAAA,MACzB,QAAQD;AAAA,MACR,SAASC;AAAA,MACT,gBAAgB;AAAA,IAAA,CACjB;AAAA,EAEF,GAAA,CAACD,GAAOgB,GAAoBf,CAAM,CAAC,GAGtCuC,EAAU,MAAM;AACd,QAAIzB,GAAuB;AACzB,YAAM0B,IAA2B1B,EAAsB,IAAI,CAAA2B,MAAWA,EAAQ,UAAU;AAExF,MAAAvC,EAA2BsC,CAAwB;AAAA,IACrD;AAAA,EAAA,GACC,CAAC1B,CAAqB,CAAC,GAGvB,gBAAA4B,EAAA/C,EAAe,UAAf,EAAwB,OAAO0C,GAC7B,UAAA;AAAA,IAAAnB,uBACEyB,GAAA,EACE,UAAAvC,EAAc,IAAI,CAACyB,GAAWe,MAC7B,gBAAAC,EAACC,KAAqC,WAAAjB,KAAtB,aAAae,CAAK,EAA0B,CAC7D,GACH;AAAA,IAED9C;AAAA,EACH,EAAA,CAAA;AAEJ;"}
|
1
|
+
{"version":3,"file":"journey-context-provider.js","sources":["../../../../src/features/journey/use-journey/journey-context-provider.tsx"],"sourcesContent":["/* eslint-disable no-console */\nimport type { TJourneyId } from '../journey-id/journey-id-types';\nimport type {\n ICoachmarkProps,\n IJourneyContext,\n IJourneyProviderProps,\n} from './journey-context-types';\nimport type { FC } from 'react';\n\nimport { createContext, useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { Coachmark } from '../comps/coachmark/coachmark';\nimport { useGetUserJourney, usePostUserJourney } from '../user-journey-api/user-journey-api';\nimport * as S from './journey-styled';\n\nexport const JourneyContext = createContext<IJourneyContext | null>(null);\n\nexport const JourneyProvider: FC<IJourneyProviderProps> = ({ children, appId, userId }) => {\n const [userCompletedJourneyIds, setUserCompletedJourneyIds] = useState<TJourneyId[]>([]);\n const [coachmarkList, setCoachmarkList] = useState<ICoachmarkProps[]>([]);\n const [isJourneyActive, setIsJourneyActive] = useState(false);\n const currentIndex = useRef(-1);\n const currentJourneyId = useRef<TJourneyId | undefined>();\n const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n const { post: postJourneyCompletion } = usePostUserJourney();\n const {\n data: userCompletedJourneys = null,\n get: getJourneyProgress,\n isProcessing,\n } = useGetUserJourney();\n\n const showCoachmarks =\n appId === '' // Otherwise coachmark stories wont work\n ? coachmarkList.length > 0\n : userCompletedJourneys && !isProcessing && coachmarkList.length > 0;\n\n const setJourney = useCallback(\n (id: TJourneyId, coachmarks: ICoachmarkProps[]) => {\n if (coachmarkList.length > 0) {\n console.error(\n `setJourney: Other Journey is already active, Current Journey: ${currentJourneyId.current}, New Journey Request: ${id}`,\n );\n\n return;\n }\n setIsJourneyActive(true);\n currentJourneyId.current = id;\n currentIndex.current = -1;\n setCoachmarkList([...coachmarks]);\n },\n [coachmarkList.length],\n );\n\n const clearJourney = useCallback(() => {\n // Clear all timers\n timerRefs.current.forEach(timer => {\n clearTimeout(timer);\n });\n timerRefs.current = [];\n currentJourneyId.current = undefined;\n currentIndex.current = -1;\n setCoachmarkList([]);\n setIsJourneyActive(false);\n }, []);\n\n const endJourney = useCallback(\n (journeyId: TJourneyId) => {\n setUserCompletedJourneyIds(prev => [...prev, journeyId]);\n postJourneyCompletion({\n app_id: appId,\n user_id: userId,\n journey_id: journeyId,\n journey_status: 'COMPLETED',\n });\n clearJourney();\n },\n [appId, clearJourney, postJourneyCompletion, userId],\n );\n\n const addCoachmark = useCallback((id: TJourneyId, coachmark: ICoachmarkProps) => {\n if (!currentJourneyId.current || id !== currentJourneyId.current) {\n console.error(\n currentJourneyId.current\n ? `A Journey is already active, Current Journey: ${currentJourneyId.current}, New Journey Request: ${id}`\n : `addCoachmark was called before setJourney and Journey ID is undefined`,\n );\n\n return;\n }\n\n setCoachmarkList(prev => [...prev, coachmark]);\n }, []);\n\n const nextCoachmark = useCallback(\n (id: TJourneyId, keepPrevActive: boolean = false, delayInMs: number = 0) => {\n if (!currentJourneyId.current || id !== currentJourneyId.current) {\n console.error(\n currentJourneyId.current\n ? `nextCoachmark was called before setJourney`\n : `A Journey is already active, Current Journey: ${currentJourneyId.current}, New Journey Request: ${id}`,\n );\n\n return;\n }\n\n if (delayInMs !== 0) {\n // If delay is not 0, we will hide all them coachmarks and reveal only after the delay\n setCoachmarkList(prevList => {\n return prevList.map((item: ICoachmarkProps) => {\n return { ...item, isActive: false };\n });\n });\n }\n\n const timer = setTimeout(() => {\n clearTimeout(timer);\n const currIndex = currentIndex.current + 1;\n\n setCoachmarkList(prevList => {\n // Finish onboarding\n if (currIndex >= prevList.length || prevList.length === 0) {\n currentJourneyId.current = undefined;\n currentIndex.current = -1;\n\n return [];\n }\n\n currentIndex.current = currIndex;\n const updatedCoachmarkList = [...prevList];\n\n (updatedCoachmarkList[currIndex] as ICoachmarkProps).isActive = true;\n\n if (currIndex > 0) {\n (updatedCoachmarkList[currIndex - 1] as ICoachmarkProps).isActive = keepPrevActive;\n }\n\n return updatedCoachmarkList;\n });\n }, delayInMs);\n\n timerRefs.current.push(timer);\n },\n [],\n );\n\n const memoizedContextValue: IJourneyContext = useMemo(\n () => ({\n nextCoachmark,\n setJourney,\n addCoachmark,\n clearJourney,\n endJourney,\n coachmarks: coachmarkList,\n userCompletedJourneyIds,\n isJourneyActive,\n }),\n [\n nextCoachmark,\n setJourney,\n addCoachmark,\n clearJourney,\n endJourney,\n coachmarkList,\n userCompletedJourneyIds,\n isJourneyActive,\n ],\n );\n\n // Get the initial state of incompleteJourneys\n useEffect(() => {\n if (appId && userId) {\n getJourneyProgress(userId, {\n app_id: appId,\n user_id: userId,\n journey_status: 'COMPLETED',\n });\n }\n }, [appId, getJourneyProgress, userId]);\n\n // Set the data to context state initially\n useEffect(() => {\n if (userCompletedJourneys) {\n const completedUserJourneysIds = userCompletedJourneys.map(journey => journey.journey_id);\n\n setUserCompletedJourneyIds(completedUserJourneysIds);\n }\n }, [userCompletedJourneys]);\n\n return (\n <JourneyContext.Provider value={memoizedContextValue}>\n {showCoachmarks && (\n <S.Overlay>\n {coachmarkList.map((coachmark, index) => (\n <Coachmark key={`coachmark-${index}`} coachmark={coachmark} />\n ))}\n </S.Overlay>\n )}\n {children}\n </JourneyContext.Provider>\n );\n};\n"],"names":["JourneyContext","createContext","JourneyProvider","children","appId","userId","userCompletedJourneyIds","setUserCompletedJourneyIds","useState","coachmarkList","setCoachmarkList","isJourneyActive","setIsJourneyActive","currentIndex","useRef","currentJourneyId","timerRefs","postJourneyCompletion","usePostUserJourney","userCompletedJourneys","getJourneyProgress","isProcessing","useGetUserJourney","showCoachmarks","setJourney","useCallback","id","coachmarks","clearJourney","timer","endJourney","journeyId","prev","addCoachmark","coachmark","nextCoachmark","keepPrevActive","delayInMs","prevList","item","currIndex","updatedCoachmarkList","memoizedContextValue","useMemo","useEffect","completedUserJourneysIds","journey","jsxs","S.Overlay","index","jsx","Coachmark"],"mappings":"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"}
|
package/dist/index.d.ts
CHANGED
@@ -1107,7 +1107,6 @@ declare interface IGame extends IBaseProject {
|
|
1107
1107
|
declare interface IGameLauncherProps {
|
1108
1108
|
onSegmentClick: (projectDetail: Game | Puzzle | Lesson | ITableDetails, projectType: ProjectType) => void;
|
1109
1109
|
isLoading?: boolean;
|
1110
|
-
isError?: boolean;
|
1111
1110
|
data: IProjectData | null;
|
1112
1111
|
defaultIndex?: number;
|
1113
1112
|
journeyId?: TJourneyId;
|