improvement(PeliasPanel): confirm before delete or replace

Author: miles-grant-ibigroup

lib/manager/components/deployment/PeliasPanel.js

@@ -22,13 +22,15 @@ type Props = {
 }
 
 type State = {
+  fileToDeleteOnSuccesfulUpload: string,
   peliasPassword: string,
   peliasUsername: string,
   peliasWebhookUrl: string
 }
 
 class PeliasPanel extends Component<Props, State> {
   state = {
+    fileToDeleteOnSuccesfulUpload: null,
     peliasWebhookUrl: '',
     peliasPassword: '',
     peliasUsername: ''
@@ -78,13 +80,16 @@ class PeliasPanel extends Component<Props, State> {
    */
   _onConfirmUpload = async (files: Array<File>) => {
     const { user, deployment } = this.props
-    const peliasCsvFiles = deployment.peliasCsvFiles || []
+    const { fileToDeleteOnSuccesfulUpload } = this.state
+
+    let peliasCsvFiles = deployment.peliasCsvFiles || []
 
     if (!user.token || user.token === null) {
       return false
     }
 
     const file = files[0]
+    // TODO: more extensive csv validation?
     if (file.type === 'text/csv') {
       const url = `${SECURE_API_PREFIX}deployments/${deployment.id}/upload`
       const formData = new FormData()
@@ -97,6 +102,13 @@ class PeliasPanel extends Component<Props, State> {
         body: formData
       })
       const s3UploadUrl = await s3UploadResponse.text()
+
+      // If a file is set to delete on successful upload, delete it here
+      if (fileToDeleteOnSuccesfulUpload) {
+        peliasCsvFiles = peliasCsvFiles.filter(csv => csv !== fileToDeleteOnSuccesfulUpload)
+        this.setState({ fileToDeleteOnSuccesfulUpload: null })
+      }
+
       this._updateDeployment({ 'peliasCsvFiles': [ ...peliasCsvFiles, s3UploadUrl ] })
       return true
     } else {
@@ -140,10 +152,17 @@ class PeliasPanel extends Component<Props, State> {
     return (
       <li key={url}>
         {fileName}{' '}
-        <Button disabled={!enabled} bsSize='xsmall' onClick={() => { this.refs.uploadModal.open(); this._deleteCsvFile(url) }}>
+        <Button disabled={!enabled} bsSize='xsmall' onClick={() => {
+          this.refs.uploadModal.open()
+          this.setState({fileToDeleteOnSuccesfulUpload: url})
+        }}>
           Replace
         </Button>
-        <Button disabled={!enabled} bsSize='xsmall' onClick={() => this._deleteCsvFile(url)}>Delete</Button>
+        <Button disabled={!enabled} bsSize='xsmall' onClick={() => {
+          if (confirm('Are you sure you want to delete this CSV file?')) {
+            this._deleteCsvFile(url)
+          }
+        }}>Delete</Button>
       </li>
     )
   }
@@ -213,6 +232,7 @@ class PeliasPanel extends Component<Props, State> {
               title='Upload CSV File'
               body='Select a CSV file of POIs to upload:'
               onConfirm={this._onConfirmUpload}
+              onCancel={() => this.setState({fileToDeleteOnSuccesfulUpload: null})}
               errorMessage='Uploaded file must be a valid csv file (.csv).'
             />
             <ul>