Add a button on Pepite home page to extract applications in xls file

client/package.json

@@ -37,6 +37,7 @@
     "bootstrap": "3.3.7",
     "bootswatch": "3.3.7",
     "cleave.js": "0.7.15",
+    "file-saver": "1.3.3",
     "jquery": "3.1.1",
     "jwt-decode": "2.1.0",
     "moment": "2.17.1",

client/src/actions/applicationActions.js

@@ -90,3 +90,10 @@ export function getPepiteApplication() {
     return applicationApi.getAllPepiteApplications(user.id, user.token)
   }
 }
+
+export function getPepiteApplicationXls() {
+  return (dispatch, getState) => {
+    const {user} = getState()
+    return applicationApi.getAllPepiteApplicationsXls(user.id, user.token)
+  }
+}

client/src/api/applicationApi.js

@@ -1,4 +1,5 @@
 import axios from 'axios'
+import { getFilename } from './requestUtils'
 // eslint-disable-next-line no-undef
 axios.defaults.baseURL = API_URI
 
@@ -66,6 +67,26 @@ class applicationApi {
         throw new Error(err)
       })
   }
+
+  static getAllPepiteApplicationsXls(pepiteId, userToken) {
+    return axios.get(`/pepite/${pepiteId}/application/xls`,
+      {
+        'headers': {
+          'Authorization': `Bearer ${userToken}`
+        }
+      })
+      .then((res) => {
+        console.log(res.data)
+        return {
+          data: res.data,
+          type: res.headers['content-type'],
+          filename: getFilename(res.headers['content-disposition'])
+        }
+      })
+      .catch((err) => {
+        throw new Error(err)
+      })
+  }
 }
 
 export default applicationApi

client/src/api/requestUtils.js

@@ -0,0 +1,9 @@
+export function getFilename(header) {
+  const re = /.*filename=['"](.*)['"].*/
+  const match = header.match(re)
+  if (match && match.length == 2) {
+    return match[1]
+  } else {
+    return null
+  }
+}

client/src/api/requestUtils.test.js

@@ -0,0 +1,18 @@
+import expect from 'expect'
+import { getFilename } from './requestUtils'
+
+
+describe('requestUtils', () => {
+  describe('getFilename', () => {
+    it('should return the fileaname in a Content-Disposition header', () => {
+      const filename = 'data.xls'
+      const contentDispostionHeader = `attachment; filename="${filename}"`
+      expect(getFilename(contentDispostionHeader)).toBe(filename)
+    })
+    it('should return null otherwise', () => {
+      const filename = 'data.xls'
+      const badContentDispostionHeader = `attachment; filenamebad="${filename}"`
+      expect(getFilename(badContentDispostionHeader)).toBe(null)
+    })
+  })
+})

client/src/components/pepite/PepiteHomePage.js

@@ -3,6 +3,7 @@ import toastr from 'toastr'
 import { connect } from 'react-redux'
 import { Tabs, Tab } from 'react-bootstrap'
 import { bindActionCreators } from 'redux'
+import FileSaver from 'file-saver'
 import * as applicationActions from '../../actions/applicationActions'
 import PepiteApplicantTable from './PepiteApplicantTable'
 
@@ -14,6 +15,7 @@ export class PepiteHomePage extends React.Component {
       accepted: [],
       refused: []
     }
+    this.getPepiteApplicationXls = this.getPepiteApplicationXls.bind(this)
   }
 
   componentDidMount() {
@@ -30,12 +32,19 @@ export class PepiteHomePage extends React.Component {
       })
   }
 
+  getPepiteApplicationXls() {
+    this.props.actions.getPepiteApplicationXls().then(xlsFile => {
+      FileSaver.saveAs(new Blob([xlsFile.data], { type: xlsFile.type }), xlsFile.filename)
+    })
+  }
+
   render() {
     return (
       <div className="container back-content">
         <div className="page-header">
           <h1>Candidatures</h1>
         </div>
+        <a className="btn btn-info btn-xs" target="_blank" onClick={this.getPepiteApplicationXls}>Extraire</a>
         <Tabs defaultActiveKey={1}>
           <Tab eventKey={1} title={<div>En attente <span className="badge">{this.state.applications.length}</span></div>}>
             <PepiteApplicantTable applicants={this.state.applications} />