Merge pull request #960 from ibi-group/pelias-panel-show-csv-uploaded…

…-time

refactor: show csv upload time

lib/manager/components/deployment/PeliasPanel.js

@@ -17,6 +17,9 @@ import ConfirmModal from '../../../common/components/ConfirmModal'
 import { updateDeployment, uploadPeliasWebhookCsvFile, updatePelias } from '../../actions/deployments'
 import { setErrorMessage } from '../../actions/status'
 import type { Deployment, Project } from '../../../types'
+import {
+  formatTimestamp
+} from '../../../common/util/date-time'
 
 type Props = {
   deployment: Deployment,
@@ -29,13 +32,55 @@ type Props = {
 
 type State = {
   fileToDeleteOnSuccesfulUpload: string | null,
+  peliasCsvUploadsDates: Array<string>
 }
 
 class PeliasPanel extends Component<Props, State> {
   state = {
-    fileToDeleteOnSuccesfulUpload: null
+    fileToDeleteOnSuccesfulUpload: null,
+    peliasCsvUploadsDates: []
   };
 
+componentDidUpdate = (newProps) => {
+  const { deployment } = newProps
+  if (!deployment.peliasCsvFiles) {
+    return
+  }
+
+  // Only update if the deployment has changed
+  if (
+    this.props.deployment.peliasCsvFiles &&
+    this.props.deployment.peliasCsvFiles.every(
+      // $FlowFixMe flow is wrong
+      (file) => deployment.peliasCsvFiles.indexOf(file) > -1
+    ) &&
+    // $FlowFixMe flow is wrong
+    deployment.peliasCsvFiles.every(
+    // $FlowFixMe flow is wrong
+      (file) => this.props.deployment.peliasCsvFiles.indexOf(file) > -1
+    // And if there are no upload dates yet
+    ) && this.state.peliasCsvUploadsDates.length > 0
+  ) {
+    return
+  }
+
+  // $FlowFixMe flow is wrong
+  deployment.peliasCsvFiles.forEach(
+    (file, index) => this.fetchAndUpdatePeliasDate(file, index)
+  )
+}
+
+  fetchAndUpdatePeliasDate = (url, index) => {
+    const { peliasCsvUploadsDates } = this.state
+    fetch(url, {method: 'HEAD'}).then(data => {
+      const lastModified = data.headers.get('last-modified')
+      if (!lastModified) return
+
+      peliasCsvUploadsDates[index] = lastModified
+      this.setState({peliasCsvUploadsDates})
+    })
+  }
+
   /**
    * Method fired when Pelias *Update* button is pressed
    */
@@ -141,9 +186,10 @@ class PeliasPanel extends Component<Props, State> {
    * buttons to replace or remove the file
    * @param {*} url     The URL to add to the list of csv files associated with the deployment
    * @param {*} enabled Whether the buttons should be enabled
+   * @param {*} label   An optional label to render next to the buttons
    * @returns           JSX including the file name and buttons
    */
-  renderCsvUrl = (url: string, enabled: boolean) => {
+  renderCsvUrl = (url: string, enabled: boolean, label?: string) => {
     // Usually, files will be rendered by https://github.com/ibi-group/datatools-server/blob/dev/src/main/java/com/conveyal/datatools/manager/controllers/api/DeploymentController.java
     // so we can take advantage of a predictable filename
     // As a fallback, render the full url
@@ -175,6 +221,7 @@ class PeliasPanel extends Component<Props, State> {
         >
           Download
         </Button>
+        {label && <em style={{marginLeft: '1ch', verticalAlign: 'middle'}}>{label}</em>}
       </li>
     )
   }
@@ -234,8 +281,11 @@ class PeliasPanel extends Component<Props, State> {
             />
             <ul>
               {deployment.peliasCsvFiles &&
-                deployment.peliasCsvFiles.map((url) =>
-                  this.renderCsvUrl(url, !peliasButtonsDisabled)
+                deployment.peliasCsvFiles.map((url, index) => {
+                  const uploadDate = this.state.peliasCsvUploadsDates[index]
+                  const label = uploadDate ? formatTimestamp(uploadDate) : ''
+                  return this.renderCsvUrl(url, !peliasButtonsDisabled, label)
+                }
                 )}
             </ul>
             <Button