refactor: simplify file adding

src/bundles/files.js

@@ -228,38 +228,33 @@ export default (opts = {}) => {
     doFilesWrite: make(actions.WRITE, async (ipfs, root, rawFiles, id, { dispatch }) => {
       const { streams, totalSize } = await filesToStreams(rawFiles)
 
-      const updateProgress = (progress) => {
-        dispatch({ type: 'FILES_WRITE_UPDATED', payload: { id: id, progress } })
+      const updateProgress = (sent) => {
+        dispatch({ type: 'FILES_WRITE_UPDATED', payload: { id: id, progress: sent / totalSize * 100 } })
       }
 
       updateProgress(0)
 
-      let sent = 0
+      const res = await ipfs.files.add(streams, {
+        pin: false,
+        wrapWithDirectory: true,
+        progress: updateProgress
+      })
 
-      for (const file of streams) {
-        const dir = join(root, dirname(file.name))
-        await ipfs.files.mkdir(dir, { parents: true })
-        let alreadySent = 0
-
-        const res = await ipfs.add(file.content, {
-          pin: false,
-          // eslint-disable-next-line
-          progress: (bytes) => {
-            sent = sent + bytes - alreadySent
-            alreadySent = bytes
-            updateProgress(sent / totalSize * 100)
-          }
-        })
-
-        const src = `/ipfs/${res[0].hash}`
-        const dst = join(root, file.name)
-        await ipfs.files.cp([src, dst])
+      if (res.length !== streams.length + 1) {
+        // See https://github.com/ipfs/js-ipfs-api/issues/797
+        throw new Error('Unable to finish upload: IPFS API returned a partial response. Try adding a smaller tree.')
+      }
 
-        sent = sent - alreadySent + file.size
-        updateProgress(sent / totalSize * 100)
+      for (const { path, hash } of res) {
+        // Only go for direct children
+        if (path.indexOf('/') === -1 && path !== '') {
+          const src = `/ipfs/${hash}`
+          const dst = join(root, path)
+          await ipfs.files.cp([src, dst])
+        }
       }
 
-      updateProgress(100)
+      updateProgress(totalSize)
     }),
 
     doFilesDelete: make(actions.DELETE, (ipfs, files) => {

src/files/files-list/FilesList.js

@@ -66,7 +66,13 @@ class FileList extends React.Component {
 
   get selectedMenu () {
     const unselectAll = () => this.toggleAll(false)
-    const size = this.selectedFiles.reduce((a, b) => a + (b.size || b.cumulativeSize), 0)
+    const size = this.selectedFiles.reduce((a, b) => {
+      if (b.cumulativeSize) {
+        return a + b.cumulativeSize
+      }
+
+      return a + b.size
+    }, 0)
     const show = this.state.selected.length !== 0
 
     return (

src/lib/dnd-backend.js

@@ -25,7 +25,7 @@ async function scanFiles (item, root = '') {
     const file = await getFileFromEntry(item)
 
     return [{
-      name: join(root, file.webkitRelativePath || file.name),
+      path: join(root, file.webkitRelativePath || file.name),
       content: fileReader(file),
       size: file.size
     }]
@@ -51,13 +51,13 @@ async function scan (files) {
     if (file.getAsEntry || file.webkitGetAsEntry) {
       entries.push({
         entry: getAsEntry(file),
-        name: file.name
+        path: file.name
       })
     } else {
       totalSize += file.size
 
       streams.push({
-        name: file.webkitRelativePath || file.name,
+        path: file.webkitRelativePath || file.name,
         content: fileReader(file),
         size: file.size
       })

src/lib/files.js

@@ -28,7 +28,7 @@ export async function filesToStreams (files) {
     }
 
     streams.push({
-      name: file.webkitRelativePath || file.name,
+      path: file.webkitRelativePath || file.name,
       content: stream,
       size: file.size
     })