refactor(review): handle loading state, browser warnings

src/pages/create/index.tsx

@@ -730,10 +730,7 @@ export const CreatePage = () => {
       setIsLoading(true)
       setLoadingSpinnerDesc('Generating file hashes')
       const fileHashes = await generateFileHashes()
-      if (!fileHashes) {
-        setIsLoading(false)
-        return
-      }
+      if (!fileHashes) return
 
       setLoadingSpinnerDesc('Generating encryption key')
       const encryptionKey = await generateEncryptionKey()
@@ -741,10 +738,7 @@ export const CreatePage = () => {
       if (await isOnline()) {
         setLoadingSpinnerDesc('generating files.zip')
         const arrayBuffer = await generateFilesZip()
-        if (!arrayBuffer) {
-          setIsLoading(false)
-          return
-        }
+        if (!arrayBuffer) return
 
         setLoadingSpinnerDesc('Encrypting files.zip')
         const encryptedArrayBuffer = await encryptZipFile(
@@ -756,10 +750,7 @@ export const CreatePage = () => {
 
         setLoadingSpinnerDesc('Uploading files.zip to file storage')
         const fileUrl = await uploadFile(encryptedArrayBuffer)
-        if (!fileUrl) {
-          setIsLoading(false)
-          return
-        }
+        if (!fileUrl) return
 
         setLoadingSpinnerDesc('Generating create signature')
         const createSignature = await generateCreateSignature(
@@ -767,10 +758,7 @@ export const CreatePage = () => {
           fileHashes,
           fileUrl
         )
-        if (!createSignature) {
-          setIsLoading(false)
-          return
-        }
+        if (!createSignature) return
 
         setLoadingSpinnerDesc('Generating keys for decryption')
 
@@ -782,11 +770,8 @@ export const CreatePage = () => {
         }
 
         const keys = await generateKeys(pubkeys, encryptionKey)
+        if (!keys) return
 
-        if (!keys) {
-          setIsLoading(false)
-          return
-        }
         const meta: Meta = {
           createSignature,
           keys,
@@ -796,10 +781,7 @@ export const CreatePage = () => {
 
         setLoadingSpinnerDesc('Updating user app data')
         const event = await updateUsersAppData(meta)
-        if (!event) {
-          setIsLoading(false)
-          return
-        }
+        if (!event) return
 
         setLoadingSpinnerDesc('Sending notifications to counterparties')
         const promises = sendNotifications(meta)
@@ -828,10 +810,7 @@ export const CreatePage = () => {
           fileHashes,
           ''
         )
-        if (!createSignature) {
-          setIsLoading(false)
-          return
-        }
+        if (!createSignature) return
 
         const meta: Meta = {
           createSignature,
@@ -850,10 +829,7 @@ export const CreatePage = () => {
         }
 
         const arrayBuffer = await generateZipFile(zip)
-        if (!arrayBuffer) {
-          setIsLoading(false)
-          return
-        }
+        if (!arrayBuffer) return
 
         setLoadingSpinnerDesc('Encrypting zip file')
         const encryptedArrayBuffer = await encryptZipFile(
@@ -917,7 +893,7 @@ export const CreatePage = () => {
               <ol className={`${styles.paperGroup} ${styles.orderedFilesList}`}>
                 {selectedFiles.length > 0 &&
                   selectedFiles.map((file, index) => (
-                    <div
+                    <li
                       key={index}
                       className={`${fileListStyles.fileItem} ${isActive(file) && fileListStyles.active}`}
                       onClick={() => {
@@ -925,9 +901,9 @@ export const CreatePage = () => {
                         setCurrentFile(file)
                       }}
                     >
-                      <>
                       <span className={styles.fileName}>{file.name}</span>
                       <Button
+                        aria-label={`delete ${file.name}`}
                         variant="text"
                         onClick={(event) => handleRemoveFile(event, file)}
                         sx={{
@@ -936,21 +912,21 @@ export const CreatePage = () => {
                       >
                         <FontAwesomeIcon icon={faTrash} />
                       </Button>
-                      </>
-                    </div>
+                    </li>
                   ))}
               </ol>
               <Button variant="contained" onClick={handleUploadButtonClick}>
                 <FontAwesomeIcon icon={faUpload} />
                 <span className={styles.uploadFileText}>Upload new files</span>
+              </Button>
               <input
                 ref={fileInputRef}
                 hidden={true}
                 multiple={true}
                 type="file"
+                aria-label="file-upload"
                 onChange={handleSelectFiles}
               />
-              </Button>
             </div>
           }
           right={