Merge pull request #12 from edx/schen/fix_download_link

fix(functionality): Update the download report link URL

package-lock.json

@@ -2965,20 +2965,18 @@
       }
     },
     "@edx/frontend-auth": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@edx/frontend-auth/-/frontend-auth-1.2.0.tgz",
-      "integrity": "sha512-acQ+rxDYN84z0gUBkcRhUQO+guMMcRSei/PxYvr9j/aCpa8GoelL/K+TKyFuSfEuUcCuzmfUnJHpU6JtulzQcw==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@edx/frontend-auth/-/frontend-auth-1.1.0.tgz",
+      "integrity": "sha512-Pl6CUgwRPHcKx3REX1CXJIGl/WqSCg20IPGNUbpsyQ4ZuIaOi/bxI6dYfGhmOWt8LPLeBiEmGerofEWLNydZ9w==",
       "requires": {
         "axios": "^0.18.0",
         "jwt-decode": "^2.2.0",
         "prop-types": "^15.5.10",
-        "pubsub-js": "^1.7.0",
         "react": "^16.4.2",
         "react-redux": "^5.0.7",
         "react-router-dom": "^4.3.1",
         "redux": "^4.0.0",
-        "universal-cookie": "^3.0.4",
-        "url-parse": "^1.4.3"
+        "universal-cookie": "^3.0.4"
       },
       "dependencies": {
         "invariant": {
@@ -2989,11 +2987,6 @@
             "loose-envify": "^1.0.0"
           }
         },
-        "querystringify": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.1.0.tgz",
-          "integrity": "sha512-sluvZZ1YiTLD5jsqZcDmFyV2EwToyXZBfpoVOmktMmW+VEnhgakFHnasVph65fOjGPTWN0Nw3+XQaSeMayr0kg=="
-        },
         "react": {
           "version": "16.6.3",
           "resolved": "https://registry.npmjs.org/react/-/react-16.6.3.tgz",
@@ -3071,15 +3064,6 @@
             "object-assign": "^4.1.1"
           }
         },
-        "url-parse": {
-          "version": "1.4.4",
-          "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.4.4.tgz",
-          "integrity": "sha512-/92DTTorg4JjktLNLe6GPS2/RvAd/RGr6LuktmWSMLEOa6rjnlrFXNgSbSmkNvCoL2T028A0a1JaJLzRMlFoHg==",
-          "requires": {
-            "querystringify": "^2.0.0",
-            "requires-port": "^1.0.0"
-          }
-        },
         "warning": {
           "version": "4.0.2",
           "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.2.tgz",
@@ -19181,11 +19165,6 @@
         "randombytes": "^2.0.1"
       }
     },
-    "pubsub-js": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/pubsub-js/-/pubsub-js-1.7.0.tgz",
-      "integrity": "sha512-Pb68P9qFZxnvDipHMuj9oT1FoIgBcXJ9C9eWdHCLZAnulaUoJ3+Y87RhGMYilWpun6DMWVmvK70T4RP4drZMSA=="
-    },
     "pump": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/pump/-/pump-2.0.1.tgz",
@@ -20123,7 +20102,8 @@
     "requires-port": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
-      "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8="
+      "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=",
+      "dev": true
     },
     "resolve": {
       "version": "1.5.0",

package.json

@@ -25,7 +25,7 @@
   },
   "dependencies": {
     "@edx/edx-bootstrap": "^0.4.3",
-    "@edx/frontend-auth": "^1.2.0",
+    "@edx/frontend-auth": "1.1.0",
     "@edx/paragon": "^3.7.0",
     "babel-polyfill": "^6.26.0",
     "classnames": "^2.2.5",

src/components/Gradebook/index.jsx

@@ -1,9 +1,7 @@
 import React from 'react';
-import PropTypes from 'prop-types';
-import emailPropType from 'email-prop-type';
 import { Button, Modal, SearchField, Table, InputSelect } from '@edx/paragon';
 import queryString from 'query-string';
-
+import { configuration } from '../../config';
 
 export default class Gradebook extends React.Component {
   constructor(props) {
@@ -170,7 +168,7 @@ export default class Gradebook extends React.Component {
             <input
               style={{ width: '25px' }}
               type="text"
-              onChange={(event) => this.setState({updateVal: event.target.value})}
+              onChange={event => this.setState({ updateVal: event.target.value })}
             /> / {subsection.score_possible}
           </span>
         ),
@@ -180,7 +178,7 @@ export default class Gradebook extends React.Component {
       updateModuleId: subsection.module_id,
       updateUserId: userEntry.user_id,
 
-    })
+    });
   }
 
   mapUserEntriesPercent = entries => entries.map((entry) => {
@@ -223,10 +221,10 @@ export default class Gradebook extends React.Component {
   handleAdjustedGradeClick = () => {
     this.props.updateGrades(this.props.match.params.courseId, [
       {
-        'user_id': this.state.updateUserId,
-        'usage_id': this.state.updateModuleId,
-        'grade': {
-          'earned_graded_override': this.state.updateVal,
+        user_id: this.state.updateUserId,
+        usage_id: this.state.updateModuleId,
+        grade: {
+          earned_graded_override: this.state.updateVal,
         },
       },
     ]);
@@ -238,27 +236,27 @@ export default class Gradebook extends React.Component {
   };
 
   mapCohortsEntries = (entries) => {
-    let mapped = entries.map(entry => ({
+    const mapped = entries.map(entry => ({
       id: entry.id,
       label: entry.name,
     }));
-    mapped.unshift({id:0, label:'Cohorts'});
+    mapped.unshift({ id: 0, label: 'Cohorts' });
     return mapped;
   };
 
   mapTracksEntries = (entries) => {
-    let mapped = entries.map(entry => ({
+    const mapped = entries.map(entry => ({
       id: entry.slug,
       label: entry.name,
     }));
-    mapped.unshift({ label:'Tracks' });
+    mapped.unshift({ label: 'Tracks' });
     return mapped;
   };
 
   updateTracks = (event) => {
-    const selectedTrackItem = this.props.tracks.find(x=>x.name===event);
+    const selectedTrackItem = this.props.tracks.find(x => x.name === event);
     let selectedTrackSlug = null;
-    if(selectedTrackItem) {
+    if (selectedTrackItem) {
       selectedTrackSlug = selectedTrackItem.slug;
     }
     this.props.getUserGrades(
@@ -266,14 +264,14 @@ export default class Gradebook extends React.Component {
       this.props.selectedCohort,
       selectedTrackSlug,
     );
-    const updatedQueryStrings = this.updateQueryParams('track', selectedTrackSlug)
+    const updatedQueryStrings = this.updateQueryParams('track', selectedTrackSlug);
     this.props.history.push(updatedQueryStrings);
   };
 
   updateCohorts = (event) => {
-    const selectedCohortItem = this.props.cohorts.find(x=>x.name===event);
+    const selectedCohortItem = this.props.cohorts.find(x => x.name === event);
     let selectedCohortId = null;
-    if(selectedCohortItem) {
+    if (selectedCohortItem) {
       selectedCohortId = selectedCohortItem.id;
     }
     this.props.getUserGrades(
@@ -281,7 +279,7 @@ export default class Gradebook extends React.Component {
       selectedCohortId,
       this.props.selectedTrack,
     );
-    const updatedQueryStrings = this.updateQueryParams('cohort', selectedCohortId)
+    const updatedQueryStrings = this.updateQueryParams('cohort', selectedCohortId);
     this.props.history.push(updatedQueryStrings);
   };
 
@@ -301,6 +299,9 @@ export default class Gradebook extends React.Component {
     return 'Tracks';
   };
 
+  getDataDownloadUrl = courseId => `${configuration.LMS_BASE_URL}/courses/${courseId}/instructor#view-data_download`;
+
+
   render() {
     return (
       <div className="d-flex justify-content-center">
@@ -384,7 +385,7 @@ export default class Gradebook extends React.Component {
                     </span>
                     {this.props.tracks.length > 0 &&
                       <InputSelect
-                        name='Tracks'
+                        name="Tracks"
                         value={this.mapSelectedTrackEntry(this.props.selectedTrack)}
                         options={this.mapTracksEntries(this.props.tracks)}
                         onChange={this.updateTracks}
@@ -392,7 +393,7 @@ export default class Gradebook extends React.Component {
                     }
                     {this.props.cohorts.length > 0 &&
                       <InputSelect
-                        name='Cohorts'
+                        name="Cohorts"
                         value={this.mapSelectedCohortEntry(this.props.selectedCohort)}
                         options={this.mapCohortsEntries(this.props.cohorts)}
                         onChange={this.updateCohorts}
@@ -403,7 +404,7 @@ export default class Gradebook extends React.Component {
               </div>
               <div>
                 <div style={{ marginLeft: '10px', marginBottom: '10px' }}>
-                  <a href="https://www.google./com">Download Grade Report</a>
+                  <a href={this.getDataDownloadUrl(this.props.match.params.courseId)}>Download Grade Report</a>
                 </div>
                 <SearchField
                   onSubmit={value => this.props.searchForUser(this.props.match.params.courseId, value, this.props.selectedCohort, this.props.selectedTrack)}
@@ -430,12 +431,12 @@ export default class Gradebook extends React.Component {
                 <div>
                   <h3>{this.state.modalModel[0].assignmentName}</h3>
                   <Table
-                      columns={[{ label: 'Username', key: 'username' }, { label: 'Current grade', key: 'currentGrade' }, { label: 'Adjusted grade', key: 'adjustedGrade' }]}
-                      data={this.state.modalModel}
-                      tableSortable
-                      defaultSortDirection="desc"
-                      defaultSortedColumn="username"
-                    />
+                    columns={[{ label: 'Username', key: 'username' }, { label: 'Current grade', key: 'currentGrade' }, { label: 'Adjusted grade', key: 'adjustedGrade' }]}
+                    data={this.state.modalModel}
+                    tableSortable
+                    defaultSortDirection="desc"
+                    defaultSortedColumn="username"
+                  />
                 </div>
               )}
               buttons={[
@@ -443,7 +444,7 @@ export default class Gradebook extends React.Component {
                   label="Edit Grade"
                   buttonType="primary"
                   onClick={this.handleAdjustedGradeClick}
-                />
+                />,
               ]}
               onClose={() => this.setState({
                 modalOpen: false,