From 1f4f39e06cc1740ccad487ce716e463268199fda Mon Sep 17 00:00:00 2001
From: Andrew Watkins <watts@influxdb.com>
Date: Wed, 21 Jun 2017 14:45:35 -0700
Subject: [PATCH] Display uploaded filename

---
 ui/src/data_explorer/components/WriteDataBody.js |  5 ++++-
 ui/src/data_explorer/components/WriteDataForm.js | 14 +++++++-------
 2 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/ui/src/data_explorer/components/WriteDataBody.js b/ui/src/data_explorer/components/WriteDataBody.js
index f1713b0536..830033eb0b 100644
--- a/ui/src/data_explorer/components/WriteDataBody.js
+++ b/ui/src/data_explorer/components/WriteDataBody.js
@@ -8,6 +8,7 @@ const WriteDataBody = ({
   handleSubmit,
   inputContent,
   uploadContent,
+  fileName,
   isManual,
 }) => {
   let inputRef
@@ -40,7 +41,8 @@ const WriteDataBody = ({
             </button>
             {uploadContent
               ? <span className="write-data-form--filepath_selected">
-                  <span className="icon checkmark" />1 file selected
+                  <span className="icon checkmark" />
+                  {fileName}
                 </span>
               : <span className="write-data-form--filepath_empty">
                   No file selected
@@ -65,6 +67,7 @@ WriteDataBody.propTypes = {
   handleSubmit: func.isRequired,
   inputContent: string,
   uploadContent: string,
+  fileName: string,
   isManual: bool,
 }
 
diff --git a/ui/src/data_explorer/components/WriteDataForm.js b/ui/src/data_explorer/components/WriteDataForm.js
index dec4192ee8..62c56e406f 100644
--- a/ui/src/data_explorer/components/WriteDataForm.js
+++ b/ui/src/data_explorer/components/WriteDataForm.js
@@ -13,6 +13,7 @@ class WriteDataForm extends Component {
       selectedDatabase: null,
       inputContent: null,
       uploadContent: '',
+      fileName: '',
       progress: '',
       isManual: false,
     }
@@ -73,28 +74,27 @@ class WriteDataForm extends Component {
 
     // async function run when loading of file is complete
     reader.onload = loadEvent => {
-      this.setState({uploadContent: loadEvent.target.result})
+      this.setState({
+        uploadContent: loadEvent.target.result,
+        fileName: file.name,
+      })
     }
   }
 
   render() {
     const {onClose, errorThrown} = this.props
-    const {inputContent, uploadContent, selectedDatabase, isManual} = this.state
 
     return (
       <div className="write-data-form">
         <WriteDataHeader
+          {...this.state}
           handleSelectDatabase={this.handleSelectDatabase}
-          selectedDatabase={selectedDatabase}
           errorThrown={errorThrown}
           toggleWriteView={this.toggleWriteView}
-          isManual={isManual}
           onClose={onClose}
         />
         <WriteDataBody
-          isManual={isManual}
-          inputContent={inputContent}
-          uploadContent={uploadContent}
+          {...this.state}
           handleEdit={this.handleEdit}
           handleFile={this.handleFile}
           handleKeyUp={this.handleKeyUp}