From ed051c3543e3ba21dee13c1c67617ffa66a9b5e9 Mon Sep 17 00:00:00 2001
From: Dmytro <98233552+DmytroAlipov@users.noreply.github.com>
Date: Fri, 1 Dec 2023 16:26:12 +0200
Subject: [PATCH] fix: default display of Show Answer and Show reset option
 (#403)

Hardcoding values for showAnswer and showResetButton
in initialState leads to incorrect selection of additional
states specified in Advanced settings.
---
 .../SettingsWidget/__snapshots__/index.test.jsx.snap | 12 +++++++++---
 .../EditProblemView/SettingsWidget/index.jsx         |  8 ++++++--
 .../SettingsWidget/settingsComponents/ResetCard.jsx  |  9 ++++++---
 .../settingsComponents/ShowAnswerCard.jsx            |  6 ++++--
 src/editors/data/redux/problem/reducers.js           |  6 +++---
 5 files changed, 28 insertions(+), 13 deletions(-)

diff --git a/src/editors/containers/ProblemEditor/components/EditProblemView/SettingsWidget/__snapshots__/index.test.jsx.snap b/src/editors/containers/ProblemEditor/components/EditProblemView/SettingsWidget/__snapshots__/index.test.jsx.snap
index ea8ae5d6f..52a608aec 100644
--- a/src/editors/containers/ProblemEditor/components/EditProblemView/SettingsWidget/__snapshots__/index.test.jsx.snap
+++ b/src/editors/containers/ProblemEditor/components/EditProblemView/SettingsWidget/__snapshots__/index.test.jsx.snap
@@ -62,7 +62,9 @@ exports[`SettingsWidget snapshot snapshot: renders Settings widget for Advanced
       <div
         className="my-3"
       >
-        <ResetCard />
+        <ResetCard
+          defaultValue={false}
+        />
       </div>
       <div
         className="my-3"
@@ -143,7 +145,9 @@ exports[`SettingsWidget snapshot snapshot: renders Settings widget page 1`] = `
       <div
         className="my-3"
       >
-        <ResetCard />
+        <ResetCard
+          defaultValue={false}
+        />
       </div>
       <div
         className="my-3"
@@ -224,7 +228,9 @@ exports[`SettingsWidget snapshot snapshot: renders Settings widget page advanced
       <div
         className="my-3"
       >
-        <ResetCard />
+        <ResetCard
+          defaultValue={false}
+        />
       </div>
       <div
         className="my-3"
diff --git a/src/editors/containers/ProblemEditor/components/EditProblemView/SettingsWidget/index.jsx b/src/editors/containers/ProblemEditor/components/EditProblemView/SettingsWidget/index.jsx
index 037cc4e4d..8290d224b 100644
--- a/src/editors/containers/ProblemEditor/components/EditProblemView/SettingsWidget/index.jsx
+++ b/src/editors/containers/ProblemEditor/components/EditProblemView/SettingsWidget/index.jsx
@@ -113,7 +113,11 @@ export const SettingsWidget = ({
             />
           </div>
           <div className="my-3">
-            <ResetCard showResetButton={settings.showResetButton} updateSettings={updateSettings} />
+            <ResetCard
+              showResetButton={settings.showResetButton}
+              defaultValue={defaultSettings.showResetButton}
+              updateSettings={updateSettings}
+            />
           </div>
           {
             problemType === ProblemTypeKeys.ADVANCED && (
@@ -165,7 +169,7 @@ SettingsWidget.propTypes = {
   defaultSettings: PropTypes.shape({
     maxAttempts: PropTypes.number,
     showanswer: PropTypes.string,
-    showReseButton: PropTypes.bool,
+    showResetButton: PropTypes.bool,
     rerandomize: PropTypes.string,
   }).isRequired,
   // eslint-disable-next-line
diff --git a/src/editors/containers/ProblemEditor/components/EditProblemView/SettingsWidget/settingsComponents/ResetCard.jsx b/src/editors/containers/ProblemEditor/components/EditProblemView/SettingsWidget/settingsComponents/ResetCard.jsx
index a4038863b..3f4d1415e 100644
--- a/src/editors/containers/ProblemEditor/components/EditProblemView/SettingsWidget/settingsComponents/ResetCard.jsx
+++ b/src/editors/containers/ProblemEditor/components/EditProblemView/SettingsWidget/settingsComponents/ResetCard.jsx
@@ -10,6 +10,7 @@ import { selectors } from '../../../../../../data/redux';
 
 export const ResetCard = ({
   showResetButton,
+  defaultValue,
   updateSettings,
   // inject
   intl,
@@ -17,10 +18,11 @@ export const ResetCard = ({
   const isLibrary = useSelector(selectors.app.isLibrary);
   const { setResetTrue, setResetFalse } = resetCardHooks(updateSettings);
   const advancedSettingsLink = `${useSelector(selectors.app.studioEndpointUrl)}/settings/advanced/${useSelector(selectors.app.learningContextId)}#show_reset_button`;
+  const currentResetButton = showResetButton !== null ? showResetButton : defaultValue;
   return (
     <SettingsOption
       title={intl.formatMessage(messages.resetSettingsTitle)}
-      summary={showResetButton
+      summary={currentResetButton
         ? intl.formatMessage(messages.resetSettingsTrue) : intl.formatMessage(messages.resetSettingsFalse)}
       className="resetCard"
     >
@@ -37,10 +39,10 @@ export const ResetCard = ({
         </div>
       )}
       <ButtonGroup size="sm" className="resetSettingsButtons mb-2">
-        <Button variant={showResetButton ? 'outline-primary' : 'primary'} size="sm" onClick={setResetFalse}>
+        <Button variant={currentResetButton ? 'outline-primary' : 'primary'} size="sm" onClick={setResetFalse}>
           <FormattedMessage {...messages.resetSettingsFalse} />
         </Button>
-        <Button variant={showResetButton ? 'primary' : 'outline-primary'} size="sm" onClick={setResetTrue}>
+        <Button variant={currentResetButton ? 'primary' : 'outline-primary'} size="sm" onClick={setResetTrue}>
           <FormattedMessage {...messages.resetSettingsTrue} />
         </Button>
       </ButtonGroup>
@@ -50,6 +52,7 @@ export const ResetCard = ({
 
 ResetCard.propTypes = {
   showResetButton: PropTypes.bool.isRequired,
+  defaultValue: PropTypes.bool.isRequired,
   updateSettings: PropTypes.func.isRequired,
   // injected
   intl: intlShape.isRequired,
diff --git a/src/editors/containers/ProblemEditor/components/EditProblemView/SettingsWidget/settingsComponents/ShowAnswerCard.jsx b/src/editors/containers/ProblemEditor/components/EditProblemView/SettingsWidget/settingsComponents/ShowAnswerCard.jsx
index 5739abbed..2e92667fd 100644
--- a/src/editors/containers/ProblemEditor/components/EditProblemView/SettingsWidget/settingsComponents/ShowAnswerCard.jsx
+++ b/src/editors/containers/ProblemEditor/components/EditProblemView/SettingsWidget/settingsComponents/ShowAnswerCard.jsx
@@ -26,6 +26,8 @@ export const ShowAnswerCard = ({
     showAttempts,
   } = useAnswerSettings(showAnswer, updateSettings);
 
+  const currentShowAnswer = showAnswer.on || defaultValue;
+
   const showAnswerSection = (
     <>
       <div className="pb-2">
@@ -43,7 +45,7 @@ export const ShowAnswerCard = ({
       <Form.Group className="pb-0 mb-0">
         <Form.Control
           as="select"
-          value={showAnswer.on}
+          value={currentShowAnswer}
           onChange={handleShowAnswerChange}
         >
           {Object.values(ShowAnswerTypesKeys).map((answerType) => {
@@ -79,7 +81,7 @@ export const ShowAnswerCard = ({
   return (
     <SettingsOption
       title={intl.formatMessage(messages.showAnswerSettingsTitle)}
-      summary={intl.formatMessage(ShowAnswerTypes[showAnswer.on])}
+      summary={intl.formatMessage(ShowAnswerTypes[currentShowAnswer])}
     >
       {showAnswerSection}
     </SettingsOption>
diff --git a/src/editors/data/redux/problem/reducers.js b/src/editors/data/redux/problem/reducers.js
index 4173cbc9b..c672b85a3 100644
--- a/src/editors/data/redux/problem/reducers.js
+++ b/src/editors/data/redux/problem/reducers.js
@@ -2,7 +2,7 @@ import _ from 'lodash-es';
 import { createSlice } from '@reduxjs/toolkit';
 import { indexToLetterMap } from '../../../containers/ProblemEditor/data/OLXParser';
 import { StrictDict } from '../../../utils';
-import { ProblemTypeKeys, RichTextProblems, ShowAnswerTypesKeys } from '../../constants/problem';
+import { ProblemTypeKeys, RichTextProblems } from '../../constants/problem';
 import { ToleranceTypes } from '../../../containers/ProblemEditor/components/EditProblemView/SettingsWidget/settingsComponents/Tolerance/constants';
 
 const nextAlphaId = (lastId) => String.fromCharCode(lastId.charCodeAt(0) + 1);
@@ -28,10 +28,10 @@ const initialState = {
     hints: [],
     timeBetween: 0,
     showAnswer: {
-      on: ShowAnswerTypesKeys.FINISHED,
+      on: '',
       afterAttempts: 0,
     },
-    showResetButton: false,
+    showResetButton: null,
     solutionExplanation: '',
     tolerance: {
       value: null,