use one Archive instance for state.archive

app/archive.js

@@ -68,4 +68,8 @@ export default class Archive {
       this.files.splice(index, 1);
     }
   }
+
+  clear() {
+    this.files = [];
+  }
 }

app/controller.js

@@ -3,7 +3,6 @@ import FileSender from './fileSender';
 import FileReceiver from './fileReceiver';
 import { copyToClipboard, delay, openLinksInNewTab, percent } from './utils';
 import * as metrics from './metrics';
-import Archive from './archive';
 import { bytes } from './utils';
 import okDialog from './ui/okDialog';
 import copyDialog from './ui/copyDialog';
@@ -66,9 +65,6 @@ export default function(state, emitter) {
 
   emitter.on('removeUpload', file => {
     state.archive.remove(file);
-    if (state.archive.numFiles === 0) {
-      state.archive = null;
-    }
     render();
   });
 
@@ -99,7 +95,6 @@ export default function(state, emitter) {
       return;
     }
     const maxSize = state.user.maxSize;
-    state.archive = state.archive || new Archive();
     try {
       state.archive.addFiles(files, maxSize);
     } catch (e) {
@@ -109,15 +104,11 @@ export default function(state, emitter) {
           count: LIMITS.MAX_FILES_PER_ARCHIVE
         })
       );
-      if (state.archive.numFiles === 0) {
-        state.archive = null;
-      }
     }
     render();
   });
 
   emitter.on('upload', async ({ type, dlimit, password }) => {
-    if (!state.archive) return;
     if (state.storage.files.length >= LIMITS.MAX_ARCHIVES_PER_USER) {
       state.modal = okDialog(
         state.translate('tooManyArchives', {
@@ -171,12 +162,12 @@ export default function(state, emitter) {
         emitter.emit('pushState', '/error');
       }
     } finally {
-      await state.user.syncFileList();
       openLinksInNewTab(links, false);
-      state.archive = null;
+      state.archive.clear();
       state.password = '';
       state.uploading = false;
       state.transfer = null;
+      await state.user.syncFileList();
       render();
     }
   });

app/main.js

@@ -16,6 +16,7 @@ import Raven from 'raven-js';
 import './main.css';
 import User from './user';
 import { getTranslator } from './locale';
+import Archive from './archive';
 
 if (navigator.doNotTrack !== '1' && window.RAVEN_CONFIG) {
   Raven.config(window.SENTRY_ID, window.RAVEN_CONFIG).install();
@@ -37,6 +38,7 @@ if (process.env.NODE_ENV === 'production') {
 
   const translate = await getTranslator(LOCALE);
   window.initialState = {
+    archive: new Archive(),
     capabilities,
     translate,
     storage,

app/ui/archiveTile.js

@@ -345,6 +345,7 @@ module.exports.empty = function(state, emit) {
       />
       <label
         for="file-upload"
+        role="button"
         class="rounded bg-blue hover\:bg-blue-dark focus\:bg-blue-darker cursor-pointer text-center text-white py-2 px-6 h-12 mt-4 flex flex-no-shrink items-center justify-center font-semibold"
         title="${state.translate('addFilesButton')}"
       >

app/ui/home.js

@@ -11,14 +11,14 @@ module.exports = function(state, emit) {
   let left = '';
   if (state.uploading) {
     left = archiveTile.uploading(state, emit);
-  } else if (state.archive) {
+  } else if (state.archive.numFiles > 0) {
     left = archiveTile.wip(state, emit);
   } else {
     left = archiveTile.empty(state, emit);
   }
   archives.reverse();
   const right =
-    archives.length < 1
+    archives.length === 0
       ? intro(state)
       : list(
           archives,

server/state.js

@@ -16,6 +16,9 @@ module.exports = async function(req) {
     }
   }
   return {
+    archive: {
+      numFiles: 0
+    },
     locale,
     capabilities: { account: false },
     translate: getTranslator(locale),