@cuemath/leap 2.9.6-as1 → 2.9.6-as10
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/chapters-v2/chapter-details/block-sections/block-section-view.js +28 -28
- package/dist/features/chapters-v2/chapter-details/block-sections/block-section-view.js.map +1 -1
- package/dist/features/chapters-v2/chapter-details/block-sections/block-sections.js +44 -43
- package/dist/features/chapters-v2/chapter-details/block-sections/block-sections.js.map +1 -1
- package/dist/features/chapters-v2/chapter-details/chapter-banner/chapter-banner.js +31 -30
- package/dist/features/chapters-v2/chapter-details/chapter-banner/chapter-banner.js.map +1 -1
- package/dist/features/chapters-v2/chapter-details/chapter-details.js +82 -55
- package/dist/features/chapters-v2/chapter-details/chapter-details.js.map +1 -1
- package/dist/features/chapters-v2/comps/node-card/node-card-styled.js +30 -24
- package/dist/features/chapters-v2/comps/node-card/node-card-styled.js.map +1 -1
- package/dist/features/chapters-v2/comps/node-card/student-actions/student-actions.js +3 -3
- package/dist/features/chapters-v2/comps/node-card/student-actions/student-actions.js.map +1 -1
- package/dist/features/chapters-v2/comps/node-card/teacher-actions/teacher-actions.js +25 -25
- package/dist/features/chapters-v2/comps/node-card/teacher-actions/teacher-actions.js.map +1 -1
- package/dist/features/chapters-v2/utils/node-card-utils.js +31 -29
- package/dist/features/chapters-v2/utils/node-card-utils.js.map +1 -1
- package/dist/features/homework/hw-card-list/hw-card-list.js +38 -39
- package/dist/features/homework/hw-card-list/hw-card-list.js.map +1 -1
- package/dist/features/journey/hooks/use-chapter-journey.js +194 -0
- package/dist/features/journey/hooks/use-chapter-journey.js.map +1 -0
- package/dist/features/journey/journey-id/journey-id-student.js +2 -3
- package/dist/features/journey/journey-id/journey-id-student.js.map +1 -1
- package/dist/features/journey/journey-id/journey-id-teacher.js +5 -0
- package/dist/features/journey/journey-id/journey-id-teacher.js.map +1 -0
- package/dist/features/journey/use-journey/journey-context-provider.js +48 -48
- package/dist/features/journey/use-journey/journey-context-provider.js.map +1 -1
- package/dist/features/milestone/milestone-list-container/milestone-list/milestone-widget/milestone-info.js +12 -11
- package/dist/features/milestone/milestone-list-container/milestone-list/milestone-widget/milestone-info.js.map +1 -1
- package/dist/features/milestone/milestone-tests/test-list-v2/test-list-view.js +1 -1
- package/dist/features/milestone/milestone-tests/test-list-v2/test-list-view.js.map +1 -1
- package/dist/features/sheet-v2/resource-list/resource-list.js +1 -1
- package/dist/features/sheet-v2/resource-list/resource-list.js.map +1 -1
- package/dist/index.d.ts +29 -4
- package/dist/index.js +140 -137
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
@@ -1,16 +1,16 @@
|
|
1
|
-
import { jsx as t, jsxs as
|
2
|
-
import
|
3
|
-
import
|
4
|
-
import
|
1
|
+
import { jsx as t, jsxs as o } from "react/jsx-runtime";
|
2
|
+
import L from "../../../../assets/line-icons/icons/more-vertical.js";
|
3
|
+
import T from "../../../../assets/line-icons/icons/skip.js";
|
4
|
+
import I from "../../../ui/context-menu/context-menu.js";
|
5
5
|
import c from "../../../ui/layout/flex-view.js";
|
6
6
|
import u from "../../../ui/text/text.js";
|
7
|
-
import
|
7
|
+
import O from "../../comps/node-card/node-card.js";
|
8
8
|
import j from "../../comps/node-card/node-menu-options/node-menu-options.js";
|
9
9
|
import { BLOCK_NAME as k } from "../../constants/block-constants.js";
|
10
|
-
import { getSheetNLessonCount as
|
11
|
-
import { BlockSectionWrapper as
|
10
|
+
import { getSheetNLessonCount as M } from "../../utils/index.js";
|
11
|
+
import { BlockSectionWrapper as y, BlockOptionsWrapper as B, BlockSheetContainer as D } from "./block-sections-styled.js";
|
12
12
|
const q = ({
|
13
|
-
userType:
|
13
|
+
userType: n,
|
14
14
|
imageHue: m,
|
15
15
|
blockData: l,
|
16
16
|
lessonIdx: s,
|
@@ -19,31 +19,31 @@ const q = ({
|
|
19
19
|
onNodeAttempt: g,
|
20
20
|
onNodeAttemptLocationChange: x,
|
21
21
|
onNodeMarkAsDone: _,
|
22
|
-
onNodeReattempt:
|
23
|
-
onNodeReview:
|
22
|
+
onNodeReattempt: E,
|
23
|
+
onNodeReview: b,
|
24
24
|
onNodeView: N,
|
25
25
|
onBlockSkipUnskip: i
|
26
26
|
}) => {
|
27
|
-
const { block_type: p, name: a, sheets: d, permissions:
|
27
|
+
const { block_type: p, name: a, sheets: d, permissions: S } = l, { can_skip: h, can_un_skip: e } = S, f = k[p], w = M(e, d.length, r, s), A = [
|
28
28
|
{
|
29
29
|
id: "node-card-skip",
|
30
30
|
label: e ? "Revert 'Skip'" : "Skip",
|
31
|
-
icon:
|
31
|
+
icon: T,
|
32
32
|
disabled: !1,
|
33
33
|
onClick: () => i == null ? void 0 : i(l, h)
|
34
34
|
}
|
35
35
|
];
|
36
|
-
return
|
37
|
-
|
36
|
+
return n === "STUDENT" && e ? null : /* @__PURE__ */ t(
|
37
|
+
y,
|
38
38
|
{
|
39
39
|
$background: r ? `${m}_1` : "WHITE_1",
|
40
40
|
$gutterX: 1,
|
41
41
|
$lastBlock: C,
|
42
42
|
$flexGap: 12,
|
43
|
-
children: /* @__PURE__ */
|
44
|
-
/* @__PURE__ */
|
45
|
-
/* @__PURE__ */
|
46
|
-
/* @__PURE__ */
|
43
|
+
children: /* @__PURE__ */ o(c, { $flexGap: 12, children: [
|
44
|
+
/* @__PURE__ */ o(c, { $flexDirection: "row", $alignItems: "center", $justifyContent: "space-between", children: [
|
45
|
+
/* @__PURE__ */ o(c, { $opacity: e ? 0.5 : 1, children: [
|
46
|
+
/* @__PURE__ */ o(
|
47
47
|
u,
|
48
48
|
{
|
49
49
|
$renderAs: "ac4",
|
@@ -52,7 +52,7 @@ const q = ({
|
|
52
52
|
children: [
|
53
53
|
f === "Puzzles" ? a : f,
|
54
54
|
" ",
|
55
|
-
|
55
|
+
n !== "STUDENT" && w
|
56
56
|
]
|
57
57
|
}
|
58
58
|
),
|
@@ -66,8 +66,8 @@ const q = ({
|
|
66
66
|
}
|
67
67
|
)
|
68
68
|
] }),
|
69
|
-
|
70
|
-
|
69
|
+
n === "TEACHER" && (h || e) && /* @__PURE__ */ t(
|
70
|
+
I,
|
71
71
|
{
|
72
72
|
targetElement: /* @__PURE__ */ t(
|
73
73
|
B,
|
@@ -76,28 +76,28 @@ const q = ({
|
|
76
76
|
$height: 20,
|
77
77
|
$justifyContent: "center",
|
78
78
|
$alignItems: "center",
|
79
|
-
children: /* @__PURE__ */ t(
|
79
|
+
children: /* @__PURE__ */ t(L, { width: 16, height: 16 })
|
80
80
|
}
|
81
81
|
),
|
82
|
-
menuElement: /* @__PURE__ */ t(j, { options:
|
82
|
+
menuElement: /* @__PURE__ */ t(j, { options: A }),
|
83
83
|
menuOffset: 5,
|
84
84
|
menuZIndex: 4
|
85
85
|
}
|
86
86
|
)
|
87
87
|
] }),
|
88
|
-
/* @__PURE__ */ t(
|
89
|
-
|
88
|
+
/* @__PURE__ */ t(D, { $opacity: e ? 0.5 : 1, children: d.map(($) => /* @__PURE__ */ t(
|
89
|
+
O,
|
90
90
|
{
|
91
91
|
imageHue: m || "BLUE",
|
92
|
-
userType:
|
92
|
+
userType: n,
|
93
93
|
nodeData: $,
|
94
94
|
blockType: p,
|
95
95
|
isSkipped: e,
|
96
96
|
onNodeAttempt: g,
|
97
97
|
onNodeAttemptLocationChange: x,
|
98
98
|
onNodeMarkAsDone: _,
|
99
|
-
onNodeReattempt:
|
100
|
-
onNodeReview:
|
99
|
+
onNodeReattempt: E,
|
100
|
+
onNodeReview: b,
|
101
101
|
onNodeView: N
|
102
102
|
},
|
103
103
|
$.node_id
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"block-section-view.js","sources":["../../../../../src/features/chapters-v2/chapter-details/block-sections/block-section-view.tsx"],"sourcesContent":["import type { INodeMenuOption } from '../../comps/node-card/node-menu-options/node-menu-options-types';\nimport type { IBlockSectionProps } from './block-sections-types';\nimport type { FC } from 'react';\n\nimport MoreVerticalIcon from '../../../../assets/line-icons/icons/more-vertical';\nimport SkipIcon from '../../../../assets/line-icons/icons/skip';\nimport ContextMenu from '../../../ui/context-menu/context-menu';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport NodeCard from '../../comps/node-card/node-card';\nimport NodeMenuOptions from '../../comps/node-card/node-menu-options/node-menu-options';\nimport { BLOCK_NAME } from '../../constants/block-constants';\nimport { getSheetNLessonCount } from '../../utils';\nimport * as Styled from './block-sections-styled';\n\nconst BlockSectionView: FC<IBlockSectionProps> = ({\n userType,\n imageHue,\n blockData,\n lessonIdx,\n isLastBlock,\n isGoalBlock,\n onNodeAttempt,\n onNodeAttemptLocationChange,\n onNodeMarkAsDone,\n onNodeReattempt,\n onNodeReview,\n onNodeView,\n onBlockSkipUnskip,\n}) => {\n const { block_type: blockType, name, sheets, permissions } = blockData;\n\n const { can_skip: canSkip, can_un_skip: canUnskip } = permissions;\n const blockName = BLOCK_NAME[blockType];\n\n const sheetNLessonCount = getSheetNLessonCount(canUnskip, sheets.length, isGoalBlock, lessonIdx);\n\n const menuOptions: INodeMenuOption[] = [\n {\n id: 'node-card-skip',\n label: canUnskip ? `Revert 'Skip'` : 'Skip',\n icon: SkipIcon,\n disabled: false,\n onClick: () => onBlockSkipUnskip?.(blockData, canSkip),\n },\n ];\n\n if (userType === 'STUDENT' && canUnskip) return null;\n\n return (\n <Styled.BlockSectionWrapper\n $background={isGoalBlock ? `${imageHue}_1` : 'WHITE_1'}\n $gutterX={1}\n $lastBlock={isLastBlock}\n $flexGap={12}\n >\n <FlexView $flexGap={12}>\n <FlexView $flexDirection=\"row\" $alignItems=\"center\" $justifyContent=\"space-between\">\n <FlexView $opacity={canUnskip ? 0.5 : 1}>\n <Text\n $renderAs=\"ac4\"\n $color=\"BLACK_T_60\"\n $textDecoration={canUnskip ? 'line-through' : 'none'}\n >\n {blockName === 'Puzzles' ? name : blockName} {sheetNLessonCount}\n </Text>\n\n {isGoalBlock && (lessonIdx ?? 0) > 0 && (\n <Text\n $renderAs=\"ab2-bold\"\n $color=\"BLACK_1\"\n $textDecoration={canUnskip ? 'line-through' : 'none'}\n >\n {name}\n </Text>\n )}\n </FlexView>\n\n {userType === 'TEACHER' && (canSkip || canUnskip) && (\n <ContextMenu\n targetElement={\n <Styled.BlockOptionsWrapper\n $width={20}\n $height={20}\n $justifyContent=\"center\"\n $alignItems=\"center\"\n >\n <MoreVerticalIcon width={16} height={16} />\n </Styled.BlockOptionsWrapper>\n }\n menuElement={<NodeMenuOptions options={menuOptions} />}\n menuOffset={5}\n menuZIndex={4}\n />\n )}\n </FlexView>\n\n <Styled.BlockSheetContainer $opacity={canUnskip ? 0.5 : 1}>\n {sheets.map(nodeData => (\n <NodeCard\n key={nodeData.node_id}\n imageHue={imageHue || 'BLUE'}\n userType={userType}\n nodeData={nodeData}\n blockType={blockType}\n isSkipped={canUnskip}\n onNodeAttempt={onNodeAttempt}\n onNodeAttemptLocationChange={onNodeAttemptLocationChange}\n onNodeMarkAsDone={onNodeMarkAsDone}\n onNodeReattempt={onNodeReattempt}\n onNodeReview={onNodeReview}\n onNodeView={onNodeView}\n />\n ))}\n </Styled.BlockSheetContainer>\n </FlexView>\n </Styled.BlockSectionWrapper>\n );\n};\n\nexport default BlockSectionView;\n"],"names":["BlockSectionView","userType","imageHue","blockData","lessonIdx","isLastBlock","isGoalBlock","onNodeAttempt","onNodeAttemptLocationChange","onNodeMarkAsDone","onNodeReattempt","onNodeReview","onNodeView","onBlockSkipUnskip","blockType","name","sheets","permissions","canSkip","canUnskip","blockName","BLOCK_NAME","sheetNLessonCount","getSheetNLessonCount","menuOptions","SkipIcon","jsx","Styled.BlockSectionWrapper","jsxs","FlexView","Text","ContextMenu","Styled.BlockOptionsWrapper","MoreVerticalIcon","NodeMenuOptions","Styled.BlockSheetContainer","nodeData","NodeCard"],"mappings":";;;;;;;;;;;AAeA,MAAMA,IAA2C,CAAC;AAAA,EAChD,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC;AAAA,EACA,6BAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AAAA,EACA,mBAAAC;AACF,MAAM;AACJ,QAAM,EAAE,YAAYC,GAAW,MAAAC,GAAM,QAAAC,GAAQ,aAAAC,EAAgB,IAAAd,GAEvD,EAAE,UAAUe,GAAS,aAAaC,MAAcF,GAChDG,IAAYC,EAAWP,CAAS,GAEhCQ,IAAoBC,EAAqBJ,GAAWH,EAAO,QAAQV,GAAaF,CAAS,GAEzFoB,IAAiC;AAAA,IACrC;AAAA,MACE,IAAI;AAAA,MACJ,OAAOL,IAAY,kBAAkB;AAAA,MACrC,MAAMM;AAAA,MACN,UAAU;AAAA,MACV,SAAS,MAAMZ,KAAA,gBAAAA,EAAoBV,GAAWe;AAAA,IAChD;AAAA,EAAA;AAGE,SAAAjB,MAAa,aAAakB,IAAkB,OAG9C,gBAAAO;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,aAAarB,IAAc,GAAGJ,CAAQ,OAAO;AAAA,MAC7C,UAAU;AAAA,MACV,YAAYG;AAAA,MACZ,UAAU;AAAA,MAEV,UAAA,gBAAAuB,EAACC,GAAS,EAAA,UAAU,IAClB,UAAA;AAAA,QAAA,gBAAAD,EAACC,KAAS,gBAAe,OAAM,aAAY,UAAS,iBAAgB,iBAClE,UAAA;AAAA,UAAA,gBAAAD,EAACC,GAAS,EAAA,UAAUV,IAAY,MAAM,GACpC,UAAA;AAAA,YAAA,gBAAAS;AAAA,cAACE;AAAA,cAAA;AAAA,gBACC,WAAU;AAAA,gBACV,QAAO;AAAA,gBACP,iBAAiBX,IAAY,iBAAiB;AAAA,gBAE7C,UAAA;AAAA,kBAAAC,MAAc,YAAYL,IAAOK;AAAA,
|
1
|
+
{"version":3,"file":"block-section-view.js","sources":["../../../../../src/features/chapters-v2/chapter-details/block-sections/block-section-view.tsx"],"sourcesContent":["import type { INodeMenuOption } from '../../comps/node-card/node-menu-options/node-menu-options-types';\nimport type { IBlockSectionProps } from './block-sections-types';\nimport type { FC } from 'react';\n\nimport MoreVerticalIcon from '../../../../assets/line-icons/icons/more-vertical';\nimport SkipIcon from '../../../../assets/line-icons/icons/skip';\nimport ContextMenu from '../../../ui/context-menu/context-menu';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport NodeCard from '../../comps/node-card/node-card';\nimport NodeMenuOptions from '../../comps/node-card/node-menu-options/node-menu-options';\nimport { BLOCK_NAME } from '../../constants/block-constants';\nimport { getSheetNLessonCount } from '../../utils';\nimport * as Styled from './block-sections-styled';\n\nconst BlockSectionView: FC<IBlockSectionProps> = ({\n userType,\n imageHue,\n blockData,\n lessonIdx,\n isLastBlock,\n isGoalBlock,\n onNodeAttempt,\n onNodeAttemptLocationChange,\n onNodeMarkAsDone,\n onNodeReattempt,\n onNodeReview,\n onNodeView,\n onBlockSkipUnskip,\n}) => {\n const { block_type: blockType, name, sheets, permissions } = blockData;\n\n const { can_skip: canSkip, can_un_skip: canUnskip } = permissions;\n const blockName = BLOCK_NAME[blockType];\n\n const sheetNLessonCount = getSheetNLessonCount(canUnskip, sheets.length, isGoalBlock, lessonIdx);\n\n const menuOptions: INodeMenuOption[] = [\n {\n id: 'node-card-skip',\n label: canUnskip ? `Revert 'Skip'` : 'Skip',\n icon: SkipIcon,\n disabled: false,\n onClick: () => onBlockSkipUnskip?.(blockData, canSkip),\n },\n ];\n\n if (userType === 'STUDENT' && canUnskip) return null;\n\n return (\n <Styled.BlockSectionWrapper\n $background={isGoalBlock ? `${imageHue}_1` : 'WHITE_1'}\n $gutterX={1}\n $lastBlock={isLastBlock}\n $flexGap={12}\n >\n <FlexView $flexGap={12}>\n <FlexView $flexDirection=\"row\" $alignItems=\"center\" $justifyContent=\"space-between\">\n <FlexView $opacity={canUnskip ? 0.5 : 1}>\n <Text\n $renderAs=\"ac4\"\n $color=\"BLACK_T_60\"\n $textDecoration={canUnskip ? 'line-through' : 'none'}\n >\n {blockName === 'Puzzles' ? name : blockName}{' '}\n {userType !== 'STUDENT' && sheetNLessonCount}\n </Text>\n\n {isGoalBlock && (lessonIdx ?? 0) > 0 && (\n <Text\n $renderAs=\"ab2-bold\"\n $color=\"BLACK_1\"\n $textDecoration={canUnskip ? 'line-through' : 'none'}\n >\n {name}\n </Text>\n )}\n </FlexView>\n\n {userType === 'TEACHER' && (canSkip || canUnskip) && (\n <ContextMenu\n targetElement={\n <Styled.BlockOptionsWrapper\n $width={20}\n $height={20}\n $justifyContent=\"center\"\n $alignItems=\"center\"\n >\n <MoreVerticalIcon width={16} height={16} />\n </Styled.BlockOptionsWrapper>\n }\n menuElement={<NodeMenuOptions options={menuOptions} />}\n menuOffset={5}\n menuZIndex={4}\n />\n )}\n </FlexView>\n\n <Styled.BlockSheetContainer $opacity={canUnskip ? 0.5 : 1}>\n {sheets.map(nodeData => (\n <NodeCard\n key={nodeData.node_id}\n imageHue={imageHue || 'BLUE'}\n userType={userType}\n nodeData={nodeData}\n blockType={blockType}\n isSkipped={canUnskip}\n onNodeAttempt={onNodeAttempt}\n onNodeAttemptLocationChange={onNodeAttemptLocationChange}\n onNodeMarkAsDone={onNodeMarkAsDone}\n onNodeReattempt={onNodeReattempt}\n onNodeReview={onNodeReview}\n onNodeView={onNodeView}\n />\n ))}\n </Styled.BlockSheetContainer>\n </FlexView>\n </Styled.BlockSectionWrapper>\n );\n};\n\nexport default BlockSectionView;\n"],"names":["BlockSectionView","userType","imageHue","blockData","lessonIdx","isLastBlock","isGoalBlock","onNodeAttempt","onNodeAttemptLocationChange","onNodeMarkAsDone","onNodeReattempt","onNodeReview","onNodeView","onBlockSkipUnskip","blockType","name","sheets","permissions","canSkip","canUnskip","blockName","BLOCK_NAME","sheetNLessonCount","getSheetNLessonCount","menuOptions","SkipIcon","jsx","Styled.BlockSectionWrapper","jsxs","FlexView","Text","ContextMenu","Styled.BlockOptionsWrapper","MoreVerticalIcon","NodeMenuOptions","Styled.BlockSheetContainer","nodeData","NodeCard"],"mappings":"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"}
|
@@ -1,9 +1,9 @@
|
|
1
|
-
import { jsxs as b, jsx as
|
2
|
-
import { memo as
|
3
|
-
import
|
4
|
-
import
|
1
|
+
import { jsxs as b, jsx as n } from "react/jsx-runtime";
|
2
|
+
import { memo as I } from "react";
|
3
|
+
import w from "styled-components";
|
4
|
+
import E from "../../../ui/layout/flex-view.js";
|
5
5
|
import S from "./block-section-view.js";
|
6
|
-
const
|
6
|
+
const G = w(E)`
|
7
7
|
min-height: calc(
|
8
8
|
100vh - 168px - 56px + 64px
|
9
9
|
); // 168 chapter banner, 56 header height , 64 bottom padding
|
@@ -11,70 +11,71 @@ const E = I(w)`
|
|
11
11
|
&:last-child {
|
12
12
|
padding-bottom: 64px;
|
13
13
|
}
|
14
|
-
`, O =
|
14
|
+
`, O = I((_) => {
|
15
15
|
const {
|
16
|
-
blocks:
|
16
|
+
blocks: i,
|
17
17
|
imageHue: e,
|
18
|
-
userType:
|
18
|
+
userType: c,
|
19
|
+
coreBlocksRef: u,
|
19
20
|
onNodeAttempt: s,
|
20
|
-
onNodeAttemptLocationChange:
|
21
|
-
onNodeMarkAsDone:
|
22
|
-
onNodeReattempt:
|
23
|
-
onNodeReview:
|
24
|
-
onNodeView:
|
25
|
-
onBlockSkipUnskip:
|
21
|
+
onNodeAttemptLocationChange: r,
|
22
|
+
onNodeMarkAsDone: l,
|
23
|
+
onNodeReattempt: d,
|
24
|
+
onNodeReview: p,
|
25
|
+
onNodeView: m,
|
26
|
+
onBlockSkipUnskip: a
|
26
27
|
} = _;
|
27
|
-
let
|
28
|
-
const
|
28
|
+
let k = 0;
|
29
|
+
const h = i.filter(
|
29
30
|
(o) => o.section_code === "GOALS" || o.section_code === "READINESS"
|
30
|
-
),
|
31
|
+
), f = i.filter(
|
31
32
|
(o) => o.section_code !== "GOALS" && o.section_code !== "READINESS"
|
32
33
|
);
|
33
34
|
return /* @__PURE__ */ b(
|
34
|
-
|
35
|
+
G,
|
35
36
|
{
|
36
37
|
$width: "100%",
|
37
|
-
$background:
|
38
|
+
$background: f.length ? "WHITE_1" : `${e}_1`,
|
38
39
|
children: [
|
39
|
-
|
40
|
-
const { block_type:
|
41
|
-
let
|
42
|
-
const N = t ===
|
43
|
-
return
|
40
|
+
/* @__PURE__ */ n("div", { ref: u, children: h.map((o, t) => {
|
41
|
+
const { block_type: x, block_id: A, is_skipped: B } = o;
|
42
|
+
let g = 0;
|
43
|
+
const N = t === h.length - 1;
|
44
|
+
return x === "GOAL" && (B || (k += 1), g = k), /* @__PURE__ */ n(
|
44
45
|
S,
|
45
46
|
{
|
46
47
|
blockData: o,
|
47
|
-
userType:
|
48
|
+
userType: c,
|
48
49
|
isLastBlock: N,
|
49
|
-
lessonIdx:
|
50
|
+
lessonIdx: g,
|
50
51
|
imageHue: e,
|
51
52
|
isGoalBlock: !0,
|
52
53
|
onNodeAttempt: s,
|
53
|
-
onNodeAttemptLocationChange:
|
54
|
-
onNodeMarkAsDone:
|
55
|
-
onNodeReattempt:
|
56
|
-
onNodeReview:
|
57
|
-
onNodeView:
|
58
|
-
onBlockSkipUnskip:
|
54
|
+
onNodeAttemptLocationChange: r,
|
55
|
+
onNodeMarkAsDone: l,
|
56
|
+
onNodeReattempt: d,
|
57
|
+
onNodeReview: p,
|
58
|
+
onNodeView: m,
|
59
|
+
onBlockSkipUnskip: a
|
59
60
|
},
|
60
|
-
|
61
|
+
A
|
61
62
|
);
|
62
|
-
}),
|
63
|
-
|
63
|
+
}) }),
|
64
|
+
f.map((o) => {
|
64
65
|
const { block_id: t } = o;
|
65
|
-
return /* @__PURE__ */
|
66
|
+
return /* @__PURE__ */ n(
|
66
67
|
S,
|
67
68
|
{
|
68
69
|
blockData: o,
|
69
|
-
userType:
|
70
|
+
userType: c,
|
70
71
|
imageHue: e,
|
71
72
|
onNodeAttempt: s,
|
72
|
-
onNodeAttemptLocationChange:
|
73
|
-
onNodeMarkAsDone:
|
74
|
-
onNodeReattempt:
|
75
|
-
onNodeReview:
|
76
|
-
onNodeView:
|
77
|
-
onBlockSkipUnskip:
|
73
|
+
onNodeAttemptLocationChange: r,
|
74
|
+
onNodeMarkAsDone: l,
|
75
|
+
onNodeReattempt: d,
|
76
|
+
onNodeReview: p,
|
77
|
+
onNodeView: m,
|
78
|
+
onBlockSkipUnskip: a
|
78
79
|
},
|
79
80
|
t
|
80
81
|
);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"block-sections.js","sources":["../../../../../src/features/chapters-v2/chapter-details/block-sections/block-sections.tsx"],"sourcesContent":["import type { IBlockSectionsProps } from './block-sections-types';\nimport type { FC } from 'react';\n\nimport { memo } from 'react';\nimport styled from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport BlockSectionView from './block-section-view';\n\nconst ChapterDetailsWrapper = styled(FlexView)`\n min-height: calc(\n 100vh - 168px - 56px + 64px\n ); // 168 chapter banner, 56 header height , 64 bottom padding\n\n &:last-child {\n padding-bottom: 64px;\n }\n`;\n\nconst BlockSections: FC<IBlockSectionsProps> = memo(props => {\n const {\n blocks,\n imageHue,\n userType,\n onNodeAttempt,\n onNodeAttemptLocationChange,\n onNodeMarkAsDone,\n onNodeReattempt,\n onNodeReview,\n onNodeView,\n onBlockSkipUnskip,\n } = props;\n\n let lessonCount = 0;\n\n const goalBlocks = blocks.filter(\n block => block.section_code === 'GOALS' || block.section_code === 'READINESS',\n );\n\n const nonGoalBlocks = blocks.filter(\n block => block.section_code !== 'GOALS' && block.section_code !== 'READINESS',\n );\n\n return (\n <ChapterDetailsWrapper\n $width=\"100%\"\n $background={!nonGoalBlocks.length ? `${imageHue}_1` : 'WHITE_1'}\n >\n {goalBlocks.map((blockData, idx) => {\n
|
1
|
+
{"version":3,"file":"block-sections.js","sources":["../../../../../src/features/chapters-v2/chapter-details/block-sections/block-sections.tsx"],"sourcesContent":["import type { IBlockSectionsProps } from './block-sections-types';\nimport type { FC } from 'react';\n\nimport { memo } from 'react';\nimport styled from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport BlockSectionView from './block-section-view';\n\nconst ChapterDetailsWrapper = styled(FlexView)`\n min-height: calc(\n 100vh - 168px - 56px + 64px\n ); // 168 chapter banner, 56 header height , 64 bottom padding\n\n &:last-child {\n padding-bottom: 64px;\n }\n`;\n\nconst BlockSections: FC<IBlockSectionsProps> = memo(props => {\n const {\n blocks,\n imageHue,\n userType,\n coreBlocksRef,\n onNodeAttempt,\n onNodeAttemptLocationChange,\n onNodeMarkAsDone,\n onNodeReattempt,\n onNodeReview,\n onNodeView,\n onBlockSkipUnskip,\n } = props;\n\n let lessonCount = 0;\n\n const goalBlocks = blocks.filter(\n block => block.section_code === 'GOALS' || block.section_code === 'READINESS',\n );\n\n const nonGoalBlocks = blocks.filter(\n block => block.section_code !== 'GOALS' && block.section_code !== 'READINESS',\n );\n\n return (\n <ChapterDetailsWrapper\n $width=\"100%\"\n $background={!nonGoalBlocks.length ? `${imageHue}_1` : 'WHITE_1'}\n >\n <div ref={coreBlocksRef}>\n {goalBlocks.map((blockData, idx) => {\n const { block_type: blockType, block_id: blockId, is_skipped: isSkipped } = blockData;\n let lessonIdx = 0;\n\n const isLastBlock = idx === goalBlocks.length - 1;\n\n if (blockType === 'GOAL') {\n if (!isSkipped) {\n lessonCount += 1;\n }\n\n lessonIdx = lessonCount;\n }\n\n return (\n <BlockSectionView\n blockData={blockData}\n userType={userType}\n isLastBlock={isLastBlock}\n key={blockId}\n lessonIdx={lessonIdx}\n imageHue={imageHue}\n isGoalBlock\n onNodeAttempt={onNodeAttempt}\n onNodeAttemptLocationChange={onNodeAttemptLocationChange}\n onNodeMarkAsDone={onNodeMarkAsDone}\n onNodeReattempt={onNodeReattempt}\n onNodeReview={onNodeReview}\n onNodeView={onNodeView}\n onBlockSkipUnskip={onBlockSkipUnskip}\n />\n );\n })}\n </div>\n\n {nonGoalBlocks.map(blockData => {\n const { block_id: blockId } = blockData;\n\n return (\n <BlockSectionView\n key={blockId}\n blockData={blockData}\n userType={userType}\n imageHue={imageHue}\n onNodeAttempt={onNodeAttempt}\n onNodeAttemptLocationChange={onNodeAttemptLocationChange}\n onNodeMarkAsDone={onNodeMarkAsDone}\n onNodeReattempt={onNodeReattempt}\n onNodeReview={onNodeReview}\n onNodeView={onNodeView}\n onBlockSkipUnskip={onBlockSkipUnskip}\n />\n );\n })}\n </ChapterDetailsWrapper>\n );\n});\n\nexport default BlockSections;\n"],"names":["ChapterDetailsWrapper","styled","FlexView","BlockSections","memo","props","blocks","imageHue","userType","coreBlocksRef","onNodeAttempt","onNodeAttemptLocationChange","onNodeMarkAsDone","onNodeReattempt","onNodeReview","onNodeView","onBlockSkipUnskip","lessonCount","goalBlocks","block","nonGoalBlocks","jsxs","jsx","blockData","idx","blockType","blockId","isSkipped","lessonIdx","isLastBlock","BlockSectionView"],"mappings":";;;;;AASA,MAAMA,IAAwBC,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAUvCC,IAAyCC,EAAK,CAASC,MAAA;AACrD,QAAA;AAAA,IACJ,QAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,eAAAC;AAAA,IACA,eAAAC;AAAA,IACA,6BAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,cAAAC;AAAA,IACA,YAAAC;AAAA,IACA,mBAAAC;AAAA,EACE,IAAAX;AAEJ,MAAIY,IAAc;AAElB,QAAMC,IAAaZ,EAAO;AAAA,IACxB,CAASa,MAAAA,EAAM,iBAAiB,WAAWA,EAAM,iBAAiB;AAAA,EAAA,GAG9DC,IAAgBd,EAAO;AAAA,IAC3B,CAASa,MAAAA,EAAM,iBAAiB,WAAWA,EAAM,iBAAiB;AAAA,EAAA;AAIlE,SAAA,gBAAAE;AAAA,IAACrB;AAAA,IAAA;AAAA,MACC,QAAO;AAAA,MACP,aAAcoB,EAAc,SAA2B,YAAlB,GAAGb,CAAQ;AAAA,MAEhD,UAAA;AAAA,QAAA,gBAAAe,EAAC,SAAI,KAAKb,GACP,YAAW,IAAI,CAACc,GAAWC,MAAQ;AAClC,gBAAM,EAAE,YAAYC,GAAW,UAAUC,GAAS,YAAYC,EAAc,IAAAJ;AAC5E,cAAIK,IAAY;AAEV,gBAAAC,IAAcL,MAAQN,EAAW,SAAS;AAEhD,iBAAIO,MAAc,WACXE,MACYV,KAAA,IAGLW,IAAAX,IAIZ,gBAAAK;AAAA,YAACQ;AAAA,YAAA;AAAA,cACC,WAAAP;AAAA,cACA,UAAAf;AAAA,cACA,aAAAqB;AAAA,cAEA,WAAAD;AAAA,cACA,UAAArB;AAAA,cACA,aAAW;AAAA,cACX,eAAAG;AAAA,cACA,6BAAAC;AAAA,cACA,kBAAAC;AAAA,cACA,iBAAAC;AAAA,cACA,cAAAC;AAAA,cACA,YAAAC;AAAA,cACA,mBAAAC;AAAA,YAAA;AAAA,YAVKU;AAAA,UAAA;AAAA,QAaV,CAAA,GACH;AAAA,QAECN,EAAc,IAAI,CAAaG,MAAA;AACxB,gBAAA,EAAE,UAAUG,EAAY,IAAAH;AAG5B,iBAAA,gBAAAD;AAAA,YAACQ;AAAA,YAAA;AAAA,cAEC,WAAAP;AAAA,cACA,UAAAf;AAAA,cACA,UAAAD;AAAA,cACA,eAAAG;AAAA,cACA,6BAAAC;AAAA,cACA,kBAAAC;AAAA,cACA,iBAAAC;AAAA,cACA,cAAAC;AAAA,cACA,YAAAC;AAAA,cACA,mBAAAC;AAAA,YAAA;AAAA,YAVKU;AAAA,UAAA;AAAA,QAWP,CAEH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}
|
@@ -1,45 +1,46 @@
|
|
1
|
-
import { jsx as e, jsxs as
|
2
|
-
import { memo as
|
3
|
-
import { ILLUSTRATIONS as
|
1
|
+
import { jsx as e, jsxs as r } from "react/jsx-runtime";
|
2
|
+
import { memo as D, useMemo as d } from "react";
|
3
|
+
import { ILLUSTRATIONS as b } from "../../../../assets/illustrations/illustrations.js";
|
4
4
|
import g from "../../../../assets/line-icons/icons/check2.js";
|
5
5
|
import V from "../../../ui/image/image.js";
|
6
6
|
import n from "../../../ui/layout/flex-view.js";
|
7
7
|
import i from "../../../ui/text/text.js";
|
8
8
|
import C from "../../comps/tag/tag.js";
|
9
9
|
import { getChapterCompletionPercentage as W } from "../../utils/index.js";
|
10
|
-
import { BannerContainer as
|
11
|
-
const a = 52, l = 54, c = 54,
|
12
|
-
const { progressStats: o, imageHue: S, title: x, imageUrl: u } = I,
|
13
|
-
const h = (-(
|
10
|
+
import { BannerContainer as M, BannerImageWrapper as O, BannerImage as X, ChapterProgressSVG as j, ChapterProgressSVGCircle as $, StyledImportantIcon as f, StyledCheckIcon as H, BannerTitleWrapper as N } from "./chapter-banner-styled.js";
|
11
|
+
const a = 52, l = 54, c = 54, re = D((I) => {
|
12
|
+
const { progressStats: o, imageHue: S, title: x, imageUrl: R, bannerRef: u } = I, t = d(() => W(o), [o]), { iconTopVal: E, iconLeftVal: w } = d(() => {
|
13
|
+
const h = (-(t === 100 ? 60 : t) * 3.6 - 180) * Math.PI / 180, A = c + a * Math.sin(h), B = l + a * Math.cos(h);
|
14
14
|
return {
|
15
|
-
iconLeftVal:
|
16
|
-
iconTopVal:
|
15
|
+
iconLeftVal: A,
|
16
|
+
iconTopVal: B
|
17
17
|
};
|
18
|
-
}, [
|
18
|
+
}, [t]);
|
19
19
|
if (!o) return null;
|
20
|
-
const { mandatory:
|
20
|
+
const { mandatory: T, optional: _, classwork: k } = o, { completed: y = 0, total: s = 0 } = T || {}, { completed: G = 0, total: p = 0 } = _ || {}, { completed: L = 0, total: m = 0 } = k || {}, P = m > 0 && L === m;
|
21
21
|
return /* @__PURE__ */ e(
|
22
|
-
|
22
|
+
M,
|
23
23
|
{
|
24
24
|
$flexDirection: "row",
|
25
25
|
$justifyContent: "center",
|
26
26
|
$alignItems: "center",
|
27
27
|
$widthX: 50,
|
28
28
|
$background: `${S}_4`,
|
29
|
-
|
29
|
+
ref: u,
|
30
|
+
children: /* @__PURE__ */ r(n, { $height: 168, $position: "relative", children: [
|
30
31
|
/* @__PURE__ */ e(
|
31
32
|
V,
|
32
33
|
{
|
33
34
|
width: "100%",
|
34
35
|
height: "168px",
|
35
|
-
src:
|
36
|
+
src: b.CHAPTER_HEADER_BG,
|
36
37
|
alt: "Chapter header background",
|
37
38
|
withLoader: !0
|
38
39
|
}
|
39
40
|
),
|
40
|
-
/* @__PURE__ */
|
41
|
-
/* @__PURE__ */ e(
|
42
|
-
/* @__PURE__ */
|
41
|
+
/* @__PURE__ */ r(O, { children: [
|
42
|
+
/* @__PURE__ */ e(X, { src: R, alt: "Chapter image" }),
|
43
|
+
/* @__PURE__ */ r(j, { width: "108px", height: "108px", children: [
|
43
44
|
/* @__PURE__ */ e(
|
44
45
|
$,
|
45
46
|
{
|
@@ -54,34 +55,34 @@ const a = 52, l = 54, c = 54, ee = B((I) => {
|
|
54
55
|
{
|
55
56
|
$progressCircle: !0,
|
56
57
|
$progressBackground: "BLACK",
|
57
|
-
$progress: 3.3 *
|
58
|
+
$progress: 3.3 * t,
|
58
59
|
r: a,
|
59
60
|
cx: l,
|
60
61
|
cy: c
|
61
62
|
}
|
62
63
|
)
|
63
64
|
] }),
|
64
|
-
|
65
|
-
|
65
|
+
t > 0 && /* @__PURE__ */ e(f, { $progress: !0, $top: E, $left: w }),
|
66
|
+
t === 100 && /* @__PURE__ */ e(H, { children: /* @__PURE__ */ e(C, { Icon: g }) })
|
66
67
|
] }),
|
67
|
-
/* @__PURE__ */
|
68
|
+
/* @__PURE__ */ r(N, { $flexGap: 4, children: [
|
68
69
|
/* @__PURE__ */ e(i, { $renderAs: "ah4-bold", children: x }),
|
69
|
-
/* @__PURE__ */
|
70
|
-
!!s && /* @__PURE__ */
|
70
|
+
/* @__PURE__ */ r(n, { $flexDirection: "row", $alignItems: "center", $flexGapX: 2.75, children: [
|
71
|
+
!!s && /* @__PURE__ */ r(n, { $position: "relative", $flexDirection: "row", children: [
|
71
72
|
/* @__PURE__ */ e(f, {}),
|
72
|
-
/* @__PURE__ */
|
73
|
-
/* @__PURE__ */
|
73
|
+
/* @__PURE__ */ r(n, { $flexDirection: "row", $alignItems: "center", $flexGap: 8, children: [
|
74
|
+
/* @__PURE__ */ r(i, { $renderAs: "ab2", children: [
|
74
75
|
"Core - ",
|
75
|
-
|
76
|
+
y,
|
76
77
|
"/",
|
77
78
|
s
|
78
79
|
] }),
|
79
|
-
|
80
|
+
P && /* @__PURE__ */ e(C, { Icon: g, label: "CW" })
|
80
81
|
] })
|
81
82
|
] }),
|
82
|
-
p > 0 && /* @__PURE__ */
|
83
|
+
p > 0 && /* @__PURE__ */ r(i, { $renderAs: "ab2", children: [
|
83
84
|
"Supplementary - ",
|
84
|
-
|
85
|
+
G,
|
85
86
|
"/",
|
86
87
|
p
|
87
88
|
] })
|
@@ -92,6 +93,6 @@ const a = 52, l = 54, c = 54, ee = B((I) => {
|
|
92
93
|
);
|
93
94
|
});
|
94
95
|
export {
|
95
|
-
|
96
|
+
re as default
|
96
97
|
};
|
97
98
|
//# sourceMappingURL=chapter-banner.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"chapter-banner.js","sources":["../../../../../src/features/chapters-v2/chapter-details/chapter-banner/chapter-banner.tsx"],"sourcesContent":["import type { IChapterBannerProps } from './chapter-banner-types';\nimport type { FC } from 'react';\n\nimport { memo, useMemo } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\nimport Check2Icon from '../../../../assets/line-icons/icons/check2';\nimport Image from '../../../ui/image/image';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport Tag from '../../comps/tag/tag';\nimport { getChapterCompletionPercentage } from '../../utils';\nimport * as Styled from './chapter-banner-styled';\n\nconst PROGRESS_CIRCLE_RADIUS = 52;\nconst PROGRESS_CIRCLE_CENTER_X = 54;\nconst PROGRESS_CIRCLE_CENTER_Y = 54;\n\n// This component renders a banner for a chapter, displaying its title, progress, and associated tags.\n// It includes an image, progress visualization, and details about the chapter's core and supplementary sheets.\n// It calculates the completion percentage and dynamically positions an icon based on progress.\nconst ChapterBanner: FC<IChapterBannerProps> = memo(props => {\n const { progressStats, imageHue, title, imageUrl } = props;\n\n const completionPercentage = useMemo(() => {\n return getChapterCompletionPercentage(progressStats);\n }, [progressStats]);\n\n const { iconTopVal, iconLeftVal } = useMemo(() => {\n //* Calculate the position of the important icon based on the completion percentage\n //* Convert degrees to radians\n const angleInDegree = completionPercentage === 100 ? 60 : completionPercentage;\n\n const angleInRadian = ((-angleInDegree * 3.6 - 180) * Math.PI) / 180;\n const positionX = PROGRESS_CIRCLE_CENTER_Y + PROGRESS_CIRCLE_RADIUS * Math.sin(angleInRadian);\n const positionY = PROGRESS_CIRCLE_CENTER_X + PROGRESS_CIRCLE_RADIUS * Math.cos(angleInRadian);\n\n return {\n iconLeftVal: positionX,\n iconTopVal: positionY,\n };\n }, [completionPercentage]);\n\n if (!progressStats) return null;\n\n const { mandatory, optional, classwork: classWork } = progressStats;\n const { completed: completedMandatorySheets = 0, total: totalMandatorySheets = 0 } =\n mandatory || {};\n const { completed: completedOptionalSheets = 0, total: totalOptionalSheets = 0 } = optional || {};\n const { completed: completedClassWorkSheets = 0, total: totalClassWorkSheets = 0 } =\n classWork || {};\n const showClassWorkTag =\n totalClassWorkSheets > 0 && completedClassWorkSheets === totalClassWorkSheets;\n\n return (\n <Styled.BannerContainer\n $flexDirection=\"row\"\n $justifyContent=\"center\"\n $alignItems=\"center\"\n $widthX={50}\n $background={`${imageHue}_4`}\n >\n <FlexView $height={168} $position=\"relative\">\n <Image\n width=\"100%\"\n height=\"168px\"\n src={ILLUSTRATIONS.CHAPTER_HEADER_BG}\n alt=\"Chapter header background\"\n withLoader\n />\n <Styled.BannerImageWrapper>\n <Styled.BannerImage src={imageUrl} alt=\"Chapter image\" />\n <Styled.ChapterProgressSVG width=\"108px\" height=\"108px\">\n <Styled.ChapterProgressSVGCircle\n $progress={0}\n r={PROGRESS_CIRCLE_RADIUS}\n cx={PROGRESS_CIRCLE_CENTER_X}\n cy={PROGRESS_CIRCLE_CENTER_Y}\n />\n <Styled.ChapterProgressSVGCircle\n $progressCircle\n $progressBackground={'BLACK'}\n $progress={3.3 * completionPercentage}\n r={PROGRESS_CIRCLE_RADIUS}\n cx={PROGRESS_CIRCLE_CENTER_X}\n cy={PROGRESS_CIRCLE_CENTER_Y}\n />\n </Styled.ChapterProgressSVG>\n\n {completionPercentage > 0 && (\n <Styled.StyledImportantIcon $progress $top={iconTopVal} $left={iconLeftVal} />\n )}\n\n {completionPercentage === 100 && (\n <Styled.StyledCheckIcon>\n <Tag Icon={Check2Icon} />\n </Styled.StyledCheckIcon>\n )}\n </Styled.BannerImageWrapper>\n <Styled.BannerTitleWrapper $flexGap={4}>\n <Text $renderAs=\"ah4-bold\">{title}</Text>\n <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexGapX={2.75}>\n {!!totalMandatorySheets && (\n <FlexView $position=\"relative\" $flexDirection=\"row\">\n <Styled.StyledImportantIcon />\n <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexGap={8}>\n <Text $renderAs=\"ab2\">\n Core - {completedMandatorySheets}/{totalMandatorySheets}\n </Text>\n {showClassWorkTag && <Tag Icon={Check2Icon} label=\"CW\" />}\n </FlexView>\n </FlexView>\n )}\n {totalOptionalSheets > 0 && (\n <Text $renderAs=\"ab2\">\n Supplementary - {completedOptionalSheets}/{totalOptionalSheets}\n </Text>\n )}\n </FlexView>\n </Styled.BannerTitleWrapper>\n </FlexView>\n </Styled.BannerContainer>\n );\n});\n\nexport default ChapterBanner;\n"],"names":["PROGRESS_CIRCLE_RADIUS","PROGRESS_CIRCLE_CENTER_X","PROGRESS_CIRCLE_CENTER_Y","ChapterBanner","memo","props","progressStats","imageHue","title","imageUrl","completionPercentage","useMemo","getChapterCompletionPercentage","iconTopVal","iconLeftVal","angleInRadian","positionX","positionY","mandatory","optional","classWork","completedMandatorySheets","totalMandatorySheets","completedOptionalSheets","totalOptionalSheets","completedClassWorkSheets","totalClassWorkSheets","showClassWorkTag","jsx","Styled.BannerContainer","jsxs","FlexView","Image","ILLUSTRATIONS","Styled.BannerImageWrapper","Styled.BannerImage","Styled.ChapterProgressSVG","Styled.ChapterProgressSVGCircle","Styled.StyledImportantIcon","Styled.StyledCheckIcon","Tag","Check2Icon","Styled.BannerTitleWrapper","Text"],"mappings":";;;;;;;;;;AAcA,MAAMA,IAAyB,IACzBC,IAA2B,IAC3BC,IAA2B,IAK3BC,KAAyCC,EAAK,CAASC,MAAA;AAC3D,QAAM,EAAE,eAAAC,GAAe,UAAAC,GAAU,OAAAC,GAAO,UAAAC,
|
1
|
+
{"version":3,"file":"chapter-banner.js","sources":["../../../../../src/features/chapters-v2/chapter-details/chapter-banner/chapter-banner.tsx"],"sourcesContent":["import type { IChapterBannerProps } from './chapter-banner-types';\nimport type { FC } from 'react';\n\nimport { memo, useMemo } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\nimport Check2Icon from '../../../../assets/line-icons/icons/check2';\nimport Image from '../../../ui/image/image';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport Tag from '../../comps/tag/tag';\nimport { getChapterCompletionPercentage } from '../../utils';\nimport * as Styled from './chapter-banner-styled';\n\nconst PROGRESS_CIRCLE_RADIUS = 52;\nconst PROGRESS_CIRCLE_CENTER_X = 54;\nconst PROGRESS_CIRCLE_CENTER_Y = 54;\n\n// This component renders a banner for a chapter, displaying its title, progress, and associated tags.\n// It includes an image, progress visualization, and details about the chapter's core and supplementary sheets.\n// It calculates the completion percentage and dynamically positions an icon based on progress.\nconst ChapterBanner: FC<IChapterBannerProps> = memo(props => {\n const { progressStats, imageHue, title, imageUrl, bannerRef } = props;\n\n const completionPercentage = useMemo(() => {\n return getChapterCompletionPercentage(progressStats);\n }, [progressStats]);\n\n const { iconTopVal, iconLeftVal } = useMemo(() => {\n //* Calculate the position of the important icon based on the completion percentage\n //* Convert degrees to radians\n const angleInDegree = completionPercentage === 100 ? 60 : completionPercentage;\n\n const angleInRadian = ((-angleInDegree * 3.6 - 180) * Math.PI) / 180;\n const positionX = PROGRESS_CIRCLE_CENTER_Y + PROGRESS_CIRCLE_RADIUS * Math.sin(angleInRadian);\n const positionY = PROGRESS_CIRCLE_CENTER_X + PROGRESS_CIRCLE_RADIUS * Math.cos(angleInRadian);\n\n return {\n iconLeftVal: positionX,\n iconTopVal: positionY,\n };\n }, [completionPercentage]);\n\n if (!progressStats) return null;\n\n const { mandatory, optional, classwork: classWork } = progressStats;\n const { completed: completedMandatorySheets = 0, total: totalMandatorySheets = 0 } =\n mandatory || {};\n const { completed: completedOptionalSheets = 0, total: totalOptionalSheets = 0 } = optional || {};\n const { completed: completedClassWorkSheets = 0, total: totalClassWorkSheets = 0 } =\n classWork || {};\n const showClassWorkTag =\n totalClassWorkSheets > 0 && completedClassWorkSheets === totalClassWorkSheets;\n\n return (\n <Styled.BannerContainer\n $flexDirection=\"row\"\n $justifyContent=\"center\"\n $alignItems=\"center\"\n $widthX={50}\n $background={`${imageHue}_4`}\n ref={bannerRef}\n >\n <FlexView $height={168} $position=\"relative\">\n <Image\n width=\"100%\"\n height=\"168px\"\n src={ILLUSTRATIONS.CHAPTER_HEADER_BG}\n alt=\"Chapter header background\"\n withLoader\n />\n <Styled.BannerImageWrapper>\n <Styled.BannerImage src={imageUrl} alt=\"Chapter image\" />\n <Styled.ChapterProgressSVG width=\"108px\" height=\"108px\">\n <Styled.ChapterProgressSVGCircle\n $progress={0}\n r={PROGRESS_CIRCLE_RADIUS}\n cx={PROGRESS_CIRCLE_CENTER_X}\n cy={PROGRESS_CIRCLE_CENTER_Y}\n />\n <Styled.ChapterProgressSVGCircle\n $progressCircle\n $progressBackground={'BLACK'}\n $progress={3.3 * completionPercentage}\n r={PROGRESS_CIRCLE_RADIUS}\n cx={PROGRESS_CIRCLE_CENTER_X}\n cy={PROGRESS_CIRCLE_CENTER_Y}\n />\n </Styled.ChapterProgressSVG>\n\n {completionPercentage > 0 && (\n <Styled.StyledImportantIcon $progress $top={iconTopVal} $left={iconLeftVal} />\n )}\n\n {completionPercentage === 100 && (\n <Styled.StyledCheckIcon>\n <Tag Icon={Check2Icon} />\n </Styled.StyledCheckIcon>\n )}\n </Styled.BannerImageWrapper>\n <Styled.BannerTitleWrapper $flexGap={4}>\n <Text $renderAs=\"ah4-bold\">{title}</Text>\n <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexGapX={2.75}>\n {!!totalMandatorySheets && (\n <FlexView $position=\"relative\" $flexDirection=\"row\">\n <Styled.StyledImportantIcon />\n <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexGap={8}>\n <Text $renderAs=\"ab2\">\n Core - {completedMandatorySheets}/{totalMandatorySheets}\n </Text>\n {showClassWorkTag && <Tag Icon={Check2Icon} label=\"CW\" />}\n </FlexView>\n </FlexView>\n )}\n {totalOptionalSheets > 0 && (\n <Text $renderAs=\"ab2\">\n Supplementary - {completedOptionalSheets}/{totalOptionalSheets}\n </Text>\n )}\n </FlexView>\n </Styled.BannerTitleWrapper>\n </FlexView>\n </Styled.BannerContainer>\n );\n});\n\nexport default ChapterBanner;\n"],"names":["PROGRESS_CIRCLE_RADIUS","PROGRESS_CIRCLE_CENTER_X","PROGRESS_CIRCLE_CENTER_Y","ChapterBanner","memo","props","progressStats","imageHue","title","imageUrl","bannerRef","completionPercentage","useMemo","getChapterCompletionPercentage","iconTopVal","iconLeftVal","angleInRadian","positionX","positionY","mandatory","optional","classWork","completedMandatorySheets","totalMandatorySheets","completedOptionalSheets","totalOptionalSheets","completedClassWorkSheets","totalClassWorkSheets","showClassWorkTag","jsx","Styled.BannerContainer","jsxs","FlexView","Image","ILLUSTRATIONS","Styled.BannerImageWrapper","Styled.BannerImage","Styled.ChapterProgressSVG","Styled.ChapterProgressSVGCircle","Styled.StyledImportantIcon","Styled.StyledCheckIcon","Tag","Check2Icon","Styled.BannerTitleWrapper","Text"],"mappings":"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"}
|