update api to match docs

src/App.jsx

@@ -29,15 +29,15 @@ const App = ({ courseMetadata }) => (
 );
 App.defaultProps = {
   courseMetadata: {
-    name: '',
+    title: '',
     number: null,
     org: '',
   },
 };
 App.propTypes = {
   courseMetadata: PropTypes.shape({
-    name: PropTypes.string,
-    number: PropTypes.number,
+    title: PropTypes.string,
+    number: PropTypes.string,
     org: PropTypes.string,
   }),
 };

src/components/StatusBadge.jsx

@@ -9,16 +9,23 @@ import { gradingStatuses as statuses } from 'data/services/lms/constants';
  * <StatusBadge />
  */
 export const StatusBadge = ({ className, status }) => {
+  let args = {
+    label: status,
+    variant: 'light',
+  };
   if (status === statuses.ungraded) {
-    return (<Badge className={className} variant="primary">Ungraded</Badge>);
+    args = { label: 'Ungraded', variant: 'primary' };
   }
   if (status === statuses.locked) {
-    return (<Badge className={className} variant="light">Grading in progress</Badge>);
+    args = { label: 'Grading in progress', variant: 'light' };
   }
   if (status === statuses.graded) {
-    return (<Badge className={className} variant="success">Grading Complete</Badge>);
+    args = { label: 'Grading Complete', variant: 'success' };
   }
-  return (<Badge>{status}</Badge>);
+  if (status === statuses.inProgress) {
+    args = { label: 'Locked by you', variant: 'warning' };
+  }
+  return (<Badge className={className} variant={args.variant}>{args.label}</Badge>);
 };
 StatusBadge.defaultProps = {
   className: '',

src/containers/ListView/index.jsx

@@ -30,9 +30,12 @@ export class ListView extends React.Component {
     return date.toLocaleString();
   }
 
-  formatGrade = ({ value }) => (
-    value === null ? '-' : value
-  );
+  formatGrade = ({ value: grade }) => {
+    console.log({ grade });
+    return (
+      grade === null ? '-' : `${grade.pointsEarned}/${grade.pointsPossible}`
+    );
+  }
 
   formatStatus = ({ value }) => (<StatusBadge status={value} />);
 
@@ -49,6 +52,9 @@ export class ListView extends React.Component {
 
   render() {
     console.log({ props: this.props, length: this.props.listData.length });
+    if (this.props.listData.length === 0) {
+      return null;
+    }
     return (
       <div id="ora-esg-list-view">
         <DataTable
@@ -115,7 +121,10 @@ ListView.propTypes = {
     username: PropTypes.string,
     dateSubmitted: PropTypes.number,
     status: PropTypes.string,
-    grade: PropTypes.number,
+    grade: PropTypes.shape({
+      pointsEarned: PropTypes.number,
+      pointsPossible: PropTypes.number,
+    }),
   })),
   loadSelectionForReview: PropTypes.func.isRequired,
 };

src/containers/ReviewModal/index.jsx

@@ -39,6 +39,9 @@ export class ReviewModal extends React.Component {
   }
 
   render() {
+    if (this.props.response === null) {
+      return null;
+    }
     return (
       <FullscreenModal
         title={this.props.oraName}
@@ -53,13 +56,15 @@ export class ReviewModal extends React.Component {
     );
   }
 }
-ReviewModal.defaultProps = {};
+ReviewModal.defaultProps = {
+  response: null,
+};
 ReviewModal.propTypes = {
   oraName: PropTypes.string.isRequired,
   isOpen: PropTypes.bool.isRequired,
   response: PropTypes.shape({
     text: PropTypes.node,
-  }).isRequired,
+  }),
   setShowReview: PropTypes.func.isRequired,
 };
 

src/data/reducers/app.js

@@ -8,7 +8,7 @@ const initialState = {
   },
   courseMetadata: {
     name: '',
-    number: 0,
+    number: '',
     org: '',
   },
   showReview: false,

src/data/reducers/submissions.js

@@ -1,34 +1,83 @@
 import actions from 'data/actions';
 
 const initialState = {
-  list: {},
-  selected: [],
+  list: {
+    /**
+     * <submissionId>: {
+     *   submissionId: '',
+     *   username: ''
+     *   teamName: ''
+     *   dateSubmitted: 0,
+     *   status: ''
+     *   grade: {
+     *     pointsEarned: 0,
+     *     pointsPossible: 0,
+     *   }
+     * }
+     */
+  },
+  selected: [
+    /**
+     * {
+     *   submissionId: '',
+     *   username: ''
+     *   teamName: ''
+     *   dateSubmitted: 0,
+     *   status: '',
+     * }
+     */
+  ],
   activeIndex: null, // submissionId
   current: {
-    submissionId: null,
-    response: {
-      text: '',
-      files: [],
-    },
-    rubric: {
-      name: '',
-      commentRequirement: 'optional',
-      criteria: [
-        {
-          name: '',
-          description: '',
-          points: 0,
-          commentRequirement: 'optional',
-        },
-      ],
-    },
-    rubricData: {
-    },
-    grade: null,
-    status: null,
+    /**
+     * staticData: {
+     *   submissionId: '',
+     *   username: ''
+     *   teamName: ''
+     *   dateSubmitted: 0,
+     *   status: ''
+     *   rubricConfig: {
+     *     feedback: '',
+     *     criteria: [{
+     *       name: '',
+     *       orderNum: 0,
+     *       prompt: '',
+     *       feedback: '',
+     *       options: [{
+     *         orderNum: 0,
+     *         name: '',
+     *         label: '',
+     *         explanation: '',
+     *         points: 0,
+     *       }]
+     *     }],
+     *   },
+     * }
+     * gradeData: {
+     *   score: {
+     *     pointsEarned: 0,
+     *     pointsPossible: 0,
+     *   }
+     *   overallFeedback: '',
+     *   criteria: [{
+     *     name: '',
+     *     feedback: '',
+     *     score: 0,
+     *     selectedOption: '',
+     *   }],
+     * }
+     * response: {
+     *   text: '',
+     *   files: [{
+     *     download_url: '',
+     *     description: '',
+     *     name: '',
+     *   }],
+     * },
+     */
   },
-  prev: null,
-  next: null,
+  prev: null, // { staticData, response }
+  next: null, // { staticData, response }
 };
 
 // eslint-disable-next-line no-unused-vars

src/data/services/lms/constants.js

@@ -4,4 +4,5 @@ export const gradingStatuses = StrictDict({
   ungraded: 'ungraded',
   graded: 'graded',
   locked: 'locked',
+  inProgress: 'in-progress',
 });

src/data/services/lms/fakeData/course.js

@@ -1,5 +1,5 @@
 export const org = 'AuroraU';
-export const number = 101;
+export const number = '101';
 export const title = 'Time Travel 101';
 
 export default { org, number, title };

src/data/services/lms/fakeData/submissionFull.js

@@ -6,37 +6,53 @@ Phasellus tempor eros aliquam ipsum molestie, vitae varius lectus tempus. Morbi
 Phasellus porttitor vel magna et auctor. Nulla porttitor convallis aliquam. Donec cursus, ipsum ut egestas bibendum, purus metus dignissim est, ac condimentum leo felis eget diam. In magna mi, tincidunt id sapien id, fermentum vestibulum quam. Quisque et dui sed urna convallis rutrum pellentesque quis sapien. Cras non lectus velit. Praesent semper eros id risus mollis, quis interdum quam imperdiet. Sed nec vulputate tortor, at tristique tortor.
 </div>`;
 
-const rubric = {
-  name: 'Rubric name',
+const rubricConfig = {
   comments: 'rubric-level comments',
   criteria: [
     {
-      name: 'Poor',
-      description: 'Includes little information with few or no details or unrelated details.  Unsuccessful in attempts to explore any facets of the topic.',
-      points: 0,
-      comments: 'criterion 0 comments',
-    },
-    {
-      name: 'Fair',
-      description: 'Includes little information and few or no details.  Explores only one or two facets of the topic.',
-      points: 1,
-      comments: 'criterion 1 comments',
-    },
-    {
-      name: 'Poor',
-      description: 'Includes sufficient information and supporting details.  (Details may not be fully developed; ideas may be listed.)  Explores some facets of the topic.',
-      points: 2,
-      comments: 'criterion 2 comments',
-    },
-    {
-      name: 'Excellent',
-      description: 'Includes in-depth information and exceptional supportint details that are fully developed.  Explores all facets of the topic',
-      points: 3,
-      comments: 'criterion 3 comments',
+      name: 'First Criterion',
+      orderNum: 0,
+      prompt: 'A criterion prompt',
+      feedback: 'optional',
+      options: [
+        {
+          orderNum: 0,
+          name: 'poor',
+          label: 'Poor',
+          explanation: 'Includes little information with few or no details or unrelated details.  Unsuccessful in attempts to explore any facets of the topic.',
+          points: 0,
+          feedback: 'optional',
+        },
+        {
+          orderNum: 1,
+          name: 'fair',
+          prompt: 'Fair',
+          explanation: 'Includes little information and few or no details.  Explores only one or two facets of the topic.',
+          points: 1,
+          feedback: 'optional',
+        },
+        {
+          orderNum: 2,
+          name: 'good',
+          prompt: 'Good',
+          explanation: 'Includes sufficient information and supporting details.  (Details may not be fully developed; ideas may be listed.)  Explores some facets of the topic.',
+          points: 2,
+          feedback: 'optional',
+        },
+        {
+          orderNum: 3,
+          name: 'excellent',
+          prompt: 'Excellent',
+          explanation: 'Includes in-depth information and exceptional supportint details that are fully developed.  Explores all facets of the topic',
+          points: 3,
+          feedback: 'optional',
+        },
+      ],
     },
   ],
 };
 
+// eslint-disable-next-line
 export const mockSubmission = (submissionId) => ({
   response: {
     text: responseText,
@@ -44,5 +60,5 @@ export const mockSubmission = (submissionId) => ({
   },
   status: submissionList[submissionId].status,
   grade: submissionList[submissionId].grade,
-  rubric,
+  rubricConfig,
 });

src/data/services/lms/fakeData/submissionList.js

@@ -5,9 +5,13 @@ import { gradingStatuses as statuses } from '../constants';
  * Response entries, with identifier.
  * {
  *   id: {string}
- *   learnerId: {string}
+ *   submissionId: {string}
+ *   username: {string} (optional)
  *   dateSubmitted: {number}
- *   grade: {number}
+ *   grade: {
+ *     pointsPossible: {number}
+ *     pointsEarned: {number}
+ *   }
  *   status: {string}
  * }
  */
@@ -22,11 +26,10 @@ const createSubmission = (grade, status) => {
   const index = lastIndex;
   lastIndex += 1;
   const submissionId = ids.submissionId(index);
-  const learnerId = ids.learnerId(index);
   submissions[submissionId] = {
     submissionId,
     username: ids.username(index),
-    learnerId,
+    // teamName: '',
     dateSubmitted: date0 + (day * index),
     status,
     grade,
@@ -35,8 +38,18 @@ const createSubmission = (grade, status) => {
 
 for (let i = 0; i < 20; i++) {
   createSubmission(null, statuses.ungraded);
-  createSubmission(70 + i, statuses.locked);
-  createSubmission(80 + i, statuses.graded);
+  createSubmission(
+    { pointsEarned: 70 + i, pointsPossible: 100 },
+    statuses.locked,
+  );
+  createSubmission(
+    { pointsEarned: 80 + i, pointsPossible: 100 },
+    statuses.graded,
+  );
+  createSubmission(
+    null,
+    statuses.inProgress,
+  );
 }
 
 export default submissions;