Display uploaded filename

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,
 }
 

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}