feat: update answer helper text (#213)

src/editors/containers/ProblemEditor/components/EditProblemView/AnswerWidget/index.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { FormattedMessage } from '@edx/frontend-platform/i18n';
+import { FormattedMessage, injectIntl, intlShape } from '@edx/frontend-platform/i18n';
 
 import messages from './messages';
 import { ProblemTypes } from '../../../../../data/constants/problem';
@@ -11,6 +11,8 @@ import './index.scss';
 const AnswerWidget = ({
   // Redux
   problemType,
+  // injected
+  intl,
 }) => {
   const problemStaticData = ProblemTypes[problemType];
   return (
@@ -20,7 +22,7 @@ const AnswerWidget = ({
           <FormattedMessage {...messages.answerWidgetTitle} />
         </div>
         <div className="small">
-          {problemStaticData.description}
+          {intl.formatMessage(messages.answerHelperText, { helperText: problemStaticData.description })}
         </div>
       </div>
       <AnswersContainer problemType={problemType} />
@@ -30,5 +32,7 @@ const AnswerWidget = ({
 
 AnswerWidget.propTypes = {
   problemType: PropTypes.string.isRequired,
+  // injected
+  intl: intlShape.isRequired,
 };
-export default AnswerWidget;
+export default injectIntl(AnswerWidget);

src/editors/containers/ProblemEditor/components/EditProblemView/AnswerWidget/messages.js

@@ -4,6 +4,11 @@ export const messages = {
     defaultMessage: 'Answers',
     description: 'Main title for Answers widget',
   },
+  answerHelperText: {
+    id: 'authoring.problemEditor.answerWidget.answer.answerHelperText',
+    defaultMessage: '{helperText}',
+    description: 'Helper text describing how the user should input answers',
+  },
   addAnswerButtonText: {
     id: 'authoring.answerwidget.answer.addAnswerButton',
     defaultMessage: 'Add answer',

src/editors/containers/ProblemEditor/components/EditProblemView/__snapshots__/index.test.jsx.snap

@@ -42,7 +42,7 @@ exports[`EditorProblemView component renders simple view 1`] = `
       className="flex-grow-1"
     >
       <injectIntl(ShimmedIntlComponent) />
-      <AnswerWidget
+      <injectIntl(ShimmedIntlComponent)
         problemType="multiplechoiceresponse"
       />
     </span>

src/editors/containers/ProblemEditor/components/SelectTypeModal/content/__snapshots__/Preview.test.jsx.snap

@@ -33,7 +33,7 @@ exports[`Preview snapshots snapshots: renders as expected with problemType is ch
   <div
     className="mb-3"
   >
-    Specify one or more correct answers from a list of possible options.
+    Enter your multi-select answers below and select which choices are correct
   </div>
   <Hyperlink
     destination="https://edx.readthedocs.io/projects/edx-partner-course-staff/en/latest/exercises_tools/checkbox.html"
@@ -79,7 +79,7 @@ exports[`Preview snapshots snapshots: renders as expected with problemType is mu
   <div
     className="mb-3"
   >
-    Specify one correct answer from a list of possible options
+    Enter your single select answers below and select which choice is correct
   </div>
   <Hyperlink
     destination="https://edx.readthedocs.io/projects/edx-partner-course-staff/en/latest/exercises_tools/multiple_choice.html"
@@ -125,7 +125,7 @@ exports[`Preview snapshots snapshots: renders as expected with problemType is nu
   <div
     className="mb-3"
   >
-    Specify one or more correct numeric answers, submitted in a response field.
+    Enter correct numerical input answers below
   </div>
   <Hyperlink
     destination="https://edx.readthedocs.io/projects/edx-partner-course-staff/en/latest/exercises_tools/numerical_input.html"
@@ -171,7 +171,7 @@ exports[`Preview snapshots snapshots: renders as expected with problemType is op
   <div
     className="mb-3"
   >
-    Specify one correct answer from a list of possible options, selected in a dropdown menu.
+    Enter your dropdown answers below and select which choice is correct
   </div>
   <Hyperlink
     destination="https://edx.readthedocs.io/projects/edx-partner-course-staff/en/latest/exercises_tools/dropdown.html"
@@ -217,7 +217,7 @@ exports[`Preview snapshots snapshots: renders as expected with problemType is st
   <div
     className="mb-3"
   >
-    Specify one or more correct text answers, including numbers and special characters, submitted in a response field.
+    Enter your text input answers below and select which choices are correct
   </div>
   <Hyperlink
     destination="https://edx.readthedocs.io/projects/edx-partner-course-staff/en/latest/exercises_tools/text_input.html"

src/editors/data/constants/problem.js

@@ -20,7 +20,7 @@ export const ProblemTypes = StrictDict({
   [ProblemTypeKeys.SINGLESELECT]: {
     title: 'Single select',
     preview: singleSelect,
-    description: 'Specify one correct answer from a list of possible options',
+    description: 'Enter your single select answers below and select which choice is correct',
     helpLink: 'https://edx.readthedocs.io/projects/edx-partner-course-staff/en/latest/exercises_tools/multiple_choice.html',
     prev: ProblemTypeKeys.TEXTINPUT,
     next: ProblemTypeKeys.MULTISELECT,
@@ -30,7 +30,7 @@ export const ProblemTypes = StrictDict({
   [ProblemTypeKeys.MULTISELECT]: {
     title: 'Multi-select',
     preview: multiSelect,
-    description: 'Specify one or more correct answers from a list of possible options.',
+    description: 'Enter your multi-select answers below and select which choices are correct',
     helpLink: 'https://edx.readthedocs.io/projects/edx-partner-course-staff/en/latest/exercises_tools/checkbox.html',
     next: ProblemTypeKeys.DROPDOWN,
     prev: ProblemTypeKeys.SINGLESELECT,
@@ -39,7 +39,7 @@ export const ProblemTypes = StrictDict({
   [ProblemTypeKeys.DROPDOWN]: {
     title: 'Dropdown',
     preview: dropdown,
-    description: 'Specify one correct answer from a list of possible options, selected in a dropdown menu.',
+    description: 'Enter your dropdown answers below and select which choice is correct',
     helpLink: 'https://edx.readthedocs.io/projects/edx-partner-course-staff/en/latest/exercises_tools/dropdown.html',
     next: ProblemTypeKeys.NUMERIC,
     prev: ProblemTypeKeys.MULTISELECT,
@@ -48,7 +48,7 @@ export const ProblemTypes = StrictDict({
   [ProblemTypeKeys.NUMERIC]: {
     title: 'Numerical input',
     preview: numericalInput,
-    description: 'Specify one or more correct numeric answers, submitted in a response field.',
+    description: 'Enter correct numerical input answers below',
     helpLink: 'https://edx.readthedocs.io/projects/edx-partner-course-staff/en/latest/exercises_tools/numerical_input.html',
     next: ProblemTypeKeys.TEXTINPUT,
     prev: ProblemTypeKeys.DROPDOWN,
@@ -57,7 +57,7 @@ export const ProblemTypes = StrictDict({
   [ProblemTypeKeys.TEXTINPUT]: {
     title: 'Text input',
     preview: textInput,
-    description: 'Specify one or more correct text answers, including numbers and special characters, submitted in a response field.',
+    description: 'Enter your text input answers below and select which choices are correct',
     helpLink: 'https://edx.readthedocs.io/projects/edx-partner-course-staff/en/latest/exercises_tools/text_input.html',
     prev: ProblemTypeKeys.NUMERIC,
     next: ProblemTypeKeys.SINGLESELECT,