Skip to content

fix: clean failed uploads when closing upload overlay #1300

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
JammingBen merged 1 commit into from
Oct 2, 2025
Merged

fix: clean failed uploads when closing upload overlay #1300

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 8 additions & 0 deletions packages/web-pkg/src/services/uppy/uppyService.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -328,6 +328,14 @@ export class UppyService {
return this.uppy.cancelAll()
}

removeFailedFiles() {
const { files } = this.uppy.getState()
const failedFiles = Object.values(files).filter((f) => f.error)
if (failedFiles.length) {
this.uppy.removeFiles(failedFiles.map(({ id }) => id))
}
}

getCurrentUploads(): Record<string, unknown> {
return this.uppy.getState().currentUploads
}
Expand Down
45 changes: 29 additions & 16 deletions packages/web-runtime/src/components/UploadInfo.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -164,7 +164,13 @@ import { defineComponent, ref, watch, unref } from 'vue'
import { isUndefined } from 'lodash-es'
import { getSpeed } from '@uppy/utils'
import { HttpError, Resource, urlJoin } from '@opencloud-eu/web-client'
import { OcUppyFile, queryItemAsString, useConfigStore } from '@opencloud-eu/web-pkg'
import {
OcUppyFile,
queryItemAsString,
UppyService,
useConfigStore,
useService
} from '@opencloud-eu/web-pkg'
import { formatFileSize, ResourceListItem, ResourceIcon, ResourceName } from '@opencloud-eu/web-pkg'
import { extractParentFolderName } from '@opencloud-eu/web-client'
import { storeToRefs } from 'pinia'
Expand All @@ -182,6 +188,7 @@ interface UploadResult extends OcUppyFile {
export default defineComponent({
components: { ResourceListItem, ResourceIcon, ResourceName },
setup() {
const uppyService = useService<UppyService>('$uppyService')
const configStore = useConfigStore()
const { options: configOptions } = storeToRefs(configStore)

Expand Down Expand Up @@ -238,7 +245,8 @@ export default defineComponent({
filesInEstimation,
timeStarted,
remainingTime,
disableActions
disableActions,
uppyService
}
},
computed: {
Expand Down Expand Up @@ -298,7 +306,7 @@ export default defineComponent({
)
},
uploadsPausable() {
return this.$uppyService.tusActive()
return this.uppyService.tusActive()
},
showErrorLog() {
return this.infoExpanded && this.uploadErrorLogContent
Expand All @@ -319,7 +327,7 @@ export default defineComponent({
}
},
created() {
this.$uppyService.subscribe('uploadStarted', () => {
this.uppyService.subscribe('uploadStarted', () => {
if (!this.remainingTime) {
this.remainingTime = this.$gettext('Calculating estimated time...')
}
Expand All @@ -333,7 +341,7 @@ export default defineComponent({
this.runningUploads += 1
this.inFinalization = false
})
this.$uppyService.subscribe('addedForUpload', (files: OcUppyFile[]) => {
this.uppyService.subscribe('addedForUpload', (files: OcUppyFile[]) => {
// only count root level files and folders
this.itemsInProgressCount += files.filter((f) => !f.meta.relativeFolder).length

Expand Down Expand Up @@ -365,17 +373,17 @@ export default defineComponent({
}
}
})
this.$uppyService.subscribe('uploadCompleted', () => {
this.uppyService.subscribe('uploadCompleted', () => {
this.runningUploads -= 1

if (!this.runningUploads) {
this.resetProgress()
}
})
this.$uppyService.subscribe('progress', (value: number) => {
this.uppyService.subscribe('progress', (value: number) => {
this.totalProgress = value
})
this.$uppyService.subscribe(
this.uppyService.subscribe(
'upload-progress',
({ file, progress }: { file: OcUppyFile; progress: { bytesUploaded: number } }) => {
if (!this.timeStarted) {
Expand Down Expand Up @@ -412,7 +420,7 @@ export default defineComponent({
}
}
)
this.$uppyService.subscribe(
this.uppyService.subscribe(
'uploadError',
({ file, error }: { file: OcUppyFile; error: Error }) => {
if (this.errors[file.meta.uploadId]) {
Expand All @@ -435,7 +443,7 @@ export default defineComponent({
this.errors[file.meta.uploadId] = error as HttpError

if (!file.meta.isFolder) {
if (!file.meta.relativeFolder) {
if (!file.meta.relativeFolder && this.itemsInProgressCount > 0) {
Copy link

Copilot AI Oct 1, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The condition this.itemsInProgressCount > 0 is added to prevent negative counts, but this could mask underlying issues where the count becomes inconsistent. Consider adding logging or debugging information to track when this condition prevents a decrement, which would help identify root causes of count mismatches.

Copilot uses AI. Check for mistakes.
Copy link
Contributor Author

@JammingBen JammingBen Oct 1, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

True, this is just a quick fix for an edge case scenario where a retry of a failed file would not be added to the count but subtracted eventually => counter can become <0. Solving this the properly would mean quite some refactoring, I'd rather not touch this now.

// reduce count for failed root level files. count for folders is handled in handleTopLevelFolderUpdate
this.itemsInProgressCount -= 1
}
Expand All @@ -446,7 +454,7 @@ export default defineComponent({
}
}
)
this.$uppyService.subscribe('uploadSuccess', (file: OcUppyFile) => {
this.uppyService.subscribe('uploadSuccess', (file: OcUppyFile) => {
// item inside folder
if (!this.uploads[file.meta.uploadId] || file.meta.relativeFolder) {
if (!file.meta.isFolder && file.meta.topLevelFolderId) {
Expand All @@ -468,7 +476,7 @@ export default defineComponent({
this.uploads[file.meta.uploadId].status = 'success'
this.successful.push(file.meta.uploadId)

if (!file.meta.isFolder) {
if (!file.meta.isFolder && this.itemsInProgressCount > 0) {
// reduce count for succeeded root level files. count for folders is handled in handleTopLevelFolderUpdate
this.itemsInProgressCount -= 1
}
Expand Down Expand Up @@ -517,6 +525,11 @@ export default defineComponent({
this.infoExpanded = false
this.cleanOverlay()
this.resetProgress()

if (!this.runningUploads) {
// we can safely remove all failed files if no uploads are running and the overlay is closed
this.uppyService.removeFailedFiles()
}
},
cleanOverlay() {
this.uploadsCancelled = false
Expand Down Expand Up @@ -626,14 +639,14 @@ export default defineComponent({
}
}
this.errors = {}
this.$uppyService.retryAllUploads()
this.uppyService.retryAllUploads()
},
togglePauseUploads() {
if (this.uploadsPaused) {
this.$uppyService.resumeAllUploads()
this.uppyService.resumeAllUploads()
this.timeStarted = null
} else {
this.$uppyService.pauseAllUploads()
this.uppyService.pauseAllUploads()
}

this.uploadsPaused = !this.uploadsPaused
Expand All @@ -643,7 +656,7 @@ export default defineComponent({
this.itemsInProgressCount = 0
this.runningUploads = 0
this.resetProgress()
this.$uppyService.cancelAllUploads()
this.uppyService.cancelAllUploads()
const runningUploads = Object.values(this.uploads).filter(
(u) => u.status !== 'success' && u.status !== 'error'
)
Expand Down
3 changes: 2 additions & 1 deletion packages/web-runtime/tests/unit/components/UploadInfo.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -244,7 +244,8 @@ function getShallowWrapper() {
wrapper: shallowMount(UploadInfo, {
global: {
plugins: [...defaultPlugins()],
mocks
mocks,
provide: mocks
}
})
}
Expand Down
3 changes: 0 additions & 3 deletions web.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
/// <reference types="vite/client" />

import { UppyService } from '@opencloud-eu/web-pkg'
import { Route, Router } from 'vue-router'

// This file must have at least one export or import on top-level
Expand All @@ -14,8 +13,6 @@ declare global {

declare module 'vue' {
interface ComponentCustomProperties {
$uppyService: UppyService

$router: Router
$route: Route
}
Expand Down