diff --git a/app/assets/javascripts/UIModels/AppState/FilesState.ts b/app/assets/javascripts/UIModels/AppState/FilesState.ts index 3361a3265..3fdd3f079 100644 --- a/app/assets/javascripts/UIModels/AppState/FilesState.ts +++ b/app/assets/javascripts/UIModels/AppState/FilesState.ts @@ -8,7 +8,7 @@ import { parseFileName, } from '@standardnotes/filepicker' import { ClientDisplayableError, SNFile } from '@standardnotes/snjs' -import { addToast, dismissToast, ToastType } from '@standardnotes/stylekit' +import { addToast, dismissToast, ToastType, updateToast } from '@standardnotes/stylekit' import { WebApplication } from '../Application' export class FilesState { @@ -27,18 +27,30 @@ export class FilesState { } downloadingToastId = addToast({ - type: ToastType.Loading, - message: 'Downloading file...', + type: ToastType.Progress, + message: `Downloading file "${file.name}" (0%)`, + progress: 0, }) const decryptedBytesArray: Uint8Array[] = [] - await this.application.files.downloadFile(file, async (decryptedBytes: Uint8Array) => { + await this.application.files.downloadFile(file, async (decryptedBytes, progress) => { if (isUsingStreamingSaver) { await saver.pushBytes(decryptedBytes) } else { decryptedBytesArray.push(decryptedBytes) } + + if (progress) { + const progressPercent = Number.isInteger(progress.percentComplete) + ? progress.percentComplete + : progress.percentComplete.toFixed(2) + + updateToast(downloadingToastId, { + message: `Downloading file "${file.name}" (${progressPercent}%)`, + progress: progress.percentComplete, + }) + } }) if (isUsingStreamingSaver) { @@ -103,11 +115,6 @@ export class FilesState { continue } - toastId = addToast({ - type: ToastType.Loading, - message: `Uploading file "${file.name}"...`, - }) - const operation = await this.application.files.beginNewFileUpload(file.size) if (operation instanceof ClientDisplayableError) { @@ -118,8 +125,23 @@ export class FilesState { throw new Error('Unable to start upload session') } + const initialProgress = operation.getProgress().percentComplete + + toastId = addToast({ + type: ToastType.Progress, + message: `Uploading file "${file.name}" (${initialProgress}%)`, + progress: initialProgress, + }) + const onChunk = async (chunk: Uint8Array, index: number, isLast: boolean) => { await this.application.files.pushBytesForUpload(operation, chunk, index, isLast) + + const progress = operation.getProgress().percentComplete + const formattedProgress = Number.isInteger(progress) ? progress : progress.toFixed(2) + updateToast(toastId, { + message: `Uploading file "${file.name}" (${formattedProgress}%)`, + progress, + }) } const fileResult = await picker.readFile(file, minimumChunkSize, onChunk) diff --git a/package.json b/package.json index 8da16b0d3..fde58f371 100644 --- a/package.json +++ b/package.json @@ -72,8 +72,8 @@ "@standardnotes/components": "1.7.15", "@standardnotes/filepicker": "1.13.4", "@standardnotes/sncrypto-web": "1.9.0", - "@standardnotes/snjs": "2.105.2", - "@standardnotes/stylekit": "5.24.1", + "@standardnotes/snjs": "2.105.3", + "@standardnotes/stylekit": "5.25.0", "@zip.js/zip.js": "^2.4.10", "mobx": "^6.5.0", "mobx-react-lite": "^3.3.0", diff --git a/yarn.lock b/yarn.lock index 1dc6fb8a2..2a35ef127 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2483,10 +2483,10 @@ "@standardnotes/common" "^1.19.6" "@standardnotes/utils" "^1.6.3" -"@standardnotes/files@^1.0.4": - version "1.0.4" - resolved "https://registry.yarnpkg.com/@standardnotes/files/-/files-1.0.4.tgz#bd0a565498fffe6e079863907d233df64df0fc15" - integrity sha512-soj7zpb/UWOtx9Fc/cG5cq3fHh4m3+LmLUOje+Zh78f7eA9LkbPGGn7XajCINCBSAcHKlia5mhTu3NnwH9S3Ww== +"@standardnotes/files@^1.0.5": + version "1.0.5" + resolved "https://registry.yarnpkg.com/@standardnotes/files/-/files-1.0.5.tgz#ed293082167555ca89ce1c2a879eb7307064db61" + integrity sha512-ACsl9emP7S9OpCC8FcGZZxdxGJjMjZ3wvshevsjHqGtKcKQX/2/xU8FcUNg05VzvGMicV8Smekp+/6BvcNpjEA== dependencies: "@standardnotes/models" "^1.6.2" "@standardnotes/responses" "^1.6.13" @@ -2541,10 +2541,10 @@ buffer "^6.0.3" libsodium-wrappers "^0.7.9" -"@standardnotes/snjs@2.105.2": - version "2.105.2" - resolved "https://registry.yarnpkg.com/@standardnotes/snjs/-/snjs-2.105.2.tgz#fd2ac92c84010225f3f66dc143979f1360790476" - integrity sha512-ihRp4Z6XEakJwEg9UWJxMgda5LvN+k+EEGBVU2eG5CTjeBI3cQyu0K+iRpZD5jzg2/Vvis1gEdIrZPfPJj1mCQ== +"@standardnotes/snjs@2.105.3": + version "2.105.3" + resolved "https://registry.yarnpkg.com/@standardnotes/snjs/-/snjs-2.105.3.tgz#4eebce30c8cc6469ba6aada28ceb9825b47827c5" + integrity sha512-dYzGCbljJ6x88+kJX2iMS+8hyKGSvLljJqlmeWYVnoVPs9ZR2CkfZfjugaVkNIMS9mteuAO36t0YUyhQA6yBPQ== dependencies: "@standardnotes/auth" "^3.18.11" "@standardnotes/common" "^1.19.6" @@ -2552,7 +2552,7 @@ "@standardnotes/encryption" "^1.6.1" "@standardnotes/features" "^1.39.0" "@standardnotes/filepicker" "^1.13.4" - "@standardnotes/files" "^1.0.4" + "@standardnotes/files" "^1.0.5" "@standardnotes/models" "^1.6.2" "@standardnotes/responses" "^1.6.13" "@standardnotes/services" "^1.10.1" @@ -2560,10 +2560,10 @@ "@standardnotes/sncrypto-common" "^1.8.0" "@standardnotes/utils" "^1.6.3" -"@standardnotes/stylekit@5.24.1": - version "5.24.1" - resolved "https://registry.yarnpkg.com/@standardnotes/stylekit/-/stylekit-5.24.1.tgz#9ebc3afde31ce4263e83ef59392120aaa932d638" - integrity sha512-niYMW8Mpj2gOloI2SSGoZvV8kSGGcujB09ti9uoicK1c9WD9s/vkjhoyzdSa3FmAjXbzVq/iwI9boSu7MLcpHw== +"@standardnotes/stylekit@5.25.0": + version "5.25.0" + resolved "https://registry.yarnpkg.com/@standardnotes/stylekit/-/stylekit-5.25.0.tgz#dd79f8c7bd9c2a6f810bc6283f76928dd268f9e8" + integrity sha512-zc/qsWJ6UYNFZeEPpifJbN19GXZy2VBrha2njvnmLy+Yr9XZuDBR+kwzBvvDYIb33OijkATNQ4EyUja245edKQ== dependencies: "@nanostores/preact" "^0.1.3" "@reach/listbox" "^0.16.2"