fix: Fix rows counter in the Edit Grade modal window (olive branch) (#311)

* fix: Fix rows counter in the Edit Grade modal window

* fix: Update tests

src/components/GradesView/EditModal/OverrideTable/AdjustedGradeInput.jsx

@@ -21,15 +21,28 @@ export class AdjustedGradeInput extends React.Component {
   }
 
   onChange = ({ target }) => {
-    this.props.setModalState({ adjustedGradeValue: target.value });
+    let adjustedGradeValue;
+    switch (true) {
+      case target.value < 0:
+        adjustedGradeValue = 0;
+        break;
+      case this.props.possibleGrade && target.value > this.props.possibleGrade:
+        adjustedGradeValue = this.props.possibleGrade;
+        break;
+      default:
+        adjustedGradeValue = target.value;
+    }
+    this.props.setModalState({ adjustedGradeValue });
   };
 
   render() {
     return (
       <span>
         <Form.Control
-          type="text"
+          type="number"
           name="adjustedGradeValue"
+          min="0"
+          max={this.props.possibleGrade ? this.props.possibleGrade : ''}
           value={this.props.value}
           onChange={this.onChange}
         />

src/components/GradesView/EditModal/OverrideTable/AdjustedGradeInput.test.jsx

@@ -54,9 +54,34 @@ describe('AdjustedGradeInput', () => {
     });
     describe('behavior', () => {
       describe('onChange', () => {
-        it('calls props.setModalState event target value', () => {
+        it('calls props.setModalState event target value with correct value', () => {
+          const value = 3;
+          el.instance().onChange({ target: { value } });
+          expect(props.setModalState).toHaveBeenCalledWith({
+            adjustedGradeValue: value,
+          });
+        });
+
+        it('calls props.setModalState event target value with a value more then the possibleGrade value', () => {
           const value = 42;
           el.instance().onChange({ target: { value } });
+          expect(props.setModalState).toHaveBeenCalledWith({
+            adjustedGradeValue: props.possibleGrade,
+          });
+        });
+
+        it('calls props.setModalState event target value with less then 0', () => {
+          const value = -5;
+          el.instance().onChange({ target: { value } });
+          expect(props.setModalState).toHaveBeenCalledWith({
+            adjustedGradeValue: 0,
+          });
+        });
+
+        it('calls props.setModalState event target value without possibleGrade value', () => {
+          const value = 100;
+          const newEl = shallow(<AdjustedGradeInput {...props} possibleGrade={null} />);
+          newEl.instance().onChange({ target: { value } });
           expect(props.setModalState).toHaveBeenCalledWith({
             adjustedGradeValue: value,
           });

src/components/GradesView/EditModal/OverrideTable/__snapshots__/AdjustedGradeInput.test.jsx.snap

@@ -3,9 +3,11 @@
 exports[`AdjustedGradeInput Component snapshots displays input control and "out of possible grade" label 1`] = `
 <span>
   <Control
+    max={5}
+    min="0"
     name="adjustedGradeValue"
     onChange={[MockFunction this.onChange]}
-    type="text"
+    type="number"
     value={1}
   />
    / 5

src/components/GradesView/EditModal/OverrideTable/__snapshots__/test.jsx.snap

@@ -59,6 +59,6 @@ exports[`OverrideTable Component snapshots basic snapshot shows a row for each e
       },
     ]
   }
-  itemCount={2}
+  itemCount={3}
 />
 `;

src/components/GradesView/EditModal/OverrideTable/index.jsx

@@ -26,6 +26,16 @@ export const OverrideTable = ({
   if (hide) {
     return null;
   }
+
+  const tableData = [
+    ...gradeOverrides,
+    {
+      adjustedGrade: <AdjustedGradeInput />,
+      date: todaysDate,
+      reason: <ReasonInput />,
+    },
+  ];
+
   return (
     <DataTable
       columns={[
@@ -37,15 +47,8 @@ export const OverrideTable = ({
           accessor: columns.adjustedGrade,
         },
       ]}
-      data={[
-        ...gradeOverrides,
-        {
-          adjustedGrade: <AdjustedGradeInput />,
-          date: todaysDate,
-          reason: <ReasonInput />,
-        },
-      ]}
-      itemCount={gradeOverrides.length}
+      data={tableData}
+      itemCount={tableData.length}
     />
   );
 };

src/data/selectors/index.js

@@ -91,17 +91,10 @@ export const formattedGradeLimits = (state) => {
   const { assignmentGradeMax, assignmentGradeMin } = app.assignmentGradeLimits(state);
   const { courseGradeMax, courseGradeMin } = app.courseGradeLimits(state);
   const hasAssignment = filters.selectedAssignmentId(state) !== undefined;
-  if (!hasAssignment) {
-    return {
-      assignmentGradeMax: null,
-      assignmentGradeMin: null,
-      courseGradeMax: null,
-      courseGradeMin: null,
-    };
-  }
+
   return {
-    assignmentGradeMax: assignmentGradeMax === maxGrade ? null : assignmentGradeMax,
-    assignmentGradeMin: assignmentGradeMin === minGrade ? null : assignmentGradeMin,
+    assignmentGradeMax: (assignmentGradeMax === maxGrade || !hasAssignment) ? null : assignmentGradeMax,
+    assignmentGradeMin: (assignmentGradeMin === minGrade || !hasAssignment) ? null : assignmentGradeMin,
     courseGradeMax: courseGradeMax === maxGrade ? null : courseGradeMax,
     courseGradeMin: courseGradeMin === minGrade ? null : courseGradeMin,
   };

src/data/selectors/index.test.js

@@ -260,15 +260,15 @@ describe('root selectors', () => {
     };
     const grade1 = '42';
     const grade2 = '3.14';
-    it('returns an object of nulls if assignment is not set', () => {
+    it('returns an object of nullable assignmentGrades if assignment is not set', () => {
       mockId(undefined);
       mockAssgn(grade1, grade2);
       mockCourse(grade1, grade2);
       expect(selector(testState)).toEqual({
         assignmentGradeMax: null,
         assignmentGradeMin: null,
-        courseGradeMax: null,
-        courseGradeMin: null,
+        courseGradeMax: '42',
+        courseGradeMin: '3.14',
       });
     });
     it('returns null for each extreme iff they are equal their default', () => {