1 files changed, 15 insertions, 40 deletions

diff --git a/src/App.js b/src/App.js
index 347d243..fb77d93 100644
--- a/src/App.js
+++ b/src/App.js
@@ -18,9 +18,10 @@
  */
 
 import React, { Component } from 'react';
-import {Parser} from 'xml2js';
+import { Parser } from 'xml2js';
+import JSZip from 'jszip';
 
-import {Counters, SessionInfo, PackagesCoverage} from './Blocks.js';
+import { Report } from './Report.js';
 import './App.css';
 
 class App extends Component {
@@ -28,24 +29,31 @@ class App extends Component {
     super(props);
     this.state = {
       report: null,
+      sourceSet: null,
       hasError: false
     };
   }
 
   componentDidCatch(error, info) {
     this.setState({ hasError: true });
-    console.err(error, info);
+    console.error(error, info);
   }
 
   _useReportFile(file) {
     const fileReader = new FileReader();
-    fileReader.onloadend = (readEvent) => this._useReport(readEvent.target.result);
+    fileReader.onloadend = readEvent => this._useReport(readEvent.target.result);
     fileReader.readAsText(file);
   }
 
   _useReport(xmlString) {
+    this.setState({ hasError: false });
     const xmlParser = new Parser();
-    xmlParser.parseString(xmlString, (err, result) => this.setState({ report: result.report }));
+    xmlParser.parseString(xmlString, (_, result) => this.setState({ report: result.report }));
+  }
+
+  _useSourceArchive(file) {
+    this.setState({ hasError: false });
+    JSZip.loadAsync(file).then(zip => this.setState({ sourceSet: zip.files }));
   }
 
   _renderError() {
@@ -58,7 +66,7 @@ class App extends Component {
   }
 
   _renderReport() {
-    return this.state.hasError ? this._renderError(): (<Report report={this.state.report} />);
+    return this.state.hasError ? this._renderError(): (<Report report={this.state.report} sourceSet={this.state.sourceSet} />);
   }
 
   render() {
@@ -73,7 +81,7 @@ class App extends Component {
 
         <div>
           <label htmlFor="sourceJar">Source JAR: </label>
-          <input id="sourceJar" type="file" accept=".jar" onChange={event => null} />
+          <input id="sourceJar" type="file" accept=".jar" onChange={event => this._useSourceArchive(event.target.files[0])} />
         </div>
 
         <hr />
@@ -83,37 +91,4 @@ class App extends Component {
   }
 }
 
-class Report extends Component {  
-  _renderNone() {
-    return (<span>Please provide a JaCoCo XML report file to visualise.</span>);
-  }
-
-  _renderReport() {
-    return (
-      <div>
-        <h2>Viewing report: "{this.props.report.$.name}"</h2>
-
-        <section>
-          <h3>Session info</h3>
-          <SessionInfo data={this.props.report.sessioninfo} />
-        </section>
-        
-        <section>
-          <h3>Global coverage</h3>
-          <Counters data={this.props.report.counter} />
-        </section>
-
-        <section>
-          <h3>Details</h3>
-          <PackagesCoverage packages={this.props.report.package} />
-        </section>
-      </div>
-    );
-  }
-
-  render() {
-    return this.props.report ? this._renderReport() : this._renderNone();
-  }
-}
-
 export default App;