From 59ac853c953ee38ec3a7a13eb0f551f07ee168ac Mon Sep 17 00:00:00 2001 From: Jannik Stehle Date: Fri, 10 Jun 2022 14:58:13 +0200 Subject: [PATCH 1/4] Use 'uploadDataDuringCreation' option when uploading via tus --- .../src/components/AppBar/CreateAndUpload.vue | 4 ++-- .../src/composables/upload/useUploadHelpers.ts | 8 ++++++-- .../components/AppBar/CreateAndUpload.spec.js | 6 +----- .../web-runtime/src/components/UploadInfo.vue | 17 ++++++++++++++++- .../src/composables/upload/useUpload.ts | 15 +++++++++++---- .../web-runtime/src/services/uppyService.ts | 3 ++- 6 files changed, 38 insertions(+), 15 deletions(-) diff --git a/packages/web-app-files/src/components/AppBar/CreateAndUpload.vue b/packages/web-app-files/src/components/AppBar/CreateAndUpload.vue index 7e8436698bb..27fb1977fdd 100644 --- a/packages/web-app-files/src/components/AppBar/CreateAndUpload.vue +++ b/packages/web-app-files/src/components/AppBar/CreateAndUpload.vue @@ -673,11 +673,11 @@ export default defineComponent({ const uploadSizeSpaceMapping = uppyResources.reduce((acc, uppyResource) => { let targetUploadSpace - if (uppyResource.meta.route.params?.storage === 'home') { + if (uppyResource.meta.routeStorage === 'home') { targetUploadSpace = this.spaces.find((space) => space.driveType === 'personal') } else { targetUploadSpace = this.spaces.find( - (space) => space.id === uppyResource.meta.route?.params?.storageId + (space) => space.id === uppyResource.meta.routeStorageId ) } diff --git a/packages/web-app-files/src/composables/upload/useUploadHelpers.ts b/packages/web-app-files/src/composables/upload/useUploadHelpers.ts index 6f0603e3bd6..37cbe6ea969 100644 --- a/packages/web-app-files/src/composables/upload/useUploadHelpers.ts +++ b/packages/web-app-files/src/composables/upload/useUploadHelpers.ts @@ -226,11 +226,15 @@ const inputFilesToUppyFiles = ({ currentFolder, relativeFolder: directory, relativePath: relativeFilePath, // uppy needs this property to be named relativePath - route: fileRoute, tusEndpoint, webDavBasePath: unref(webDavBasePath), // WebDAV base path where the files will be uploaded to uploadId: uuid.v4(), - topLevelFolderId + topLevelFolderId, + routeName: fileRoute.name, + routeItem: fileRoute.params?.item || '', + routeShareName: (fileRoute.params as any)?.shareName || '', + routeStorage: (fileRoute.params as any)?.storage || '', + routeStorageId: (fileRoute.params as any)?.storageId || '' } }) } diff --git a/packages/web-app-files/tests/unit/components/AppBar/CreateAndUpload.spec.js b/packages/web-app-files/tests/unit/components/AppBar/CreateAndUpload.spec.js index dd7f95dd5f1..0ea9f892b2a 100644 --- a/packages/web-app-files/tests/unit/components/AppBar/CreateAndUpload.spec.js +++ b/packages/web-app-files/tests/unit/components/AppBar/CreateAndUpload.spec.js @@ -176,11 +176,7 @@ describe('CreateAndUpload component', () => { size: 1001 }, meta: { - route: { - params: { - storage: 'home' - } - } + routeStorage: 'home' } } ]) diff --git a/packages/web-runtime/src/components/UploadInfo.vue b/packages/web-runtime/src/components/UploadInfo.vue index b714d1587f7..e5d9a6d521b 100644 --- a/packages/web-runtime/src/components/UploadInfo.vue +++ b/packages/web-runtime/src/components/UploadInfo.vue @@ -343,7 +343,7 @@ export default { } else { this.uploads[file.meta.uploadId].path = `${file.meta.currentFolder}${file.name}` } - this.uploads[file.meta.uploadId].targetRoute = file.meta.route + this.uploads[file.meta.uploadId].targetRoute = this.buildRouteFromUppyResource(file) if (!file.isFolder) { this.uploads[file.meta.uploadId].status = 'success' @@ -426,6 +426,21 @@ export default { parentFolderLink(file) { return this.createFolderLink(path.dirname(file.path), file.storageId, file.targetRoute) }, + buildRouteFromUppyResource(resource) { + if (!resource.meta.routeName) { + return null + } + + return { + name: resource.meta.routeName, + params: { + item: resource.meta.routeItem, + shareName: resource.meta.routeShareName, + storage: resource.meta.routeStorage, + storageId: resource.meta.routeStorageId + } + } + }, defaultParentFolderName(file) { const { targetRoute } = file // FIXME: use isLocationSpacesActive(), but it currently lies in the files app diff --git a/packages/web-runtime/src/composables/upload/useUpload.ts b/packages/web-runtime/src/composables/upload/useUpload.ts index 866227224f9..b39723815c4 100644 --- a/packages/web-runtime/src/composables/upload/useUpload.ts +++ b/packages/web-runtime/src/composables/upload/useUpload.ts @@ -9,7 +9,6 @@ import { computed, Ref, unref, watch } from '@vue/composition-api' import { useActiveLocation } from 'files/src/composables' import { isLocationPublicActive } from 'files/src/router' import { UppyService } from '../../services/uppyService' -import { Location } from 'vue-router/types/router' import * as uuid from 'uuid' export interface UppyResource { @@ -22,11 +21,15 @@ export interface UppyResource { currentFolder: string relativeFolder: string relativePath: string - route: Location tusEndpoint: string webDavBasePath: string uploadId: string topLevelFolderId?: string + routeName?: string + routeItem?: string + routeShareName?: string + routeStorage?: string + routeStorageId?: string } } @@ -152,9 +155,13 @@ const createDirectoryTree = ({ type: 'folder', meta: { relativeFolder: createdSubFolders, - route: file.meta.route, currentFolder: file.meta.currentFolder, - uploadId + uploadId, + routeName: file.meta.routeName, + routeItem: file.meta.routeItem, + routeShareName: file.meta.routeShareName, + routeStorage: file.meta.routeStorage, + routeStorageId: file.meta.routeStorageId } } diff --git a/packages/web-runtime/src/services/uppyService.ts b/packages/web-runtime/src/services/uppyService.ts index 535c8196f57..6ae2f6cdc09 100644 --- a/packages/web-runtime/src/services/uppyService.ts +++ b/packages/web-runtime/src/services/uppyService.ts @@ -51,7 +51,8 @@ export class UppyService { chunkSize: chunkSize, removeFingerprintOnSuccess: true, overridePatchMethod: !!tusHttpMethodOverride, - retryDelays: [0, 500, 1000] + retryDelays: [0, 500, 1000], + uploadDataDuringCreation: true } const xhrPlugin = this.uppy.getPlugin('XHRUpload') From 9a3c60d0c0265af54f4fbace1fc6ddbd94092120 Mon Sep 17 00:00:00 2001 From: Jannik Stehle Date: Fri, 10 Jun 2022 15:29:50 +0200 Subject: [PATCH 2/4] Remove route storage usage, add changelog item --- .../unreleased/enhancement-upload-data-during-creation | 6 ++++++ .../web-app-files/src/components/AppBar/CreateAndUpload.vue | 2 +- .../tests/unit/components/AppBar/CreateAndUpload.spec.js | 2 +- packages/web-runtime/src/components/UploadInfo.vue | 1 - 4 files changed, 8 insertions(+), 3 deletions(-) create mode 100644 changelog/unreleased/enhancement-upload-data-during-creation diff --git a/changelog/unreleased/enhancement-upload-data-during-creation b/changelog/unreleased/enhancement-upload-data-during-creation new file mode 100644 index 00000000000..e4c66bddbe2 --- /dev/null +++ b/changelog/unreleased/enhancement-upload-data-during-creation @@ -0,0 +1,6 @@ +Enhancement: Upload data during creation + +Uploading via tus now uses the `uploadDataDuringCreation` option which saves up one request. Also, we've fixed a serialization error during uploads, saving up another request. + +https://github.com/owncloud/web/pull/7111 +https://github.com/owncloud/web/issues/7066 diff --git a/packages/web-app-files/src/components/AppBar/CreateAndUpload.vue b/packages/web-app-files/src/components/AppBar/CreateAndUpload.vue index 27fb1977fdd..2f08cd50176 100644 --- a/packages/web-app-files/src/components/AppBar/CreateAndUpload.vue +++ b/packages/web-app-files/src/components/AppBar/CreateAndUpload.vue @@ -673,7 +673,7 @@ export default defineComponent({ const uploadSizeSpaceMapping = uppyResources.reduce((acc, uppyResource) => { let targetUploadSpace - if (uppyResource.meta.routeStorage === 'home') { + if (uppyResource.meta.routeName === 'files-spaces-personal') { targetUploadSpace = this.spaces.find((space) => space.driveType === 'personal') } else { targetUploadSpace = this.spaces.find( diff --git a/packages/web-app-files/tests/unit/components/AppBar/CreateAndUpload.spec.js b/packages/web-app-files/tests/unit/components/AppBar/CreateAndUpload.spec.js index 0ea9f892b2a..07245454d50 100644 --- a/packages/web-app-files/tests/unit/components/AppBar/CreateAndUpload.spec.js +++ b/packages/web-app-files/tests/unit/components/AppBar/CreateAndUpload.spec.js @@ -176,7 +176,7 @@ describe('CreateAndUpload component', () => { size: 1001 }, meta: { - routeStorage: 'home' + routeName: 'files-spaces-personal' } } ]) diff --git a/packages/web-runtime/src/components/UploadInfo.vue b/packages/web-runtime/src/components/UploadInfo.vue index e5d9a6d521b..30736a6a602 100644 --- a/packages/web-runtime/src/components/UploadInfo.vue +++ b/packages/web-runtime/src/components/UploadInfo.vue @@ -468,7 +468,6 @@ export default { query: targetRoute.query, params: { ...(storageId && path && { storageId }), - ...(targetRoute.params?.storage && { storage: targetRoute.params?.storage }), ...(targetRoute.params?.shareName && { shareName: targetRoute.params?.shareName }) } } From f6ef8e3ed0327cc53156c299f1f785d065396382 Mon Sep 17 00:00:00 2001 From: Jannik Stehle Date: Mon, 13 Jun 2022 10:07:00 +0200 Subject: [PATCH 3/4] Add shareId to uppyResource meta object, split changelog item --- changelog/unreleased/bugfix-upload-meta-serialization | 6 ++++++ .../unreleased/enhancement-upload-data-during-creation | 2 +- .../src/composables/upload/useUploadHelpers.ts | 1 + packages/web-runtime/src/components/UploadInfo.vue | 4 ++++ packages/web-runtime/src/composables/upload/useUpload.ts | 2 ++ 5 files changed, 14 insertions(+), 1 deletion(-) create mode 100644 changelog/unreleased/bugfix-upload-meta-serialization diff --git a/changelog/unreleased/bugfix-upload-meta-serialization b/changelog/unreleased/bugfix-upload-meta-serialization new file mode 100644 index 00000000000..27cdde87e82 --- /dev/null +++ b/changelog/unreleased/bugfix-upload-meta-serialization @@ -0,0 +1,6 @@ +Bugfix: Upload meta data serialization + +We've fixed a bug where meta properties of uploading resources could not be serialized, resulting in unnecessary network requests. + +https://github.com/owncloud/web/pull/6846 +https://github.com/owncloud/web/issues/6819 diff --git a/changelog/unreleased/enhancement-upload-data-during-creation b/changelog/unreleased/enhancement-upload-data-during-creation index e4c66bddbe2..f42c068ef63 100644 --- a/changelog/unreleased/enhancement-upload-data-during-creation +++ b/changelog/unreleased/enhancement-upload-data-during-creation @@ -1,6 +1,6 @@ Enhancement: Upload data during creation -Uploading via tus now uses the `uploadDataDuringCreation` option which saves up one request. Also, we've fixed a serialization error during uploads, saving up another request. +Uploading via tus now uses the `uploadDataDuringCreation` option which saves up one request. https://github.com/owncloud/web/pull/7111 https://github.com/owncloud/web/issues/7066 diff --git a/packages/web-app-files/src/composables/upload/useUploadHelpers.ts b/packages/web-app-files/src/composables/upload/useUploadHelpers.ts index 37cbe6ea969..6221f0d0c08 100644 --- a/packages/web-app-files/src/composables/upload/useUploadHelpers.ts +++ b/packages/web-app-files/src/composables/upload/useUploadHelpers.ts @@ -233,6 +233,7 @@ const inputFilesToUppyFiles = ({ routeName: fileRoute.name, routeItem: fileRoute.params?.item || '', routeShareName: (fileRoute.params as any)?.shareName || '', + routeShareId: (fileRoute.query as any)?.shareId || '', routeStorage: (fileRoute.params as any)?.storage || '', routeStorageId: (fileRoute.params as any)?.storageId || '' } diff --git a/packages/web-runtime/src/components/UploadInfo.vue b/packages/web-runtime/src/components/UploadInfo.vue index 30736a6a602..92bc89b623b 100644 --- a/packages/web-runtime/src/components/UploadInfo.vue +++ b/packages/web-runtime/src/components/UploadInfo.vue @@ -433,6 +433,9 @@ export default { return { name: resource.meta.routeName, + query: { + shareId: resource.meta.routeShareId + }, params: { item: resource.meta.routeItem, shareName: resource.meta.routeShareName, @@ -468,6 +471,7 @@ export default { query: targetRoute.query, params: { ...(storageId && path && { storageId }), + ...(targetRoute.params?.storage && { storage: targetRoute.params?.storage }), ...(targetRoute.params?.shareName && { shareName: targetRoute.params?.shareName }) } } diff --git a/packages/web-runtime/src/composables/upload/useUpload.ts b/packages/web-runtime/src/composables/upload/useUpload.ts index b39723815c4..3cb07d28eb3 100644 --- a/packages/web-runtime/src/composables/upload/useUpload.ts +++ b/packages/web-runtime/src/composables/upload/useUpload.ts @@ -18,6 +18,7 @@ export interface UppyResource { type: string data: Blob meta: { + // must only contain primitive types because the properties can't be serialized otherwise! currentFolder: string relativeFolder: string relativePath: string @@ -28,6 +29,7 @@ export interface UppyResource { routeName?: string routeItem?: string routeShareName?: string + routeShareId?: string routeStorage?: string routeStorageId?: string } From e4790bff10ab6ebd1ba48e27fd0b4a722549d951 Mon Sep 17 00:00:00 2001 From: Jannik Stehle Date: Mon, 13 Jun 2022 10:33:28 +0200 Subject: [PATCH 4/4] Use capabilities for create-with-upload option --- .../web-pkg/src/composables/capability/useCapability.ts | 4 ++++ packages/web-runtime/src/composables/upload/useUpload.ts | 3 +++ packages/web-runtime/src/services/uppyService.ts | 6 +++++- 3 files changed, 12 insertions(+), 1 deletion(-) diff --git a/packages/web-pkg/src/composables/capability/useCapability.ts b/packages/web-pkg/src/composables/capability/useCapability.ts index ff786fab3d6..3c8a789347f 100644 --- a/packages/web-pkg/src/composables/capability/useCapability.ts +++ b/packages/web-pkg/src/composables/capability/useCapability.ts @@ -43,3 +43,7 @@ export const useCapabilityFilesTusSupportMaxChunkSize = createCapabilityComposab 'files.tus_support.max_chunk_size', 0 ) +export const useCapabilityFilesTusExtension = createCapabilityComposable( + 'files.tus_support.extension', + '' +) diff --git a/packages/web-runtime/src/composables/upload/useUpload.ts b/packages/web-runtime/src/composables/upload/useUpload.ts index 3cb07d28eb3..42eb37a8dfe 100644 --- a/packages/web-runtime/src/composables/upload/useUpload.ts +++ b/packages/web-runtime/src/composables/upload/useUpload.ts @@ -1,5 +1,6 @@ import { ClientService } from 'web-pkg/src/services' import { + useCapabilityFilesTusExtension, useCapabilityFilesTusSupportHttpMethodOverride, useCapabilityFilesTusSupportMaxChunkSize, useClientService, @@ -53,6 +54,7 @@ export function useUpload(options: UploadOptions): UploadResult { const tusHttpMethodOverride = useCapabilityFilesTusSupportHttpMethodOverride() const tusMaxChunkSize = useCapabilityFilesTusSupportMaxChunkSize() + const tusExtension = useCapabilityFilesTusExtension() const uploadChunkSize = computed((): number => store.getters.configuration.uploadChunkSize) const headers = computed((): { [key: string]: string } => { @@ -78,6 +80,7 @@ export function useUpload(options: UploadOptions): UploadResult { tusMaxChunkSize: unref(tusMaxChunkSize), uploadChunkSize: unref(uploadChunkSize), tusHttpMethodOverride: unref(tusHttpMethodOverride), + tusExtension: unref(tusExtension), headers: unref(headers) } } diff --git a/packages/web-runtime/src/services/uppyService.ts b/packages/web-runtime/src/services/uppyService.ts index 6ae2f6cdc09..7f6ff8342df 100644 --- a/packages/web-runtime/src/services/uppyService.ts +++ b/packages/web-runtime/src/services/uppyService.ts @@ -34,11 +34,13 @@ export class UppyService { tusMaxChunkSize, uploadChunkSize, tusHttpMethodOverride, + tusExtension, headers }: { tusMaxChunkSize: number uploadChunkSize: number tusHttpMethodOverride: boolean + tusExtension: string headers: { [key: string]: string } }) { const chunkSize = @@ -46,13 +48,15 @@ export class UppyService { ? Math.max(tusMaxChunkSize, uploadChunkSize) : uploadChunkSize + const uploadDataDuringCreation = tusExtension.includes('creation-with-upload') + const tusPluginOptions = { headers: headers, chunkSize: chunkSize, removeFingerprintOnSuccess: true, overridePatchMethod: !!tusHttpMethodOverride, retryDelays: [0, 500, 1000], - uploadDataDuringCreation: true + uploadDataDuringCreation } const xhrPlugin = this.uppy.getPlugin('XHRUpload')