From c7f6e2fa73b1061149360bc8e31c8749cc3a3ad1 Mon Sep 17 00:00:00 2001 From: Antoine du Hamel Date: Tue, 13 Dec 2022 15:06:37 +0100 Subject: [PATCH 01/10] @uppy/xhr-upload: add`'upload-stalled'` event --- packages/@uppy/xhr-upload/src/index.js | 5 +---- website/src/docs/core.md | 5 +++++ website/src/docs/xhr-upload.md | 8 +++++--- 3 files changed, 11 insertions(+), 7 deletions(-) diff --git a/packages/@uppy/xhr-upload/src/index.js b/packages/@uppy/xhr-upload/src/index.js index 25e9082706..af361f83d5 100644 --- a/packages/@uppy/xhr-upload/src/index.js +++ b/packages/@uppy/xhr-upload/src/index.js @@ -230,11 +230,8 @@ export default class XHRUpload extends BasePlugin { let queuedRequest const timer = new ProgressTimeout(opts.timeout, () => { - xhr.abort() - queuedRequest.done() const error = new Error(this.i18n('timedOut', { seconds: Math.ceil(opts.timeout / 1000) })) - this.uppy.emit('upload-error', file, error) - reject(error) + this.uppy.emit('upload-stalled', file, error) }) const id = nanoid() diff --git a/website/src/docs/core.md b/website/src/docs/core.md index 731f7e7d9a..898078ef7c 100644 --- a/website/src/docs/core.md +++ b/website/src/docs/core.md @@ -946,6 +946,11 @@ uppy.on('upload-error', (file, error, response) => { }) ``` +### `upload-stalled` + +Fired when an upload is seemingly stalled. Use this event to display a message +on the UI to tell the user they might want to retry the upload. + ### `upload-retry` Fired when an upload has been retried (after an error, for example). diff --git a/website/src/docs/xhr-upload.md b/website/src/docs/xhr-upload.md index c90dc826ee..b10df02018 100644 --- a/website/src/docs/xhr-upload.md +++ b/website/src/docs/xhr-upload.md @@ -209,10 +209,12 @@ function getResponseError (responseText, response) { The field name containing a publically accessible location of the uploaded file in the response data returned by [`getResponseData()`](#getResponseData-responseText-response). -### `timeout: 30 * 1000` +### `timeout: 30_000` -When no upload progress events have been received for this amount of milliseconds, assume the connection has an issue and abort the upload. -Note that unlike the [`XMLHttpRequest.timeout`][XHR.timeout] property, this is a timer between progress events: the total upload can take longer than this value. +When no upload progress events have been received for this amount of +milliseconds, send a `'upload-stalled'` event. +Note that unlike the [`XMLHttpRequest.timeout`][XHR.timeout] property, this is a +timer between progress events: the total upload can take longer than this value. Set to `0` to disable this check. The default for the timeout is 30 seconds. From a17b8fc067501294c9545c031cd66f4a6fb1f980 Mon Sep 17 00:00:00 2001 From: Antoine du Hamel Date: Wed, 14 Dec 2022 10:19:36 +0100 Subject: [PATCH 02/10] Apply suggestions from code review Co-authored-by: Merlijn Vos --- website/src/docs/core.md | 3 +-- website/src/docs/xhr-upload.md | 6 ++---- 2 files changed, 3 insertions(+), 6 deletions(-) diff --git a/website/src/docs/core.md b/website/src/docs/core.md index 898078ef7c..71419c8d2e 100644 --- a/website/src/docs/core.md +++ b/website/src/docs/core.md @@ -948,8 +948,7 @@ uppy.on('upload-error', (file, error, response) => { ### `upload-stalled` -Fired when an upload is seemingly stalled. Use this event to display a message -on the UI to tell the user they might want to retry the upload. +Fired when an upload is seemingly stalled. Use this event to display a message on the UI to tell the user they might want to retry the upload. ### `upload-retry` diff --git a/website/src/docs/xhr-upload.md b/website/src/docs/xhr-upload.md index b10df02018..224fda39c1 100644 --- a/website/src/docs/xhr-upload.md +++ b/website/src/docs/xhr-upload.md @@ -211,10 +211,8 @@ The field name containing a publically accessible location of the uploaded file ### `timeout: 30_000` -When no upload progress events have been received for this amount of -milliseconds, send a `'upload-stalled'` event. -Note that unlike the [`XMLHttpRequest.timeout`][XHR.timeout] property, this is a -timer between progress events: the total upload can take longer than this value. +When no upload progress events have been received for this amount of milliseconds, send a `'upload-stalled'` event. +Note that unlike the [`XMLHttpRequest.timeout`][XHR.timeout] property, this is a timer between progress events: the total upload can take longer than this value. Set to `0` to disable this check. The default for the timeout is 30 seconds. From 18b375c17f2e0b9d214a432c914d414ba4c03494 Mon Sep 17 00:00:00 2001 From: Antoine du Hamel Date: Wed, 14 Dec 2022 10:32:52 +0100 Subject: [PATCH 03/10] Add example --- website/src/docs/core.md | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/website/src/docs/core.md b/website/src/docs/core.md index 71419c8d2e..2a17b52973 100644 --- a/website/src/docs/core.md +++ b/website/src/docs/core.md @@ -950,6 +950,15 @@ uppy.on('upload-error', (file, error, response) => { Fired when an upload is seemingly stalled. Use this event to display a message on the UI to tell the user they might want to retry the upload. +```js +uppy.on('upload-stalled', () => { + stallWarning.hidden = false + uppy.once('progress', () => { + stallWarning.hidden = true + }) +}) +``` + ### `upload-retry` Fired when an upload has been retried (after an error, for example). From 6663adc0fb398a268a96df0c456a9790e43bce7c Mon Sep 17 00:00:00 2001 From: Antoine du Hamel Date: Wed, 21 Dec 2022 18:13:52 +0100 Subject: [PATCH 04/10] Update website/src/docs/core.md Co-authored-by: Merlijn Vos --- website/src/docs/core.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/website/src/docs/core.md b/website/src/docs/core.md index 2a17b52973..ae8857e5bd 100644 --- a/website/src/docs/core.md +++ b/website/src/docs/core.md @@ -952,7 +952,7 @@ Fired when an upload is seemingly stalled. Use this event to display a message o ```js uppy.on('upload-stalled', () => { - stallWarning.hidden = false + uppy.info(`Your upload "${file.meta.name}" has not made any progress for ${timeout} seconds. You may want to retry it.`, 'warning') uppy.once('progress', () => { stallWarning.hidden = true }) From 981c53087b4bfc2ec3adfe925c4e8e9e5acb048e Mon Sep 17 00:00:00 2001 From: Antoine du Hamel Date: Wed, 21 Dec 2022 18:18:32 +0100 Subject: [PATCH 05/10] Update website/src/docs/core.md --- website/src/docs/core.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/website/src/docs/core.md b/website/src/docs/core.md index ae8857e5bd..022af89ddf 100644 --- a/website/src/docs/core.md +++ b/website/src/docs/core.md @@ -954,7 +954,7 @@ Fired when an upload is seemingly stalled. Use this event to display a message o uppy.on('upload-stalled', () => { uppy.info(`Your upload "${file.meta.name}" has not made any progress for ${timeout} seconds. You may want to retry it.`, 'warning') uppy.once('progress', () => { - stallWarning.hidden = true + uppy.info('The upload is no longer stalled') }) }) ``` From 179f4e39673d9d8da48327c33f84a81d78efce03 Mon Sep 17 00:00:00 2001 From: Antoine du Hamel Date: Wed, 21 Dec 2022 18:54:23 +0100 Subject: [PATCH 06/10] add bundle error and update locales --- packages/@uppy/xhr-upload/src/index.js | 10 ++++------ packages/@uppy/xhr-upload/src/locale.js | 2 +- 2 files changed, 5 insertions(+), 7 deletions(-) diff --git a/packages/@uppy/xhr-upload/src/index.js b/packages/@uppy/xhr-upload/src/index.js index af361f83d5..7f585e2bb1 100644 --- a/packages/@uppy/xhr-upload/src/index.js +++ b/packages/@uppy/xhr-upload/src/index.js @@ -230,8 +230,8 @@ export default class XHRUpload extends BasePlugin { let queuedRequest const timer = new ProgressTimeout(opts.timeout, () => { - const error = new Error(this.i18n('timedOut', { seconds: Math.ceil(opts.timeout / 1000) })) - this.uppy.emit('upload-stalled', file, error) + const error = new Error(this.i18n('uploadStalled', { seconds: Math.ceil(opts.timeout / 1000) })) + this.uppy.emit('upload-stalled', error, file) }) const id = nanoid() @@ -513,10 +513,8 @@ export default class XHRUpload extends BasePlugin { } const timer = new ProgressTimeout(this.opts.timeout, () => { - xhr.abort() - const error = new Error(this.i18n('timedOut', { seconds: Math.ceil(this.opts.timeout / 1000) })) - emitError(error) - reject(error) + const error = new Error(this.i18n('uploadStalled', { seconds: Math.ceil(this.opts.timeout / 1000) })) + this.uppy.emit('upload-stalled', error) }) xhr.upload.addEventListener('loadstart', () => { diff --git a/packages/@uppy/xhr-upload/src/locale.js b/packages/@uppy/xhr-upload/src/locale.js index ff9aa94070..6c9030db99 100644 --- a/packages/@uppy/xhr-upload/src/locale.js +++ b/packages/@uppy/xhr-upload/src/locale.js @@ -1,6 +1,6 @@ export default { strings: { // Shown in the Informer if an upload is being canceled because it stalled for too long. - timedOut: 'Upload stalled for %{seconds} seconds, aborting.', + uploadStalled: 'Upload has not made any progress for %{seconds} seconds. You may want to retry it.', }, } From 3dd4ad88857f626746b2104bec6b065a9e899d76 Mon Sep 17 00:00:00 2001 From: Antoine du Hamel Date: Wed, 21 Dec 2022 19:21:48 +0100 Subject: [PATCH 07/10] add info message and update docs --- packages/@uppy/core/src/Uppy.js | 13 +++++++++++++ packages/@uppy/xhr-upload/src/index.js | 4 ++-- website/src/docs/core.md | 14 +++++++++----- 3 files changed, 24 insertions(+), 7 deletions(-) diff --git a/packages/@uppy/core/src/Uppy.js b/packages/@uppy/core/src/Uppy.js index f16d30c39e..59388c81b3 100644 --- a/packages/@uppy/core/src/Uppy.js +++ b/packages/@uppy/core/src/Uppy.js @@ -972,6 +972,19 @@ class Uppy { } }) + let uploadStalledWarningRecentlyEmitted + this.on('upload-stalled', (error, files) => { + const { message } = error + const details = files.map(file => file.meta.name).join(', ') + if (!uploadStalledWarningRecentlyEmitted) { + this.info({ message, details }, 'warning', this.opts.infoTimeout) + uploadStalledWarningRecentlyEmitted = setTimeout(() => { + uploadStalledWarningRecentlyEmitted = null + }, this.opts.infoTimeout) + } + this.log(`${message} ${details}`.trim(), 'warning') + }) + this.on('upload', () => { this.setState({ error: null }) }) diff --git a/packages/@uppy/xhr-upload/src/index.js b/packages/@uppy/xhr-upload/src/index.js index 7f585e2bb1..34ce6d0b2c 100644 --- a/packages/@uppy/xhr-upload/src/index.js +++ b/packages/@uppy/xhr-upload/src/index.js @@ -231,7 +231,7 @@ export default class XHRUpload extends BasePlugin { const timer = new ProgressTimeout(opts.timeout, () => { const error = new Error(this.i18n('uploadStalled', { seconds: Math.ceil(opts.timeout / 1000) })) - this.uppy.emit('upload-stalled', error, file) + this.uppy.emit('upload-stalled', error, [file]) }) const id = nanoid() @@ -514,7 +514,7 @@ export default class XHRUpload extends BasePlugin { const timer = new ProgressTimeout(this.opts.timeout, () => { const error = new Error(this.i18n('uploadStalled', { seconds: Math.ceil(this.opts.timeout / 1000) })) - this.uppy.emit('upload-stalled', error) + this.uppy.emit('upload-stalled', error, files) }) xhr.upload.addEventListener('loadstart', () => { diff --git a/website/src/docs/core.md b/website/src/docs/core.md index 022af89ddf..d35883dd9b 100644 --- a/website/src/docs/core.md +++ b/website/src/docs/core.md @@ -951,11 +951,15 @@ uppy.on('upload-error', (file, error, response) => { Fired when an upload is seemingly stalled. Use this event to display a message on the UI to tell the user they might want to retry the upload. ```js -uppy.on('upload-stalled', () => { - uppy.info(`Your upload "${file.meta.name}" has not made any progress for ${timeout} seconds. You may want to retry it.`, 'warning') - uppy.once('progress', () => { - uppy.info('The upload is no longer stalled') - }) +uppy.on('upload-stalled', (error, files) => { + console.log(error, files) + const uploadProgressHandler = (file) => { + if (files.includes(file)) { + uppy.info('The upload is no longer stalled') + uppy.off('upload-progress', uploadProgressHandler) + } + } + uppy.on('upload-progress', uploadProgressHandler) }) ``` From 9507c7744f812205530270a6465eabf6531cbae9 Mon Sep 17 00:00:00 2001 From: Antoine du Hamel Date: Wed, 21 Dec 2022 19:22:13 +0100 Subject: [PATCH 08/10] add French translation --- packages/@uppy/locales/src/fr_FR.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/@uppy/locales/src/fr_FR.js b/packages/@uppy/locales/src/fr_FR.js index 2fa230c4ca..748e2934d2 100644 --- a/packages/@uppy/locales/src/fr_FR.js +++ b/packages/@uppy/locales/src/fr_FR.js @@ -125,6 +125,7 @@ fr_FR.strings = { uploadComplete: 'Téléchargement terminé', uploadFailed: 'Le téléchargement a échoué', uploadPaused: 'Téléchargement mis en pause', + uploadStalled: 'Téléchargement bloqué depuis %{seconds} secondes. Il est peut-être nécessaire de recommencer l\'opération.', uploadXFiles: { '0': 'Télécharger %{smart_count} fichier', '1': 'Télécharger %{smart_count} fichiers', From b1cd494036c6c3313577c09f0296543998e03731 Mon Sep 17 00:00:00 2001 From: Antoine du Hamel Date: Thu, 22 Dec 2022 13:17:18 +0100 Subject: [PATCH 09/10] Update website/src/docs/core.md --- website/src/docs/core.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/website/src/docs/core.md b/website/src/docs/core.md index d35883dd9b..7a6c715e2a 100644 --- a/website/src/docs/core.md +++ b/website/src/docs/core.md @@ -948,7 +948,7 @@ uppy.on('upload-error', (file, error, response) => { ### `upload-stalled` -Fired when an upload is seemingly stalled. Use this event to display a message on the UI to tell the user they might want to retry the upload. +Fired when an upload has not received any progress in some time (in `@uppy/xhr-upload`, the delay is defined by the `timeout` option). Use this event to display a message on the UI to tell the user they might want to retry the upload. ```js uppy.on('upload-stalled', (error, files) => { From 17149e9cd7cfc442390a34f488bf9f90a82ccfcb Mon Sep 17 00:00:00 2001 From: Antoine du Hamel Date: Thu, 22 Dec 2022 13:19:02 +0100 Subject: [PATCH 10/10] fixup! Update website/src/docs/core.md --- website/src/docs/core.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/website/src/docs/core.md b/website/src/docs/core.md index 7a6c715e2a..4f3a481832 100644 --- a/website/src/docs/core.md +++ b/website/src/docs/core.md @@ -952,14 +952,14 @@ Fired when an upload has not received any progress in some time (in `@uppy/xhr-u ```js uppy.on('upload-stalled', (error, files) => { - console.log(error, files) - const uploadProgressHandler = (file) => { + console.log('upload seems stalled', error, files) + const noLongerStalledEventHandler = (file) => { if (files.includes(file)) { - uppy.info('The upload is no longer stalled') - uppy.off('upload-progress', uploadProgressHandler) + console.log('upload is no longer stalled') + uppy.off('upload-progress', noLongerStalledEventHandler) } } - uppy.on('upload-progress', uploadProgressHandler) + uppy.on('upload-progress', noLongerStalledEventHandler) }) ```