From 41aa53eb072c312b0c7030b912b6dfd940777eda Mon Sep 17 00:00:00 2001
From: mhashim6 <m6hashim@gmail.com>
Date: Tue, 12 May 2020 15:16:36 +0200
Subject: [PATCH 1/3] reset flow on close

---
 .../ProgramManagement/CourseManagementFlow.jsx  | 17 +++++++++++++----
 .../ProgramManagement/LessonManagementFlow.jsx  | 13 +++++++++++--
 .../ProgramManagement/ProgramManagementFlow.jsx | 13 +++++++++++--
 3 files changed, 35 insertions(+), 8 deletions(-)

diff --git a/src/components/ProgramManagement/CourseManagementFlow.jsx b/src/components/ProgramManagement/CourseManagementFlow.jsx
index 1ff1a2c..49ee8fa 100644
--- a/src/components/ProgramManagement/CourseManagementFlow.jsx
+++ b/src/components/ProgramManagement/CourseManagementFlow.jsx
@@ -19,6 +19,8 @@ export const CourseManagementFlow = ({ courseID, isShown, onFinish }) => {
 
   const [course, updateCourse] = useState(emptyState); // replace with api data
 
+  const [modalKey, setModalKey] = useState(0);
+
   const canGoNext = (index) => {
     switch (index) {
       case 0:
@@ -70,14 +72,21 @@ export const CourseManagementFlow = ({ courseID, isShown, onFinish }) => {
     },
   ];
 
+  const resetFlow = () => {
+    updateCourse(emptyState);
+    setModalKey(modalKey + 1);
+    onFinish();
+  };
+
   return (
     <FlowModal
-      flowStops={flowStops}
+      key={modalKey}
       isShown={isShown}
-      canGoNext={canGoNext}
       runBeforeNext={runBeforeNext}
-      onFinish={onFinish}
-      onCancel={onFinish}
+      canGoNext={canGoNext}
+      flowStops={flowStops}
+      onFinish={resetFlow}
+      onCancel={resetFlow}
     />
   );
 };
diff --git a/src/components/ProgramManagement/LessonManagementFlow.jsx b/src/components/ProgramManagement/LessonManagementFlow.jsx
index f8b0ca2..adc2e7f 100644
--- a/src/components/ProgramManagement/LessonManagementFlow.jsx
+++ b/src/components/ProgramManagement/LessonManagementFlow.jsx
@@ -19,6 +19,8 @@ export const LessonManagementFlow = ({ lessonID, isShown, onFinish }) => {
   };
   const [lesson, updateLesson] = useState(emptyState); // replace with api data
 
+  const [modalKey, setModalKey] = useState(0);
+
   const canGoNext = (index) => {
     switch (index) {
       case 0:
@@ -64,14 +66,21 @@ export const LessonManagementFlow = ({ lessonID, isShown, onFinish }) => {
     },
   ];
 
+  const resetFlow = () => {
+    updateLesson(emptyState);
+    setModalKey(modalKey + 1);
+    onFinish();
+  };
+
   return (
     <FlowModal
+      key={modalKey}
       isShown={isShown}
       runBeforeNext={runBeforeNext}
       canGoNext={canGoNext}
       flowStops={flowStops}
-      onFinish={onFinish}
-      onCancel={onFinish}
+      onFinish={resetFlow}
+      onCancel={resetFlow}
     />
   );
 };
diff --git a/src/components/ProgramManagement/ProgramManagementFlow.jsx b/src/components/ProgramManagement/ProgramManagementFlow.jsx
index 03f7f2f..843c0c6 100644
--- a/src/components/ProgramManagement/ProgramManagementFlow.jsx
+++ b/src/components/ProgramManagement/ProgramManagementFlow.jsx
@@ -18,6 +18,8 @@ export const ProgramManagementFlow = ({ programID, isShown, onFinish }) => {
 
   const [program, updateProgram] = useState(emptyState); // replace with api data
 
+  const [modalKey, setModalKey] = useState(0);
+
   const canGoNext = (index) => {
     switch (index) {
       case 0:
@@ -65,14 +67,21 @@ export const ProgramManagementFlow = ({ programID, isShown, onFinish }) => {
     },
   ];
 
+  const resetFlow = () => {
+    updateProgram(emptyState);
+    setModalKey(modalKey + 1);
+    onFinish();
+  };
+
   return (
     <FlowModal
+      key={modalKey}
       isShown={isShown}
       runBeforeNext={runBeforeNext}
       canGoNext={canGoNext}
       flowStops={flowStops}
-      onFinish={onFinish}
-      onCancel={onFinish}
+      onFinish={resetFlow}
+      onCancel={resetFlow}
     />
   );
 };

From ac760cf5ce126be73cd0b9b5664ce7029434d808 Mon Sep 17 00:00:00 2001
From: mhashim6 <m6hashim@gmail.com>
Date: Thu, 14 May 2020 00:07:38 +0200
Subject: [PATCH 2/3] simplified canGoNext and runBeforeNext

---
 .../CourseManagementFlow.jsx                  | 30 ++++-------------
 .../LessonManagementFlow.jsx                  | 22 -------------
 .../ProgramManagementFlow.jsx                 | 33 ++++---------------
 src/components/Shared/Flow/Flow.jsx           | 16 +++------
 4 files changed, 17 insertions(+), 84 deletions(-)

diff --git a/src/components/ProgramManagement/CourseManagementFlow.jsx b/src/components/ProgramManagement/CourseManagementFlow.jsx
index 49ee8fa..3111151 100644
--- a/src/components/ProgramManagement/CourseManagementFlow.jsx
+++ b/src/components/ProgramManagement/CourseManagementFlow.jsx
@@ -21,28 +21,6 @@ export const CourseManagementFlow = ({ courseID, isShown, onFinish }) => {
 
   const [modalKey, setModalKey] = useState(0);
 
-  const canGoNext = (index) => {
-    switch (index) {
-      case 0:
-        return isCourseValid(course.content);
-      case 1:
-        return true;
-      case 2:
-        return isQuizValid(course.quiz);
-    }
-  };
-
-  const runBeforeNext = (index) => {
-    switch (index) {
-      case 0:
-        console.debug(course.content); //TODO: replace with an api call
-        break;
-      case 2:
-        console.debug(course.quiz); //TODO: replace with an api call
-        break;
-    }
-  };
-
   const flowStops = [
     {
       title: "إنشاء كورس",
@@ -54,10 +32,14 @@ export const CourseManagementFlow = ({ courseID, isShown, onFinish }) => {
           }
         />
       ),
+      canGoNext: () => isCourseValid(course.content),
+      action: () => console.debug(course.content),
     },
     {
       title: "إضافة دروس",
       content: <LessonsListing courseID={courseID} lessons={course.lessons} />,
+      canGoNext: () => true,
+      action: () => {},
     },
     {
       title: "إنشاء كويز",
@@ -69,6 +51,8 @@ export const CourseManagementFlow = ({ courseID, isShown, onFinish }) => {
           }}
         />
       ),
+      canGoNext: () => isQuizValid(course.quiz),
+      action: () => console.debug(course.quiz),
     },
   ];
 
@@ -82,8 +66,6 @@ export const CourseManagementFlow = ({ courseID, isShown, onFinish }) => {
     <FlowModal
       key={modalKey}
       isShown={isShown}
-      runBeforeNext={runBeforeNext}
-      canGoNext={canGoNext}
       flowStops={flowStops}
       onFinish={resetFlow}
       onCancel={resetFlow}
diff --git a/src/components/ProgramManagement/LessonManagementFlow.jsx b/src/components/ProgramManagement/LessonManagementFlow.jsx
index adc2e7f..50fb0e3 100644
--- a/src/components/ProgramManagement/LessonManagementFlow.jsx
+++ b/src/components/ProgramManagement/LessonManagementFlow.jsx
@@ -21,26 +21,6 @@ export const LessonManagementFlow = ({ lessonID, isShown, onFinish }) => {
 
   const [modalKey, setModalKey] = useState(0);
 
-  const canGoNext = (index) => {
-    switch (index) {
-      case 0:
-        return isLessonValid(lesson.content);
-      case 1:
-        return isQuizValid(lesson.quiz);
-    }
-  };
-
-  const runBeforeNext = (index) => {
-    switch (index) {
-      case 0:
-        console.debug(lesson.content); //TODO: replace with an api call
-        break;
-      case 1:
-        console.debug(lesson.quiz); //TODO: replace with an api call
-        break;
-    }
-  };
-
   const flowStops = [
     {
       title: "إنشاء درس",
@@ -76,8 +56,6 @@ export const LessonManagementFlow = ({ lessonID, isShown, onFinish }) => {
     <FlowModal
       key={modalKey}
       isShown={isShown}
-      runBeforeNext={runBeforeNext}
-      canGoNext={canGoNext}
       flowStops={flowStops}
       onFinish={resetFlow}
       onCancel={resetFlow}
diff --git a/src/components/ProgramManagement/ProgramManagementFlow.jsx b/src/components/ProgramManagement/ProgramManagementFlow.jsx
index 843c0c6..489331c 100644
--- a/src/components/ProgramManagement/ProgramManagementFlow.jsx
+++ b/src/components/ProgramManagement/ProgramManagementFlow.jsx
@@ -20,39 +20,18 @@ export const ProgramManagementFlow = ({ programID, isShown, onFinish }) => {
 
   const [modalKey, setModalKey] = useState(0);
 
-  const canGoNext = (index) => {
-    switch (index) {
-      case 0:
-        return true; //TODO: handle program creation
-      case 1:
-        return true;
-      case 2:
-        return isQuizValid(program.assessmentQuiz);
-    }
-  };
-
-  const runBeforeNext = (index) => {
-    switch (index) {
-      case 0:
-        console.debug("program"); //TODO: replace with an api call
-        break;
-      case 1:
-        console.debug("courses"); //TODO: replace with an api call
-        break;
-      case 2:
-        console.debug(program.quiz); //TODO: replace with an api call
-        break;
-    }
-  };
-
   const flowStops = [
     {
       title: "إنشاء برنامج جديد",
       content: <ProgramCreation />,
+      canGoNext: () => true,
+      action: () => console.debug("program"),
     },
     {
       title: "الكورسات",
       content: <CoursesListing programID={programID} />,
+      canGoNext: () => true,
+      action: () => console.debug("courses"),
     },
     {
       title: "امتحان القبول",
@@ -64,6 +43,8 @@ export const ProgramManagementFlow = ({ programID, isShown, onFinish }) => {
           }}
         />
       ),
+      canGoNext: () => isQuizValid(program.assessmentQuiz),
+      action: () => console.debug(program.assessmentQuiz),
     },
   ];
 
@@ -77,8 +58,6 @@ export const ProgramManagementFlow = ({ programID, isShown, onFinish }) => {
     <FlowModal
       key={modalKey}
       isShown={isShown}
-      runBeforeNext={runBeforeNext}
-      canGoNext={canGoNext}
       flowStops={flowStops}
       onFinish={resetFlow}
       onCancel={resetFlow}
diff --git a/src/components/Shared/Flow/Flow.jsx b/src/components/Shared/Flow/Flow.jsx
index 59b912b..414174a 100644
--- a/src/components/Shared/Flow/Flow.jsx
+++ b/src/components/Shared/Flow/Flow.jsx
@@ -3,14 +3,7 @@ import { SwitchTransition, CSSTransition } from "react-transition-group";
 import "./Flow.scss";
 import { Modal, ModalBody, ModalFooter, ModalHeader } from "reactstrap";
 
-export const FlowModal = ({
-  flowStops,
-  isShown,
-  canGoNext,
-  runBeforeNext,
-  onFinish,
-  onCancel,
-}) => {
+export const FlowModal = ({ flowStops, isShown, onFinish, onCancel }) => {
   const [currentStop, updateCurrentStop] = useState(0);
 
   const firstStop = currentStop === 0;
@@ -32,16 +25,17 @@ export const FlowModal = ({
           <div className="navigationBtns">
             <button
               type="button"
-              disabled={!canGoNext(currentStop)}
+              disabled={!flowStops[currentStop].canGoNext()}
               className="btn btn-success"
               onClick={() => {
-                if (window.confirm("تأكيد؟"))
+                if (window.confirm("تأكيد؟")) {
+                  flowStops[currentStop].action();
                   if (lastStop) {
                     if (onFinish) onFinish();
                   } else {
-                    runBeforeNext(currentStop);
                     updateCurrentStop(currentStop + 1);
                   }
+                }
               }}
             >
               {lastStop

From 951fce7d3d9f48e35931f7655dde9d52bffd1cee Mon Sep 17 00:00:00 2001
From: mhashim6 <m6hashim@gmail.com>
Date: Thu, 14 May 2020 00:11:38 +0200
Subject: [PATCH 3/3] minor fixes

---
 src/components/ProgramManagement/CourseManagementFlow.jsx  | 2 +-
 src/components/ProgramManagement/LessonManagementFlow.jsx  | 6 +++++-
 src/components/ProgramManagement/ManageQuiz.jsx            | 2 --
 src/components/ProgramManagement/ProgramManagementFlow.jsx | 2 +-
 4 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/components/ProgramManagement/CourseManagementFlow.jsx b/src/components/ProgramManagement/CourseManagementFlow.jsx
index 3111151..33f244a 100644
--- a/src/components/ProgramManagement/CourseManagementFlow.jsx
+++ b/src/components/ProgramManagement/CourseManagementFlow.jsx
@@ -116,7 +116,7 @@ export const CoursesListing = ({ programID }) => {
         onMinus={() => {
           if (userIsSure()) manageCourses.removeLast();
         }}
-        minusDisabled={manageCourses.collection.length == 0}
+        minusDisabled={manageCourses.collection.length === 0}
       />
     </div>
   );
diff --git a/src/components/ProgramManagement/LessonManagementFlow.jsx b/src/components/ProgramManagement/LessonManagementFlow.jsx
index 50fb0e3..d3cd9a2 100644
--- a/src/components/ProgramManagement/LessonManagementFlow.jsx
+++ b/src/components/ProgramManagement/LessonManagementFlow.jsx
@@ -32,6 +32,8 @@ export const LessonManagementFlow = ({ lessonID, isShown, onFinish }) => {
           }
         />
       ),
+      canGoNext: () => isLessonValid(lesson.content),
+      action: () => console.debug(lesson.content),
     },
     {
       title: "إنشاء كويز",
@@ -43,6 +45,8 @@ export const LessonManagementFlow = ({ lessonID, isShown, onFinish }) => {
           }}
         />
       ),
+      canGoNext: () => isQuizValid(lesson.quiz),
+      action: () => console.debug(lesson.quiz),
     },
   ];
 
@@ -106,7 +110,7 @@ export const LessonsListing = ({ courseID }) => {
         onMinus={() => {
           if (userIsSure()) manageLessons.removeLast();
         }}
-        minusDisabled={manageLessons.collection.length == 0}
+        minusDisabled={manageLessons.collection.length === 0}
       />
     </div>
   );
diff --git a/src/components/ProgramManagement/ManageQuiz.jsx b/src/components/ProgramManagement/ManageQuiz.jsx
index 5e9c193..3d42142 100644
--- a/src/components/ProgramManagement/ManageQuiz.jsx
+++ b/src/components/ProgramManagement/ManageQuiz.jsx
@@ -32,8 +32,6 @@ const ManageQuiz = React.memo(({ existingQuestions, update }) => {
             type: "WRITTEN",
             fullMark: 0,
           });
-          console.log(manageQuizzes.collection);
-
         }}
         onMinus={() => {
           manageQuizzes.removeLast();
diff --git a/src/components/ProgramManagement/ProgramManagementFlow.jsx b/src/components/ProgramManagement/ProgramManagementFlow.jsx
index 489331c..4f27851 100644
--- a/src/components/ProgramManagement/ProgramManagementFlow.jsx
+++ b/src/components/ProgramManagement/ProgramManagementFlow.jsx
@@ -108,7 +108,7 @@ export const ProgramsListing = ({ userID }) => {
         onMinus={() => {
           if (userIsSure()) managePrograms.removeLast();
         }}
-        minusDisabled={managePrograms.collection.length == 0}
+        minusDisabled={managePrograms.collection.length === 0}
       />
     </div>
   );