React source code to download file via ajax

download.js

import React, { Component } from 'react';
import './App.css';
//import Person from './Person';

class App extends Component {

  constructor(){
    super();
    this.state = {
      downloaded : 'NOT YET',
      persons : [
        {id: '10', name:'Funke', age: 28},
        {id: '11', name:'Adaobi', age: 21},
        {id: '12', name:'Amina', age: 23}
      ]
    }

  }

  downloadReport = () => {

    this.setState({downloaded : 'Downloading'});

    let accessToken = 'Bearer eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiIzIiwiaWF0IjoxNTQxMDAzNjM4LCJleHAiOjE1NDE2MDM2Mzh9.5HIFmVa6UfBs24Gv6hg5WHSaumyCS7tCE9ntehOyVeFrQFKzd1ZJQPu7N_YRle4G0V5YqQT5SkvavFzV3bTtLw';
    let headers = new Headers();
    headers.append('Authorization',accessToken);
    //headers.set('Content-Type','application/x-www-form-urlencoded')

    fetch('http://localhost:8080/api/participant?page=1&pageSize=20&programId=1&downloadReport=1',{method:'GET', headers: headers })
    .then(res => {
      return res.blob();
    })
    .then(blob => {
      this.setState({downloaded : 'Downloaded'})

      var newBlob = new Blob([blob], {type: "text/csv"})
 
      // IE doesn't allow using a blob object directly as link href
      // instead it is necessary to use msSaveOrOpenBlob
      if (window.navigator && window.navigator.msSaveOrOpenBlob) {
        window.navigator.msSaveOrOpenBlob(newBlob);
        return;
      } 

      // For other browsers: 
      // Create a link pointing to the ObjectURL containing the blob.
      const data = window.URL.createObjectURL(newBlob);
      var link = document.createElement('a');
      link.href = data;
      link.download="file.csv";
      link.click();
      setTimeout(function(){
        // For Firefox it is necessary to delay revoking the ObjectURL
        window.URL.revokeObjectURL(data);}
  , 100)

    });
  }


   nameChangeHandler = (event, id) => {

    let name = event.target.value;
    let personIdex = this.state.persons.findIndex(person => {
      if(person.id === id)
        return true
      
      return false;
    });

    let persons = [...this.state.persons];
    console.log(personIdex);
    persons[personIdex].name = name;
    

    this.setState({persons: persons});
  }

  personDeleteHandler = (id) => {

    let persons = this.state.persons.filter(person => {
        if(person.id !== id){
          return true;
        }
        return false;
      });

    console.log(persons);

    this.setState({persons: persons});
    // let personIndex = this.state.persons.findIndex(person => {
    //   if(person.id === id){
    //     return true;
    //   }
    //   return false;
    // })


  }


  componentDidMount(){

    
  }


  render() {


    return (
      <div className="App">
        <h1>{this.state.downloaded}</h1>
       <button onClick={this.downloadReport}>Download</button>
      </div>
    );
  }
}

export default App;