From 40040323b875f1a3118f553ff9507ce84cacc4f4 Mon Sep 17 00:00:00 2001
From: gets0ul <gets0ul@gmail.com>
Date: Tue, 20 Oct 2020 04:58:31 +0700
Subject: [PATCH 1/3] fix: toggle checkpoint feedback

---
 src/shared/actions/page/challenge-details.js    |  2 +-
 .../challenge-detail/Checkpoints/index.jsx      |  4 ++--
 .../containers/challenge-detail/index.jsx       | 14 ++++++++++++--
 src/shared/reducers/page/challenge-details.js   | 17 +++--------------
 4 files changed, 18 insertions(+), 19 deletions(-)

diff --git a/src/shared/actions/page/challenge-details.js b/src/shared/actions/page/challenge-details.js
index 20faf4c0d8..3312b33bb7 100644
--- a/src/shared/actions/page/challenge-details.js
+++ b/src/shared/actions/page/challenge-details.js
@@ -59,7 +59,7 @@ function setSpecsTabState(state) {
  * @param {Boolean} open
  * @return {Object}
  */
-function toggleCheckpointFeedback(id, open) {
+function toggleCheckpointFeedback(id, open = false) {
   return { id, open };
 }
 
diff --git a/src/shared/components/challenge-detail/Checkpoints/index.jsx b/src/shared/components/challenge-detail/Checkpoints/index.jsx
index cc7f5a62c8..37de8dc40a 100644
--- a/src/shared/components/challenge-detail/Checkpoints/index.jsx
+++ b/src/shared/components/challenge-detail/Checkpoints/index.jsx
@@ -27,7 +27,7 @@ function Checkpoints(props) {
                 document
                   .getElementsByClassName(style['challenge-checkpoint-winners'])[index]
                   .scrollIntoView(true);
-                toggleCheckpointFeedback(index, true);
+                toggleCheckpointFeedback(item.submissionId, true);
               }}
               type="button"
             >
@@ -52,7 +52,7 @@ function Checkpoints(props) {
               <button
                 onClick={(e) => {
                   e.preventDefault();
-                  toggleCheckpointFeedback(index);
+                  toggleCheckpointFeedback(item.submissionId, !item.expanded);
                 }}
                 styleName="challenge-checkpoint-submission"
                 type="button"
diff --git a/src/shared/containers/challenge-detail/index.jsx b/src/shared/containers/challenge-detail/index.jsx
index 1dc074aee0..5fb0768fca 100644
--- a/src/shared/containers/challenge-detail/index.jsx
+++ b/src/shared/containers/challenge-detail/index.jsx
@@ -640,6 +640,7 @@ ChallengeDetailPageContainer.defaultProps = {
   mySubmissions: [],
   isLoadingSubmissionInformation: false,
   submissionInformation: null,
+  toggledFeedback: null,
   // prizeMode: 'money-usd',
 };
 
@@ -704,6 +705,7 @@ ChallengeDetailPageContainer.propTypes = {
   // expandTag: PT.func.isRequired,
   // loadingRecommendedChallengesUUID: PT.string.isRequired,
   history: PT.shape().isRequired,
+  toggledFeedback: PT.shape(),
 };
 
 function mapStateToProps(state, props) {
@@ -762,6 +764,14 @@ function mapStateToProps(state, props) {
       mySubmissions = _.filter(challenge.submissions, s => (`${s.memberId}` === `${auth.user.userId}`));
     }
   }
+  const feedbackOpen = state.page.challengeDetails.feedbackOpen;
+  const checkpoints = state.challenge.checkpoints || {};
+  if (checkpoints.checkpointResults) {
+    checkpoints.checkpointResults = checkpoints.checkpointResults.map(result => ({
+      ...result,
+      expanded: result.submissionId === feedbackOpen.id ? feedbackOpen.open : result.expanded,
+    }));
+  }
   return {
     auth: state.auth,
     challenge,
@@ -772,9 +782,9 @@ function mapStateToProps(state, props) {
     challengeId: String(props.match.params.challengeId),
     challengesUrl: props.challengesUrl,
     challengeTypesMap: state.challengeListing.challengeTypesMap,
-    checkpointResults: (state.challenge.checkpoints || {}).checkpointResults,
+    checkpointResults: checkpoints.checkpointResults,
     checkpointResultsUi: state.page.challengeDetails.checkpoints,
-    checkpoints: state.challenge.checkpoints || {},
+    checkpoints,
     communityId: props.communityId,
     communitiesList: state.tcCommunities.list,
     domain: state.domain,
diff --git a/src/shared/reducers/page/challenge-details.js b/src/shared/reducers/page/challenge-details.js
index 2c19a68b8b..669d3727cf 100644
--- a/src/shared/reducers/page/challenge-details.js
+++ b/src/shared/reducers/page/challenge-details.js
@@ -8,19 +8,8 @@ import { updateQuery } from 'utils/url';
  * @param {Object} state Previous state.
  * @param {Object} action Action.
  */
-function onToggleCheckpointFeedback(state, action) {
-  const { payload: { id, open } } = action;
-  const newCheckpointResults = _.clone(state.checkpoints.checkpointResults);
-  newCheckpointResults[id].expanded = _.isUndefined(open)
-    ? !newCheckpointResults[id].expanded : open;
-  const newCheckpoints = {
-    ...state.checkpoints,
-    checkpointResults: newCheckpointResults,
-  };
-  return {
-    ...state,
-    checkpoints: newCheckpoints,
-  };
+function onToggleCheckpointFeedback(state, { payload }) {
+  return { ...state, feedbackOpen: payload };
 }
 
 /**
@@ -92,7 +81,7 @@ function create(state = {}) {
     [a.submissions.toggleSubmissionTestcase]: toggleSubmissionTestcase,
     [a.submissions.clearSubmissionTestcaseOpen]: clearSubmissionTestcaseOpen,
   }, _.defaults(state, {
-    checkpoints: {},
+    feedbackOpen: {},
     specsTabState: SPECS_TAB_STATES.VIEW,
     submissionHistoryOpen: {},
     submissionTestcaseOpen: {},

From 555390d040244036914c8de4038f90ffa743bc43 Mon Sep 17 00:00:00 2001
From: gets0ul <gets0ul@gmail.com>
Date: Tue, 20 Oct 2020 05:18:14 +0700
Subject: [PATCH 2/3] fix: lint

---
 .../components/challenge-detail/Checkpoints/index.jsx       | 2 +-
 src/shared/containers/challenge-detail/index.jsx            | 6 ++----
 2 files changed, 3 insertions(+), 5 deletions(-)

diff --git a/src/shared/components/challenge-detail/Checkpoints/index.jsx b/src/shared/components/challenge-detail/Checkpoints/index.jsx
index 37de8dc40a..92bad4c10c 100644
--- a/src/shared/components/challenge-detail/Checkpoints/index.jsx
+++ b/src/shared/components/challenge-detail/Checkpoints/index.jsx
@@ -47,7 +47,7 @@ function Checkpoints(props) {
           }}
         />
         {
-          checkpointResults && checkpointResults.map((item, index) => (
+          checkpointResults && checkpointResults.map((item) => (
             <div key={item.submissionId} styleName="challenge-checkpoint-winners">
               <button
                 onClick={(e) => {
diff --git a/src/shared/containers/challenge-detail/index.jsx b/src/shared/containers/challenge-detail/index.jsx
index 5fb0768fca..fd38620774 100644
--- a/src/shared/containers/challenge-detail/index.jsx
+++ b/src/shared/containers/challenge-detail/index.jsx
@@ -640,7 +640,6 @@ ChallengeDetailPageContainer.defaultProps = {
   mySubmissions: [],
   isLoadingSubmissionInformation: false,
   submissionInformation: null,
-  toggledFeedback: null,
   // prizeMode: 'money-usd',
 };
 
@@ -705,7 +704,6 @@ ChallengeDetailPageContainer.propTypes = {
   // expandTag: PT.func.isRequired,
   // loadingRecommendedChallengesUUID: PT.string.isRequired,
   history: PT.shape().isRequired,
-  toggledFeedback: PT.shape(),
 };
 
 function mapStateToProps(state, props) {
@@ -764,9 +762,9 @@ function mapStateToProps(state, props) {
       mySubmissions = _.filter(challenge.submissions, s => (`${s.memberId}` === `${auth.user.userId}`));
     }
   }
-  const feedbackOpen = state.page.challengeDetails.feedbackOpen;
+  const { page: { challengeDetails : { feedbackOpen } } } = state;
   const checkpoints = state.challenge.checkpoints || {};
-  if (checkpoints.checkpointResults) {
+  if (feedbackOpen.id && checkpoints.checkpointResults) {
     checkpoints.checkpointResults = checkpoints.checkpointResults.map(result => ({
       ...result,
       expanded: result.submissionId === feedbackOpen.id ? feedbackOpen.open : result.expanded,

From 9bbcc8305a982d479329ee90accce921492378ee Mon Sep 17 00:00:00 2001
From: gets0ul <gets0ul@gmail.com>
Date: Tue, 20 Oct 2020 05:26:10 +0700
Subject: [PATCH 3/3] fix: more lint error

---
 src/shared/components/challenge-detail/Checkpoints/index.jsx | 2 +-
 src/shared/containers/challenge-detail/index.jsx             | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/shared/components/challenge-detail/Checkpoints/index.jsx b/src/shared/components/challenge-detail/Checkpoints/index.jsx
index 92bad4c10c..a6e1282d5a 100644
--- a/src/shared/components/challenge-detail/Checkpoints/index.jsx
+++ b/src/shared/components/challenge-detail/Checkpoints/index.jsx
@@ -47,7 +47,7 @@ function Checkpoints(props) {
           }}
         />
         {
-          checkpointResults && checkpointResults.map((item) => (
+          checkpointResults && checkpointResults.map(item => (
             <div key={item.submissionId} styleName="challenge-checkpoint-winners">
               <button
                 onClick={(e) => {
diff --git a/src/shared/containers/challenge-detail/index.jsx b/src/shared/containers/challenge-detail/index.jsx
index fd38620774..0f9477a487 100644
--- a/src/shared/containers/challenge-detail/index.jsx
+++ b/src/shared/containers/challenge-detail/index.jsx
@@ -762,7 +762,7 @@ function mapStateToProps(state, props) {
       mySubmissions = _.filter(challenge.submissions, s => (`${s.memberId}` === `${auth.user.userId}`));
     }
   }
-  const { page: { challengeDetails : { feedbackOpen } } } = state;
+  const { page: { challengeDetails: { feedbackOpen } } } = state;
   const checkpoints = state.challenge.checkpoints || {};
   if (feedbackOpen.id && checkpoints.checkpointResults) {
     checkpoints.checkpointResults = checkpoints.checkpointResults.map(result => ({