From f0dd02b5f1f6485e49af3865a9a632b6a20f6224 Mon Sep 17 00:00:00 2001
From: JanAckermann <jackermann@owncloud.com>
Date: Thu, 17 Mar 2022 10:00:41 +0100
Subject: [PATCH 01/14] Fix single space page title, add trash space title

---
 .../src/views/spaces/Project.vue              |  4 +--
 .../src/views/spaces/Trashbin.vue             | 32 ++++++++++++++++++-
 2 files changed, 33 insertions(+), 3 deletions(-)

diff --git a/packages/web-app-files/src/views/spaces/Project.vue b/packages/web-app-files/src/views/spaces/Project.vue
index 6c47e7fbd98..41a084551bc 100644
--- a/packages/web-app-files/src/views/spaces/Project.vue
+++ b/packages/web-app-files/src/views/spaces/Project.vue
@@ -238,7 +238,7 @@ export default {
       'totalFilesCount',
       'totalFilesSize'
     ]),
-    ...mapGetters(['user', 'getToken']),
+    ...mapGetters(['user', 'getToken', 'configuration']),
 
     selected: {
       get() {
@@ -360,7 +360,7 @@ export default {
   async mounted() {
     await this.loadResourcesTask.perform(this, false, this.$route.params.item || '')
 
-    document.title = `${this.space.name} - ${this.$route.meta.title}`
+    document.title = `${this.$route.meta.title} - ${this.space.name} - ${this.configuration.currentTheme.general.name}`
     this.$route.params.name = this.space.name
 
     const loadSpaceEventToken = bus.subscribe('app.files.list.load', (path) => {
diff --git a/packages/web-app-files/src/views/spaces/Trashbin.vue b/packages/web-app-files/src/views/spaces/Trashbin.vue
index aa2b5c74dc6..baac6866248 100644
--- a/packages/web-app-files/src/views/spaces/Trashbin.vue
+++ b/packages/web-app-files/src/views/spaces/Trashbin.vue
@@ -2,8 +2,38 @@
 
 <script>
 import Trashbin from '../../components/Trashbin.vue'
+import { useStore } from 'web-pkg/src/composables'
+import { ref } from '@vue/composition-api'
+import { clientService } from 'web-pkg/src/services'
+import { useTask } from 'vue-concurrency'
+import { buildSpace } from '../../helpers/resources'
 
 export default {
-  components: { Trashbin }
+  components: { Trashbin },
+
+  setup() {
+    const store = useStore()
+    const space = ref({})
+    const graphClient = clientService.graphAuthenticated(
+      store.getters.configuration.server,
+      store.getters.getToken
+    )
+
+    const loadResourcesTask = useTask(function* (signal, ref) {
+      const response = yield graphClient.drives.getDrive(ref.$router.currentRoute.params.storageId)
+      const loadedSpace = response.data || {}
+      space.value = buildSpace(loadedSpace)
+    })
+
+    return {
+      space,
+      loadResourcesTask
+    }
+  },
+
+  async mounted() {
+    await this.loadResourcesTask.perform(this)
+    document.title = `${this.$route.meta.title} - ${this.space.name} - ${this.configuration.currentTheme.general.name}`
+  }
 }
 </script>

From cbf5ad1a3f2a06811b63e185dda55cb463450af8 Mon Sep 17 00:00:00 2001
From: JanAckermann <jackermann@owncloud.com>
Date: Thu, 17 Mar 2022 12:34:01 +0100
Subject: [PATCH 02/14] Redesign trash bin breadcrumbs

---
 .../src/components/AppBar/AppBar.vue          | 33 +++++++++++++----
 .../components/FilesList/ContextActions.vue   |  7 +++-
 .../src/mixins/spaces/actions/navigate.js     | 37 +++++++++++++++++++
 3 files changed, 67 insertions(+), 10 deletions(-)
 create mode 100644 packages/web-app-files/src/mixins/spaces/actions/navigate.js

diff --git a/packages/web-app-files/src/components/AppBar/AppBar.vue b/packages/web-app-files/src/components/AppBar/AppBar.vue
index 71abe73b9ef..30f2dfd5e78 100644
--- a/packages/web-app-files/src/components/AppBar/AppBar.vue
+++ b/packages/web-app-files/src/components/AppBar/AppBar.vue
@@ -22,7 +22,7 @@
           :items="breadcrumbs"
         >
           <template #contextMenu>
-            <context-actions v-if="showContextActions" :items="[currentFolder]" />
+            <context-actions v-if="showContextActions" :items="contextActionItems" />
           </template>
         </oc-breadcrumb>
         <shares-navigation v-if="isSharesLocation" />
@@ -95,6 +95,7 @@ export default {
       isPublicLocation: useActiveLocation(isLocationPublicActive, 'files-public-files'),
       isSpacesProjectsLocation: useActiveLocation(isLocationSpacesActive, 'files-spaces-projects'),
       isSpacesProjectLocation: useActiveLocation(isLocationSpacesActive, 'files-spaces-project'),
+      isTrashPersonalActive: useActiveLocation(isLocationTrashActive, 'files-trash-personal'),
       isTrashSpacesProjectActive: useActiveLocation(
         isLocationTrashActive,
         'files-trash-spaces-project'
@@ -119,7 +120,7 @@ export default {
     ...mapState('Files', ['areHiddenFilesShown']),
 
     showContextActions() {
-      if (this.isTrashSpacesProjectActive) {
+      if (this.isTrashPersonalActive) {
         return false
       }
       if (this.isSpacesProjectLocation) {
@@ -128,6 +129,12 @@ export default {
 
       return this.currentFolder && this.breadcrumbs.length > 1
     },
+    contextActionItems() {
+      if (this.isTrashSpacesProjectActive) {
+        return []
+      }
+      return [this.currentFolder]
+    },
     currentPath() {
       const path = this.$route.params.item || ''
       if (path.endsWith('/')) {
@@ -176,24 +183,34 @@ export default {
           this.isPersonalLocation ||
           this.isSpacesProjectsLocation ||
           this.isSpacesProjectLocation ||
+          this.isTrashPersonalActive ||
           this.isTrashSpacesProjectActive
         )
       ) {
         return []
       }
 
-      if (this.isTrashSpacesProjectActive) {
+      if (this.isTrashPersonalActive) {
         return [
           {
-            text: this.$gettext('Spaces'),
-            to: '/files/spaces/projects'
+            text: this.$gettext('Deleted files'),
+            to: '/files/trash'
           },
           {
-            text: this.$route.params.storageId,
-            to: `/files/spaces/projects/${this.$route.params.storageId}`
+            text: this.$gettext('Personal'),
+            onClick: () => bus.publish('app.files.list.load')
+          }
+        ]
+      }
+
+      if (this.isTrashSpacesProjectActive) {
+        return [
+          {
+            text: this.$gettext('Deleted files'),
+            to: '/files/trash'
           },
           {
-            text: this.$gettext('Deleted Files'),
+            text: this.$route.params.storageId,
             onClick: () => bus.publish('app.files.list.load')
           }
         ]
diff --git a/packages/web-app-files/src/components/FilesList/ContextActions.vue b/packages/web-app-files/src/components/FilesList/ContextActions.vue
index fa43d33f521..1e28893e703 100644
--- a/packages/web-app-files/src/components/FilesList/ContextActions.vue
+++ b/packages/web-app-files/src/components/FilesList/ContextActions.vue
@@ -41,6 +41,7 @@ import ShowDetails from '../../mixins/actions/showDetails'
 import ShowShares from '../../mixins/actions/showShares'
 import SetSpaceImage from '../../mixins/spaces/actions/setImage'
 import SetSpaceReadme from '../../mixins/spaces/actions/setReadme'
+import SpaceNavigate from '../../mixins/spaces/actions/navigate'
 
 export default {
   name: 'ContextActions',
@@ -64,7 +65,8 @@ export default {
     ShowDetails,
     ShowShares,
     SetSpaceImage,
-    SetSpaceReadme
+    SetSpaceReadme,
+    SpaceNavigate
   ],
 
   props: {
@@ -165,7 +167,8 @@ export default {
         ...this.$_acceptShare_items,
         ...this.$_declineShare_items,
         ...this.$_setSpaceImage_items,
-        ...this.$_setSpaceReadme_items
+        ...this.$_setSpaceReadme_items,
+        ...this.$_navigate_space_items
       ].filter((item) => item.isEnabled(this.filterParams))
     },
 
diff --git a/packages/web-app-files/src/mixins/spaces/actions/navigate.js b/packages/web-app-files/src/mixins/spaces/actions/navigate.js
new file mode 100644
index 00000000000..c97649888ca
--- /dev/null
+++ b/packages/web-app-files/src/mixins/spaces/actions/navigate.js
@@ -0,0 +1,37 @@
+import { createLocationSpaces, isLocationTrashActive } from '../../../router'
+
+export default {
+  computed: {
+    $_navigate_space_items() {
+      return [
+        {
+          name: 'navigate',
+          icon: 'layout-grid',
+          label: () => {
+            return this.$gettext('Navigate to space')
+          },
+          handler: this.$_navigate_space_trigger,
+          isEnabled: ({ resources }) => {
+            if (resources.length) {
+              return false
+            }
+            return isLocationTrashActive(this.$router, 'files-trash-spaces-project')
+          },
+          componentType: 'oc-button',
+          class: 'oc-files-actions-navigate-trigger'
+        }
+      ]
+    }
+  },
+  methods: {
+    $_navigate_space_trigger({ resources }) {
+      this.$router.push(
+        createLocationSpaces('files-spaces-project', {
+          params: {
+            storageId: this.$route.params.storageId
+          }
+        })
+      )
+    }
+  }
+}

From bc311bdc08f8f00460475f0de17536c3e68cd573 Mon Sep 17 00:00:00 2001
From: JanAckermann <jackermann@owncloud.com>
Date: Thu, 17 Mar 2022 14:01:26 +0100
Subject: [PATCH 03/14] Rename trashbin component && remove duplicate test

---
 .../components/{Trashbin.vue => TrashBin.vue} |   2 +-
 packages/web-app-files/src/views/Trashbin.vue |   6 +-
 .../src/views/spaces/Trashbin.vue             |   6 +-
 .../{Trashbin.spec.js => TrashBin.spec.js}    |   4 +-
 ...bin.spec.js.snap => TrashBin.spec.js.snap} |   0
 .../tests/unit/views/Trashbin.spec.js         | 203 ------------------
 6 files changed, 9 insertions(+), 212 deletions(-)
 rename packages/web-app-files/src/components/{Trashbin.vue => TrashBin.vue} (99%)
 rename packages/web-app-files/tests/unit/components/{Trashbin.spec.js => TrashBin.spec.js} (98%)
 rename packages/web-app-files/tests/unit/components/__snapshots__/{Trashbin.spec.js.snap => TrashBin.spec.js.snap} (100%)
 delete mode 100644 packages/web-app-files/tests/unit/views/Trashbin.spec.js

diff --git a/packages/web-app-files/src/components/Trashbin.vue b/packages/web-app-files/src/components/TrashBin.vue
similarity index 99%
rename from packages/web-app-files/src/components/Trashbin.vue
rename to packages/web-app-files/src/components/TrashBin.vue
index 11fa15ac363..1572b6e13e2 100644
--- a/packages/web-app-files/src/components/Trashbin.vue
+++ b/packages/web-app-files/src/components/TrashBin.vue
@@ -62,7 +62,7 @@ import { useResourcesViewDefaults } from '../composables'
 import { bus } from 'web-pkg/src/instance'
 
 export default {
-  name: 'Trashbin',
+  name: 'TrashBin',
 
   components: { ResourceTable, ListLoader, NoContentMessage, ListInfo, Pagination, ContextActions },
 
diff --git a/packages/web-app-files/src/views/Trashbin.vue b/packages/web-app-files/src/views/Trashbin.vue
index 2ab9482f50b..c990e021a0a 100644
--- a/packages/web-app-files/src/views/Trashbin.vue
+++ b/packages/web-app-files/src/views/Trashbin.vue
@@ -1,9 +1,9 @@
-<template><Trashbin /></template>
+<template><trash-bin /></template>
 
 <script>
-import Trashbin from '../components/Trashbin.vue'
+import TrashBin from '../components/TrashBin.vue'
 
 export default {
-  components: { Trashbin }
+  components: { TrashBin }
 }
 </script>
diff --git a/packages/web-app-files/src/views/spaces/Trashbin.vue b/packages/web-app-files/src/views/spaces/Trashbin.vue
index baac6866248..1757174cefc 100644
--- a/packages/web-app-files/src/views/spaces/Trashbin.vue
+++ b/packages/web-app-files/src/views/spaces/Trashbin.vue
@@ -1,7 +1,7 @@
-<template><Trashbin :no-content-message="$gettext('Space has no deleted files')" /></template>
+<template><trash-bin :no-content-message="$gettext('Space has no deleted files')" /></template>
 
 <script>
-import Trashbin from '../../components/Trashbin.vue'
+import TrashBin from '../../components/TrashBin.vue'
 import { useStore } from 'web-pkg/src/composables'
 import { ref } from '@vue/composition-api'
 import { clientService } from 'web-pkg/src/services'
@@ -9,7 +9,7 @@ import { useTask } from 'vue-concurrency'
 import { buildSpace } from '../../helpers/resources'
 
 export default {
-  components: { Trashbin },
+  components: { TrashBin },
 
   setup() {
     const store = useStore()
diff --git a/packages/web-app-files/tests/unit/components/Trashbin.spec.js b/packages/web-app-files/tests/unit/components/TrashBin.spec.js
similarity index 98%
rename from packages/web-app-files/tests/unit/components/Trashbin.spec.js
rename to packages/web-app-files/tests/unit/components/TrashBin.spec.js
index dc5a84ea535..da871bd466f 100644
--- a/packages/web-app-files/tests/unit/components/Trashbin.spec.js
+++ b/packages/web-app-files/tests/unit/components/TrashBin.spec.js
@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils'
-import Trashbin from '@files/src/components/Trashbin.vue'
+import TrashBin from '@files/src/components/TrashBin.vue'
 import { getStore, localVue, createFile } from '@files/tests/unit/components/components.setup.js'
 
 const stubs = {
@@ -176,7 +176,7 @@ describe('Trashbin component', () => {
     paginationPages = 12,
     paginationPage = 21
   } = {}) {
-    const component = { ...Trashbin, created: jest.fn() }
+    const component = { ...TrashBin, created: jest.fn() }
     const store = createStore({
       totalFilesCount: { files: paginatedResources.length, folders: 0 },
       selectedFiles
diff --git a/packages/web-app-files/tests/unit/components/__snapshots__/Trashbin.spec.js.snap b/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap
similarity index 100%
rename from packages/web-app-files/tests/unit/components/__snapshots__/Trashbin.spec.js.snap
rename to packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap
diff --git a/packages/web-app-files/tests/unit/views/Trashbin.spec.js b/packages/web-app-files/tests/unit/views/Trashbin.spec.js
deleted file mode 100644
index 1797f5fbae5..00000000000
--- a/packages/web-app-files/tests/unit/views/Trashbin.spec.js
+++ /dev/null
@@ -1,203 +0,0 @@
-import { mount } from '@vue/test-utils'
-import Trashbin from '@files/src/components/Trashbin.vue'
-import { getStore, localVue, createFile } from '@files/tests/unit/views/views.setup.js'
-
-const stubs = {
-  'list-loader': true,
-  'no-content-message': true,
-  'resource-table': true,
-  'context-actions': true,
-  pagination: true,
-  'list-info': true,
-  'router-link': true
-}
-
-const listLoaderStub = 'list-loader-stub'
-const noContentStub = 'no-content-message-stub'
-const filesTableStub = 'resource-table-stub'
-const filesTableSelector = '#files-trashbin-table'
-const contextActionsStub = 'context-actions-stub'
-const listInfoStub = 'list-info-stub'
-const paginationStub = 'pagination-stub'
-
-describe('Trashbin component', () => {
-  it('should show the list loader when the view is still loading', () => {
-    const wrapper = getMountedWrapper({ loading: true })
-
-    expect(wrapper.find(listLoaderStub).exists()).toBeTruthy()
-    expect(wrapper.find(noContentStub).exists()).toBeFalsy()
-    expect(wrapper.find(filesTableStub).exists()).toBeFalsy()
-  })
-
-  describe('when the view is not loading anymore', () => {
-    it('should show the no content message component if the paginated resources is empty', () => {
-      const wrapper = getMountedWrapper()
-
-      expect(wrapper.find(listLoaderStub).exists()).toBeFalsy()
-      expect(wrapper.find(filesTableStub).exists()).toBeFalsy()
-      expect(wrapper.find(noContentStub).exists()).toBeTruthy()
-    })
-
-    describe('when length of the paginated resources is greater than zero', () => {
-      const resourceList = [
-        createFile({ id: '1234' }),
-        createFile({ id: '5896' }),
-        createFile({ id: '9856' })
-      ]
-      const wrapper = getMountedWrapper({
-        paginatedResources: resourceList
-      })
-
-      it('should not show the no content message component', () => {
-        expect(wrapper.find(noContentStub).exists()).toBeFalsy()
-      })
-
-      it('should load the resource table with correct props', () => {
-        stubs['resource-table'] = false
-        const wrapper = getMountedWrapper({
-          paginatedResources: resourceList
-        })
-        const filesTable = wrapper.find(filesTableSelector)
-
-        expect(filesTable.exists()).toBeTruthy()
-        expect(filesTable).toMatchSnapshot()
-
-        stubs['resource-table'] = true
-      })
-
-      describe('context menu', () => {
-        let wrapper
-        const selectedResources = [resourceList[0], resourceList[1]]
-        const notSelectedResources = [resourceList[2]]
-        beforeEach(() => {
-          stubs['resource-table'] = false
-
-          wrapper = getMountedWrapper({
-            selectedFiles: selectedResources,
-            paginatedResources: resourceList,
-            paginationPage: 1,
-            paginationPages: 2
-          })
-        })
-        afterEach(() => {
-          stubs['resource-table'] = true
-        })
-        it('should show the context actions for every selected resource', () => {
-          selectedResources.forEach((selectedResource) => {
-            const fileRow = wrapper.find(`[data-item-id="${selectedResource.id}"]`)
-            const contextMenu = fileRow.find(contextActionsStub)
-            expect(contextMenu.exists()).toBeTruthy()
-            expect(contextMenu.props().items).toMatchObject(selectedResources)
-          })
-        })
-        it('should not show the context actions for a resource that is not selected', () => {
-          notSelectedResources.forEach((notSelectedResource) => {
-            const fileRow = wrapper.find(`[data-item-id="${notSelectedResource.id}"]`)
-            const contextMenu = fileRow.find(contextActionsStub)
-            expect(contextMenu.exists()).toBeFalsy()
-          })
-        })
-      })
-
-      describe('pagination', () => {
-        it('should be visible if the paginated pages is greater than zero', () => {
-          stubs['resource-table'] = false
-          const wrapper = getMountedWrapper({
-            paginatedResources: resourceList,
-            paginationPages: 2,
-            paginationPage: 1
-          })
-
-          const pagination = wrapper.find(paginationStub)
-
-          expect(pagination.exists()).toBeTruthy()
-          expect(pagination.props()).toMatchObject({
-            pages: 2,
-            currentPage: 1
-          })
-          stubs['resource-table'] = true
-        })
-      })
-
-      describe('list info', () => {
-        it('should be present if the paginated resources list is not empty', () => {
-          stubs['resource-table'] = false
-
-          const wrapper = getMountedWrapper({
-            paginatedResources: resourceList,
-            paginationPage: 1,
-            paginationPages: 2
-          })
-
-          const listInfo = wrapper.find(listInfoStub)
-          expect(listInfo.exists()).toBeTruthy()
-          expect(listInfo.props()).toMatchObject({
-            files: 3,
-            folders: 0
-          })
-          stubs['resource-table'] = true
-        })
-      })
-    })
-  })
-
-  function mountOptions({ store, loading, paginatedResources, paginationPages, paginationPage }) {
-    const $route = { params: { page: 1 } }
-    const $router = {
-      afterEach: jest.fn(),
-      currentRoute: {
-        query: {}
-      }
-    }
-    return {
-      localVue,
-      store: store,
-      stubs,
-      mocks: {
-        $route,
-        $router
-      },
-      setup: () => ({
-        loadResourcesTask: {
-          isRunning: loading,
-          perform: jest.fn()
-        },
-        paginatedResources: paginatedResources,
-        paginationPages: paginationPages,
-        paginationPage: paginationPage
-      })
-    }
-  }
-
-  function getMountedWrapper({
-    selectedFiles = [],
-    loading = false,
-    paginatedResources = [],
-    paginationPages = 12,
-    paginationPage = 21
-  } = {}) {
-    const component = { ...Trashbin, created: jest.fn() }
-    const store = createStore({
-      totalFilesCount: { files: paginatedResources.length, folders: 0 },
-      selectedFiles
-    })
-    return mount(
-      component,
-      mountOptions({
-        store,
-        loading,
-        paginatedResources,
-        paginationPages,
-        paginationPage
-      })
-    )
-  }
-
-  function createStore({ totalFilesCount, highlightedFile, selectedFiles } = {}) {
-    return getStore({
-      highlightedFile,
-      totalFilesCount,
-      selectedFiles
-    })
-  }
-})

From 3ff60bb9ed3ff8bc77678b09e1b0b8742a1ae634 Mon Sep 17 00:00:00 2001
From: JanAckermann <jackermann@owncloud.com>
Date: Thu, 17 Mar 2022 14:57:04 +0100
Subject: [PATCH 04/14] Prepare permission check

---
 packages/web-app-files/src/helpers/resources.js      | 7 ++++++-
 packages/web-app-files/src/mixins/actions/restore.js | 4 ++++
 packages/web-pkg/src/constants/dav.ts                | 3 ++-
 3 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/packages/web-app-files/src/helpers/resources.js b/packages/web-app-files/src/helpers/resources.js
index ab2e3d6fbc1..b07025ec533 100644
--- a/packages/web-app-files/src/helpers/resources.js
+++ b/packages/web-app-files/src/helpers/resources.js
@@ -543,7 +543,12 @@ export function buildDeletedResource(resource) {
     indicators: [],
     canUpload: () => false,
     canDownload: () => false,
-    canBeDeleted: () => true,
+    canBeDeleted: () => {
+      return true
+    },
+    canBeRestored: function () {
+      return true
+    },
     canRename: () => false,
     canShare: () => false,
     canCreate: () => false,
diff --git a/packages/web-app-files/src/mixins/actions/restore.js b/packages/web-app-files/src/mixins/actions/restore.js
index 28c7f9d3061..8727d86e353 100644
--- a/packages/web-app-files/src/mixins/actions/restore.js
+++ b/packages/web-app-files/src/mixins/actions/restore.js
@@ -26,6 +26,10 @@ export default {
             ) {
               return false
             }
+            if (!resources.every((r) => r.canBeRestored())) {
+              return false
+            }
+
             return resources.length > 0
           },
           componentType: 'oc-button',
diff --git a/packages/web-pkg/src/constants/dav.ts b/packages/web-pkg/src/constants/dav.ts
index 1199618b60e..197382fdfd5 100644
--- a/packages/web-pkg/src/constants/dav.ts
+++ b/packages/web-pkg/src/constants/dav.ts
@@ -75,6 +75,7 @@ export abstract class DavProperties {
     DavProperty.ResourceType,
     DavProperty.TrashbinOriginalLocation,
     DavProperty.TrashbinOriginalFilename,
-    DavProperty.TrashbinDeletedDate
+    DavProperty.TrashbinDeletedDate,
+    DavProperty.Permissions
   ]
 }

From 9f2b37765a14ca10bd2d483a5e6b0b48be5d445d Mon Sep 17 00:00:00 2001
From: JanAckermann <jackermann@owncloud.com>
Date: Fri, 18 Mar 2022 11:31:56 +0100
Subject: [PATCH 05/14] Add comment how to properly implement trash acls

---
 packages/web-app-files/src/helpers/resources.js | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/packages/web-app-files/src/helpers/resources.js b/packages/web-app-files/src/helpers/resources.js
index b07025ec533..62f66f02b5a 100644
--- a/packages/web-app-files/src/helpers/resources.js
+++ b/packages/web-app-files/src/helpers/resources.js
@@ -544,9 +544,19 @@ export function buildDeletedResource(resource) {
     canUpload: () => false,
     canDownload: () => false,
     canBeDeleted: () => {
+      /** FIXME: once https://github.com/owncloud/ocis/issues/3339 gets implemented,
+       * we want to add a check if the permission is set.
+       * We might to be careful and do an early return true if DavProperty.Permissions is not set
+       * as oc10 does not support it.
+       **/
       return true
     },
     canBeRestored: function () {
+      /** FIXME: once https://github.com/owncloud/ocis/issues/3339 gets implemented,
+       * we want to add a check if the permission is set.
+       * We might to be careful and do an early return true if DavProperty.Permissions is not set
+       * as oc10 does not support it.
+       **/
       return true
     },
     canRename: () => false,

From b2513c19186c28408db5891a28ea260da8d58b43 Mon Sep 17 00:00:00 2001
From: JanAckermann <jackermann@owncloud.com>
Date: Fri, 18 Mar 2022 11:52:05 +0100
Subject: [PATCH 06/14] Add tests for navigate.js action

---
 .../src/mixins/spaces/actions/navigate.js     |  4 +-
 .../tests/unit/mixins/spaces/navigate.spec.js | 86 +++++++++++++++++++
 2 files changed, 88 insertions(+), 2 deletions(-)
 create mode 100644 packages/web-app-files/tests/unit/mixins/spaces/navigate.spec.js

diff --git a/packages/web-app-files/src/mixins/spaces/actions/navigate.js b/packages/web-app-files/src/mixins/spaces/actions/navigate.js
index c97649888ca..34188b871a8 100644
--- a/packages/web-app-files/src/mixins/spaces/actions/navigate.js
+++ b/packages/web-app-files/src/mixins/spaces/actions/navigate.js
@@ -24,11 +24,11 @@ export default {
     }
   },
   methods: {
-    $_navigate_space_trigger({ resources }) {
+    $_navigate_space_trigger() {
       this.$router.push(
         createLocationSpaces('files-spaces-project', {
           params: {
-            storageId: this.$route.params.storageId
+            storageId: this.$router.currentRoute.params.storageId
           }
         })
       )
diff --git a/packages/web-app-files/tests/unit/mixins/spaces/navigate.spec.js b/packages/web-app-files/tests/unit/mixins/spaces/navigate.spec.js
new file mode 100644
index 00000000000..93eebb68c27
--- /dev/null
+++ b/packages/web-app-files/tests/unit/mixins/spaces/navigate.spec.js
@@ -0,0 +1,86 @@
+import Vuex from 'vuex'
+import { createStore } from 'vuex-extensions'
+import { mount, createLocalVue } from '@vue/test-utils'
+import Navigate from '@files/src/mixins/spaces/actions/navigate.js'
+import { createLocationSpaces, createLocationTrash } from '../../../../src/router'
+
+const localVue = createLocalVue()
+localVue.use(Vuex)
+
+const Component = {
+  render() {},
+  mixins: [Navigate]
+}
+
+describe('navigate', () => {
+  afterEach(() => jest.clearAllMocks())
+
+  describe('isEnabled property', () => {
+    it('should be true when no resource given', () => {
+      const wrapper = getWrapper()
+      expect(wrapper.vm.$_navigate_space_items[0].isEnabled({ resources: [] })).toBe(true)
+    })
+    it('should be false when resource is given', () => {
+      const wrapper = getWrapper()
+      expect(wrapper.vm.$_navigate_space_items[0].isEnabled({ resources: [{}] })).toBe(false)
+    })
+    it('should be false when location is invalid', () => {
+      const wrapper = getWrapper({ invalidLocation: true })
+      expect(wrapper.vm.$_navigate_space_items[0].isEnabled({ resources: [] })).toBe(false)
+    })
+  })
+
+  describe('method "$_navigate_space_trigger"', () => {
+    it('should trigger route change', async () => {
+      const wrapper = getWrapper()
+      await wrapper.vm.$_navigate_space_trigger()
+
+      expect(wrapper.vm.$router.push).toHaveBeenCalledWith(
+        createLocationSpaces('files-spaces-project', {
+          params: {
+            storageId: wrapper.vm.$router.currentRoute.params.storageId
+          }
+        })
+      )
+    })
+  })
+})
+
+function getWrapper({ invalidLocation = false } = {}) {
+  return mount(Component, {
+    localVue,
+    mocks: {
+      $router: {
+        currentRoute: invalidLocation
+          ? createLocationTrash('files-trash-personal')
+          : createLocationTrash('files-trash-spaces-project', { params: { storageId: '1' } }),
+        resolve: (r) => {
+          return { href: r.name }
+        },
+        push: jest.fn()
+      },
+      $gettext: jest.fn()
+    },
+    store: createStore(Vuex.Store, {
+      actions: {
+        createModal: jest.fn(),
+        hideModal: jest.fn(),
+        showMessage: jest.fn()
+      },
+      getters: {
+        configuration: () => ({
+          server: 'https://example.com'
+        }),
+        getToken: () => 'token'
+      },
+      modules: {
+        Files: {
+          namespaced: true,
+          mutations: {
+            REMOVE_FILE: jest.fn()
+          }
+        }
+      }
+    })
+  })
+}

From 976daa50a67d8bd373b3d79a9a35a373fb56b9db Mon Sep 17 00:00:00 2001
From: JanAckermann <jackermann@owncloud.com>
Date: Fri, 18 Mar 2022 12:00:10 +0100
Subject: [PATCH 07/14] Update snapshots

---
 .../__snapshots__/ContextActions.spec.js.snap | 52 +++++------
 .../RecipientContainer.spec.js.snap           | 12 +--
 .../__snapshots__/TrashBin.spec.js.snap       |  8 +-
 .../tests/unit/mixins/actions/restore.spec.js | 12 ++-
 .../views/__snapshots__/Trashbin.spec.js.snap | 87 -------------------
 .../__snapshots__/Projects.spec.js.snap       | 10 +--
 .../__snapshots__/SidebarNav.spec.js.snap     |  6 +-
 .../__snapshots__/SidebarNavItem.spec.js.snap |  4 +-
 .../__snapshots__/FeedbackLink.spec.js.snap   |  2 +-
 .../__snapshots__/ThemeSwitcher.spec.js.snap  | 12 +--
 10 files changed, 63 insertions(+), 142 deletions(-)
 delete mode 100644 packages/web-app-files/tests/unit/views/__snapshots__/Trashbin.spec.js.snap

diff --git a/packages/web-app-files/tests/unit/components/FilesList/__snapshots__/ContextActions.spec.js.snap b/packages/web-app-files/tests/unit/components/FilesList/__snapshots__/ContextActions.spec.js.snap
index 9849b9e62b2..ea3f14506bc 100644
--- a/packages/web-app-files/tests/unit/components/FilesList/__snapshots__/ContextActions.spec.js.snap
+++ b/packages/web-app-files/tests/unit/components/FilesList/__snapshots__/ContextActions.spec.js.snap
@@ -3,59 +3,59 @@
 exports[`ContextActions menu items renders a list of actions for a file 1`] = `
 <div id="oc-files-context-menu">
   <oc-list-stub id="oc-files-context-actions-context" class="oc-files-context-actions oc-pb-s oc-files-context-actions-border">
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-markdown-editor-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-markdown-editor-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="file-text" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in editor</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName1-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName1-trigger action-menu-item" data-testid="action-handler">
         <oc-img-stub src="exampleIcon1" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName1</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName2-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName2-trigger action-menu-item" data-testid="action-handler">
         <oc-img-stub src="exampleIcon2" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName2</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName3-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName3-trigger action-menu-item" data-testid="action-handler">
         <oc-img-stub src="exampleIcon3" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName3</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-download-file-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-download-file-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="download" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Download</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-create-public-link-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-create-public-link-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="links" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Create link</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-shares-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-shares-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="group" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Share</span>
         <!---->
       </button></li>
   </oc-list-stub>
   <oc-list-stub id="oc-files-context-actions-actions" class="oc-files-context-actions oc-pb-s oc-pt-s oc-files-context-actions-border">
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-rename-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-rename-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="pencil" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Edit</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-move-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-move-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="folder-shared" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Move</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-copy-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-copy-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="file-copy" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Copy</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-delete-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-delete-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="delete-bin-5" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Delete</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-actions-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-actions-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="slideshow" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">All actions</span>
         <!---->
       </button></li>
   </oc-list-stub>
   <oc-list-stub id="oc-files-context-actions-sidebar" class="oc-files-context-actions oc-pt-s">
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-details-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-details-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="information" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Details</span>
         <!---->
       </button></li>
@@ -66,59 +66,59 @@ exports[`ContextActions menu items renders a list of actions for a file 1`] = `
 exports[`ContextActions menu items renders a list of actions for a folder 1`] = `
 <div id="oc-files-context-menu">
   <oc-list-stub id="oc-files-context-actions-context" class="oc-files-context-actions oc-pb-s oc-files-context-actions-border">
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-markdown-editor-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-markdown-editor-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="file-text" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in editor</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName1-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName1-trigger action-menu-item" data-testid="action-handler">
         <oc-img-stub src="exampleIcon1" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName1</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName2-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName2-trigger action-menu-item" data-testid="action-handler">
         <oc-img-stub src="exampleIcon2" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName2</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName3-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName3-trigger action-menu-item" data-testid="action-handler">
         <oc-img-stub src="exampleIcon3" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName3</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-download-file-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-download-file-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="download" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Download</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-create-public-link-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-create-public-link-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="links" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Create link</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-shares-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-shares-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="group" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Share</span>
         <!---->
       </button></li>
   </oc-list-stub>
   <oc-list-stub id="oc-files-context-actions-actions" class="oc-files-context-actions oc-pb-s oc-pt-s oc-files-context-actions-border">
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-rename-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-rename-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="pencil" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Edit</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-move-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-move-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="folder-shared" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Move</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-copy-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-copy-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="file-copy" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Copy</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-delete-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-delete-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="delete-bin-5" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Delete</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-actions-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-actions-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="slideshow" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">All actions</span>
         <!---->
       </button></li>
   </oc-list-stub>
   <oc-list-stub id="oc-files-context-actions-sidebar" class="oc-files-context-actions oc-pt-s">
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-details-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-details-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="information" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Details</span>
         <!---->
       </button></li>
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/InviteCollaborator/__snapshots__/RecipientContainer.spec.js.snap b/packages/web-app-files/tests/unit/components/SideBar/Shares/InviteCollaborator/__snapshots__/RecipientContainer.spec.js.snap
index 6b5ee61735a..efc1218935b 100644
--- a/packages/web-app-files/tests/unit/components/SideBar/Shares/InviteCollaborator/__snapshots__/RecipientContainer.spec.js.snap
+++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/InviteCollaborator/__snapshots__/RecipientContainer.spec.js.snap
@@ -2,17 +2,17 @@
 
 exports[`InviteCollaborator RecipientContainer displays an avatar image if capability is present 1`] = `
 <span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-Albert Einstein"><span width="16.8" aria-hidden="true" focusable="false" data-test-user-name="Albert Einstein" class="vue-avatar--wrapper oc-avatar oc-recipient-avatar" style="width: 16.8px; height: 16.8px; line-height: 16.8px; background-color: rgb(194, 28, 83); font-size: 6px; font-family: Helvetica, Arial, sans-serif; color: white;" data-testid="recipient-avatar"><span class="avatarInitials">AE</span></span>
-<p data-testid="recipient-name" class="oc-recipient-name">Albert Einstein</p> <button aria-label="Deselect Albert Einstein" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw">
+<p data-testid="recipient-name" class="oc-recipient-name">Albert Einstein</p> <button aria-label="Deselect Albert Einstein" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw">
   <ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub>
 </button></span>
 `;
 
-exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 1`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-Albert Einstein"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">Albert Einstein</p> <button aria-label="Deselect Albert Einstein" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
+exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 1`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-Albert Einstein"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">Albert Einstein</p> <button aria-label="Deselect Albert Einstein" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
 
-exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 2`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-physics-lovers"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">physics-lovers</p> <button aria-label="Deselect physics-lovers" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
+exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 2`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-physics-lovers"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">physics-lovers</p> <button aria-label="Deselect physics-lovers" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
 
-exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 3`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-guest-user"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">guest-user</p> <button aria-label="Deselect guest-user" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
+exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 3`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-guest-user"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">guest-user</p> <button aria-label="Deselect guest-user" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
 
-exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 4`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-remote-user"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">remote-user</p> <button aria-label="Deselect remote-user" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
+exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 4`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-remote-user"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">remote-user</p> <button aria-label="Deselect remote-user" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
 
-exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 5`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-Albert Einstein"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">Albert Einstein</p> <button aria-label="Deselect Albert Einstein" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
+exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 5`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-Albert Einstein"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">Albert Einstein</p> <button aria-label="Deselect Albert Einstein" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
diff --git a/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap b/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap
index 4655f395437..60f4ec09e9a 100644
--- a/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap
+++ b/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap
@@ -7,7 +7,7 @@ exports[`Trashbin component when the view is not loading anymore when length of
       <th class="oc-th oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-shrink oc-text-nowrap oc-table-header-cell oc-table-header-cell-select oc-pl-m " style="top: 0px;"><span class="oc-table-thead-content"><div class="resource-table-select-all"><span><input id="resource-table-select-all" type="checkbox" name="checkbox" class="oc-checkbox oc-rounded oc-checkbox-l" value=""> <label for="resource-table-select-all" class="oc-invisible-sr oc-cursor-pointer">Select all resources</label></span></div></span>
         <!---->
       </th>
-      <th class="oc-th oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-expand oc-text-nowrap oc-table-header-cell oc-table-header-cell-name" aria-sort="none" style="top: 0px;"><span class="oc-table-thead-content header-text">Name</span> <button aria-label="Sort by name" type="button" class="oc-button-sort oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-invisible"><span class="oc-icon oc-icon-s oc-icon-passive"><!----></span></button></th>
+      <th class="oc-th oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-expand oc-text-nowrap oc-table-header-cell oc-table-header-cell-name" aria-sort="none" style="top: 0px;"><span class="oc-table-thead-content header-text">Name</span> <button aria-label="Sort by name" type="button" class="oc-button-sort oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-invisible"><span class="oc-icon oc-icon-s oc-icon-passive"><!----></span></button></th>
       <th class="oc-th oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-header-cell oc-table-header-cell-status" style="top: 0px;"><span class="oc-table-thead-content header-text">Status</span>
         <!---->
       </th>
@@ -31,7 +31,7 @@ exports[`Trashbin component when the view is not loading anymore when length of
       </td>
       <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-status"></td>
       <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-actions oc-pr-m">
-        <div class="resource-table-actions"> <button aria-label="Show context menu" type="button" class="resource-table-btn-action-dropdown oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="context-menu-trigger-file-id-1234"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
+        <div class="resource-table-actions"> <button aria-label="Show context menu" type="button" class="resource-table-btn-action-dropdown oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="context-menu-trigger-file-id-1234"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
           <div id="context-menu-drop-file-id-1234" class="oc-drop oc-box-shadow-medium oc-rounded"></div>
         </div>
       </td>
@@ -50,7 +50,7 @@ exports[`Trashbin component when the view is not loading anymore when length of
       </td>
       <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-status"></td>
       <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-actions oc-pr-m">
-        <div class="resource-table-actions"> <button aria-label="Show context menu" type="button" class="resource-table-btn-action-dropdown oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="context-menu-trigger-file-id-5896"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
+        <div class="resource-table-actions"> <button aria-label="Show context menu" type="button" class="resource-table-btn-action-dropdown oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="context-menu-trigger-file-id-5896"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
           <div id="context-menu-drop-file-id-5896" class="oc-drop oc-box-shadow-medium oc-rounded"></div>
         </div>
       </td>
@@ -69,7 +69,7 @@ exports[`Trashbin component when the view is not loading anymore when length of
       </td>
       <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-status"></td>
       <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-actions oc-pr-m">
-        <div class="resource-table-actions"> <button aria-label="Show context menu" type="button" class="resource-table-btn-action-dropdown oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="context-menu-trigger-file-id-9856"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
+        <div class="resource-table-actions"> <button aria-label="Show context menu" type="button" class="resource-table-btn-action-dropdown oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="context-menu-trigger-file-id-9856"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
           <div id="context-menu-drop-file-id-9856" class="oc-drop oc-box-shadow-medium oc-rounded"></div>
         </div>
       </td>
diff --git a/packages/web-app-files/tests/unit/mixins/actions/restore.spec.js b/packages/web-app-files/tests/unit/mixins/actions/restore.spec.js
index 4ff703ac89d..f151f770cb4 100644
--- a/packages/web-app-files/tests/unit/mixins/actions/restore.spec.js
+++ b/packages/web-app-files/tests/unit/mixins/actions/restore.spec.js
@@ -22,9 +22,17 @@ describe('restore', () => {
       const wrapper = getWrapper()
       expect(wrapper.vm.$_restore_items[0].isEnabled({ resources: [] })).toBe(false)
     })
-    it('should be true when resource is given', () => {
+    it('should be true when permission is sufficient', () => {
       const wrapper = getWrapper()
-      expect(wrapper.vm.$_restore_items[0].isEnabled({ resources: [{}] })).toBe(true)
+      expect(
+        wrapper.vm.$_restore_items[0].isEnabled({ resources: [{ canBeRestored: () => true }] })
+      ).toBe(true)
+    })
+    it('should be false when permission is not sufficient', () => {
+      const wrapper = getWrapper()
+      expect(
+        wrapper.vm.$_restore_items[0].isEnabled({ resources: [{ canBeRestored: () => false }] })
+      ).toBe(false)
     })
     it('should be false when location is invalid', () => {
       const wrapper = getWrapper({ invalidLocation: true })
diff --git a/packages/web-app-files/tests/unit/views/__snapshots__/Trashbin.spec.js.snap b/packages/web-app-files/tests/unit/views/__snapshots__/Trashbin.spec.js.snap
deleted file mode 100644
index 4655f395437..00000000000
--- a/packages/web-app-files/tests/unit/views/__snapshots__/Trashbin.spec.js.snap
+++ /dev/null
@@ -1,87 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Trashbin component when the view is not loading anymore when length of the paginated resources is greater than zero should load the resource table with correct props 1`] = `
-<table class="files-table oc-table oc-table-hover oc-table-sticky files-table-squashed" id="files-trashbin-table">
-  <thead class="oc-thead">
-    <tr tabindex="-1" class="oc-table-header-row">
-      <th class="oc-th oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-shrink oc-text-nowrap oc-table-header-cell oc-table-header-cell-select oc-pl-m " style="top: 0px;"><span class="oc-table-thead-content"><div class="resource-table-select-all"><span><input id="resource-table-select-all" type="checkbox" name="checkbox" class="oc-checkbox oc-rounded oc-checkbox-l" value=""> <label for="resource-table-select-all" class="oc-invisible-sr oc-cursor-pointer">Select all resources</label></span></div></span>
-        <!---->
-      </th>
-      <th class="oc-th oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-expand oc-text-nowrap oc-table-header-cell oc-table-header-cell-name" aria-sort="none" style="top: 0px;"><span class="oc-table-thead-content header-text">Name</span> <button aria-label="Sort by name" type="button" class="oc-button-sort oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-invisible"><span class="oc-icon oc-icon-s oc-icon-passive"><!----></span></button></th>
-      <th class="oc-th oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-header-cell oc-table-header-cell-status" style="top: 0px;"><span class="oc-table-thead-content header-text">Status</span>
-        <!---->
-      </th>
-      <th class="oc-th oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-header-cell oc-table-header-cell-actions oc-pr-m" style="top: 0px;"><span class="oc-table-thead-content header-text">Actions</span>
-        <!---->
-      </th>
-    </tr>
-  </thead>
-  <tbody>
-    <tr tabindex="-1" data-item-id="file-id-1234" draggable="false" class="oc-tbody-tr oc-tbody-tr-file-id-1234">
-      <td class="oc-td oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-shrink oc-table-data-cell oc-table-data-cell-select oc-pl-m "><span><input id="resource-table-select-file-id-1234" type="checkbox" name="checkbox" class="oc-checkbox oc-rounded oc-checkbox-l" value="[object Object]"> <label for="resource-table-select-file-id-1234" class="oc-invisible-sr oc-cursor-pointer">Select folder</label></span></td>
-      <td class="oc-td oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-expand oc-text-truncate oc-table-data-cell oc-table-data-cell-name">
-        <div class="oc-resource oc-text-overflow"><span><span class="oc-icon oc-icon-l oc-icon-passive oc-resource-icon oc-resource-icon-file"><!----></span></span>
-          <div class="oc-resource-details oc-text-overflow"><span class="oc-text-overflow"><!----> <span data-test-resource-path="/file-path/1234" data-test-resource-name="file-path/file-name-1234" data-test-resource-type="folder" class="oc-resource-name"><span class="oc-text-truncate"><span class="oc-resource-basename">file-name-1234</span></span>
-            <!----></span></span>
-            <div class="oc-resource-indicators">
-              <router-link-stub to="[object Object]" class="parent-folder" style="cursor: pointer;"><span class="oc-icon oc-icon-s oc-icon-passive"><!----></span> <span class="text">file-path</span></router-link-stub>
-            </div>
-          </div>
-        </div>
-      </td>
-      <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-status"></td>
-      <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-actions oc-pr-m">
-        <div class="resource-table-actions"> <button aria-label="Show context menu" type="button" class="resource-table-btn-action-dropdown oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="context-menu-trigger-file-id-1234"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
-          <div id="context-menu-drop-file-id-1234" class="oc-drop oc-box-shadow-medium oc-rounded"></div>
-        </div>
-      </td>
-    </tr>
-    <tr tabindex="-1" data-item-id="file-id-5896" draggable="false" class="oc-tbody-tr oc-tbody-tr-file-id-5896">
-      <td class="oc-td oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-shrink oc-table-data-cell oc-table-data-cell-select oc-pl-m "><span><input id="resource-table-select-file-id-5896" type="checkbox" name="checkbox" class="oc-checkbox oc-rounded oc-checkbox-l" value="[object Object]"> <label for="resource-table-select-file-id-5896" class="oc-invisible-sr oc-cursor-pointer">Select folder</label></span></td>
-      <td class="oc-td oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-expand oc-text-truncate oc-table-data-cell oc-table-data-cell-name">
-        <div class="oc-resource oc-text-overflow"><span><span class="oc-icon oc-icon-l oc-icon-passive oc-resource-icon oc-resource-icon-file"><!----></span></span>
-          <div class="oc-resource-details oc-text-overflow"><span class="oc-text-overflow"><!----> <span data-test-resource-path="/file-path/5896" data-test-resource-name="file-path/file-name-5896" data-test-resource-type="folder" class="oc-resource-name"><span class="oc-text-truncate"><span class="oc-resource-basename">file-name-5896</span></span>
-            <!----></span></span>
-            <div class="oc-resource-indicators">
-              <router-link-stub to="[object Object]" class="parent-folder" style="cursor: pointer;"><span class="oc-icon oc-icon-s oc-icon-passive"><!----></span> <span class="text">file-path</span></router-link-stub>
-            </div>
-          </div>
-        </div>
-      </td>
-      <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-status"></td>
-      <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-actions oc-pr-m">
-        <div class="resource-table-actions"> <button aria-label="Show context menu" type="button" class="resource-table-btn-action-dropdown oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="context-menu-trigger-file-id-5896"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
-          <div id="context-menu-drop-file-id-5896" class="oc-drop oc-box-shadow-medium oc-rounded"></div>
-        </div>
-      </td>
-    </tr>
-    <tr tabindex="-1" data-item-id="file-id-9856" draggable="false" class="oc-tbody-tr oc-tbody-tr-file-id-9856">
-      <td class="oc-td oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-shrink oc-table-data-cell oc-table-data-cell-select oc-pl-m "><span><input id="resource-table-select-file-id-9856" type="checkbox" name="checkbox" class="oc-checkbox oc-rounded oc-checkbox-l" value="[object Object]"> <label for="resource-table-select-file-id-9856" class="oc-invisible-sr oc-cursor-pointer">Select folder</label></span></td>
-      <td class="oc-td oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-expand oc-text-truncate oc-table-data-cell oc-table-data-cell-name">
-        <div class="oc-resource oc-text-overflow"><span><span class="oc-icon oc-icon-l oc-icon-passive oc-resource-icon oc-resource-icon-file"><!----></span></span>
-          <div class="oc-resource-details oc-text-overflow"><span class="oc-text-overflow"><!----> <span data-test-resource-path="/file-path/9856" data-test-resource-name="file-path/file-name-9856" data-test-resource-type="folder" class="oc-resource-name"><span class="oc-text-truncate"><span class="oc-resource-basename">file-name-9856</span></span>
-            <!----></span></span>
-            <div class="oc-resource-indicators">
-              <router-link-stub to="[object Object]" class="parent-folder" style="cursor: pointer;"><span class="oc-icon oc-icon-s oc-icon-passive"><!----></span> <span class="text">file-path</span></router-link-stub>
-            </div>
-          </div>
-        </div>
-      </td>
-      <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-status"></td>
-      <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-actions oc-pr-m">
-        <div class="resource-table-actions"> <button aria-label="Show context menu" type="button" class="resource-table-btn-action-dropdown oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="context-menu-trigger-file-id-9856"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
-          <div id="context-menu-drop-file-id-9856" class="oc-drop oc-box-shadow-medium oc-rounded"></div>
-        </div>
-      </td>
-    </tr>
-  </tbody>
-  <tfoot class="oc-table-footer">
-    <tr class="oc-table-footer-row">
-      <td colspan="4" class="oc-table-footer-cell">
-        <pagination-stub pages="12" currentpage="21"></pagination-stub>
-        <list-info-stub files="3" folders="0" class="oc-width-1-1 oc-my-s"></list-info-stub>
-      </td>
-    </tr>
-  </tfoot>
-</table>
-`;
diff --git a/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.js.snap b/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.js.snap
index d4431526d2a..41eb8264c80 100644
--- a/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.js.snap
+++ b/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.js.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Spaces component should list spaces 1`] = `
-<div class="oc-py-s oc-px-m"><button aria-label="Create a new space" type="button" class="oc-mb-l oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-primary" id="new-space-menu-btn" data-testid="spaces-list-create-space-btn"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span>
+<div class="oc-py-s oc-px-m"><button aria-label="Create a new space" type="button" class="oc-mb-l oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-primary" id="new-space-menu-btn" data-testid="spaces-list-create-space-btn"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span>
     <translate-stub tag="span">Create Space</translate-stub>
   </button>
   <div class="oc-pb-xl oc-border-b"><span>Store your project related files in Spaces for seamless collaboration.</span></div>
@@ -26,15 +26,15 @@ exports[`Spaces component should list spaces 1`] = `
             <div class="oc-flex oc-flex-between oc-flex-middle">
               <div class="oc-flex oc-flex-middle"><span class="oc-mr-s oc-icon oc-icon-m oc-icon-passive"><!----></span> <a href="#/" aria-current="page" class="space-name oc-text-left router-link-exact-active router-link-active"><span></span></a></div>
               <div class="oc-flex oc-flex-middle">
-                <div><button aria-label="Show members" type="button" class="oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button></div>
-                <div><button aria-label="Show context menu" type="button" class="oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="space-context-btn-1"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
+                <div><button aria-label="Show members" type="button" class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button></div>
+                <div><button aria-label="Show context menu" type="button" class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="space-context-btn-1"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
                   <div id="space-context-drop-1" class="oc-drop oc-box-shadow-medium oc-rounded" options="[object Object]">
                     <div class="oc-card oc-card-body oc-rounded oc-background-secondary oc-p-s">
                       <ul class="oc-list oc-files-context-actions">
-                        <li class="oc-files-context-action oc-px-s"><button type="button" class="oc-button oc-rounded oc-button-m oc-button-justify-content-left oc-button-gap-m oc-button-passive oc-button-passive-raw"><span class="oc-flex oc-icon oc-icon-m oc-icon-passive"><!----></span>
+                        <li class="oc-files-context-action oc-px-s"><button type="button" class="oc-button oc-button-m oc-button-justify-content-left oc-button-gap-m oc-button-passive oc-button-passive-raw"><span class="oc-flex oc-icon oc-icon-m oc-icon-passive"><!----></span>
                             Deleted files
                           </button></li>
-                        <li class="oc-files-context-action oc-px-s"><button type="button" class="oc-button oc-rounded oc-button-m oc-button-justify-content-left oc-button-gap-m oc-button-passive oc-button-passive-raw"><span class="oc-flex oc-icon oc-icon-m oc-icon-passive"><!----></span>
+                        <li class="oc-files-context-action oc-px-s"><button type="button" class="oc-button oc-button-m oc-button-justify-content-left oc-button-gap-m oc-button-passive oc-button-passive-raw"><span class="oc-flex oc-icon oc-icon-m oc-icon-passive"><!----></span>
                             Details
                           </button></li>
                       </ul>
diff --git a/packages/web-runtime/tests/unit/components/SidebarNav/__snapshots__/SidebarNav.spec.js.snap b/packages/web-runtime/tests/unit/components/SidebarNav/__snapshots__/SidebarNav.spec.js.snap
index 1c7d2242891..06815ba152d 100644
--- a/packages/web-runtime/tests/unit/components/SidebarNav/__snapshots__/SidebarNav.spec.js.snap
+++ b/packages/web-runtime/tests/unit/components/SidebarNav/__snapshots__/SidebarNav.spec.js.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`OcSidebarNav renders navItems into a list 1`] = `
-<div id="web-nav-sidebar" class="oc-app-navigation-expanded"><button aria-label="Toggle sidebar" type="button" class="toggle-sidebar-button oc-py-s oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw toggle-sidebar-button-expanded oc-pr-s">
+<div id="web-nav-sidebar" class="oc-app-navigation-expanded"><button aria-label="Toggle sidebar" type="button" class="toggle-sidebar-button oc-py-s oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw toggle-sidebar-button-expanded oc-pr-s">
     <oc-icon-stub name="arrow-drop-left" filltype="line" accessiblelabel="" type="span" size="large" variation="passive" color=""></oc-icon-stub>
   </button>
   <nav aria-label="Sidebar navigation menu" class="oc-sidebar-nav oc-my-m oc-px-xs">
@@ -15,7 +15,7 @@ exports[`OcSidebarNav renders navItems into a list 1`] = `
 `;
 
 exports[`OcSidebarNav toggles back into open state upon button click 1`] = `
-<div id="web-nav-sidebar" class="oc-app-navigation-expanded"><button aria-label="Toggle sidebar" type="button" class="toggle-sidebar-button oc-py-s oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw toggle-sidebar-button-expanded oc-pr-s">
+<div id="web-nav-sidebar" class="oc-app-navigation-expanded"><button aria-label="Toggle sidebar" type="button" class="toggle-sidebar-button oc-py-s oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw toggle-sidebar-button-expanded oc-pr-s">
     <oc-icon-stub name="arrow-drop-left" filltype="line" accessiblelabel="" type="span" size="large" variation="passive" color=""></oc-icon-stub>
   </button>
   <nav aria-label="Sidebar navigation menu" class="oc-sidebar-nav oc-my-m oc-px-xs">
@@ -29,7 +29,7 @@ exports[`OcSidebarNav toggles back into open state upon button click 1`] = `
 `;
 
 exports[`OcSidebarNav toggles into closed state upon button click 1`] = `
-<div id="web-nav-sidebar" class="oc-app-navigation-collapsed"><button aria-label="Toggle sidebar" type="button" class="toggle-sidebar-button oc-py-s oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw toggle-sidebar-button-collapsed">
+<div id="web-nav-sidebar" class="oc-app-navigation-collapsed"><button aria-label="Toggle sidebar" type="button" class="toggle-sidebar-button oc-py-s oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw toggle-sidebar-button-collapsed">
     <oc-icon-stub name="arrow-drop-right" filltype="line" accessiblelabel="" type="span" size="large" variation="passive" color=""></oc-icon-stub>
   </button>
   <nav aria-label="Sidebar navigation menu" class="oc-sidebar-nav oc-my-m oc-px-xs">
diff --git a/packages/web-runtime/tests/unit/components/SidebarNav/__snapshots__/SidebarNavItem.spec.js.snap b/packages/web-runtime/tests/unit/components/SidebarNav/__snapshots__/SidebarNavItem.spec.js.snap
index 3bd1ef056ae..b7fea644d88 100644
--- a/packages/web-runtime/tests/unit/components/SidebarNav/__snapshots__/SidebarNavItem.spec.js.snap
+++ b/packages/web-runtime/tests/unit/components/SidebarNav/__snapshots__/SidebarNavItem.spec.js.snap
@@ -2,7 +2,7 @@
 
 exports[`OcSidebarNav renders navItem with toolTip if collapsed 1`] = `
 <li class="oc-sidebar-nav-item oc-pb-xs oc-px-s" id="123">
-  <router-link-stub to="/files/list/all" class="oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-sidebar-nav-item-link" data-nav-id="5"><span class="oc-flex"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span> <span class="oc-ml-m text text-invisible">Personal</span></span>
+  <router-link-stub to="/files/list/all" class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-sidebar-nav-item-link" data-nav-id="5"><span class="oc-flex"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span> <span class="oc-ml-m text text-invisible">Personal</span></span>
     <!---->
     <!---->
   </router-link-stub>
@@ -11,7 +11,7 @@ exports[`OcSidebarNav renders navItem with toolTip if collapsed 1`] = `
 
 exports[`OcSidebarNav renders navItem without toolTip if expanded 1`] = `
 <li class="oc-sidebar-nav-item oc-pb-xs oc-px-s" id="123">
-  <router-link-stub to="/files/list/all" class="oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-sidebar-nav-item-link" data-nav-id="5"><span class="oc-flex"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span> <span class="oc-ml-m text">Personal</span></span>
+  <router-link-stub to="/files/list/all" class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-sidebar-nav-item-link" data-nav-id="5"><span class="oc-flex"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span> <span class="oc-ml-m text">Personal</span></span>
     <!---->
     <!---->
   </router-link-stub>
diff --git a/packages/web-runtime/tests/unit/components/Topbar/__snapshots__/FeedbackLink.spec.js.snap b/packages/web-runtime/tests/unit/components/Topbar/__snapshots__/FeedbackLink.spec.js.snap
index f78c7807d76..c820886ca7e 100644
--- a/packages/web-runtime/tests/unit/components/Topbar/__snapshots__/FeedbackLink.spec.js.snap
+++ b/packages/web-runtime/tests/unit/components/Topbar/__snapshots__/FeedbackLink.spec.js.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`FeedbackLink component has no accessibility violations 1`] = `
-<div class="oc-flex"><a aria-label="ownCloud feedback survey" href="https://owncloud.com/web-design-feedback" class="oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw" target="_blank" aria-describedby="oc-feedback-link-description"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></a>
+<div class="oc-flex"><a aria-label="ownCloud feedback survey" href="https://owncloud.com/web-design-feedback" class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw" target="_blank" aria-describedby="oc-feedback-link-description"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></a>
   <p id="oc-feedback-link-description" class="oc-invisible-sr">Provide your feedback: We'd like to improve the web design and would be happy to hear your feedback. Thank you! Your ownCloud team.</p>
 </div>
 `;
diff --git a/packages/web-runtime/tests/unit/components/Topbar/__snapshots__/ThemeSwitcher.spec.js.snap b/packages/web-runtime/tests/unit/components/Topbar/__snapshots__/ThemeSwitcher.spec.js.snap
index b6466c1f14c..e9cd377b8f4 100644
--- a/packages/web-runtime/tests/unit/components/Topbar/__snapshots__/ThemeSwitcher.spec.js.snap
+++ b/packages/web-runtime/tests/unit/components/Topbar/__snapshots__/ThemeSwitcher.spec.js.snap
@@ -1,37 +1,37 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`ThemeSwitcher component restores dark theme if dark theme is saved in localstorage 1`] = `
-<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Dark mode</span>
+<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Dark mode</span>
   <oc-icon-stub name="moon-clear" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color=""></oc-icon-stub>
 </button>
 `;
 
 exports[`ThemeSwitcher component restores light theme if light theme is saved in localstorage 1`] = `
-<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Light mode</span>
+<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Light mode</span>
   <oc-icon-stub name="sun" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color=""></oc-icon-stub>
 </button>
 `;
 
 exports[`ThemeSwitcher component visually renders a button, initially in dark mode if user prefers dark color scheme 1`] = `
-<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Dark mode</span>
+<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Dark mode</span>
   <oc-icon-stub name="moon-clear" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color=""></oc-icon-stub>
 </button>
 `;
 
 exports[`ThemeSwitcher component visually renders a button, initially in light mode per default 1`] = `
-<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Light mode</span>
+<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Light mode</span>
   <oc-icon-stub name="sun" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color=""></oc-icon-stub>
 </button>
 `;
 
 exports[`ThemeSwitcher component visually toggles between themes upon click 1`] = `
-<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Dark mode</span>
+<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Dark mode</span>
   <oc-icon-stub name="moon-clear" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color=""></oc-icon-stub>
 </button>
 `;
 
 exports[`ThemeSwitcher component visually toggles between themes upon click 2`] = `
-<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Light mode</span>
+<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Light mode</span>
   <oc-icon-stub name="sun" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color=""></oc-icon-stub>
 </button>
 `;

From 31adc69699be3e300490072925e8c739df3954d3 Mon Sep 17 00:00:00 2001
From: JanAckermann <jackermann@owncloud.com>
Date: Fri, 18 Mar 2022 12:14:43 +0100
Subject: [PATCH 08/14] Update snapshots

---
 .../__snapshots__/ContextActions.spec.js.snap | 52 +++++++++----------
 .../RecipientContainer.spec.js.snap           | 12 ++---
 .../__snapshots__/TrashBin.spec.js.snap       |  8 +--
 .../__snapshots__/Projects.spec.js.snap       | 10 ++--
 .../__snapshots__/SidebarNav.spec.js.snap     |  6 +--
 .../__snapshots__/SidebarNavItem.spec.js.snap |  4 +-
 .../__snapshots__/FeedbackLink.spec.js.snap   |  2 +-
 .../__snapshots__/ThemeSwitcher.spec.js.snap  | 12 ++---
 8 files changed, 53 insertions(+), 53 deletions(-)

diff --git a/packages/web-app-files/tests/unit/components/FilesList/__snapshots__/ContextActions.spec.js.snap b/packages/web-app-files/tests/unit/components/FilesList/__snapshots__/ContextActions.spec.js.snap
index ea3f14506bc..9849b9e62b2 100644
--- a/packages/web-app-files/tests/unit/components/FilesList/__snapshots__/ContextActions.spec.js.snap
+++ b/packages/web-app-files/tests/unit/components/FilesList/__snapshots__/ContextActions.spec.js.snap
@@ -3,59 +3,59 @@
 exports[`ContextActions menu items renders a list of actions for a file 1`] = `
 <div id="oc-files-context-menu">
   <oc-list-stub id="oc-files-context-actions-context" class="oc-files-context-actions oc-pb-s oc-files-context-actions-border">
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-markdown-editor-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-markdown-editor-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="file-text" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in editor</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName1-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName1-trigger action-menu-item" data-testid="action-handler">
         <oc-img-stub src="exampleIcon1" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName1</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName2-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName2-trigger action-menu-item" data-testid="action-handler">
         <oc-img-stub src="exampleIcon2" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName2</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName3-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName3-trigger action-menu-item" data-testid="action-handler">
         <oc-img-stub src="exampleIcon3" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName3</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-download-file-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-download-file-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="download" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Download</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-create-public-link-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-create-public-link-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="links" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Create link</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-shares-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-shares-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="group" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Share</span>
         <!---->
       </button></li>
   </oc-list-stub>
   <oc-list-stub id="oc-files-context-actions-actions" class="oc-files-context-actions oc-pb-s oc-pt-s oc-files-context-actions-border">
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-rename-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-rename-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="pencil" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Edit</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-move-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-move-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="folder-shared" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Move</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-copy-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-copy-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="file-copy" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Copy</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-delete-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-delete-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="delete-bin-5" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Delete</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-actions-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-actions-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="slideshow" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">All actions</span>
         <!---->
       </button></li>
   </oc-list-stub>
   <oc-list-stub id="oc-files-context-actions-sidebar" class="oc-files-context-actions oc-pt-s">
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-details-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-details-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="information" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Details</span>
         <!---->
       </button></li>
@@ -66,59 +66,59 @@ exports[`ContextActions menu items renders a list of actions for a file 1`] = `
 exports[`ContextActions menu items renders a list of actions for a folder 1`] = `
 <div id="oc-files-context-menu">
   <oc-list-stub id="oc-files-context-actions-context" class="oc-files-context-actions oc-pb-s oc-files-context-actions-border">
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-markdown-editor-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-markdown-editor-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="file-text" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in editor</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName1-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName1-trigger action-menu-item" data-testid="action-handler">
         <oc-img-stub src="exampleIcon1" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName1</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName2-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName2-trigger action-menu-item" data-testid="action-handler">
         <oc-img-stub src="exampleIcon2" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName2</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName3-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-exampleName3-trigger action-menu-item" data-testid="action-handler">
         <oc-img-stub src="exampleIcon3" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName3</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-download-file-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-download-file-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="download" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Download</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-create-public-link-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-create-public-link-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="links" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Create link</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-shares-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-shares-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="group" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Share</span>
         <!---->
       </button></li>
   </oc-list-stub>
   <oc-list-stub id="oc-files-context-actions-actions" class="oc-files-context-actions oc-pb-s oc-pt-s oc-files-context-actions-border">
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-rename-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-rename-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="pencil" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Edit</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-move-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-move-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="folder-shared" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Move</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-copy-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-copy-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="file-copy" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Copy</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-delete-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-delete-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="delete-bin-5" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Delete</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-actions-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-actions-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="slideshow" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">All actions</span>
         <!---->
       </button></li>
   </oc-list-stub>
   <oc-list-stub id="oc-files-context-actions-sidebar" class="oc-files-context-actions oc-pt-s">
-    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-details-trigger action-menu-item" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button type="button" class="oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-files-actions-show-details-trigger action-menu-item" data-testid="action-handler">
         <oc-icon-stub name="information" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Details</span>
         <!---->
       </button></li>
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/InviteCollaborator/__snapshots__/RecipientContainer.spec.js.snap b/packages/web-app-files/tests/unit/components/SideBar/Shares/InviteCollaborator/__snapshots__/RecipientContainer.spec.js.snap
index efc1218935b..6b5ee61735a 100644
--- a/packages/web-app-files/tests/unit/components/SideBar/Shares/InviteCollaborator/__snapshots__/RecipientContainer.spec.js.snap
+++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/InviteCollaborator/__snapshots__/RecipientContainer.spec.js.snap
@@ -2,17 +2,17 @@
 
 exports[`InviteCollaborator RecipientContainer displays an avatar image if capability is present 1`] = `
 <span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-Albert Einstein"><span width="16.8" aria-hidden="true" focusable="false" data-test-user-name="Albert Einstein" class="vue-avatar--wrapper oc-avatar oc-recipient-avatar" style="width: 16.8px; height: 16.8px; line-height: 16.8px; background-color: rgb(194, 28, 83); font-size: 6px; font-family: Helvetica, Arial, sans-serif; color: white;" data-testid="recipient-avatar"><span class="avatarInitials">AE</span></span>
-<p data-testid="recipient-name" class="oc-recipient-name">Albert Einstein</p> <button aria-label="Deselect Albert Einstein" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw">
+<p data-testid="recipient-name" class="oc-recipient-name">Albert Einstein</p> <button aria-label="Deselect Albert Einstein" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw">
   <ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub>
 </button></span>
 `;
 
-exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 1`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-Albert Einstein"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">Albert Einstein</p> <button aria-label="Deselect Albert Einstein" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
+exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 1`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-Albert Einstein"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">Albert Einstein</p> <button aria-label="Deselect Albert Einstein" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
 
-exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 2`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-physics-lovers"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">physics-lovers</p> <button aria-label="Deselect physics-lovers" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
+exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 2`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-physics-lovers"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">physics-lovers</p> <button aria-label="Deselect physics-lovers" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
 
-exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 3`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-guest-user"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">guest-user</p> <button aria-label="Deselect guest-user" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
+exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 3`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-guest-user"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">guest-user</p> <button aria-label="Deselect guest-user" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
 
-exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 4`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-remote-user"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">remote-user</p> <button aria-label="Deselect remote-user" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
+exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 4`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-remote-user"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">remote-user</p> <button aria-label="Deselect remote-user" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
 
-exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 5`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-Albert Einstein"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">Albert Einstein</p> <button aria-label="Deselect Albert Einstein" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
+exports[`InviteCollaborator RecipientContainer renders a recipient with a deselect button different recipients for different shareTypes 5`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-Albert Einstein"><ocicon-stub name="person" filltype="fill" accessiblelabel="User" type="span" size="small" variation="passive" color="" data-testid="recipient-icon" class="oc-recipient-icon"></ocicon-stub> <p data-testid="recipient-name" class="oc-recipient-name">Albert Einstein</p> <button aria-label="Deselect Albert Einstein" type="button" class="files-share-invite-recipient-btn-remove oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><ocicon-stub name="close" filltype="fill" accessiblelabel="" type="span" size="small" variation="passive" color=""></ocicon-stub></button></span>`;
diff --git a/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap b/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap
index 60f4ec09e9a..4655f395437 100644
--- a/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap
+++ b/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap
@@ -7,7 +7,7 @@ exports[`Trashbin component when the view is not loading anymore when length of
       <th class="oc-th oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-shrink oc-text-nowrap oc-table-header-cell oc-table-header-cell-select oc-pl-m " style="top: 0px;"><span class="oc-table-thead-content"><div class="resource-table-select-all"><span><input id="resource-table-select-all" type="checkbox" name="checkbox" class="oc-checkbox oc-rounded oc-checkbox-l" value=""> <label for="resource-table-select-all" class="oc-invisible-sr oc-cursor-pointer">Select all resources</label></span></div></span>
         <!---->
       </th>
-      <th class="oc-th oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-expand oc-text-nowrap oc-table-header-cell oc-table-header-cell-name" aria-sort="none" style="top: 0px;"><span class="oc-table-thead-content header-text">Name</span> <button aria-label="Sort by name" type="button" class="oc-button-sort oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-invisible"><span class="oc-icon oc-icon-s oc-icon-passive"><!----></span></button></th>
+      <th class="oc-th oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-expand oc-text-nowrap oc-table-header-cell oc-table-header-cell-name" aria-sort="none" style="top: 0px;"><span class="oc-table-thead-content header-text">Name</span> <button aria-label="Sort by name" type="button" class="oc-button-sort oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-invisible"><span class="oc-icon oc-icon-s oc-icon-passive"><!----></span></button></th>
       <th class="oc-th oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-header-cell oc-table-header-cell-status" style="top: 0px;"><span class="oc-table-thead-content header-text">Status</span>
         <!---->
       </th>
@@ -31,7 +31,7 @@ exports[`Trashbin component when the view is not loading anymore when length of
       </td>
       <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-status"></td>
       <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-actions oc-pr-m">
-        <div class="resource-table-actions"> <button aria-label="Show context menu" type="button" class="resource-table-btn-action-dropdown oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="context-menu-trigger-file-id-1234"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
+        <div class="resource-table-actions"> <button aria-label="Show context menu" type="button" class="resource-table-btn-action-dropdown oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="context-menu-trigger-file-id-1234"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
           <div id="context-menu-drop-file-id-1234" class="oc-drop oc-box-shadow-medium oc-rounded"></div>
         </div>
       </td>
@@ -50,7 +50,7 @@ exports[`Trashbin component when the view is not loading anymore when length of
       </td>
       <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-status"></td>
       <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-actions oc-pr-m">
-        <div class="resource-table-actions"> <button aria-label="Show context menu" type="button" class="resource-table-btn-action-dropdown oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="context-menu-trigger-file-id-5896"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
+        <div class="resource-table-actions"> <button aria-label="Show context menu" type="button" class="resource-table-btn-action-dropdown oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="context-menu-trigger-file-id-5896"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
           <div id="context-menu-drop-file-id-5896" class="oc-drop oc-box-shadow-medium oc-rounded"></div>
         </div>
       </td>
@@ -69,7 +69,7 @@ exports[`Trashbin component when the view is not loading anymore when length of
       </td>
       <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-status"></td>
       <td class="oc-td oc-table-cell oc-table-cell-align-right oc-table-cell-align-middle oc-table-cell-width-auto oc-text-nowrap oc-table-data-cell oc-table-data-cell-actions oc-pr-m">
-        <div class="resource-table-actions"> <button aria-label="Show context menu" type="button" class="resource-table-btn-action-dropdown oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="context-menu-trigger-file-id-9856"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
+        <div class="resource-table-actions"> <button aria-label="Show context menu" type="button" class="resource-table-btn-action-dropdown oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="context-menu-trigger-file-id-9856"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
           <div id="context-menu-drop-file-id-9856" class="oc-drop oc-box-shadow-medium oc-rounded"></div>
         </div>
       </td>
diff --git a/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.js.snap b/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.js.snap
index 41eb8264c80..d4431526d2a 100644
--- a/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.js.snap
+++ b/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.js.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Spaces component should list spaces 1`] = `
-<div class="oc-py-s oc-px-m"><button aria-label="Create a new space" type="button" class="oc-mb-l oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-primary" id="new-space-menu-btn" data-testid="spaces-list-create-space-btn"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span>
+<div class="oc-py-s oc-px-m"><button aria-label="Create a new space" type="button" class="oc-mb-l oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-primary" id="new-space-menu-btn" data-testid="spaces-list-create-space-btn"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span>
     <translate-stub tag="span">Create Space</translate-stub>
   </button>
   <div class="oc-pb-xl oc-border-b"><span>Store your project related files in Spaces for seamless collaboration.</span></div>
@@ -26,15 +26,15 @@ exports[`Spaces component should list spaces 1`] = `
             <div class="oc-flex oc-flex-between oc-flex-middle">
               <div class="oc-flex oc-flex-middle"><span class="oc-mr-s oc-icon oc-icon-m oc-icon-passive"><!----></span> <a href="#/" aria-current="page" class="space-name oc-text-left router-link-exact-active router-link-active"><span></span></a></div>
               <div class="oc-flex oc-flex-middle">
-                <div><button aria-label="Show members" type="button" class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button></div>
-                <div><button aria-label="Show context menu" type="button" class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="space-context-btn-1"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
+                <div><button aria-label="Show members" type="button" class="oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button></div>
+                <div><button aria-label="Show context menu" type="button" class="oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw" id="space-context-btn-1"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
                   <div id="space-context-drop-1" class="oc-drop oc-box-shadow-medium oc-rounded" options="[object Object]">
                     <div class="oc-card oc-card-body oc-rounded oc-background-secondary oc-p-s">
                       <ul class="oc-list oc-files-context-actions">
-                        <li class="oc-files-context-action oc-px-s"><button type="button" class="oc-button oc-button-m oc-button-justify-content-left oc-button-gap-m oc-button-passive oc-button-passive-raw"><span class="oc-flex oc-icon oc-icon-m oc-icon-passive"><!----></span>
+                        <li class="oc-files-context-action oc-px-s"><button type="button" class="oc-button oc-rounded oc-button-m oc-button-justify-content-left oc-button-gap-m oc-button-passive oc-button-passive-raw"><span class="oc-flex oc-icon oc-icon-m oc-icon-passive"><!----></span>
                             Deleted files
                           </button></li>
-                        <li class="oc-files-context-action oc-px-s"><button type="button" class="oc-button oc-button-m oc-button-justify-content-left oc-button-gap-m oc-button-passive oc-button-passive-raw"><span class="oc-flex oc-icon oc-icon-m oc-icon-passive"><!----></span>
+                        <li class="oc-files-context-action oc-px-s"><button type="button" class="oc-button oc-rounded oc-button-m oc-button-justify-content-left oc-button-gap-m oc-button-passive oc-button-passive-raw"><span class="oc-flex oc-icon oc-icon-m oc-icon-passive"><!----></span>
                             Details
                           </button></li>
                       </ul>
diff --git a/packages/web-runtime/tests/unit/components/SidebarNav/__snapshots__/SidebarNav.spec.js.snap b/packages/web-runtime/tests/unit/components/SidebarNav/__snapshots__/SidebarNav.spec.js.snap
index 06815ba152d..1c7d2242891 100644
--- a/packages/web-runtime/tests/unit/components/SidebarNav/__snapshots__/SidebarNav.spec.js.snap
+++ b/packages/web-runtime/tests/unit/components/SidebarNav/__snapshots__/SidebarNav.spec.js.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`OcSidebarNav renders navItems into a list 1`] = `
-<div id="web-nav-sidebar" class="oc-app-navigation-expanded"><button aria-label="Toggle sidebar" type="button" class="toggle-sidebar-button oc-py-s oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw toggle-sidebar-button-expanded oc-pr-s">
+<div id="web-nav-sidebar" class="oc-app-navigation-expanded"><button aria-label="Toggle sidebar" type="button" class="toggle-sidebar-button oc-py-s oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw toggle-sidebar-button-expanded oc-pr-s">
     <oc-icon-stub name="arrow-drop-left" filltype="line" accessiblelabel="" type="span" size="large" variation="passive" color=""></oc-icon-stub>
   </button>
   <nav aria-label="Sidebar navigation menu" class="oc-sidebar-nav oc-my-m oc-px-xs">
@@ -15,7 +15,7 @@ exports[`OcSidebarNav renders navItems into a list 1`] = `
 `;
 
 exports[`OcSidebarNav toggles back into open state upon button click 1`] = `
-<div id="web-nav-sidebar" class="oc-app-navigation-expanded"><button aria-label="Toggle sidebar" type="button" class="toggle-sidebar-button oc-py-s oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw toggle-sidebar-button-expanded oc-pr-s">
+<div id="web-nav-sidebar" class="oc-app-navigation-expanded"><button aria-label="Toggle sidebar" type="button" class="toggle-sidebar-button oc-py-s oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw toggle-sidebar-button-expanded oc-pr-s">
     <oc-icon-stub name="arrow-drop-left" filltype="line" accessiblelabel="" type="span" size="large" variation="passive" color=""></oc-icon-stub>
   </button>
   <nav aria-label="Sidebar navigation menu" class="oc-sidebar-nav oc-my-m oc-px-xs">
@@ -29,7 +29,7 @@ exports[`OcSidebarNav toggles back into open state upon button click 1`] = `
 `;
 
 exports[`OcSidebarNav toggles into closed state upon button click 1`] = `
-<div id="web-nav-sidebar" class="oc-app-navigation-collapsed"><button aria-label="Toggle sidebar" type="button" class="toggle-sidebar-button oc-py-s oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw toggle-sidebar-button-collapsed">
+<div id="web-nav-sidebar" class="oc-app-navigation-collapsed"><button aria-label="Toggle sidebar" type="button" class="toggle-sidebar-button oc-py-s oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw toggle-sidebar-button-collapsed">
     <oc-icon-stub name="arrow-drop-right" filltype="line" accessiblelabel="" type="span" size="large" variation="passive" color=""></oc-icon-stub>
   </button>
   <nav aria-label="Sidebar navigation menu" class="oc-sidebar-nav oc-my-m oc-px-xs">
diff --git a/packages/web-runtime/tests/unit/components/SidebarNav/__snapshots__/SidebarNavItem.spec.js.snap b/packages/web-runtime/tests/unit/components/SidebarNav/__snapshots__/SidebarNavItem.spec.js.snap
index b7fea644d88..3bd1ef056ae 100644
--- a/packages/web-runtime/tests/unit/components/SidebarNav/__snapshots__/SidebarNavItem.spec.js.snap
+++ b/packages/web-runtime/tests/unit/components/SidebarNav/__snapshots__/SidebarNavItem.spec.js.snap
@@ -2,7 +2,7 @@
 
 exports[`OcSidebarNav renders navItem with toolTip if collapsed 1`] = `
 <li class="oc-sidebar-nav-item oc-pb-xs oc-px-s" id="123">
-  <router-link-stub to="/files/list/all" class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-sidebar-nav-item-link" data-nav-id="5"><span class="oc-flex"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span> <span class="oc-ml-m text text-invisible">Personal</span></span>
+  <router-link-stub to="/files/list/all" class="oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-sidebar-nav-item-link" data-nav-id="5"><span class="oc-flex"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span> <span class="oc-ml-m text text-invisible">Personal</span></span>
     <!---->
     <!---->
   </router-link-stub>
@@ -11,7 +11,7 @@ exports[`OcSidebarNav renders navItem with toolTip if collapsed 1`] = `
 
 exports[`OcSidebarNav renders navItem without toolTip if expanded 1`] = `
 <li class="oc-sidebar-nav-item oc-pb-xs oc-px-s" id="123">
-  <router-link-stub to="/files/list/all" class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-sidebar-nav-item-link" data-nav-id="5"><span class="oc-flex"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span> <span class="oc-ml-m text">Personal</span></span>
+  <router-link-stub to="/files/list/all" class="oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-sidebar-nav-item-link" data-nav-id="5"><span class="oc-flex"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span> <span class="oc-ml-m text">Personal</span></span>
     <!---->
     <!---->
   </router-link-stub>
diff --git a/packages/web-runtime/tests/unit/components/Topbar/__snapshots__/FeedbackLink.spec.js.snap b/packages/web-runtime/tests/unit/components/Topbar/__snapshots__/FeedbackLink.spec.js.snap
index c820886ca7e..f78c7807d76 100644
--- a/packages/web-runtime/tests/unit/components/Topbar/__snapshots__/FeedbackLink.spec.js.snap
+++ b/packages/web-runtime/tests/unit/components/Topbar/__snapshots__/FeedbackLink.spec.js.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`FeedbackLink component has no accessibility violations 1`] = `
-<div class="oc-flex"><a aria-label="ownCloud feedback survey" href="https://owncloud.com/web-design-feedback" class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw" target="_blank" aria-describedby="oc-feedback-link-description"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></a>
+<div class="oc-flex"><a aria-label="ownCloud feedback survey" href="https://owncloud.com/web-design-feedback" class="oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw" target="_blank" aria-describedby="oc-feedback-link-description"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></a>
   <p id="oc-feedback-link-description" class="oc-invisible-sr">Provide your feedback: We'd like to improve the web design and would be happy to hear your feedback. Thank you! Your ownCloud team.</p>
 </div>
 `;
diff --git a/packages/web-runtime/tests/unit/components/Topbar/__snapshots__/ThemeSwitcher.spec.js.snap b/packages/web-runtime/tests/unit/components/Topbar/__snapshots__/ThemeSwitcher.spec.js.snap
index e9cd377b8f4..b6466c1f14c 100644
--- a/packages/web-runtime/tests/unit/components/Topbar/__snapshots__/ThemeSwitcher.spec.js.snap
+++ b/packages/web-runtime/tests/unit/components/Topbar/__snapshots__/ThemeSwitcher.spec.js.snap
@@ -1,37 +1,37 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`ThemeSwitcher component restores dark theme if dark theme is saved in localstorage 1`] = `
-<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Dark mode</span>
+<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Dark mode</span>
   <oc-icon-stub name="moon-clear" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color=""></oc-icon-stub>
 </button>
 `;
 
 exports[`ThemeSwitcher component restores light theme if light theme is saved in localstorage 1`] = `
-<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Light mode</span>
+<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Light mode</span>
   <oc-icon-stub name="sun" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color=""></oc-icon-stub>
 </button>
 `;
 
 exports[`ThemeSwitcher component visually renders a button, initially in dark mode if user prefers dark color scheme 1`] = `
-<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Dark mode</span>
+<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Dark mode</span>
   <oc-icon-stub name="moon-clear" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color=""></oc-icon-stub>
 </button>
 `;
 
 exports[`ThemeSwitcher component visually renders a button, initially in light mode per default 1`] = `
-<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Light mode</span>
+<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Light mode</span>
   <oc-icon-stub name="sun" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color=""></oc-icon-stub>
 </button>
 `;
 
 exports[`ThemeSwitcher component visually toggles between themes upon click 1`] = `
-<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Dark mode</span>
+<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Dark mode</span>
   <oc-icon-stub name="moon-clear" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color=""></oc-icon-stub>
 </button>
 `;
 
 exports[`ThemeSwitcher component visually toggles between themes upon click 2`] = `
-<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Light mode</span>
+<button aria-label="Click to switch theme" type="button" class="themeswitcher-btn oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-inverse oc-button-inverse-raw"><span aria-label="Currently used theme" class="oc-visible@s">Light mode</span>
   <oc-icon-stub name="sun" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color=""></oc-icon-stub>
 </button>
 `;

From 2927b81c88271eae951337a26300ebb1c7d26d03 Mon Sep 17 00:00:00 2001
From: JanAckermann <jackermann@owncloud.com>
Date: Fri, 18 Mar 2022 13:57:29 +0100
Subject: [PATCH 09/14] Add unit tests for method showContextActions

---
 .../unit/components/AppBar/AppBar.spec.js     | 58 ++++++++++++++++++-
 1 file changed, 55 insertions(+), 3 deletions(-)

diff --git a/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js b/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
index fb63f2a3571..dae7dbd8e8a 100644
--- a/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
+++ b/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
@@ -8,7 +8,8 @@ import {
   createLocationCommon,
   createLocationPublic,
   createLocationShares,
-  createLocationSpaces
+  createLocationSpaces,
+  createLocationTrash
 } from '../../../../src/router'
 
 const localVue = createLocalVue()
@@ -134,6 +135,56 @@ describe('AppBar component', () => {
     })
   })
 
+  describe('method showContextActions', () => {
+    it('should be false if isTrashPersonalActive is true', () => {
+      const store = createStore({ selected: [], currentFolder })
+      const route = {
+        ...createLocationTrash('files-trash-personal', {
+          params: {
+            storageId: '1'
+          }
+        }),
+        meta: {}
+      }
+      const wrapper = getShallowWrapper(route, store, { isTrashPersonalActive: true })
+      expect(wrapper.vm.showContextActions).toBeFalsy()
+    })
+    it('should be true if isSpacesProjectLocation is true and item is given', () => {
+      const store = createStore({ selected: [], currentFolder })
+      const route = {
+        ...createLocationTrash('files-trash-personal', {
+          params: {
+            storageId: '1',
+            item: 'New folder'
+          }
+        }),
+        meta: {}
+      }
+
+      const wrapper = getShallowWrapper(route, store, {
+        isSpacesProjectLocation: true
+      })
+      expect(wrapper.vm.showContextActions).toBeTruthy()
+    })
+
+    it('should be false if isSpacesProjectLocation is true but no item is given', () => {
+      const store = createStore({ selected: [], currentFolder })
+      const route = {
+        ...createLocationTrash('files-trash-personal', {
+          params: {
+            storageId: '1'
+          }
+        }),
+        meta: {}
+      }
+
+      const wrapper = getShallowWrapper(route, store, {
+        isSpacesProjectLocation: true
+      })
+      expect(wrapper.vm.showContextActions).toBeFalsy()
+    })
+  })
+
   describe.each([favoritesLocation.name, sharesWithOthersLocation.name, sharesWithMeLocation.name])(
     '%s page',
     (page) => {
@@ -184,7 +235,7 @@ describe('AppBar component', () => {
   )
 })
 
-function getShallowWrapper(route = {}, store = {}) {
+function getShallowWrapper(route = {}, store = {}, mocks = {}) {
   return shallowMount(AppBar, {
     localVue,
     mocks: {
@@ -196,7 +247,8 @@ function getShallowWrapper(route = {}, store = {}) {
         }
       },
       publicPage: jest.fn(() => false),
-      isIE11: jest.fn(() => false)
+      isIE11: jest.fn(() => false),
+      ...mocks
     },
     store
   })

From b1198a95e5045d36b7849fefbc37a2a24f8d30f4 Mon Sep 17 00:00:00 2001
From: JanAckermann <jackermann@owncloud.com>
Date: Fri, 18 Mar 2022 14:16:57 +0100
Subject: [PATCH 10/14] Add more tests

---
 .../unit/components/AppBar/AppBar.spec.js     | 67 ++++++++++++++++++-
 1 file changed, 66 insertions(+), 1 deletion(-)

diff --git a/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js b/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
index dae7dbd8e8a..96ee88a56b3 100644
--- a/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
+++ b/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
@@ -135,7 +135,7 @@ describe('AppBar component', () => {
     })
   })
 
-  describe('method showContextActions', () => {
+  describe('computed showContextActions', () => {
     it('should be false if isTrashPersonalActive is true', () => {
       const store = createStore({ selected: [], currentFolder })
       const route = {
@@ -183,6 +183,71 @@ describe('AppBar component', () => {
       })
       expect(wrapper.vm.showContextActions).toBeFalsy()
     })
+
+    it('should be true if isPersonalLocation is true and item is given', () => {
+      const store = createStore({ selected: [], currentFolder })
+      const route = {
+        ...createLocationSpaces('files-spaces-personal-home', {
+          params: {
+            storageId: '1',
+            item: 'New folder'
+          }
+        }),
+        meta: {}
+      }
+
+      const wrapper = getShallowWrapper(route, store, {
+        isPersonalLocation: true
+      })
+      expect(wrapper.vm.showContextActions).toBeTruthy()
+    })
+
+    it('should be false if isPersonalLocation is true but no item is given', () => {
+      const store = createStore({ selected: [], currentFolder })
+      const route = {
+        ...createLocationSpaces('files-spaces-personal-home', {
+          params: {
+            storageId: '1'
+          }
+        }),
+        meta: {}
+      }
+
+      const wrapper = getShallowWrapper(route, store, {
+        isPersonalLocation: true
+      })
+      expect(wrapper.vm.showContextActions).toBeFalsy()
+    })
+  })
+
+  describe('computed contextActionItems', () => {
+    it('should be empty if isTrashSpacesProjectActive is true', () => {
+      const store = createStore({ selected: [], currentFolder })
+      const route = {
+        ...createLocationTrash('files-trash-personal', {
+          params: {
+            storageId: '1'
+          }
+        }),
+        meta: {}
+      }
+      const wrapper = getShallowWrapper(route, store, { isTrashSpacesProjectActive: true })
+      expect(wrapper.vm.contextActionItems).toEqual([])
+    })
+
+    it('should not be empty if isTrashPersonalActive is true', () => {
+      const store = createStore({ selected: [], currentFolder })
+      const route = {
+        ...createLocationTrash('files-trash-personal', {
+          params: {
+            storageId: '1'
+          }
+        }),
+        meta: {}
+      }
+      const wrapper = getShallowWrapper(route, store, { isTrashPersonalActive: true })
+      expect(wrapper.vm.contextActionItems).toEqual([wrapper.vm.currentFolder])
+    })
   })
 
   describe.each([favoritesLocation.name, sharesWithOthersLocation.name, sharesWithMeLocation.name])(

From c48eb69921da93613318f028ee06f1aec3558368 Mon Sep 17 00:00:00 2001
From: JanAckermann <jackermann@owncloud.com>
Date: Fri, 18 Mar 2022 14:42:22 +0100
Subject: [PATCH 11/14] Add more tests

---
 .../unit/components/AppBar/AppBar.spec.js     | 32 +++++++++++++++++++
 1 file changed, 32 insertions(+)

diff --git a/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js b/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
index 96ee88a56b3..ea7ecfb3964 100644
--- a/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
+++ b/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
@@ -250,6 +250,38 @@ describe('AppBar component', () => {
     })
   })
 
+  describe('computed breadcrumbs', () => {
+    it('should contain to two items if isTrashPersonalActive is true', () => {
+      const store = createStore({ selected: [], currentFolder })
+      const route = {
+        ...createLocationTrash('files-trash-personal', {
+          params: {
+            storageId: '1'
+          }
+        }),
+        meta: {}
+      }
+      const wrapper = getShallowWrapper(route, store, { isTrashSpacesProjectActive: true })
+      expect(wrapper.vm.breadcrumbs[0].to).toEqual('/files/trash')
+      expect(wrapper.vm.breadcrumbs.length).toEqual(2)
+    })
+
+    it('should contain to two items if isTrashSpacesProjectActive is true', () => {
+      const store = createStore({ selected: [], currentFolder })
+      const route = {
+        ...createLocationTrash('files-trash-spaces-project', {
+          params: {
+            storageId: '1'
+          }
+        }),
+        meta: {}
+      }
+      const wrapper = getShallowWrapper(route, store, { isTrashSpacesProjectActive: true })
+      expect(wrapper.vm.breadcrumbs[0].to).toEqual('/files/trash')
+      expect(wrapper.vm.breadcrumbs.length).toEqual(2)
+    })
+  })
+
   describe.each([favoritesLocation.name, sharesWithOthersLocation.name, sharesWithMeLocation.name])(
     '%s page',
     (page) => {

From 57fa1e7efbd2d420f505bac928b12afd6a7d8ec4 Mon Sep 17 00:00:00 2001
From: JanAckermann <jackermann@owncloud.com>
Date: Fri, 18 Mar 2022 14:57:58 +0100
Subject: [PATCH 12/14] Add changelog item

---
 changelog/unreleased/enhancement-trash-bin-breadcrumbs | 9 +++++++++
 1 file changed, 9 insertions(+)
 create mode 100644 changelog/unreleased/enhancement-trash-bin-breadcrumbs

diff --git a/changelog/unreleased/enhancement-trash-bin-breadcrumbs b/changelog/unreleased/enhancement-trash-bin-breadcrumbs
new file mode 100644
index 00000000000..8388d7373ab
--- /dev/null
+++ b/changelog/unreleased/enhancement-trash-bin-breadcrumbs
@@ -0,0 +1,9 @@
+Enhancement: Trash bin breadcrumbs
+
+We've improved the trash bin in general:
+* Add a breadcrumb for personal trash bin
+* Improve the breadcrumb for spaces trash bin, also add 'Navigate to space' action to context menu
+* Fix wrong page title in spaces trash bin
+
+https://github.com/owncloud/web/pull/6609
+

From 3b8b4d69de609943d6e2d585fc45d6ebe80bc5db Mon Sep 17 00:00:00 2001
From: JanAckermann <jackermann@owncloud.com>
Date: Mon, 21 Mar 2022 10:16:18 +0100
Subject: [PATCH 13/14] Add more tests

---
 .../src/views/spaces/Trashbin.vue             |  7 +-
 .../tests/unit/views/spaces/Trashbin.spec.js  | 70 +++++++++++++++++++
 2 files changed, 76 insertions(+), 1 deletion(-)
 create mode 100644 packages/web-app-files/tests/unit/views/spaces/Trashbin.spec.js

diff --git a/packages/web-app-files/src/views/spaces/Trashbin.vue b/packages/web-app-files/src/views/spaces/Trashbin.vue
index 1757174cefc..0709839d210 100644
--- a/packages/web-app-files/src/views/spaces/Trashbin.vue
+++ b/packages/web-app-files/src/views/spaces/Trashbin.vue
@@ -7,6 +7,7 @@ import { ref } from '@vue/composition-api'
 import { clientService } from 'web-pkg/src/services'
 import { useTask } from 'vue-concurrency'
 import { buildSpace } from '../../helpers/resources'
+import { mapGetters } from 'vuex'
 
 export default {
   components: { TrashBin },
@@ -31,9 +32,13 @@ export default {
     }
   },
 
+  computed: {
+    ...mapGetters(['configuration'])
+  },
+
   async mounted() {
     await this.loadResourcesTask.perform(this)
-    document.title = `${this.$route.meta.title} - ${this.space.name} - ${this.configuration.currentTheme.general.name}`
+    document.title = `${this.$router.currentRoute.meta.title} - ${this.space.name} - ${this.configuration.currentTheme.general.name}`
   }
 }
 </script>
diff --git a/packages/web-app-files/tests/unit/views/spaces/Trashbin.spec.js b/packages/web-app-files/tests/unit/views/spaces/Trashbin.spec.js
new file mode 100644
index 00000000000..4001d7510b7
--- /dev/null
+++ b/packages/web-app-files/tests/unit/views/spaces/Trashbin.spec.js
@@ -0,0 +1,70 @@
+import Vuex from 'vuex'
+import { mount, createLocalVue } from '@vue/test-utils'
+import Trashbin from '@files/src/views/spaces/Trashbin.vue'
+import { createStore } from 'vuex-extensions'
+import { createLocationTrash } from '../../../../src/router'
+import { waitFor } from '@testing-library/dom'
+
+const localVue = createLocalVue()
+localVue.use(Vuex)
+
+afterEach(() => jest.clearAllMocks())
+
+describe('Trashbin', () => {
+  describe('method "mounted"', () => {
+    it('should change document title', async () => {
+      const wrapper = getWrapper()
+      expect(wrapper.vm.loadResourcesTask.perform).toBeCalled()
+      await waitFor(() => expect(document.title).toBe('Deleted files - Space - ownCloud'))
+    })
+  })
+})
+
+function getWrapper() {
+  return mount(Trashbin, {
+    localVue,
+    mocks: {
+      $router: {
+        currentRoute: {
+          ...createLocationTrash('files-trash-spaces-project'),
+          meta: {
+            title: 'Deleted files'
+          }
+        },
+        resolve: (r) => {
+          return { href: r.name }
+        }
+      },
+      loadResourcesTask: {
+        isRunning: false,
+        perform: jest.fn()
+      },
+      space: {
+        name: 'Space'
+      },
+      $gettext: jest.fn(),
+      document: {
+        title: ''
+      }
+    },
+    store: createStore(Vuex.Store, {
+      actions: {
+        showMessage: jest.fn()
+      },
+      getters: {
+        configuration: () => ({
+          server: 'https://example.com',
+          currentTheme: {
+            general: {
+              name: 'ownCloud'
+            }
+          }
+        }),
+        getToken: () => 'token'
+      }
+    }),
+    stubs: {
+      'trash-bin': true
+    }
+  })
+}

From 2b7457e5a09ddf7a6d5b9a234ccfcfd0fcd944af Mon Sep 17 00:00:00 2001
From: JanAckermann <jackermann@owncloud.com>
Date: Mon, 21 Mar 2022 11:37:20 +0100
Subject: [PATCH 14/14] React on code review

---
 .../unit/components/AppBar/AppBar.spec.js     | 148 ++++++++++--------
 1 file changed, 81 insertions(+), 67 deletions(-)

diff --git a/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js b/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
index ea7ecfb3964..8572d9c8c06 100644
--- a/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
+++ b/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
@@ -136,87 +136,101 @@ describe('AppBar component', () => {
   })
 
   describe('computed showContextActions', () => {
-    it('should be false if isTrashPersonalActive is true', () => {
-      const store = createStore({ selected: [], currentFolder })
-      const route = {
-        ...createLocationTrash('files-trash-personal', {
-          params: {
-            storageId: '1'
+    describe('if isPersonalLocation is true', () => {
+      describe('and item is selected', () => {
+        it('should be true', () => {
+          const store = createStore({ selected: [], currentFolder })
+          const route = {
+            ...createLocationSpaces('files-spaces-personal-home', {
+              params: {
+                storageId: '1',
+                item: 'New folder'
+              }
+            }),
+            meta: {}
           }
-        }),
-        meta: {}
-      }
-      const wrapper = getShallowWrapper(route, store, { isTrashPersonalActive: true })
-      expect(wrapper.vm.showContextActions).toBeFalsy()
-    })
-    it('should be true if isSpacesProjectLocation is true and item is given', () => {
-      const store = createStore({ selected: [], currentFolder })
-      const route = {
-        ...createLocationTrash('files-trash-personal', {
-          params: {
-            storageId: '1',
-            item: 'New folder'
+
+          const wrapper = getShallowWrapper(route, store, {
+            isPersonalLocation: true
+          })
+          expect(wrapper.vm.showContextActions).toBeTruthy()
+        })
+      })
+      describe('and no item is selected', () => {
+        it('should be false', () => {
+          const store = createStore({ selected: [], currentFolder })
+          const route = {
+            ...createLocationSpaces('files-spaces-personal-home', {
+              params: {
+                storageId: '1'
+              }
+            }),
+            meta: {}
           }
-        }),
-        meta: {}
-      }
 
-      const wrapper = getShallowWrapper(route, store, {
-        isSpacesProjectLocation: true
+          const wrapper = getShallowWrapper(route, store, {
+            isPersonalLocation: true
+          })
+          expect(wrapper.vm.showContextActions).toBeFalsy()
+        })
       })
-      expect(wrapper.vm.showContextActions).toBeTruthy()
     })
 
-    it('should be false if isSpacesProjectLocation is true but no item is given', () => {
-      const store = createStore({ selected: [], currentFolder })
-      const route = {
-        ...createLocationTrash('files-trash-personal', {
-          params: {
-            storageId: '1'
+    describe('if isSpacesProjectLocation is true', () => {
+      describe('and item is selected', () => {
+        it('should be true', () => {
+          const store = createStore({ selected: [], currentFolder })
+          const route = {
+            ...createLocationTrash('files-trash-personal', {
+              params: {
+                storageId: '1',
+                item: 'New folder'
+              }
+            }),
+            meta: {}
           }
-        }),
-        meta: {}
-      }
 
-      const wrapper = getShallowWrapper(route, store, {
-        isSpacesProjectLocation: true
+          const wrapper = getShallowWrapper(route, store, {
+            isSpacesProjectLocation: true
+          })
+          expect(wrapper.vm.showContextActions).toBeTruthy()
+        })
       })
-      expect(wrapper.vm.showContextActions).toBeFalsy()
-    })
 
-    it('should be true if isPersonalLocation is true and item is given', () => {
-      const store = createStore({ selected: [], currentFolder })
-      const route = {
-        ...createLocationSpaces('files-spaces-personal-home', {
-          params: {
-            storageId: '1',
-            item: 'New folder'
+      describe('and no item is selected', () => {
+        it('should be false', () => {
+          const store = createStore({ selected: [], currentFolder })
+          const route = {
+            ...createLocationTrash('files-trash-personal', {
+              params: {
+                storageId: '1'
+              }
+            }),
+            meta: {}
           }
-        }),
-        meta: {}
-      }
 
-      const wrapper = getShallowWrapper(route, store, {
-        isPersonalLocation: true
+          const wrapper = getShallowWrapper(route, store, {
+            isSpacesProjectLocation: true
+          })
+          expect(wrapper.vm.showContextActions).toBeFalsy()
+        })
       })
-      expect(wrapper.vm.showContextActions).toBeTruthy()
     })
 
-    it('should be false if isPersonalLocation is true but no item is given', () => {
-      const store = createStore({ selected: [], currentFolder })
-      const route = {
-        ...createLocationSpaces('files-spaces-personal-home', {
-          params: {
-            storageId: '1'
-          }
-        }),
-        meta: {}
-      }
-
-      const wrapper = getShallowWrapper(route, store, {
-        isPersonalLocation: true
+    describe('if isTrashPersonalActive is true', () => {
+      it('should be false', () => {
+        const store = createStore({ selected: [], currentFolder })
+        const route = {
+          ...createLocationTrash('files-trash-personal', {
+            params: {
+              storageId: '1'
+            }
+          }),
+          meta: {}
+        }
+        const wrapper = getShallowWrapper(route, store, { isTrashPersonalActive: true })
+        expect(wrapper.vm.showContextActions).toBeFalsy()
       })
-      expect(wrapper.vm.showContextActions).toBeFalsy()
     })
   })
 
@@ -251,7 +265,7 @@ describe('AppBar component', () => {
   })
 
   describe('computed breadcrumbs', () => {
-    it('should contain to two items if isTrashPersonalActive is true', () => {
+    it('should contain two items if isTrashPersonalActive is true', () => {
       const store = createStore({ selected: [], currentFolder })
       const route = {
         ...createLocationTrash('files-trash-personal', {
@@ -266,7 +280,7 @@ describe('AppBar component', () => {
       expect(wrapper.vm.breadcrumbs.length).toEqual(2)
     })
 
-    it('should contain to two items if isTrashSpacesProjectActive is true', () => {
+    it('should contain two items if isTrashSpacesProjectActive is true', () => {
       const store = createStore({ selected: [], currentFolder })
       const route = {
         ...createLocationTrash('files-trash-spaces-project', {