Merge pull request #112 from edx/matthugs/add-intervention-filters

add intervention filters

src/components/Gradebook/index.jsx

@@ -500,13 +500,6 @@ export default class Gradebook extends React.Component {
                 <div className="d-flex justify-content-between" >
                   {this.props.showSpinner && <div className="spinner-overlay"><Icon className="fa fa-spinner fa-spin fa-5x color-black" /></div>}
                   <div>
-                    <InputSelect
-                      label="Score View:"
-                      name="ScoreView"
-                      value="percent"
-                      options={[{ label: 'Percent', value: 'percent' }, { label: 'Absolute', value: 'absolute' }]}
-                      onChange={this.props.toggleFormat}
-                    />
                     <Collapsible title="Assignments" isOpen>
                       <div>
                         <div className="student-filters">
@@ -672,31 +665,57 @@ export default class Gradebook extends React.Component {
                   }
                 />
                 <h4>Step 2: View or Modify Individual Grades</h4>
+                {this.props.totalUsersCount ?
+                  <div>
+                    Showing
+                    <span className="font-weight-bold"> {this.props.filteredUsersCount} </span>
+                    of
+                    <span className="font-weight-bold"> {this.props.totalUsersCount} </span>
+                    total learners
+                  </div> :
+                  null
+                }
                 <div className="d-flex justify-content-between align-items-center mb-2">
-                  {this.props.totalUsersCount ?
+                  <InputSelect
+                    label="Score View:"
+                    name="ScoreView"
+                    value="percent"
+                    options={[{ label: 'Percent', value: 'percent' }, { label: 'Absolute', value: 'absolute' }]}
+                    onChange={this.props.toggleFormat}
+                  />
+                  {this.props.showDownloadButtons && (
                     <div>
-                      Showing
-                      <span className="font-weight-bold"> {this.props.filteredUsersCount} </span>
-                      of
-                      <span className="font-weight-bold"> {this.props.totalUsersCount} </span>
-                      total learners
-                    </div> :
-                    null
-                  }
-                  {this.props.showDownloadButtons && <StatefulButton
-                    buttonType="primary"
-                    onClick={this.handleClickExportGrades}
-                    state={this.props.showSpinner ? 'pending' : 'default'}
-                    labels={{
-                      default: 'Download Gradebook',
-                      pending: 'Download Gradebook',
-                    }}
-                    icons={{
-                      default: <FontAwesomeIcon className="mr-2" icon={faDownload} />,
-                      pending: <FontAwesomeIcon className="fa-spin mr-2" icon={faSpinner} />,
-                    }}
-                    disabledStates={['pending']}
-                  />}
+                      <StatefulButton
+                        buttonType="primary"
+                        onClick={this.handleClickExportGrades}
+                        state={this.props.showSpinner ? 'pending' : 'default'}
+                        labels={{
+                          default: 'Bulk Management',
+                          pending: 'Bulk Management',
+                        }}
+                        icons={{
+                          default: <FontAwesomeIcon className="mr-2" icon={faDownload} />,
+                          pending: <FontAwesomeIcon className="fa-spin mr-2" icon={faSpinner} />,
+                        }}
+                        disabledStates={['pending']}
+                      />
+                      <StatefulButton
+                        buttonType="primary"
+                        onClick={this.handleClickDownloadInterventions}
+                        state={this.props.showSpinner ? 'pending' : 'default'}
+                        className="ml-2"
+                        labels={{
+                          default: 'Interventions',
+                          pending: 'Interventions',
+                        }}
+                        icons={{
+                          default: <FontAwesomeIcon className="mr-2" icon={faDownload} />,
+                          pending: <FontAwesomeIcon className="fa-spin mr-2" icon={faSpinner} />,
+                        }}
+                        disabledStates={['pending']}
+                      />
+                    </div>
+                  )}
                 </div>
                 <div className="gbook">
                   <Table
@@ -807,14 +826,6 @@ export default class Gradebook extends React.Component {
                   >
                     Import Grades
                   </Button>
-                  <h4>Interventions Report</h4>
-                  <Button
-                    buttonType="primary"
-                    onClick={this.handleClickDownloadInterventions}
-                  >
-                    Download Interventions report
-                  </Button>
-                  <br />
                   <p>
                     Results appear in the table below.<br />
                     Grade processing may take a few seconds.

src/containers/GradebookPage/index.jsx

@@ -85,7 +85,20 @@ const mapStateToProps = (state, ownProps) => (
       courseGradeMax: formatMaxCourseGrade(state.filters.courseGradeMax),
     }),
     interventionExportUrl:
-      LmsApiService.getInterventionExportCsvUrl(ownProps.match.params.courseId),
+      LmsApiService.getInterventionExportCsvUrl(ownProps.match.params.courseId, {
+        assignment: (state.filters.assignment || {}).id,
+        assignmentType: state.filters.assignmentType,
+        assignmentGradeMin: formatMinAssignmentGrade(
+          state.filters.assignmentGradeMin,
+          { assignmentId: (state.filters.assignment || {}).id },
+        ),
+        assignmentGradeMax: formatMaxAssignmentGrade(
+          state.filters.assignmentGradeMax,
+          { assignmentId: (state.filters.assignment || {}).id },
+        ),
+        courseGradeMin: formatMinCourseGrade(state.filters.courseGradeMin),
+        courseGradeMax: formatMaxCourseGrade(state.filters.courseGradeMax),
+      }),
     bulkImportError: state.grades.bulkManagement &&
       state.grades.bulkManagement.errorMessages ?
       `Errors while processing: ${state.grades.bulkManagement.errorMessages.join(', ')}` :

src/data/services/LmsApiService.js

@@ -103,9 +103,14 @@ class LmsApiService {
     return `${LmsApiService.baseUrl}/api/bulk_grades/course/${courseId}/?${queryParams}`;
   }
 
-  static getInterventionExportCsvUrl(courseId) {
-    const downloadUrl = `${LmsApiService.baseUrl}/api/bulk_grades/course/${courseId}/intervention`;
-    return downloadUrl;
+  static getInterventionExportCsvUrl(courseId, options = {}) {
+    const queryParams = ['track', 'cohort', 'assignment', 'assignmentType', 'assignmentGradeMax',
+      'assignmentGradeMin', 'courseGradeMin', 'courseGradeMax']
+      .filter(opt => options[opt] &&
+                   options[opt] !== 'All')
+      .map(opt => `${opt}=${encodeURIComponent(options[opt])}`)
+      .join('&');
+    return `${LmsApiService.baseUrl}/api/bulk_grades/course/${courseId}/intervention?${queryParams}`;
   }
 
   static getGradeImportCsvUrl = LmsApiService.getGradeExportCsvUrl;