when FileCard loads, set up an event listener for enter key and call props.done

src/plugins/Dashboard/FileCard.js

@@ -1,12 +1,22 @@
 const html = require('yo-yo')
 const getFileTypeIcon = require('./getFileTypeIcon')
+const onload = require('on-load')
 const { checkIcon } = require('./icons')
 
+let file
+const meta = {}
+
 module.exports = function fileCard (props) {
-  const file = props.fileCardFor ? props.files[props.fileCardFor] : false
-  const meta = {}
+  file = props.fileCardFor ? props.files[props.fileCardFor] : false
+  // const meta = {}
 
-  function tempStoreMeta (ev) {
+  const handleEnterKey = (ev) => {
+    if (event.keyCode === 13) {
+      props.done(meta, file.id)
+    }
+  }
+
+  const tempStoreMeta = (ev) => {
     const value = ev.target.value
     const name = ev.target.dataset.name
     meta[name] = value
@@ -26,7 +36,7 @@ module.exports = function fileCard (props) {
     })
   }
 
-  return html`<div class="UppyDashboardFileCard" aria-hidden="${!props.fileCardFor}">
+  const fileCardEl = html`<div class="UppyDashboardFileCard" aria-hidden="${!props.fileCardFor}">
     <div class="UppyDashboardContent-bar">
       <h2 class="UppyDashboardContent-title">Editing <span class="UppyDashboardContent-titleFile">${file.meta ? file.meta.name : file.name}</span></h2>
       <button class="UppyDashboardContent-back" type="button" title="Finish editing file"
@@ -61,4 +71,9 @@ module.exports = function fileCard (props) {
               onclick=${() => props.done(meta, file.id)}>${checkIcon()}</button>
     </div>
     </div>`
+
+  return onload(html`<div>${fileCardEl}</div>`,
+    () => document.body.addEventListener('keyup', handleEnterKey),
+    () => document.body.removeEventListener('keyup', handleEnterKey)
+  )
 }