@cuemath/leap 2.8.21 → 2.8.22

package/dist/features/milestone/create/milestone-create-hooks.js

@@ -1,142 +1,144 @@
-import { useState as P, useMemo as w, useRef as B, useCallback as N } from "react";
+import { useState as P, useMemo as N, useRef as B, useCallback as b } from "react";
+import j from "../../notifications/use-student-journey.js";
 import { TEST_TYPE_TO_TEST_NAME as v } from "../constants.js";
-import { checkIfCommittedFieldIsUpdated as k } from "../edit/goal-edit-helpers.js";
-import { GOAL_EDIT_FLOWS as p, BRANCHING_FIELDS as F } from "./milestone-create-constants.js";
-import W, { CHAPTERS_SELECTION_FORM_TREE as j, ADD_CUSTOM_CHAPTERS as H, SET_COMPLETION_DATE as y } from "./milestone-create-form-tree.js";
+import { checkIfCommittedFieldIsUpdated as y } from "../edit/goal-edit-helpers.js";
+import { GOAL_EDIT_FLOWS as p, BRANCHING_FIELDS as k } from "./milestone-create-constants.js";
+import F, { CHAPTERS_SELECTION_FORM_TREE as H, ADD_CUSTOM_CHAPTERS as W, SET_COMPLETION_DATE as J } from "./milestone-create-form-tree.js";
 import { appendSchoolDataToFormState as V, generateFormStateWithPrefilledSchoolData as Y, getCurrenStep as h, clearNextFields as q } from "./milestone-create-helpers.js";
-const $ = (l, {
-  schoolData: c,
-  board: t,
-  grade: r,
+const a = (d, {
+  schoolData: o,
+  board: e,
+  grade: u,
   currentCountryCode: T,
-  flow: d
+  flow: r
 }) => {
-  const [m, o] = P(() => l && p.includes(d) ? V(l, c, t, r) : {
+  const [l, i] = P(() => d && p.includes(r) ? V(d, o, e, u) : {
     ...Y(
-      c,
-      t,
-      r,
+      o,
+      e,
+      u,
       T
     )
   });
-  return { formDataState: m, setFormData: o };
-}, x = ({
-  flow: l,
-  formDataState: c,
-  isGoalCreation: t
+  return { formDataState: l, setFormData: i };
+}, g = (d, o) => j(d === "TEACHER" ? o : null), D = ({
+  flow: d,
+  formDataState: o,
+  isGoalCreation: e
 }) => {
-  const { testType: r } = c;
-  return w(() => {
-    if (p.includes(l) && r) {
-      const d = {
-        ...j,
+  const { testType: u } = o;
+  return N(() => {
+    if (p.includes(d) && u) {
+      const r = {
+        ...H,
         isRootNode: !0,
-        title: v[r]
-      }, m = Object.assign({}, H), o = Object.assign({}, y);
-      return t || (m.buttonLabel = "Add to learning plan", d.buttonLabel = "Update"), l === "EDIT" && (o.buttonLabel = "Update goal"), (!t || r === "no-test") && (d.next = [m, o]), d;
+        title: v[u]
+      }, l = Object.assign({}, W), i = Object.assign({}, J);
+      return e || (l.buttonLabel = "Add to learning plan", r.buttonLabel = "Update"), d === "EDIT" && (i.buttonLabel = "Update goal"), (!e || u === "no-test") && (r.next = [l, i]), r;
     }
-    return W;
-  }, [l, r, t]);
-}, a = ({
-  flow: l,
-  updatedFormTree: c,
-  formData: t,
-  formDataState: r,
+    return F;
+  }, [d, u, e]);
+}, ee = ({
+  flow: d,
+  updatedFormTree: o,
+  formData: e,
+  formDataState: u,
   setFormData: T,
-  handleExit: d
+  handleExit: r
 }) => {
-  const m = B(r), o = (t == null ? void 0 : t.currentFlow) ?? l, i = w(
-    () => h(c, t, o),
-    [c, t, o]
-  ), O = i == null ? void 0 : i.name, b = !!(i != null && i.isRootNode), E = N(
-    (e) => {
-      T((s) => {
-        const S = s.testType;
-        if (p.includes(o)) {
-          const A = {
-            ...s.committed,
-            ...e.committed
+  const l = B(u), i = (e == null ? void 0 : e.currentFlow) ?? d, s = N(
+    () => h(o, e, i),
+    [o, e, i]
+  ), O = s == null ? void 0 : s.name, A = !!(s != null && s.isRootNode), E = b(
+    (t) => {
+      T((n) => {
+        const S = n.testType;
+        if (p.includes(i)) {
+          const I = {
+            ...n.committed,
+            ...t.committed
           }, C = [];
-          if (Object.entries((e == null ? void 0 : e.committed) || {}).forEach((R) => {
-            const n = R[0], U = !!R[1], M = e[n] ?? s[n];
-            if (k({
-              field: n,
-              isFieldCommited: U,
-              prevFormData: s,
-              newValueOfField: M,
-              formDataStateRef: m.current
+          if (Object.entries((t == null ? void 0 : t.committed) || {}).forEach((R) => {
+            const c = R[0], M = !!R[1], U = t[c] ?? n[c];
+            if (y({
+              field: c,
+              isFieldCommited: M,
+              prevFormData: n,
+              newValueOfField: U,
+              formDataStateRef: l.current
             })) {
               let _ = [];
-              S && S === "no-test" && (_ = _.concat(["board"])), _.includes(n) || C.push(n);
+              S && S === "no-test" && (_ = _.concat(["board"])), _.includes(c) || C.push(c);
             }
-          }), C.length > 0 && C.some((n) => F.includes(n))) {
-            const n = q(
-              c,
-              s,
+          }), C.length > 0 && C.some((c) => k.includes(c))) {
+            const c = q(
+              o,
+              n,
               O,
-              b,
+              A,
               []
             );
-            if (n)
+            if (c)
               return {
-                ...n,
-                ...e,
+                ...c,
+                ...t,
                 committed: {
-                  ...n.committed,
-                  ...e.committed
+                  ...c.committed,
+                  ...t.committed
                 },
                 reviewed: {
-                  ...A
+                  ...I
                 },
                 currentFlow: "CREATE"
               };
           }
           return {
-            ...s,
-            ...e,
+            ...n,
+            ...t,
             committed: {
-              ...s.committed,
-              ...e.committed
+              ...n.committed,
+              ...t.committed
             },
-            reviewed: A
+            reviewed: I
           };
         }
-        const { committed: u, reviewed: f, ...L } = s;
+        const { committed: m, reviewed: f, ...L } = n;
         return {
           ...L,
-          ...e,
+          ...t,
           committed: {
-            ...u,
-            ...e.committed
+            ...m,
+            ...t.committed
           },
           reviewed: {}
         };
       });
     },
-    [T, o, c, O, b]
-  ), I = N(() => {
-    if (i) {
-      const { reset: e, rollback: s, isRootNode: S } = i;
+    [T, i, o, O, A]
+  ), w = b(() => {
+    if (s) {
+      const { reset: t, rollback: n, isRootNode: S } = s;
       if (S) {
-        d == null || d();
+        r == null || r();
         return;
       }
-      const u = {
+      const m = {
         committed: {},
         reviewed: {}
       };
-      p.includes(o) ? s.forEach((f) => {
-        u.reviewed[f] = void 0;
-      }) : e.forEach((f) => (u[f] = void 0, !0)), s.forEach((f) => {
-        u.committed[f] = void 0;
-      }), E(u);
+      p.includes(i) ? n.forEach((f) => {
+        m.reviewed[f] = void 0;
+      }) : t.forEach((f) => (m[f] = void 0, !0)), n.forEach((f) => {
+        m.committed[f] = void 0;
+      }), E(m);
     }
-  }, [i, o, E, d]);
-  return { currentStep: i, updateFormData: E, handleBack: I };
+  }, [s, i, E, r]);
+  return { currentStep: s, updateFormData: E, handleBack: w };
 };
 export {
-  $ as useFormDataPrefiller,
-  a as useFormTreeTraversal,
-  x as useMilestoneFormTree
+  a as useFormDataPrefiller,
+  ee as useFormTreeTraversal,
+  D as useMilestoneFormTree,
+  g as useMilestoneInfoTransitionsControl
 };
 //# sourceMappingURL=milestone-create-hooks.js.map

package/dist/features/milestone/create/milestone-create-hooks.js.map

@@ -1 +1 @@
-{"version":3,"file":"milestone-create-hooks.js","sources":["../../../../src/features/milestone/create/milestone-create-hooks.ts"],"sourcesContent":["import type IStudentSchool from '../../../types/models/school';\nimport type {\n  IFormStep,\n  IFormStepProps,\n  IMileStoneFormFields,\n  IMilestoneConfig,\n  IMilestoneFormData,\n  TMilestoneFormStateField,\n  TMilestoneFormFlow,\n} from './milestone-create-types';\n\nimport { useCallback, useMemo, useRef, useState } from 'react';\n\nimport { TEST_TYPE_TO_TEST_NAME } from '../constants';\nimport { checkIfCommittedFieldIsUpdated } from '../edit/goal-edit-helpers';\nimport { BRANCHING_FIELDS, GOAL_EDIT_FLOWS } from './milestone-create-constants';\nimport FORM_TREE, {\n  ADD_CUSTOM_CHAPTERS,\n  CHAPTERS_SELECTION_FORM_TREE,\n  SET_COMPLETION_DATE,\n} from './milestone-create-form-tree';\nimport {\n  appendSchoolDataToFormState,\n  clearNextFields,\n  generateFormStateWithPrefilledSchoolData,\n  getCurrenStep,\n} from './milestone-create-helpers';\n\n//TODO: right now it is for only one step, but should be for all steps in future if needed\nconst useFormDataPrefiller = (\n  formDataProp: IMilestoneFormData | undefined,\n  {\n    schoolData,\n    board,\n    grade,\n    currentCountryCode,\n    flow,\n  }: {\n    grade: string;\n    schoolData: IStudentSchool | undefined;\n    board: string | undefined;\n    config: IMilestoneConfig;\n    flow: TMilestoneFormFlow;\n    currentCountryCode?: string;\n  },\n) => {\n  const [formDataState, setFormData] = useState<IMilestoneFormData>(() => {\n    if (formDataProp && GOAL_EDIT_FLOWS.includes(flow)) {\n      return appendSchoolDataToFormState(formDataProp, schoolData, board, grade);\n    }\n\n    const formStateWithPrefilledSchoolData = generateFormStateWithPrefilledSchoolData(\n      schoolData,\n      board,\n      grade,\n      currentCountryCode,\n    );\n\n    return {\n      ...formStateWithPrefilledSchoolData,\n    };\n  });\n\n  return { formDataState, setFormData };\n};\n\n/**\n * Based on the flow returns the correct modified tree\n */\nconst useMilestoneFormTree = ({\n  flow,\n  formDataState,\n  isGoalCreation,\n}: {\n  flow: TMilestoneFormFlow;\n  formDataState: IMilestoneFormData;\n  isGoalCreation?: boolean;\n}) => {\n  const { testType } = formDataState;\n\n  const updatedFormTree: IFormStep = useMemo(() => {\n    if (GOAL_EDIT_FLOWS.includes(flow) && testType) {\n      const formTreeInfo = {\n        ...CHAPTERS_SELECTION_FORM_TREE,\n        isRootNode: true,\n        title: TEST_TYPE_TO_TEST_NAME[testType],\n      };\n\n      //* Creating a shallow copy as we need to change only first level element.\n      const addCustomChapter = Object.assign({}, ADD_CUSTOM_CHAPTERS);\n      const setCompletionDate = Object.assign({}, SET_COMPLETION_DATE);\n\n      //* To compensate existing milestones chapter addition.\n      if (!isGoalCreation) {\n        addCustomChapter.buttonLabel = 'Add to learning plan';\n        formTreeInfo.buttonLabel = 'Update';\n      }\n\n      if (flow === 'EDIT') {\n        setCompletionDate.buttonLabel = 'Update goal';\n      }\n\n      if (!isGoalCreation || testType === 'no-test') {\n        formTreeInfo.next = [addCustomChapter, setCompletionDate];\n      }\n\n      return formTreeInfo;\n    }\n\n    return FORM_TREE;\n  }, [flow, testType, isGoalCreation]);\n\n  return updatedFormTree;\n};\n\n/**\n * This hook holds the logic to run the traversal of the tree during different flows.\n * While most of the logic is same for all flows, DRAFT_EDIT and DRAFT_REVIEW flows require extra logic where a user can navigate back and forth steps without clearing data.\n * Internally, this hook uses a currentFlow variable which is initially set to the flow but changes to CREATE flow, when certain BRANCHING_FIELDS are edited.\n * BRANCHING_FIELDS are fields on edition of which the flow might change and hence the prefilled data, needs to be cleared.\n * @returns `currentStep` - the current step the tree should be at\n * @returns `updateFormData` - the method to update form data\n * @returns `handleBack` - the method to handle back navigation\n */\nconst useFormTreeTraversal = ({\n  flow,\n  updatedFormTree,\n  formData,\n  formDataState,\n  setFormData,\n  handleExit,\n}: {\n  flow: TMilestoneFormFlow;\n  updatedFormTree: IFormStep;\n  formData: IMilestoneFormData;\n  formDataState: IMilestoneFormData;\n  setFormData: React.Dispatch<React.SetStateAction<IMilestoneFormData>>;\n  handleExit?: () => void;\n}) => {\n  const formDataStateRef = useRef(formDataState);\n  const currentFlow = formData?.currentFlow ?? flow;\n\n  const currentStep = useMemo(\n    () => getCurrenStep(updatedFormTree, formData, currentFlow),\n    [updatedFormTree, formData, currentFlow],\n  );\n\n  const currentStepName = currentStep?.name;\n  const isCurrentStepRoot = Boolean(currentStep?.isRootNode);\n\n  const updateFormData = useCallback<IFormStepProps['onFormDataChange']>(\n    changedFormData => {\n      setFormData(prevFormData => {\n        const currentTestType = prevFormData.testType;\n\n        if (GOAL_EDIT_FLOWS.includes(currentFlow)) {\n          const updatedReviewed = {\n            ...prevFormData.committed,\n            ...changedFormData.committed,\n          };\n          const updatedFields: TMilestoneFormStateField[] = [];\n\n          Object.entries(changedFormData?.committed || {}).forEach(entry => {\n            const field = entry[0] as keyof IMileStoneFormFields;\n            const isFieldCommited = Boolean(entry[1]);\n            const newValueOfField = changedFormData[field] ?? prevFormData[field];\n\n            const isFieldUpdatedAndCommitted = checkIfCommittedFieldIsUpdated({\n              field,\n              isFieldCommited,\n              prevFormData,\n              newValueOfField,\n              formDataStateRef: formDataStateRef.current,\n            });\n\n            if (isFieldUpdatedAndCommitted) {\n              let exceptedFields: TMilestoneFormStateField[] = [];\n\n              if (currentTestType && currentTestType === 'no-test') {\n                exceptedFields = exceptedFields.concat(['board']);\n              }\n\n              if (!exceptedFields.includes(field)) {\n                updatedFields.push(field);\n              }\n            }\n          });\n\n          if (updatedFields.length > 0) {\n            const isBranchingFieldUpdated = updatedFields.some(field => {\n              return BRANCHING_FIELDS.includes(field);\n            });\n\n            if (isBranchingFieldUpdated) {\n              const updatedTree = clearNextFields(\n                updatedFormTree,\n                prevFormData,\n                currentStepName,\n                isCurrentStepRoot,\n                [],\n              );\n\n              if (updatedTree)\n                return {\n                  ...updatedTree,\n                  ...changedFormData,\n                  committed: {\n                    ...updatedTree.committed,\n                    ...changedFormData.committed,\n                  },\n                  reviewed: {\n                    ...updatedReviewed,\n                  },\n                  currentFlow: 'CREATE',\n                };\n            }\n          }\n\n          return {\n            ...prevFormData,\n            ...changedFormData,\n            committed: {\n              ...prevFormData.committed,\n              ...changedFormData.committed,\n            },\n            reviewed: updatedReviewed,\n          };\n        }\n\n        const { committed: prevFormCommitted, reviewed, ...fieldsData } = prevFormData;\n\n        return {\n          ...fieldsData,\n          ...changedFormData,\n          committed: {\n            ...prevFormCommitted,\n            ...changedFormData.committed,\n          },\n          reviewed: {},\n        };\n      });\n    },\n    [setFormData, currentFlow, updatedFormTree, currentStepName, isCurrentStepRoot],\n  );\n\n  const handleBack = useCallback(() => {\n    if (currentStep) {\n      const { reset, rollback, isRootNode } = currentStep;\n\n      if (isRootNode) {\n        handleExit?.();\n\n        return;\n      }\n\n      const data: IMilestoneFormData = {\n        committed: {},\n        reviewed: {},\n      };\n\n      if (!GOAL_EDIT_FLOWS.includes(currentFlow)) {\n        reset.forEach(field => {\n          data[field] = undefined;\n\n          return true;\n        });\n      } else {\n        rollback.forEach(field => {\n          data.reviewed[field] = undefined;\n        });\n      }\n      rollback.forEach(field => {\n        data.committed[field] = undefined;\n      });\n\n      updateFormData(data);\n    }\n  }, [currentStep, currentFlow, updateFormData, handleExit]);\n\n  return { currentStep, updateFormData, handleBack };\n};\n\nexport { useFormDataPrefiller, useFormTreeTraversal, useMilestoneFormTree };\n"],"names":["useFormDataPrefiller","formDataProp","schoolData","board","grade","currentCountryCode","flow","formDataState","setFormData","useState","GOAL_EDIT_FLOWS","appendSchoolDataToFormState","generateFormStateWithPrefilledSchoolData","useMilestoneFormTree","isGoalCreation","testType","useMemo","formTreeInfo","CHAPTERS_SELECTION_FORM_TREE","TEST_TYPE_TO_TEST_NAME","addCustomChapter","ADD_CUSTOM_CHAPTERS","setCompletionDate","SET_COMPLETION_DATE","FORM_TREE","useFormTreeTraversal","updatedFormTree","formData","handleExit","formDataStateRef","useRef","currentFlow","currentStep","getCurrenStep","currentStepName","isCurrentStepRoot","updateFormData","useCallback","changedFormData","prevFormData","currentTestType","updatedReviewed","updatedFields","entry","field","isFieldCommited","newValueOfField","checkIfCommittedFieldIsUpdated","exceptedFields","BRANCHING_FIELDS","updatedTree","clearNextFields","prevFormCommitted","reviewed","fieldsData","handleBack","reset","rollback","isRootNode","data"],"mappings":"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"}
+{"version":3,"file":"milestone-create-hooks.js","sources":["../../../../src/features/milestone/create/milestone-create-hooks.ts"],"sourcesContent":["import type IStudentSchool from '../../../types/models/school';\nimport type { IStudentJourneyData } from '../../notifications/types';\nimport type { TUserTypes } from '../../ui/types';\nimport type {\n  IFormStep,\n  IFormStepProps,\n  IMileStoneFormFields,\n  IMilestoneConfig,\n  IMilestoneFormData,\n  TMilesonteFormStateField,\n  TMilestoneFormFlow,\n} from './milestone-create-types';\n\nimport { useCallback, useMemo, useRef, useState } from 'react';\n\nimport useStudentJourneys from '../../notifications/use-student-journey';\nimport { TEST_TYPE_TO_TEST_NAME } from '../constants';\nimport { checkIfCommittedFieldIsUpdated } from '../edit/goal-edit-helpers';\nimport { BRANCHING_FIELDS, GOAL_EDIT_FLOWS } from './milestone-create-constants';\nimport FORM_TREE, {\n  ADD_CUSTOM_CHAPTERS,\n  CHAPTERS_SELECTION_FORM_TREE,\n  SET_COMPLETION_DATE,\n} from './milestone-create-form-tree';\nimport {\n  appendSchoolDataToFormState,\n  clearNextFields,\n  generateFormStateWithPrefilledSchoolData,\n  getCurrenStep,\n} from './milestone-create-helpers';\n\n//TODO: right now it is for only one step, but should be for all steps in future if needed\nconst useFormDataPrefiller = (\n  formDataProp: IMilestoneFormData | undefined,\n  {\n    schoolData,\n    board,\n    grade,\n    currentCountryCode,\n    flow,\n  }: {\n    grade: string;\n    schoolData: IStudentSchool | undefined;\n    board: string | undefined;\n    config: IMilestoneConfig;\n    journeysToInclude: IStudentJourneyData[];\n    flow: TMilestoneFormFlow;\n    currentCountryCode?: string;\n  },\n) => {\n  const [formDataState, setFormData] = useState<IMilestoneFormData>(() => {\n    if (formDataProp && GOAL_EDIT_FLOWS.includes(flow)) {\n      return appendSchoolDataToFormState(formDataProp, schoolData, board, grade);\n    }\n\n    const formStateWithPrefilledSchoolData = generateFormStateWithPrefilledSchoolData(\n      schoolData,\n      board,\n      grade,\n      currentCountryCode,\n    );\n\n    return {\n      ...formStateWithPrefilledSchoolData,\n    };\n  });\n\n  return { formDataState, setFormData };\n};\n\nconst useMilestoneInfoTransitionsControl = (userType: TUserTypes, studentId: string | null) => {\n  const journeysToInclude = useStudentJourneys(userType === 'TEACHER' ? studentId : null);\n\n  return journeysToInclude;\n};\n\n/**\n * Based on the flow returns the correct modified tree\n */\nconst useMilestoneFormTree = ({\n  flow,\n  formDataState,\n  isGoalCreation,\n}: {\n  isFirstMilestoneCreated: boolean;\n  flow: TMilestoneFormFlow;\n  formDataState: IMilestoneFormData;\n  isGoalCreation?: boolean;\n}) => {\n  const { testType } = formDataState;\n\n  const updatedFormTree: IFormStep = useMemo(() => {\n    if (GOAL_EDIT_FLOWS.includes(flow) && testType) {\n      const formTreeInfo = {\n        ...CHAPTERS_SELECTION_FORM_TREE,\n        isRootNode: true,\n        title: TEST_TYPE_TO_TEST_NAME[testType],\n      };\n\n      //* Creating a shallow copy as we need to change only first level element.\n      const addCustomChapter = Object.assign({}, ADD_CUSTOM_CHAPTERS);\n      const setCompletionDate = Object.assign({}, SET_COMPLETION_DATE);\n\n      //* To compensate existing milestones chapter addition.\n      if (!isGoalCreation) {\n        addCustomChapter.buttonLabel = 'Add to learning plan';\n        formTreeInfo.buttonLabel = 'Update';\n      }\n\n      if (flow === 'EDIT') {\n        setCompletionDate.buttonLabel = 'Update goal';\n      }\n\n      if (!isGoalCreation || testType === 'no-test') {\n        formTreeInfo.next = [addCustomChapter, setCompletionDate];\n      }\n\n      return formTreeInfo;\n    }\n\n    return FORM_TREE;\n  }, [flow, testType, isGoalCreation]);\n\n  return updatedFormTree;\n};\n\n/**\n * This hook holds the logic to run the traversal of the tree during different flows.\n * While most of the logic is same for all flows, DRAFT_EDIT and DRAFT_REVIEW flows require extra logic where a user can navigate back and forth steps without clearing data.\n * Internally, this hook uses a currentFlow variable which is initially set to the flow but changes to CREATE flow, when certain BRANCHING_FIELDS are edited.\n * BRANCHING_FIELDS are fields on edition of which the flow might change and hence the prefilled data, needs to be cleared.\n * @returns `currentStep` - the current step the tree should be at\n * @returns `updateFormData` - the method to update form data\n * @returns `handleBack` - the method to handle back navigation\n */\nconst useFormTreeTraversal = ({\n  flow,\n  updatedFormTree,\n  formData,\n  formDataState,\n  setFormData,\n  handleExit,\n}: {\n  flow: TMilestoneFormFlow;\n  updatedFormTree: IFormStep;\n  formData: IMilestoneFormData;\n  formDataState: IMilestoneFormData;\n  setFormData: React.Dispatch<React.SetStateAction<IMilestoneFormData>>;\n  handleExit?: () => void;\n}) => {\n  const formDataStateRef = useRef(formDataState);\n  const currentFlow = formData?.currentFlow ?? flow;\n\n  const currentStep = useMemo(\n    () => getCurrenStep(updatedFormTree, formData, currentFlow),\n    [updatedFormTree, formData, currentFlow],\n  );\n\n  const currentStepName = currentStep?.name;\n  const isCurrentStepRoot = Boolean(currentStep?.isRootNode);\n\n  const updateFormData = useCallback<IFormStepProps['onFormDataChange']>(\n    changedFormData => {\n      setFormData(prevFormData => {\n        const currentTestType = prevFormData.testType;\n\n        if (GOAL_EDIT_FLOWS.includes(currentFlow)) {\n          const updatedReviewed = {\n            ...prevFormData.committed,\n            ...changedFormData.committed,\n          };\n          const updatedFields: TMilesonteFormStateField[] = [];\n\n          Object.entries(changedFormData?.committed || {}).forEach(entry => {\n            const field = entry[0] as keyof IMileStoneFormFields;\n            const isFieldCommited = Boolean(entry[1]);\n            const newValueOfField = changedFormData[field] ?? prevFormData[field];\n\n            const isFieldUpdatedAndCommitted = checkIfCommittedFieldIsUpdated({\n              field,\n              isFieldCommited,\n              prevFormData,\n              newValueOfField,\n              formDataStateRef: formDataStateRef.current,\n            });\n\n            if (isFieldUpdatedAndCommitted) {\n              let exceptedFields: TMilesonteFormStateField[] = [];\n\n              if (currentTestType && currentTestType === 'no-test') {\n                exceptedFields = exceptedFields.concat(['board']);\n              }\n\n              if (!exceptedFields.includes(field)) {\n                updatedFields.push(field);\n              }\n            }\n          });\n\n          if (updatedFields.length > 0) {\n            const isBranchingFieldUpdated = updatedFields.some(field => {\n              return BRANCHING_FIELDS.includes(field);\n            });\n\n            if (isBranchingFieldUpdated) {\n              const updatedTree = clearNextFields(\n                updatedFormTree,\n                prevFormData,\n                currentStepName,\n                isCurrentStepRoot,\n                [],\n              );\n\n              if (updatedTree)\n                return {\n                  ...updatedTree,\n                  ...changedFormData,\n                  committed: {\n                    ...updatedTree.committed,\n                    ...changedFormData.committed,\n                  },\n                  reviewed: {\n                    ...updatedReviewed,\n                  },\n                  currentFlow: 'CREATE',\n                };\n            }\n          }\n\n          return {\n            ...prevFormData,\n            ...changedFormData,\n            committed: {\n              ...prevFormData.committed,\n              ...changedFormData.committed,\n            },\n            reviewed: updatedReviewed,\n          };\n        }\n\n        const { committed: prevFormCommitted, reviewed, ...fieldsData } = prevFormData;\n\n        return {\n          ...fieldsData,\n          ...changedFormData,\n          committed: {\n            ...prevFormCommitted,\n            ...changedFormData.committed,\n          },\n          reviewed: {},\n        };\n      });\n    },\n    [setFormData, currentFlow, updatedFormTree, currentStepName, isCurrentStepRoot],\n  );\n\n  const handleBack = useCallback(() => {\n    if (currentStep) {\n      const { reset, rollback, isRootNode } = currentStep;\n\n      if (isRootNode) {\n        handleExit?.();\n\n        return;\n      }\n\n      const data: IMilestoneFormData = {\n        committed: {},\n        reviewed: {},\n      };\n\n      if (!GOAL_EDIT_FLOWS.includes(currentFlow)) {\n        reset.forEach(field => {\n          data[field] = undefined;\n\n          return true;\n        });\n      } else {\n        rollback.forEach(field => {\n          data.reviewed[field] = undefined;\n        });\n      }\n      rollback.forEach(field => {\n        data.committed[field] = undefined;\n      });\n\n      updateFormData(data);\n    }\n  }, [currentStep, currentFlow, updateFormData, handleExit]);\n\n  return { currentStep, updateFormData, handleBack };\n};\n\nexport {\n  useFormDataPrefiller,\n  useFormTreeTraversal,\n  useMilestoneFormTree,\n  useMilestoneInfoTransitionsControl,\n};\n"],"names":["useFormDataPrefiller","formDataProp","schoolData","board","grade","currentCountryCode","flow","formDataState","setFormData","useState","GOAL_EDIT_FLOWS","appendSchoolDataToFormState","generateFormStateWithPrefilledSchoolData","useMilestoneInfoTransitionsControl","userType","studentId","useStudentJourneys","useMilestoneFormTree","isGoalCreation","testType","useMemo","formTreeInfo","CHAPTERS_SELECTION_FORM_TREE","TEST_TYPE_TO_TEST_NAME","addCustomChapter","ADD_CUSTOM_CHAPTERS","setCompletionDate","SET_COMPLETION_DATE","FORM_TREE","useFormTreeTraversal","updatedFormTree","formData","handleExit","formDataStateRef","useRef","currentFlow","currentStep","getCurrenStep","currentStepName","isCurrentStepRoot","updateFormData","useCallback","changedFormData","prevFormData","currentTestType","updatedReviewed","updatedFields","entry","field","isFieldCommited","newValueOfField","checkIfCommittedFieldIsUpdated","exceptedFields","BRANCHING_FIELDS","updatedTree","clearNextFields","prevFormCommitted","reviewed","fieldsData","handleBack","reset","rollback","isRootNode","data"],"mappings":"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"}

package/dist/features/milestone/create/milestone-create-styled.js

@@ -1,12 +1,12 @@
 import r from "styled-components";
 import n from "../../ui/layout/flex-view.js";
-const l = r.div(
-  ({ $height: o, $viewMode: e, $minHeight: t }) => `
+const d = r.div(
+  ({ $height: o, $viewMode: t, $minHeight: e }) => `
   display: flex;
   flex-direction: column;
   height: ${o ? typeof o == "number" ? `${o}px` : `${o}` : "auto"};
-  min-height: ${t || "auto"};
-  ${e ? `
+  min-height: ${e || "auto"};
+  ${t ? `
         cursor: not-allowed;
         border: 2px solid black;
         border-radius: 8px;
@@ -16,8 +16,8 @@ const l = r.div(
         }
       ` : ""}
 `
-), d = r.div(
-  ({ theme: o, $viewMode: e }) => `
+), l = r.div(
+  ({ theme: o, $viewMode: t }) => `
   position: relative;
   display: flex;
   flex-direction: column;
@@ -25,7 +25,7 @@ const l = r.div(
   margin-bottom: ${o.layout.gutter * 0.5}px;
   border: 1px solid ${o.colors.GREY_1};
   border-radius: ${o.layout.gutter * 0.75}px;
-  ${e ? `
+  ${t ? `
         pointer-events: none;
         // opacity:  0.85;
       ` : ""}
@@ -45,25 +45,34 @@ const l = r.div(
       position: fixed;
       bottom: 24px;
       right: 24px;
-    `), x = r.img(({ theme: o, $backgroundColor: e }) => {
+    `);
+r.div(({ theme: o }) => {
+  const { gutter: t } = o.layout;
+  return `
+    position: absolute;
+    top: ${t * 2}px;
+    left: ${t * 1.5}px;
+  `;
+});
+const x = r.img(({ theme: o, $backgroundColor: t }) => {
   const {
-    layout: { gutter: t },
+    layout: { gutter: e },
     colors: i
   } = o;
   return `
-    width: ${t * 6}px;
-    height: ${t * 6}px;
-    background: ${i[e]};
-    border-radius: ${t * 0.5}px;
+    width: ${e * 6}px;
+    height: ${e * 6}px;
+    background: ${i[t]};
+    border-radius: ${e * 0.5}px;
   `;
-}), f = r(n)(({ theme: o, $viewMode: e }) => {
+}), f = r(n)(({ theme: o, $viewMode: t }) => {
   const {
-    layout: { gutter: t }
+    layout: { gutter: e }
   } = o;
   return `
     position:relative;
-    min-height:${t * 2.75}px;
-    ${e ? `
+    min-height:${e * 2.75}px;
+    ${t ? `
           pointer-events: none;
           opacity:  0.85;
         ` : ""}
@@ -72,15 +81,20 @@ const l = r.div(
   position: absolute;
   left: 50%;
   transform: translateX(-50%);
+`, b = r(n)`
+  border-radius: 0 0 8px 8px;
+  margin: auto;
+  width: 328px;
 `;
 export {
-  d as BodyContainer,
-  l as Container,
+  l as BodyContainer,
+  d as Container,
   a as ContentContainer,
   c as FooterWrapper,
   u as HeaderContainer,
   f as HeaderWrapper,
   x as RadioCardIcon,
-  $ as StepperWrapper
+  $ as StepperWrapper,
+  b as SyncIndicator
 };
 //# sourceMappingURL=milestone-create-styled.js.map

package/dist/features/milestone/create/milestone-create-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"milestone-create-styled.js","sources":["../../../../src/features/milestone/create/milestone-create-styled.tsx"],"sourcesContent":["import type { TColorNames } from '../../ui/types';\n\nimport styled from 'styled-components';\n\nimport FlexView from '../../ui/layout/flex-view';\n\ninterface ContainerProps {\n  $height?: string | number;\n  $minHeight?: string;\n  $viewMode: boolean;\n}\n\nconst Container = styled.div<ContainerProps>(\n  ({ $height, $viewMode, $minHeight }) => `\n  display: flex;\n  flex-direction: column;\n  height: ${$height ? (typeof $height === 'number' ? `${$height}px` : `${$height}`) : 'auto'};\n  min-height: ${$minHeight ? $minHeight : 'auto'};\n  ${\n    $viewMode\n      ? `\n        cursor: not-allowed;\n        border: 2px solid black;\n        border-radius: 8px;\n        transform: scale3d(.9943, .9900, 1);\n        & ${ContentContainer} {\n          pointer-events: auto;\n        }\n      `\n      : ``\n  }\n`,\n);\n\nconst BodyContainer = styled.div<{ $viewMode?: boolean }>(\n  ({ theme, $viewMode }) => `\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  margin-bottom: ${theme.layout.gutter * 0.5}px;\n  border: 1px solid ${theme.colors.GREY_1};\n  border-radius: ${theme.layout.gutter * 0.75}px;\n  ${\n    $viewMode\n      ? `\n        pointer-events: none;\n        // opacity:  0.85;\n      `\n      : ``\n  }\n`,\n);\n\ninterface IContentContainer {\n  $overflowHidden?: boolean;\n}\n\nconst ContentContainer = styled.div<IContentContainer>(({ $overflowHidden }) => {\n  return `\n    flex-grow: 1;\n    overflow-y: auto;\n\n    ${$overflowHidden && 'overflow: hidden'};\n  `;\n});\n\nconst HeaderContainer = styled(FlexView)(({ theme }) => {\n  return `\n    position: sticky;\n    top: 0;\n    z-index: 2;\n    border-bottom: 1px solid ${theme.colors.WHITE_5};\n  `;\n});\n\nconst FooterWrapper = styled(FlexView)(() => {\n  return `\n      align-self: flex-end;\n      position: fixed;\n      bottom: 24px;\n      right: 24px;\n    `;\n});\n\ninterface IRadioCardIconProps {\n  $backgroundColor: TColorNames;\n}\n\nconst RadioCardIcon = styled.img<IRadioCardIconProps>(({ theme, $backgroundColor }) => {\n  const {\n    layout: { gutter },\n    colors,\n  } = theme;\n\n  return `\n    width: ${gutter * 6}px;\n    height: ${gutter * 6}px;\n    background: ${colors[$backgroundColor]};\n    border-radius: ${gutter * 0.5}px;\n  `;\n});\n\nconst HeaderWrapper = styled(FlexView)<{ $viewMode?: boolean }>(({ theme, $viewMode }) => {\n  const {\n    layout: { gutter },\n  } = theme;\n\n  return `\n    position:relative;\n    min-height:${gutter * 2.75}px;\n    ${\n      $viewMode\n        ? `\n          pointer-events: none;\n          opacity:  0.85;\n        `\n        : ``\n    }\n`;\n});\n\nconst StepperWrapper = styled.div`\n  position: absolute;\n  left: 50%;\n  transform: translateX(-50%);\n`;\n\nexport {\n  Container,\n  BodyContainer,\n  ContentContainer,\n  HeaderContainer,\n  FooterWrapper,\n  RadioCardIcon,\n  StepperWrapper,\n  HeaderWrapper,\n};\n"],"names":["Container","styled","$height","$viewMode","$minHeight","ContentContainer","BodyContainer","theme","$overflowHidden","HeaderContainer","FlexView","FooterWrapper","RadioCardIcon","$backgroundColor","gutter","colors","HeaderWrapper","StepperWrapper"],"mappings":";;AAYA,MAAMA,IAAYC,EAAO;AAAA,EACvB,CAAC,EAAE,SAAAC,GAAS,WAAAC,GAAW,YAAAC,EAAiB,MAAA;AAAA;AAAA;AAAA,YAG9BF,IAAW,OAAOA,KAAY,WAAW,GAAGA,CAAO,OAAO,GAAGA,CAAO,KAAM,MAAM;AAAA,gBAC5EE,KAA0B,MAAM;AAAA,IAE5CD,IACI;AAAA;AAAA;AAAA;AAAA;AAAA,YAKIE,CAAgB;AAAA;AAAA;AAAA,UAIpB,EACN;AAAA;AAEF,GAEMC,IAAgBL,EAAO;AAAA,EAC3B,CAAC,EAAE,OAAAM,GAAO,WAAAJ,EAAA,MAAgB;AAAA;AAAA;AAAA;AAAA;AAAA,mBAKTI,EAAM,OAAO,SAAS,GAAG;AAAA,sBACtBA,EAAM,OAAO,MAAM;AAAA,mBACtBA,EAAM,OAAO,SAAS,IAAI;AAAA,IAEzCJ,IACI;AAAA;AAAA;AAAA,UAIA,EACN;AAAA;AAEF,GAMME,IAAmBJ,EAAO,IAAuB,CAAC,EAAE,iBAAAO,QACjD;AAAA;AAAA;AAAA;AAAA,MAIHA,KAAmB,kBAAkB;AAAA,GAE1C,GAEKC,IAAkBR,EAAOS,CAAQ,EAAE,CAAC,EAAE,OAAAH,QACnC;AAAA;AAAA;AAAA;AAAA,+BAIsBA,EAAM,OAAO,OAAO;AAAA,GAElD,GAEKI,IAAgBV,EAAOS,CAAQ,EAAE,MAC9B;AAAA;AAAA;AAAA;AAAA;AAAA,KAMR,GAMKE,IAAgBX,EAAO,IAAyB,CAAC,EAAE,OAAAM,GAAO,kBAAAM,QAAuB;AAC/E,QAAA;AAAA,IACJ,QAAQ,EAAE,QAAAC,EAAO;AAAA,IACjB,QAAAC;AAAA,EACE,IAAAR;AAEG,SAAA;AAAA,aACIO,IAAS,CAAC;AAAA,cACTA,IAAS,CAAC;AAAA,kBACNC,EAAOF,CAAgB,CAAC;AAAA,qBACrBC,IAAS,GAAG;AAAA;AAEjC,CAAC,GAEKE,IAAgBf,EAAOS,CAAQ,EAA2B,CAAC,EAAE,OAAAH,GAAO,WAAAJ,QAAgB;AAClF,QAAA;AAAA,IACJ,QAAQ,EAAE,QAAAW,EAAO;AAAA,EACf,IAAAP;AAEG,SAAA;AAAA;AAAA,iBAEQO,IAAS,IAAI;AAAA,MAExBX,IACI;AAAA;AAAA;AAAA,YAIA,EACN;AAAA;AAEJ,CAAC,GAEKc,IAAiBhB,EAAO;AAAA;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"milestone-create-styled.js","sources":["../../../../src/features/milestone/create/milestone-create-styled.tsx"],"sourcesContent":["import type { TColorNames } from '../../ui/types';\n\nimport styled from 'styled-components';\n\nimport FlexView from '../../ui/layout/flex-view';\n\ninterface ContainerProps {\n  $height?: string | number;\n  $minHeight?: string;\n  $viewMode: boolean;\n}\n\nconst Container = styled.div<ContainerProps>(\n  ({ $height, $viewMode, $minHeight }) => `\n  display: flex;\n  flex-direction: column;\n  height: ${$height ? (typeof $height === 'number' ? `${$height}px` : `${$height}`) : 'auto'};\n  min-height: ${$minHeight ? $minHeight : 'auto'};\n  ${\n    $viewMode\n      ? `\n        cursor: not-allowed;\n        border: 2px solid black;\n        border-radius: 8px;\n        transform: scale3d(.9943, .9900, 1);\n        & ${ContentContainer} {\n          pointer-events: auto;\n        }\n      `\n      : ``\n  }\n`,\n);\n\nconst BodyContainer = styled.div<{ $viewMode?: boolean }>(\n  ({ theme, $viewMode }) => `\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  margin-bottom: ${theme.layout.gutter * 0.5}px;\n  border: 1px solid ${theme.colors.GREY_1};\n  border-radius: ${theme.layout.gutter * 0.75}px;\n  ${\n    $viewMode\n      ? `\n        pointer-events: none;\n        // opacity:  0.85;\n      `\n      : ``\n  }\n`,\n);\n\ninterface IContentContainer {\n  $overflowHidden?: boolean;\n}\n\nconst ContentContainer = styled.div<IContentContainer>(({ $overflowHidden }) => {\n  return `\n    flex-grow: 1;\n    overflow-y: auto;\n\n    ${$overflowHidden && 'overflow: hidden'};\n  `;\n});\n\nconst HeaderContainer = styled(FlexView)(({ theme }) => {\n  return `\n    position: sticky;\n    top: 0;\n    z-index: 2;\n    border-bottom: 1px solid ${theme.colors.WHITE_5};\n  `;\n});\n\nconst FooterWrapper = styled(FlexView)(() => {\n  return `\n      align-self: flex-end;\n      position: fixed;\n      bottom: 24px;\n      right: 24px;\n    `;\n});\n\nconst BackButtonWrapper = styled.div(({ theme }) => {\n  const { gutter } = theme.layout;\n\n  return `\n    position: absolute;\n    top: ${gutter * 2}px;\n    left: ${gutter * 1.5}px;\n  `;\n});\n\ninterface IRadioCardIconProps {\n  $backgroundColor: TColorNames;\n}\n\nconst RadioCardIcon = styled.img<IRadioCardIconProps>(({ theme, $backgroundColor }) => {\n  const {\n    layout: { gutter },\n    colors,\n  } = theme;\n\n  return `\n    width: ${gutter * 6}px;\n    height: ${gutter * 6}px;\n    background: ${colors[$backgroundColor]};\n    border-radius: ${gutter * 0.5}px;\n  `;\n});\n\nconst HeaderWrapper = styled(FlexView)<{ $viewMode?: boolean }>(({ theme, $viewMode }) => {\n  const {\n    layout: { gutter },\n  } = theme;\n\n  return `\n    position:relative;\n    min-height:${gutter * 2.75}px;\n    ${\n      $viewMode\n        ? `\n          pointer-events: none;\n          opacity:  0.85;\n        `\n        : ``\n    }\n`;\n});\n\nconst StepperWrapper = styled.div`\n  position: absolute;\n  left: 50%;\n  transform: translateX(-50%);\n`;\n\nconst SyncIndicator = styled(FlexView)`\n  border-radius: 0 0 8px 8px;\n  margin: auto;\n  width: 328px;\n`;\n\nexport {\n  Container,\n  BodyContainer,\n  ContentContainer,\n  HeaderContainer,\n  FooterWrapper,\n  BackButtonWrapper,\n  RadioCardIcon,\n  StepperWrapper,\n  HeaderWrapper,\n  SyncIndicator,\n};\n"],"names":["Container","styled","$height","$viewMode","$minHeight","ContentContainer","BodyContainer","theme","$overflowHidden","HeaderContainer","FlexView","FooterWrapper","gutter","RadioCardIcon","$backgroundColor","colors","HeaderWrapper","StepperWrapper","SyncIndicator"],"mappings":";;AAYA,MAAMA,IAAYC,EAAO;AAAA,EACvB,CAAC,EAAE,SAAAC,GAAS,WAAAC,GAAW,YAAAC,EAAiB,MAAA;AAAA;AAAA;AAAA,YAG9BF,IAAW,OAAOA,KAAY,WAAW,GAAGA,CAAO,OAAO,GAAGA,CAAO,KAAM,MAAM;AAAA,gBAC5EE,KAA0B,MAAM;AAAA,IAE5CD,IACI;AAAA;AAAA;AAAA;AAAA;AAAA,YAKIE,CAAgB;AAAA;AAAA;AAAA,UAIpB,EACN;AAAA;AAEF,GAEMC,IAAgBL,EAAO;AAAA,EAC3B,CAAC,EAAE,OAAAM,GAAO,WAAAJ,EAAA,MAAgB;AAAA;AAAA;AAAA;AAAA;AAAA,mBAKTI,EAAM,OAAO,SAAS,GAAG;AAAA,sBACtBA,EAAM,OAAO,MAAM;AAAA,mBACtBA,EAAM,OAAO,SAAS,IAAI;AAAA,IAEzCJ,IACI;AAAA;AAAA;AAAA,UAIA,EACN;AAAA;AAEF,GAMME,IAAmBJ,EAAO,IAAuB,CAAC,EAAE,iBAAAO,QACjD;AAAA;AAAA;AAAA;AAAA,MAIHA,KAAmB,kBAAkB;AAAA,GAE1C,GAEKC,IAAkBR,EAAOS,CAAQ,EAAE,CAAC,EAAE,OAAAH,QACnC;AAAA;AAAA;AAAA;AAAA,+BAIsBA,EAAM,OAAO,OAAO;AAAA,GAElD,GAEKI,IAAgBV,EAAOS,CAAQ,EAAE,MAC9B;AAAA;AAAA;AAAA;AAAA;AAAA,KAMR;AAEyBT,EAAO,IAAI,CAAC,EAAE,OAAAM,QAAY;AAC5C,QAAA,EAAE,QAAAK,EAAO,IAAIL,EAAM;AAElB,SAAA;AAAA;AAAA,WAEEK,IAAS,CAAC;AAAA,YACTA,IAAS,GAAG;AAAA;AAExB,CAAC;AAMD,MAAMC,IAAgBZ,EAAO,IAAyB,CAAC,EAAE,OAAAM,GAAO,kBAAAO,QAAuB;AAC/E,QAAA;AAAA,IACJ,QAAQ,EAAE,QAAAF,EAAO;AAAA,IACjB,QAAAG;AAAA,EACE,IAAAR;AAEG,SAAA;AAAA,aACIK,IAAS,CAAC;AAAA,cACTA,IAAS,CAAC;AAAA,kBACNG,EAAOD,CAAgB,CAAC;AAAA,qBACrBF,IAAS,GAAG;AAAA;AAEjC,CAAC,GAEKI,IAAgBf,EAAOS,CAAQ,EAA2B,CAAC,EAAE,OAAAH,GAAO,WAAAJ,QAAgB;AAClF,QAAA;AAAA,IACJ,QAAQ,EAAE,QAAAS,EAAO;AAAA,EACf,IAAAL;AAEG,SAAA;AAAA;AAAA,iBAEQK,IAAS,IAAI;AAAA,MAExBT,IACI;AAAA;AAAA;AAAA,YAIA,EACN;AAAA;AAEJ,CAAC,GAEKc,IAAiBhB,EAAO;AAAA;AAAA;AAAA;AAAA,GAMxBiB,IAAgBjB,EAAOS,CAAQ;AAAA;AAAA;AAAA;AAAA;"}

package/dist/features/milestone/create/milestone-create.js

@@ -1,74 +1,93 @@
-import { jsx as r } from "react/jsx-runtime";
-import { memo as H, useMemo as R, useEffect as q } from "react";
-import y from "./milestone-create-components-map.js";
-import z from "./milestone-create-context.js";
-import { useFormDataPrefiller as A, useMilestoneFormTree as I, useFormTreeTraversal as J } from "./milestone-create-hooks.js";
-import { Container as K, BodyContainer as L } from "./milestone-create-styled.js";
-const Y = H(
+import { jsx as r, jsxs as I } from "react/jsx-runtime";
+import { memo as V, useMemo as Y, useEffect as H } from "react";
+import K from "../../ui/text/text.js";
+import N from "./milestone-create-components-map.js";
+import O from "./milestone-create-context.js";
+import { useFormDataPrefiller as R, useMilestoneFormTree as U, useFormTreeTraversal as W } from "./milestone-create-hooks.js";
+import { Container as _, SyncIndicator as q, BodyContainer as z } from "./milestone-create-styled.js";
+const re = V(
   ({
-    studentName: M,
-    studentId: l,
+    studentName: $,
+    studentId: v,
     height: x,
-    minHeight: S,
-    formData: n,
-    config: a,
+    minHeight: M,
+    formData: m,
+    config: c,
     onChapterExitWarning: h,
     onFormDataChange: e,
-    onPreSubmit: $,
-    onExit: C,
-    board: F,
-    schoolData: P,
-    grade: T,
+    onPreSubmit: S,
+    onExit: T,
+    userType: C,
+    board: b,
+    schoolData: w,
+    grade: y,
+    journeysToInclude: D = [],
+    isFirstMilestoneCreated: E = !0,
     flow: t,
-    milestoneId: b,
+    milestoneId: j,
     currentCountryCode: B,
-    isGoalCreation: c,
-    courseStream: D,
-    classRatio: E,
+    isGoalCreation: a,
+    courseStream: F,
+    classRatio: L,
     enrollmentType: d
   }) => {
-    const { formDataState: i, setFormData: V } = A(n, {
-      schoolData: P,
-      board: F,
-      grade: T,
-      config: a,
+    const { formDataState: i, setFormData: P } = R(m, {
+      schoolData: w,
+      board: b,
+      grade: y,
+      config: c,
+      journeysToInclude: D,
       flow: t,
       currentCountryCode: B
-    }), j = I({
+    }), g = U({
+      isFirstMilestoneCreated: E,
       flow: t,
       formDataState: i,
-      isGoalCreation: c
-    }), o = e ? i : n, m = e ? "edit" : "view", u = m === "view", { currentStep: s, updateFormData: k, handleBack: p } = J({
+      isGoalCreation: a
+    }), o = e ? i : m, n = e ? "edit" : "view", u = n === "view", { currentStep: s, updateFormData: k, handleBack: p } = W({
       flow: t,
-      updatedFormTree: j,
+      updatedFormTree: g,
       formData: o,
       formDataState: i,
-      setFormData: V,
-      handleExit: C
-    }), { name: v } = s || {}, f = v ? y[v] : void 0, w = R(() => ({ handleBack: p, mode: m, flow: t }), [p, m, t]);
-    return q(() => {
+      setFormData: P,
+      handleExit: T
+    }), { name: l } = s || {}, f = l ? N[l] : void 0, A = Y(() => ({ handleBack: p, mode: n, flow: t }), [p, n, t]);
+    return H(() => {
       e && e(o);
-    }, [o, e]), /* @__PURE__ */ r(z.Provider, { value: w, children: /* @__PURE__ */ r(K, { $height: x, $minHeight: S, $viewMode: u, children: /* @__PURE__ */ r(L, { $viewMode: u, children: f && s && d ? /* @__PURE__ */ r(
-      f,
-      {
-        studentName: M,
-        currentStep: s,
-        isGoalCreation: c,
-        config: a,
-        formData: o,
-        onFormDataChange: k,
-        onChapterExitWarning: h,
-        studentId: l,
-        onPreSubmit: $,
-        milestoneId: b,
-        courseStream: D,
-        classRatio: E || 0,
-        enrollmentType: d
-      }
-    ) : void 0 }) }) });
+    }, [o, e]), /* @__PURE__ */ r(O.Provider, { value: A, children: /* @__PURE__ */ I(_, { $height: x, $minHeight: M, $viewMode: u, children: [
+      C === "STUDENT" && /* @__PURE__ */ r(
+        q,
+        {
+          $gutter: 16,
+          $flexDirection: "row",
+          $alignItems: "center",
+          $background: "BLACK",
+          $justifyContent: "center",
+          children: /* @__PURE__ */ r(K, { $color: "YELLOW_4", $renderAs: "eyebrow2", children: "You are viewing your teacher’s screen" })
+        }
+      ),
+      /* @__PURE__ */ r(z, { $viewMode: u, children: f && s && d ? /* @__PURE__ */ r(
+        f,
+        {
+          studentName: $,
+          currentStep: s,
+          isGoalCreation: a,
+          config: c,
+          formData: o,
+          onFormDataChange: k,
+          onChapterExitWarning: h,
+          studentId: v,
+          onPreSubmit: S,
+          milestoneId: j,
+          courseStream: F,
+          classRatio: L || 0,
+          enrollmentType: d
+        }
+      ) : void 0 })
+    ] }) });
   }
 );
 export {
-  Y as default
+  re as default
 };
 //# sourceMappingURL=milestone-create.js.map

package/dist/features/milestone/create/milestone-create.js.map

@@ -1 +1 @@
-{"version":3,"file":"milestone-create.js","sources":["../../../../src/features/milestone/create/milestone-create.tsx"],"sourcesContent":["import type { MileStoneJourneyMode } from './milestone-create-context';\nimport type { IMileStoneCreateProps, IMilestoneFormData } from './milestone-create-types';\n\nimport React, { memo, useEffect, useMemo } from 'react';\n\nimport ComponentsMap from './milestone-create-components-map';\nimport MilestoneCreateContext from './milestone-create-context';\nimport {\n  useFormDataPrefiller,\n  useFormTreeTraversal,\n  useMilestoneFormTree,\n} from './milestone-create-hooks';\nimport { BodyContainer, Container } from './milestone-create-styled';\n\nconst MilestoneCreate: React.FC<IMileStoneCreateProps> = memo(\n  ({\n    studentName,\n    studentId,\n    height,\n    minHeight,\n    formData: formDataProp,\n    config,\n    onChapterExitWarning,\n    onFormDataChange,\n    onPreSubmit: handlePreSubmit,\n    onExit: handleExit,\n    board,\n    schoolData,\n    grade,\n    flow,\n    milestoneId,\n    currentCountryCode,\n    isGoalCreation,\n    courseStream,\n    classRatio,\n    enrollmentType,\n  }) => {\n    const { formDataState, setFormData } = useFormDataPrefiller(formDataProp, {\n      schoolData,\n      board,\n      grade,\n      config,\n      flow,\n      currentCountryCode,\n    });\n\n    const updatedFormTree = useMilestoneFormTree({\n      flow,\n      formDataState,\n      isGoalCreation,\n    });\n\n    const formData = (onFormDataChange ? formDataState : formDataProp) as IMilestoneFormData; //TODO: make better\n\n    const mode: MileStoneJourneyMode = onFormDataChange ? 'edit' : 'view';\n    const isViewMode = mode === 'view';\n\n    const { currentStep, updateFormData, handleBack } = useFormTreeTraversal({\n      flow,\n      updatedFormTree,\n      formData,\n      formDataState,\n      setFormData,\n      handleExit,\n    });\n\n    const { name } = currentStep || {};\n    const StepComponent = name ? ComponentsMap[name] : undefined;\n\n    const contextValue = useMemo(() => ({ handleBack, mode, flow }), [handleBack, mode, flow]);\n\n    useEffect(() => {\n      if (onFormDataChange) {\n        onFormDataChange(formData);\n      }\n    }, [formData, onFormDataChange]);\n\n    return (\n      <MilestoneCreateContext.Provider value={contextValue}>\n        <Container $height={height} $minHeight={minHeight} $viewMode={isViewMode}>\n          <BodyContainer $viewMode={isViewMode}>\n            {StepComponent && currentStep && enrollmentType ? (\n              <StepComponent\n                studentName={studentName}\n                currentStep={currentStep}\n                isGoalCreation={isGoalCreation}\n                config={config}\n                formData={formData}\n                onFormDataChange={updateFormData}\n                onChapterExitWarning={onChapterExitWarning}\n                studentId={studentId}\n                onPreSubmit={handlePreSubmit}\n                milestoneId={milestoneId}\n                courseStream={courseStream}\n                classRatio={classRatio || 0}\n                enrollmentType={enrollmentType}\n              />\n            ) : undefined}\n          </BodyContainer>\n        </Container>\n      </MilestoneCreateContext.Provider>\n    );\n  },\n);\n\nexport default MilestoneCreate;\n"],"names":["MilestoneCreate","memo","studentName","studentId","height","minHeight","formDataProp","config","onChapterExitWarning","onFormDataChange","handlePreSubmit","handleExit","board","schoolData","grade","flow","milestoneId","currentCountryCode","isGoalCreation","courseStream","classRatio","enrollmentType","formDataState","setFormData","useFormDataPrefiller","updatedFormTree","useMilestoneFormTree","formData","mode","isViewMode","currentStep","updateFormData","handleBack","useFormTreeTraversal","name","StepComponent","ComponentsMap","contextValue","useMemo","useEffect","jsx","MilestoneCreateContext","Container","BodyContainer"],"mappings":";;;;;;AAcA,MAAMA,IAAmDC;AAAA,EACvD,CAAC;AAAA,IACC,aAAAC;AAAA,IACA,WAAAC;AAAA,IACA,QAAAC;AAAA,IACA,WAAAC;AAAA,IACA,UAAUC;AAAA,IACV,QAAAC;AAAA,IACA,sBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,aAAaC;AAAA,IACb,QAAQC;AAAA,IACR,OAAAC;AAAA,IACA,YAAAC;AAAA,IACA,OAAAC;AAAA,IACA,MAAAC;AAAA,IACA,aAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,cAAAC;AAAA,IACA,YAAAC;AAAA,IACA,gBAAAC;AAAA,EAAA,MACI;AACJ,UAAM,EAAE,eAAAC,GAAe,aAAAC,MAAgBC,EAAqBlB,GAAc;AAAA,MACxE,YAAAO;AAAA,MACA,OAAAD;AAAA,MACA,OAAAE;AAAA,MACA,QAAAP;AAAA,MACA,MAAAQ;AAAA,MACA,oBAAAE;AAAA,IAAA,CACD,GAEKQ,IAAkBC,EAAqB;AAAA,MAC3C,MAAAX;AAAA,MACA,eAAAO;AAAA,MACA,gBAAAJ;AAAA,IAAA,CACD,GAEKS,IAAYlB,IAAmBa,IAAgBhB,GAE/CsB,IAA6BnB,IAAmB,SAAS,QACzDoB,IAAaD,MAAS,QAEtB,EAAE,aAAAE,GAAa,gBAAAC,GAAgB,YAAAC,EAAA,IAAeC,EAAqB;AAAA,MACvE,MAAAlB;AAAA,MACA,iBAAAU;AAAA,MACA,UAAAE;AAAA,MACA,eAAAL;AAAA,MACA,aAAAC;AAAA,MACA,YAAAZ;AAAA,IAAA,CACD,GAEK,EAAE,MAAAuB,EAAA,IAASJ,KAAe,IAC1BK,IAAgBD,IAAOE,EAAcF,CAAI,IAAI,QAE7CG,IAAeC,EAAQ,OAAO,EAAE,YAAAN,GAAY,MAAAJ,GAAM,MAAAb,EAAK,IAAI,CAACiB,GAAYJ,GAAMb,CAAI,CAAC;AAEzF,WAAAwB,EAAU,MAAM;AACd,MAAI9B,KACFA,EAAiBkB,CAAQ;AAAA,IAC3B,GACC,CAACA,GAAUlB,CAAgB,CAAC,GAG7B,gBAAA+B,EAACC,EAAuB,UAAvB,EAAgC,OAAOJ,GACtC,UAAA,gBAAAG,EAACE,KAAU,SAAStC,GAAQ,YAAYC,GAAW,WAAWwB,GAC5D,UAAC,gBAAAW,EAAAG,GAAA,EAAc,WAAWd,GACvB,UAAAM,KAAiBL,KAAeT,IAC/B,gBAAAmB;AAAA,MAACL;AAAA,MAAA;AAAA,QACC,aAAAjC;AAAA,QACA,aAAA4B;AAAA,QACA,gBAAAZ;AAAA,QACA,QAAAX;AAAA,QACA,UAAAoB;AAAA,QACA,kBAAkBI;AAAA,QAClB,sBAAAvB;AAAA,QACA,WAAAL;AAAA,QACA,aAAaO;AAAA,QACb,aAAAM;AAAA,QACA,cAAAG;AAAA,QACA,YAAYC,KAAc;AAAA,QAC1B,gBAAAC;AAAA,MAAA;AAAA,IACF,IACE,OACN,CAAA,EACF,CAAA,EACF,CAAA;AAAA,EAEJ;AACF;"}
+{"version":3,"file":"milestone-create.js","sources":["../../../../src/features/milestone/create/milestone-create.tsx"],"sourcesContent":["import type { MileStoneJourneyMode } from './milestone-create-context';\nimport type { IMileStoneCreateProps, IMilestoneFormData } from './milestone-create-types';\n\nimport React, { memo, useEffect, useMemo } from 'react';\n\nimport Text from '../../ui/text/text';\nimport ComponentsMap from './milestone-create-components-map';\nimport MilestoneCreateContext from './milestone-create-context';\nimport {\n  useFormDataPrefiller,\n  useFormTreeTraversal,\n  useMilestoneFormTree,\n} from './milestone-create-hooks';\nimport { BodyContainer, Container, SyncIndicator } from './milestone-create-styled';\n\nconst MilestoneCreate: React.FC<IMileStoneCreateProps> = memo(\n  ({\n    studentName,\n    studentId,\n    height,\n    minHeight,\n    formData: formDataProp,\n    config,\n    onChapterExitWarning,\n    onFormDataChange,\n    onPreSubmit: handlePreSubmit,\n    onExit: handleExit,\n    userType,\n    board,\n    schoolData,\n    grade,\n    journeysToInclude = [],\n    isFirstMilestoneCreated = true,\n    flow,\n    milestoneId,\n    currentCountryCode,\n    isGoalCreation,\n    courseStream,\n    classRatio,\n    enrollmentType,\n  }) => {\n    const { formDataState, setFormData } = useFormDataPrefiller(formDataProp, {\n      schoolData,\n      board,\n      grade,\n      config,\n      journeysToInclude,\n      flow,\n      currentCountryCode,\n    });\n\n    const updatedFormTree = useMilestoneFormTree({\n      isFirstMilestoneCreated,\n      flow,\n      formDataState,\n      isGoalCreation,\n    });\n\n    const formData = (onFormDataChange ? formDataState : formDataProp) as IMilestoneFormData; //TODO: make better\n\n    const mode: MileStoneJourneyMode = onFormDataChange ? 'edit' : 'view';\n    const isViewMode = mode === 'view';\n\n    const { currentStep, updateFormData, handleBack } = useFormTreeTraversal({\n      flow,\n      updatedFormTree,\n      formData,\n      formDataState,\n      setFormData,\n      handleExit,\n    });\n\n    const { name } = currentStep || {};\n    const StepComponent = name ? ComponentsMap[name] : undefined;\n\n    const contextValue = useMemo(() => ({ handleBack, mode, flow }), [handleBack, mode, flow]);\n\n    useEffect(() => {\n      if (onFormDataChange) {\n        onFormDataChange(formData);\n      }\n    }, [formData, onFormDataChange]);\n\n    return (\n      <MilestoneCreateContext.Provider value={contextValue}>\n        <Container $height={height} $minHeight={minHeight} $viewMode={isViewMode}>\n          {userType === 'STUDENT' && (\n            <SyncIndicator\n              $gutter={16}\n              $flexDirection=\"row\"\n              $alignItems=\"center\"\n              $background=\"BLACK\"\n              $justifyContent=\"center\"\n            >\n              <Text $color=\"YELLOW_4\" $renderAs=\"eyebrow2\">\n                You are viewing your teacher’s screen\n              </Text>\n            </SyncIndicator>\n          )}\n\n          <BodyContainer $viewMode={isViewMode}>\n            {StepComponent && currentStep && enrollmentType ? (\n              <StepComponent\n                studentName={studentName}\n                currentStep={currentStep}\n                isGoalCreation={isGoalCreation}\n                config={config}\n                formData={formData}\n                onFormDataChange={updateFormData}\n                onChapterExitWarning={onChapterExitWarning}\n                studentId={studentId}\n                onPreSubmit={handlePreSubmit}\n                milestoneId={milestoneId}\n                courseStream={courseStream}\n                classRatio={classRatio || 0}\n                enrollmentType={enrollmentType}\n              />\n            ) : undefined}\n          </BodyContainer>\n        </Container>\n      </MilestoneCreateContext.Provider>\n    );\n  },\n);\n\nexport default MilestoneCreate;\n"],"names":["MilestoneCreate","memo","studentName","studentId","height","minHeight","formDataProp","config","onChapterExitWarning","onFormDataChange","handlePreSubmit","handleExit","userType","board","schoolData","grade","journeysToInclude","isFirstMilestoneCreated","flow","milestoneId","currentCountryCode","isGoalCreation","courseStream","classRatio","enrollmentType","formDataState","setFormData","useFormDataPrefiller","updatedFormTree","useMilestoneFormTree","formData","mode","isViewMode","currentStep","updateFormData","handleBack","useFormTreeTraversal","name","StepComponent","ComponentsMap","contextValue","useMemo","useEffect","jsx","MilestoneCreateContext","jsxs","Container","SyncIndicator","Text","BodyContainer"],"mappings":";;;;;;;AAeA,MAAMA,KAAmDC;AAAA,EACvD,CAAC;AAAA,IACC,aAAAC;AAAA,IACA,WAAAC;AAAA,IACA,QAAAC;AAAA,IACA,WAAAC;AAAA,IACA,UAAUC;AAAA,IACV,QAAAC;AAAA,IACA,sBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,aAAaC;AAAA,IACb,QAAQC;AAAA,IACR,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,YAAAC;AAAA,IACA,OAAAC;AAAA,IACA,mBAAAC,IAAoB,CAAC;AAAA,IACrB,yBAAAC,IAA0B;AAAA,IAC1B,MAAAC;AAAA,IACA,aAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,cAAAC;AAAA,IACA,YAAAC;AAAA,IACA,gBAAAC;AAAA,EAAA,MACI;AACJ,UAAM,EAAE,eAAAC,GAAe,aAAAC,MAAgBC,EAAqBrB,GAAc;AAAA,MACxE,YAAAQ;AAAA,MACA,OAAAD;AAAA,MACA,OAAAE;AAAA,MACA,QAAAR;AAAA,MACA,mBAAAS;AAAA,MACA,MAAAE;AAAA,MACA,oBAAAE;AAAA,IAAA,CACD,GAEKQ,IAAkBC,EAAqB;AAAA,MAC3C,yBAAAZ;AAAA,MACA,MAAAC;AAAA,MACA,eAAAO;AAAA,MACA,gBAAAJ;AAAA,IAAA,CACD,GAEKS,IAAYrB,IAAmBgB,IAAgBnB,GAE/CyB,IAA6BtB,IAAmB,SAAS,QACzDuB,IAAaD,MAAS,QAEtB,EAAE,aAAAE,GAAa,gBAAAC,GAAgB,YAAAC,EAAA,IAAeC,EAAqB;AAAA,MACvE,MAAAlB;AAAA,MACA,iBAAAU;AAAA,MACA,UAAAE;AAAA,MACA,eAAAL;AAAA,MACA,aAAAC;AAAA,MACA,YAAAf;AAAA,IAAA,CACD,GAEK,EAAE,MAAA0B,EAAA,IAASJ,KAAe,IAC1BK,IAAgBD,IAAOE,EAAcF,CAAI,IAAI,QAE7CG,IAAeC,EAAQ,OAAO,EAAE,YAAAN,GAAY,MAAAJ,GAAM,MAAAb,EAAK,IAAI,CAACiB,GAAYJ,GAAMb,CAAI,CAAC;AAEzF,WAAAwB,EAAU,MAAM;AACd,MAAIjC,KACFA,EAAiBqB,CAAQ;AAAA,IAC3B,GACC,CAACA,GAAUrB,CAAgB,CAAC,GAG5B,gBAAAkC,EAAAC,EAAuB,UAAvB,EAAgC,OAAOJ,GACtC,UAAC,gBAAAK,EAAAC,GAAA,EAAU,SAAS1C,GAAQ,YAAYC,GAAW,WAAW2B,GAC3D,UAAA;AAAA,MAAApB,MAAa,aACZ,gBAAA+B;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,SAAS;AAAA,UACT,gBAAe;AAAA,UACf,aAAY;AAAA,UACZ,aAAY;AAAA,UACZ,iBAAgB;AAAA,UAEhB,4BAACC,GAAK,EAAA,QAAO,YAAW,WAAU,YAAW,UAE7C,yCAAA;AAAA,QAAA;AAAA,MACF;AAAA,wBAGDC,GAAc,EAAA,WAAWjB,GACvB,UAAAM,KAAiBL,KAAeT,IAC/B,gBAAAmB;AAAA,QAACL;AAAA,QAAA;AAAA,UACC,aAAApC;AAAA,UACA,aAAA+B;AAAA,UACA,gBAAAZ;AAAA,UACA,QAAAd;AAAA,UACA,UAAAuB;AAAA,UACA,kBAAkBI;AAAA,UAClB,sBAAA1B;AAAA,UACA,WAAAL;AAAA,UACA,aAAaO;AAAA,UACb,aAAAS;AAAA,UACA,cAAAG;AAAA,UACA,YAAYC,KAAc;AAAA,UAC1B,gBAAAC;AAAA,QAAA;AAAA,MAAA,IAEA,OACN,CAAA;AAAA,IAAA,EACF,CAAA,EACF,CAAA;AAAA,EAEJ;AACF;"}