chore: update assessmentCriterions shape

openedx · Oct 26, 2023 · f43e646 · f43e646
1 parent af5c7ce
commit f43e646
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 28 deletions.
diff --git a/src/components/CollapsibleFeedback/AssessmentCriterion.jsx b/src/components/CollapsibleFeedback/AssessmentCriterion.jsx
@@ -4,19 +4,26 @@ import PropTypes from 'prop-types';
 import { useIntl } from '@edx/frontend-platform/i18n';
 import Feedback from './Feedback';
 import messages from './messages';
+import { useORAConfigData } from 'data/services/lms/hooks/selectors';
 
-const AssessmentCriterion = ({ assessmentCriterions, overallFeedback, stepLabel }) => {
+const AssessmentCriterion = ({
+  assessmentCriterions,
+  overallFeedback,
+  stepLabel,
+}) => {
   const { formatMessage } = useIntl();
-
+  const { rubricConfig } = useORAConfigData();
   return (
     <>
-      {assessmentCriterions.map((criterion) => {
+      {rubricConfig.criteria.map((criterion, i) => {
+        const option = criterion.options[assessmentCriterions[i].selectedOption];
         return (
           <Feedback
             key={criterion.name}
             criterionName={criterion.name}
-            selectedOption={criterion.selectedOption}
-            selectedPoints={criterion.selectedPoints}
+            criterionDescription={criterion.description}
+            selectedOption={option.name}
+            selectedPoints={option.points}
             commentHeader={stepLabel}
             commentBody={criterion.feedback}
           />
@@ -33,9 +40,8 @@ const AssessmentCriterion = ({ assessmentCriterions, overallFeedback, stepLabel
 AssessmentCriterion.defaultProps = {};
 AssessmentCriterion.propTypes = {
   assessmentCriterions: PropTypes.arrayOf(PropTypes.shape({
-    name: PropTypes.string.isRequired,
-    selectedOption: PropTypes.string,
-    selectedPoints: PropTypes.number,
+    selectedOption: PropTypes.number,
+    // selectedPoints: PropTypes.number,
     feedback: PropTypes.string,
   })),
   overallFeedback: PropTypes.string,

diff --git a/src/components/CollapsibleFeedback/Feedback.jsx b/src/components/CollapsibleFeedback/Feedback.jsx
@@ -9,6 +9,7 @@ import InfoPopover from 'components/InfoPopover';
 
 const Feedback = ({
   criterionName,
+  criterionDescription,
   selectedOption,
   selectedPoints,
   commentHeader,
@@ -25,14 +26,11 @@ const Feedback = ({
       <div className='mt-2'>
         <div className='d-flex justify-content-between align-items-center'>
           <h5 className='mb-0'>{criterionName}</h5>
-          <InfoPopover onClick={() => {}}>
-            <p>
-              Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
-              eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
-              enim ad minim veniam, quis nostrud exercitation ullamco laboris
-              nisi ut aliquip ex ea commodo consequat.
-            </p>
-          </InfoPopover>
+          {criterionDescription && (
+            <InfoPopover onClick={() => {}}>
+              <p>{criterionDescription}</p>
+            </InfoPopover>
+          )}
         </div>
         {selectedOption && (
           <p>
@@ -41,10 +39,7 @@ const Feedback = ({
         )}
       </div>
       <div className='bg-gray-100 p-3'>
-        <Collapsible.Advanced
-          open={isExpanded}
-          onToggle={toggle}
-        >
+        <Collapsible.Advanced open={isExpanded} onToggle={toggle}>
           <Collapsible.Trigger className='d-flex justify-content-between'>
             <h5 className='mb-0'>{commentHeader} Comment</h5>
             {isExpanded ? (
@@ -73,6 +68,7 @@ Feedback.defaultProps = {
 Feedback.propTypes = {
   defaultOpen: PropTypes.bool,
   criterionName: PropTypes.string.isRequired,
+  criterionDescription: PropTypes.string,
   selectedOption: PropTypes.string,
   selectedPoints: PropTypes.number,
   commentHeader: PropTypes.string.isRequired,

diff --git a/src/data/services/lms/fakeData/pageData/assessments.js b/src/data/services/lms/fakeData/pageData/assessments.js
@@ -11,10 +11,9 @@ export const createAssessmentState = ({
 
 const gradedState = createAssessmentState({
   assessment_criterions: new Array(4).fill(0).map((_, i) => ({
-    name: `Criterion ${i + 1} name`,
-    selectedOption: `Option ${i + 1} name`,
-    selectedPoints: i,
     feedback: `feedback ${i + 1}`,
+    // random 0-3
+    selectedOption: Math.floor(Math.random() * 4)
   })),
   overall_feedback: 'nice job',
 });

diff --git a/src/data/services/lms/types/pageData.ts b/src/data/services/lms/types/pageData.ts
@@ -76,12 +76,8 @@ export interface ResponseData {
 
 // Assessments Data
 export interface AssessmentData {
-  optionsSelected: { [key: string]: string | null },
-  criterionFeedback: { [key: string]: string },
   assessmentCriterions: {
-    name: string,
-    selectedOption: string | null,
-    selectedPoints: number | null,
+    selectedOption: number | null,
     feedback: string,
   }[],
   overallFeedback: string | null,