diff --git a/src/molecules/Files.js b/src/molecules/Files.js
index 5e653183bc4944e0a6437966466217b8d8d28a8b..e7b5362296c98f8aca444bddc58145c2f44198b7 100644
--- a/src/molecules/Files.js
+++ b/src/molecules/Files.js
@@ -36,9 +36,13 @@ class Files extends React.Component {
       url
     })
 
-    this.setState({ values })
+    const uploads = this.state.uploads.filter(item => {
+      return item.file.name !== file.name
+    })
+
+    this.setState({ values, uploads })
 
-    this.props.handleChange(values)
+    this.props.onChange(values)
   }
 
   render () {
diff --git a/src/molecules/Upload.js b/src/molecules/Upload.js
index d7fcc0052f5a1c5bbd74c07aec32afede4ae2353..6d24f2bba0dbe49b8ddfe7fb92f457ca6170d7d2 100644
--- a/src/molecules/Upload.js
+++ b/src/molecules/Upload.js
@@ -16,8 +16,10 @@ class Upload extends React.Component {
     request.addEventListener('progress', this.handleProgress)
     request.addEventListener('load', this.handleLoad)
     request.addEventListener('error', this.handleError)
+    request.addEventListener('abort', this.handleAbort)
   }
 
+  // TODO: 'progress' event not being fired often enough?
   handleProgress = event => {
     if (!event.lengthComputable) return
 
@@ -43,12 +45,18 @@ class Upload extends React.Component {
     }
   }
 
-  handlError = event => {
+  handleError = event => {
     this.setState({
       error: 'There was an error'
     })
   }
 
+  handleAbort = event => {
+    this.setState({
+      error: 'The upload was cancelled'
+    })
+  }
+
   render () {
     const { file } = this.props
     const { progress, error } = this.state