From ec2e5811edc6b2d34af3e150449707e77331f533 Mon Sep 17 00:00:00 2001 From: Roosted7 <thomasroos@live.nl> Date: Wed, 7 Mar 2018 23:49:25 +0100 Subject: [PATCH] remove spinkit and componentize pdf processing status --- client/views/Exams.js | 34 +++++++++++++++++++--------------- package.json | 1 - 2 files changed, 19 insertions(+), 16 deletions(-) diff --git a/client/views/Exams.js b/client/views/Exams.js index 71c93cd4e..0d5505868 100644 --- a/client/views/Exams.js +++ b/client/views/Exams.js @@ -4,10 +4,27 @@ import Hero from '../components/Hero'; import Footer from '../components/Footer'; import Dropzone from 'react-dropzone' -import Spinner from 'react-spinkit' import * as api from '../api' +const StatusPDF = props => { + var iconClass = "fa fa-"; + switch(props.pdf.status) { + case "processing": + iconClass += "refresh fa-spin"; + break; + case "success": + iconClass += "check"; + break; + case "error": + iconClass += "times"; + break; + } + return <div> + {props.pdf.name} <i className={iconClass}/> + <i> {props.pdf.message}</i> + </div> +} class Exams extends React.Component { @@ -28,7 +45,6 @@ class Exams extends React.Component { this.putYaml = this.putYaml.bind(this); this.updateYaml = this.updateYaml.bind(this); this.selectExam = this.selectExam.bind(this); - this.pdfStatus= this.pdfStatus.bind(this); this.updatePDFList= this.updatePDFList.bind(this); this._pdfUpdater = null; @@ -103,18 +119,6 @@ class Exams extends React.Component { ) } - pdfStatus(pdf) { - switch(pdf.status) { - case "processing": - const style = {display: "inline-block", top: "6px"} - return <div>{pdf.name} <Spinner name="circle" style={style} fadeIn='none'/> <i>{pdf.message}</i></div> - case "success": - return <div>{pdf.name} <i className="fa fa-check"></i>{pdf.message}</div> - case "error": - return <div>{pdf.name} <i className="fa fa-times"></i><i>{pdf.message}</i></div> - } - } - onDropPDF(accepted, rejected) { if (rejected.length > 0) { alert('Please upload a PDF..') @@ -264,7 +268,7 @@ class Exams extends React.Component { </p> <ul className="menu-list"> {this.state.selected_exam.pdfs.map(pdf => - <li key={pdf.id}>{this.pdfStatus(pdf)}</li> + <li key={pdf.id}><StatusPDF pdf={pdf}/></li> )} </ul> </aside> diff --git a/package.json b/package.json index 1786e4ebf..d4c4ad51a 100644 --- a/package.json +++ b/package.json @@ -32,7 +32,6 @@ "react-markdown": "^3.2.2", "react-numeric-input": "^2.2.3", "react-router-dom": "^4.2.2", - "react-spinkit": "^3.0.0", "react-table": "^6.7.6", "style-loader": "^0.19.1", "uglifyjs-webpack-plugin": "^1.1.6", -- GitLab