fix: disable paste button in same folder

changelog/unreleased/bugfix-disable-paste-action-in-same-folder.md

@@ -0,0 +1,6 @@
+Bugfix: Disable paste action in same folder
+
+We've fixed the state of the "paste files" action when copied resources are from the same folder. The button will be disabled in such case and a tooltip with explanation message displayed.
+
+https://github.com/owncloud/web/pull/12044
+https://github.com/owncloud/web/issues/12021

packages/web-app-files/src/components/AppBar/CreateAndUpload.vue

@@ -158,14 +158,12 @@
     <div
       v-if="showPasteHereButton"
       id="clipboard-btns"
-      v-oc-tooltip="
-        uploadOrFileCreationBlocked ? $gettext('You have no permission to paste files here!') : ''
-      "
+      v-oc-tooltip="pasteHereButtonTooltip"
       class="oc-button-group"
-      :class="{ disabled: uploadOrFileCreationBlocked }"
+      :class="{ disabled: isPasteHereButtonDisabled }"
     >
       <oc-button
-        :disabled="uploadOrFileCreationBlocked"
+        :disabled="isPasteHereButtonDisabled"
         class="paste-files-btn"
         @click="pasteFileAction"
       >
@@ -270,6 +268,7 @@ export default defineComponent({
     const sharesStore = useSharesStore()
     const route = useRoute()
     const language = useGettext()
+    const { $gettext } = language
 
     const clipboardStore = useClipboardStore()
     const { clearClipboard } = clipboardStore
@@ -401,6 +400,36 @@ export default defineComponent({
       }
     }
 
+    const uploadOrFileCreationBlocked = computed(() => {
+      return !unref(canUpload)
+    })
+
+    const isPastingIntoSameFolder = computed(() => {
+      if (!unref(clipboardResources) || unref(clipboardResources).length < 1) {
+        return false
+      }
+
+      return !unref(clipboardResources).some(
+        (resource) => resource.parentFolderId !== unref(currentFolder).id
+      )
+    })
+
+    const isPasteHereButtonDisabled = computed(() => {
+      return unref(uploadOrFileCreationBlocked) || unref(isPastingIntoSameFolder)
+    })
+
+    const pasteHereButtonTooltip = computed(() => {
+      if (unref(uploadOrFileCreationBlocked)) {
+        return $gettext('You have no permission to paste files here!')
+      }
+
+      if (unref(isPastingIntoSameFolder)) {
+        return $gettext('You cannot paste resources into the same folder where you copied them.')
+      }
+
+      return ''
+    })
+
     onMounted(() => {
       uploadCompletedSub = uppyService.subscribe('uploadCompleted', onUploadComplete)
       document.addEventListener('paste', handlePasteFileEvent)
@@ -446,6 +475,9 @@ export default defineComponent({
       areFileExtensionsShown,
       clearClipboard,
       clipboardResources,
+      uploadOrFileCreationBlocked,
+      isPasteHereButtonDisabled,
+      pasteHereButtonTooltip,
 
       // HACK: exported for unit tests:
       onUploadComplete
@@ -493,10 +525,6 @@ export default defineComponent({
       return this.$gettext('Upload files or folders')
     },
 
-    uploadOrFileCreationBlocked() {
-      return !this.canUpload
-    },
-
     folderIconResource() {
       return { isFolder: true, extension: '' } as Resource
     }

packages/web-app-files/tests/unit/components/AppBar/CreateAndUpload.spec.ts

@@ -104,6 +104,34 @@ describe('CreateAndUpload component', () => {
       const clipboardStore = useClipboardStore()
       expect(clipboardStore.clearClipboard).toHaveBeenCalled()
     })
+    it('should disable the "paste files"-action when clipboardResources are from same folder', () => {
+      const { wrapper } = getWrapper({
+        clipboardResources: [mock<Resource>({ parentFolderId: 'current-folder' })],
+        currentFolder: mock<Resource>({
+          id: 'current-folder',
+          canUpload: vi.fn().mockReturnValue(true)
+        })
+      })
+      expect(
+        wrapper.findComponent<typeof OcButton>(elSelector.pasteFilesBtn).vm.disabled
+      ).toStrictEqual(true)
+    })
+
+    it('should not disable the "paste files"-action when at least one clipboardResources is not from same folder', () => {
+      const { wrapper } = getWrapper({
+        clipboardResources: [
+          mock<Resource>({ parentFolderId: 'current-folder' }),
+          mock<Resource>({ parentFolderId: 'another-folder' })
+        ],
+        currentFolder: mock<Resource>({
+          id: 'current-folder',
+          canUpload: vi.fn().mockReturnValue(true)
+        })
+      })
+      expect(
+        wrapper.findComponent<typeof OcButton>(elSelector.pasteFilesBtn).vm.disabled
+      ).toStrictEqual(false)
+    })
   })
   describe('method "onUploadComplete"', () => {
     it.each([