diff --git a/__fixtures__/collaborators.js b/__fixtures__/collaborators.js
deleted file mode 100644
index 415c1a3ebd6..00000000000
--- a/__fixtures__/collaborators.js
+++ /dev/null
@@ -1,167 +0,0 @@
-import {
-  peopleRoleEditorFile,
-  peopleRoleViewerFile,
-  spaceRoleEditor
-} from '../packages/web-app-files/src/helpers/share'
-
-export default [
-  {
-    shareType: 0,
-    id: "f5c28709-b921-4ec8-b39a-4c243709b514",
-    collaborator: {
-      name: "einstein",
-      displayName: "Albert Einstein",
-      additionalInfo: "einstein@example.org"
-    },
-    owner: {
-      name: "admin",
-      displayName: "Admin",
-      additionalInfo: "admin@example.org"
-    },
-    fileOwner: {
-      name: "admin",
-      displayName: "Admin",
-      additionalInfo: "admin@example.org"
-    },
-    stime: "1639152810",
-    permissions: 15,
-    customPermissions: [
-      {
-        _key: "read",
-        _bit: 1,
-        _label: "Read"
-      },
-      {
-        _key: "update",
-        _bit: 2,
-        _label: "Update"
-      },
-      {
-        _key: "create",
-        _bit: 4,
-        _label: "Create"
-      },
-      {
-        _key: "delete",
-        _bit: 8,
-        _label: "Delete"
-      }
-    ],
-    role: peopleRoleEditorFile,
-    path: "/Neuer Ordner-'singe'",
-    key: "collaborator-f5c28709-b921-4ec8-b39a-4c243709b514"
-  },
-  {
-    shareType: 1,
-    id: "51a8aafe-cd40-4d0a-8566-87a1149b7fea",
-    collaborator: {
-      name: "physics-lovers",
-      displayName: "physics-lovers",
-      additionalInfo: null
-    },
-    owner: {
-      name: "admin",
-      displayName: "Admin",
-      additionalInfo: "admin@example.org"
-    },
-    fileOwner: {
-      name: "admin",
-      displayName: "Admin",
-      additionalInfo: "admin@example.org"
-    },
-    stime: "1639570515",
-    permissions: 1,
-    customPermissions: [
-      {
-        _key: "read",
-        _bit: 1,
-        _label: "Read"
-      }
-    ],
-    role: peopleRoleViewerFile,
-    path: "/Neuer Ordner-'singe'",
-    key: "collaborator-51a8aafe-cd40-4d0a-8566-87a1149b7fea"
-  },
-  {
-    shareType: 4,
-    id: "51a8aafe-cd40-4d0a-8566-87a1149b7fea",
-    collaborator: {
-      name: "guest-user",
-      displayName: "guest-user",
-      additionalInfo: null
-    },
-    owner: {
-      name: "admin",
-      displayName: "Admin",
-      additionalInfo: "admin@example.org"
-    },
-    fileOwner: {
-      name: "admin",
-      displayName: "Admin",
-      additionalInfo: "admin@example.org"
-    },
-    stime: "1639570515",
-    permissions: 1,
-    customPermissions: [
-      {
-        _key: "read",
-        _bit: 1,
-        _label: "Read"
-      }
-    ],
-    role: peopleRoleViewerFile,
-    path: "/Neuer Ordner-'singe'",
-    key: "collaborator-51a8aafe-cd40-4d0a-8566-87a1149b7fea"
-  },
-  {
-    shareType: 6,
-    id: "51a8aafe-cd40-4d0a-8566-87a1149b7fea",
-    collaborator: {
-      name: "remote-user",
-      displayName: "remote-user",
-      additionalInfo: null
-    },
-    owner: {
-      name: "admin",
-      displayName: "Admin",
-      additionalInfo: "admin@example.org"
-    },
-    fileOwner: {
-      name: "admin",
-      displayName: "Admin",
-      additionalInfo: "admin@example.org"
-    },
-    stime: "1639570515",
-    permissions: 1,
-    customPermissions: [
-      {
-        _key: "read",
-        _bit: 1,
-        _label: "Read"
-      }
-    ],
-    role: peopleRoleViewerFile,
-    path: "/Neuer Ordner-'singe'",
-    key: "collaborator-51a8aafe-cd40-4d0a-8566-87a1149b7fea"
-  },
-  {
-    shareType: 7,
-    id: "f5c28709-b921-4ec8-b39a-4c243709b514",
-    collaborator: {
-      name: "einstein",
-      displayName: "Albert Einstein",
-      additionalInfo: "einstein@example.org"
-    },
-    owner: {
-      name: "admin",
-      displayName: "Admin",
-      additionalInfo: "admin@example.org"
-    },
-    fileOwner: {
-      name: "admin",
-      displayName: "Admin",
-      additionalInfo: "admin@example.org"
-    },
-    role: spaceRoleEditor
-  }
-]
diff --git a/__fixtures__/deletedFiles.js b/__fixtures__/deletedFiles.js
deleted file mode 100644
index e3c7849117e..00000000000
--- a/__fixtures__/deletedFiles.js
+++ /dev/null
@@ -1,55 +0,0 @@
-export default [
-  {
-    name: '/trash-bin/alice',
-    type: 'dir',
-    fileInfo: {
-      '{DAV:}resourcetype': ['{DAV:}collection']
-    },
-    tusSupport: null
-  },
-  {
-    name: '/trash-bin/alice/3875',
-    type: 'dir',
-    fileInfo: {
-      '{http://owncloud.org/ns}trashbin-original-filename': '.hidden-folder',
-      '{http://owncloud.org/ns}trashbin-original-location': '.hidden-folder',
-      '{http://owncloud.org/ns}trashbin-delete-datetime': 'Mon, 14 Jun 2021 12:15:33 GMT',
-      '{DAV:}resourcetype': ['{DAV:}collection']
-    },
-    tusSupport: null
-  },
-  {
-    name: '/trash-bin/alice/3871',
-    type: 'dir',
-    fileInfo: {
-      '{http://owncloud.org/ns}trashbin-original-filename': 'Documents',
-      '{http://owncloud.org/ns}trashbin-original-location': 'Documents',
-      '{http://owncloud.org/ns}trashbin-delete-datetime': 'Mon, 14 Jun 2021 12:15:33 GMT',
-      '{DAV:}resourcetype': ['{DAV:}collection']
-    },
-    tusSupport: null
-  },
-  {
-    name: '/trash-bin/alice/3873',
-    type: 'dir',
-    fileInfo: {
-      '{http://owncloud.org/ns}trashbin-original-filename': 'Photos',
-      '{http://owncloud.org/ns}trashbin-original-location': 'Photos',
-      '{http://owncloud.org/ns}trashbin-delete-datetime': 'Mon, 14 Jun 2021 12:15:33 GMT',
-      '{DAV:}resourcetype': ['{DAV:}collection']
-    },
-    tusSupport: null
-  },
-  {
-    name: '/trash-bin/alice/3852',
-    type: 'file',
-    fileInfo: {
-      '{http://owncloud.org/ns}trashbin-original-filename': 'ownCloud Manual.pdf',
-      '{http://owncloud.org/ns}trashbin-original-location': 'ownCloud Manual.pdf',
-      '{http://owncloud.org/ns}trashbin-delete-datetime': 'Wed, 09 Jun 2021 12:13:46 GMT',
-      '{DAV:}getcontentlength': '0',
-      '{DAV:}resourcetype': ''
-    },
-    tusSupport: null
-  }
-]
diff --git a/__fixtures__/favoriteFiles.js b/__fixtures__/favoriteFiles.js
deleted file mode 100644
index 72afec3d6d6..00000000000
--- a/__fixtures__/favoriteFiles.js
+++ /dev/null
@@ -1,76 +0,0 @@
-export default [
-  {
-    name: '/.hidden-folder',
-    type: 'dir',
-    fileInfo: {
-      '{http://owncloud.org/ns}permissions': 'RDNVCK',
-      '{http://owncloud.org/ns}favorite': '1',
-      '{http://owncloud.org/ns}fileid': '14',
-      '{http://owncloud.org/ns}owner-id': 'admin',
-      '{http://owncloud.org/ns}owner-display-name': 'admin',
-      '{http://owncloud.org/ns}share-types': '',
-      '{http://owncloud.org/ns}privatelink': 'http://localhost:8080/f/14',
-      '{http://owncloud.org/ns}size': '0',
-      '{DAV:}getlastmodified': 'Thu, 24 Jun 2021 15:03:58 GMT',
-      '{DAV:}getetag': '"60d49edf01ab8"',
-      '{DAV:}resourcetype': ['{DAV:}collection']
-    },
-    tusSupport: null
-  },
-  {
-    name: '/Documents',
-    type: 'dir',
-    fileInfo: {
-      '{http://owncloud.org/ns}permissions': 'RDNVCK',
-      '{http://owncloud.org/ns}favorite': '1',
-      '{http://owncloud.org/ns}fileid': '3867',
-      '{http://owncloud.org/ns}owner-id': 'alice',
-      '{http://owncloud.org/ns}owner-display-name': 'alice',
-      '{http://owncloud.org/ns}share-types': '',
-      '{http://owncloud.org/ns}privatelink': 'http://host.docker.internal:8080/f/3867',
-      '{http://owncloud.org/ns}size': '36227',
-      '{DAV:}getlastmodified': 'Mon, 14 Jun 2021 09:41:16 GMT',
-      '{DAV:}getetag': '"60c7243c2e7f1"',
-      '{DAV:}resourcetype': ['{DAV:}collection']
-    },
-    tusSupport: null
-  },
-  {
-    name: '/Photos',
-    type: 'dir',
-    fileInfo: {
-      '{http://owncloud.org/ns}permissions': 'RDNVCK',
-      '{http://owncloud.org/ns}favorite': '1',
-      '{http://owncloud.org/ns}fileid': '3863',
-      '{http://owncloud.org/ns}owner-id': 'alice',
-      '{http://owncloud.org/ns}owner-display-name': 'alice',
-      '{http://owncloud.org/ns}share-types': '',
-      '{http://owncloud.org/ns}privatelink': 'http://host.docker.internal:8080/f/3863',
-      '{http://owncloud.org/ns}size': '1011464',
-      '{DAV:}getlastmodified': 'Mon, 14 Jun 2021 09:41:15 GMT',
-      '{DAV:}getetag': '"60c7243befd5d"',
-      '{DAV:}resourcetype': ['{DAV:}collection']
-    },
-    tusSupport: null
-  },
-  {
-    name: '/ownCloud Manual.pdf',
-    type: 'file',
-    fileInfo: {
-      '{http://owncloud.org/ns}permissions': 'RDNVW',
-      '{http://owncloud.org/ns}favorite': '1',
-      '{http://owncloud.org/ns}fileid': '3862',
-      '{http://owncloud.org/ns}owner-id': 'alice',
-      '{http://owncloud.org/ns}owner-display-name': 'alice',
-      '{http://owncloud.org/ns}share-types': '',
-      '{http://owncloud.org/ns}privatelink': 'http://host.docker.internal:8080/f/3862',
-      '{DAV:}getcontentlength': '6498656',
-      '{http://owncloud.org/ns}size': '6498656',
-      '{DAV:}getlastmodified': 'Mon, 14 Jun 2021 09:41:15 GMT',
-      '{DAV:}getetag': '"1f0ac81c04bc55c5d52a59f510c785fd"',
-      '{DAV:}resourcetype': '',
-      '{http://owncloud.org/ns}downloadURL': ''
-    },
-    tusSupport: null
-  }
-]
diff --git a/__fixtures__/files.js b/__fixtures__/files.js
deleted file mode 100644
index 6614adc1e7e..00000000000
--- a/__fixtures__/files.js
+++ /dev/null
@@ -1,116 +0,0 @@
-export default {
-  '/': [
-    {
-      name: '',
-      type: 'dir',
-      fileInfo: {
-        '{http://owncloud.org/ns}permissions': 'RDNVCK',
-        '{http://owncloud.org/ns}favorite': '0',
-        '{http://owncloud.org/ns}fileid': '3861',
-        '{http://owncloud.org/ns}owner-id': 'alice',
-        '{http://owncloud.org/ns}owner-display-name': 'alice',
-        '{http://owncloud.org/ns}share-types': '',
-        '{http://owncloud.org/ns}privatelink': 'http://host.docker.internal:8080/f/3861',
-        '{http://owncloud.org/ns}size': '7546347',
-        '{DAV:}getlastmodified': 'Mon, 14 Jun 2021 09:41:16 GMT',
-        '{DAV:}getetag': '"60c7243c2e7f1"',
-        '{DAV:}resourcetype': ['{DAV:}collection']
-      },
-      tusSupport: null
-    },
-    {
-      name: '/.hidden-folder',
-      type: 'dir',
-      fileInfo: {
-        '{http://owncloud.org/ns}permissions': 'RDNVCK',
-        '{http://owncloud.org/ns}favorite': '0',
-        '{http://owncloud.org/ns}fileid': '14',
-        '{http://owncloud.org/ns}owner-id': 'admin',
-        '{http://owncloud.org/ns}owner-display-name': 'admin',
-        '{http://owncloud.org/ns}share-types': '',
-        '{http://owncloud.org/ns}privatelink': 'http://localhost:8080/f/14',
-        '{http://owncloud.org/ns}size': '0',
-        '{DAV:}getlastmodified': 'Thu, 24 Jun 2021 15:03:58 GMT',
-        '{DAV:}getetag': '"60d49edf01ab8"',
-        '{DAV:}resourcetype': ['{DAV:}collection']
-      },
-      tusSupport: null
-    },
-    {
-      name: '/Documents',
-      type: 'dir',
-      fileInfo: {
-        '{http://owncloud.org/ns}permissions': 'RDNVCK',
-        '{http://owncloud.org/ns}favorite': '0',
-        '{http://owncloud.org/ns}fileid': '3867',
-        '{http://owncloud.org/ns}owner-id': 'alice',
-        '{http://owncloud.org/ns}owner-display-name': 'alice',
-        '{http://owncloud.org/ns}share-types': '',
-        '{http://owncloud.org/ns}privatelink': 'http://host.docker.internal:8080/f/3867',
-        '{http://owncloud.org/ns}size': '36227',
-        '{DAV:}getlastmodified': 'Mon, 14 Jun 2021 09:41:16 GMT',
-        '{DAV:}getetag': '"60c7243c2e7f1"',
-        '{DAV:}resourcetype': ['{DAV:}collection']
-      },
-      tusSupport: null
-    },
-    {
-      name: '/Photos',
-      type: 'dir',
-      fileInfo: {
-        '{http://owncloud.org/ns}permissions': 'RDNVCK',
-        '{http://owncloud.org/ns}favorite': '0',
-        '{http://owncloud.org/ns}fileid': '3863',
-        '{http://owncloud.org/ns}owner-id': 'alice',
-        '{http://owncloud.org/ns}owner-display-name': 'alice',
-        '{http://owncloud.org/ns}share-types': '',
-        '{http://owncloud.org/ns}privatelink': 'http://host.docker.internal:8080/f/3863',
-        '{http://owncloud.org/ns}size': '1011464',
-        '{DAV:}getlastmodified': 'Mon, 14 Jun 2021 09:41:15 GMT',
-        '{DAV:}getetag': '"60c7243befd5d"',
-        '{DAV:}resourcetype': ['{DAV:}collection']
-      },
-      tusSupport: null
-    },
-    {
-      name: '/ownCloud Manual.pdf',
-      type: 'file',
-      fileInfo: {
-        '{http://owncloud.org/ns}permissions': 'RDNVW',
-        '{http://owncloud.org/ns}favorite': '0',
-        '{http://owncloud.org/ns}fileid': '3862',
-        '{http://owncloud.org/ns}owner-id': 'alice',
-        '{http://owncloud.org/ns}owner-display-name': 'alice',
-        '{http://owncloud.org/ns}share-types': '',
-        '{http://owncloud.org/ns}privatelink': 'http://host.docker.internal:8080/f/3862',
-        '{DAV:}getcontentlength': '6498656',
-        '{http://owncloud.org/ns}size': '6498656',
-        '{DAV:}getlastmodified': 'Mon, 14 Jun 2021 09:41:15 GMT',
-        '{DAV:}getetag': '"1f0ac81c04bc55c5d52a59f510c785fd"',
-        '{DAV:}resourcetype': '',
-        '{http://owncloud.org/ns}downloadURL': ''
-      },
-      tusSupport: null
-    }
-  ],
-  '/Documents': [
-    {
-      name: '/Documents',
-      type: 'dir',
-      fileInfo: {
-        '{http://owncloud.org/ns}permissions': 'RDNVCK',
-        '{http://owncloud.org/ns}favorite': '0',
-        '{http://owncloud.org/ns}fileid': '3867',
-        '{http://owncloud.org/ns}owner-id': 'alice',
-        '{http://owncloud.org/ns}owner-display-name': 'alice',
-        '{http://owncloud.org/ns}share-types': '',
-        '{http://owncloud.org/ns}privatelink': 'http://host.docker.internal:8080/f/3867',
-        '{http://owncloud.org/ns}size': '36227',
-        '{DAV:}getlastmodified': 'Mon, 14 Jun 2021 09:41:16 GMT',
-        '{DAV:}getetag': '"60c7243c2e7f1"',
-        '{DAV:}resourcetype': ['{DAV:}collection']
-      },
-      tusSupport: null
-    }
-  ]
-}
diff --git a/__fixtures__/publicFiles.js b/__fixtures__/publicFiles.js
deleted file mode 100644
index 323369993bc..00000000000
--- a/__fixtures__/publicFiles.js
+++ /dev/null
@@ -1,80 +0,0 @@
-export default {
-  link: [
-    {
-      name: '/link',
-      type: 'dir',
-      fileInfo: {
-        '{http://owncloud.org/ns}permissions': '',
-        '{DAV:}resourcetype': ['{DAV:}collection'],
-        '{http://owncloud.org/ns}public-link-item-type': 'folder',
-        '{http://owncloud.org/ns}public-link-permission': '1',
-        '{http://owncloud.org/ns}public-link-share-datetime': 'Wed, 09 Jun 2021 12:44:17 GMT',
-        '{http://owncloud.org/ns}public-link-share-owner': 'admin'
-      },
-      tusSupport: null,
-      getProperty: function(prop) {
-        return this.fileInfo[prop]
-      }
-    },
-    {
-      name: '/link/.hidden-folder',
-      type: 'dir',
-      fileInfo: {
-        '{http://owncloud.org/ns}permissions': '',
-        '{http://owncloud.org/ns}fileid': '3834',
-        '{http://owncloud.org/ns}owner-id': 'admin',
-        '{http://owncloud.org/ns}owner-display-name': 'admin',
-        '{http://owncloud.org/ns}size': '0',
-        '{DAV:}getlastmodified': 'Mon, 14 Jun 2021 12:59:12 GMT',
-        '{DAV:}resourcetype': ['{DAV:}collection']
-      },
-      tusSupport: null
-    },
-    {
-      name: '/link/Documents',
-      type: 'dir',
-      fileInfo: {
-        '{http://owncloud.org/ns}permissions': '',
-        '{http://owncloud.org/ns}fileid': '3874',
-        '{http://owncloud.org/ns}owner-id': 'admin',
-        '{http://owncloud.org/ns}owner-display-name': 'admin',
-        '{http://owncloud.org/ns}size': '0',
-        '{DAV:}getlastmodified': 'Mon, 14 Jun 2021 12:59:12 GMT',
-        '{DAV:}resourcetype': ['{DAV:}collection']
-      },
-      tusSupport: null
-    },
-    {
-      name: '/link/Photos',
-      type: 'dir',
-      fileInfo: {
-        '{http://owncloud.org/ns}permissions': '',
-        '{http://owncloud.org/ns}fileid': '3875',
-        '{http://owncloud.org/ns}owner-id': 'admin',
-        '{http://owncloud.org/ns}owner-display-name': 'admin',
-        '{http://owncloud.org/ns}size': '0',
-        '{DAV:}getlastmodified': 'Mon, 14 Jun 2021 12:59:12 GMT',
-        '{DAV:}resourcetype': ['{DAV:}collection']
-      },
-      tusSupport: null
-    },
-    {
-      name: '/link/ownCloud Manual.pdf',
-      type: 'file',
-      fileInfo: {
-        '{http://owncloud.org/ns}permissions': '',
-        '{http://owncloud.org/ns}fileid': '3012',
-        '{http://owncloud.org/ns}owner-id': 'admin',
-        '{http://owncloud.org/ns}owner-display-name': 'admin',
-        '{DAV:}getcontentlength': '0',
-        '{http://owncloud.org/ns}size': '0',
-        '{DAV:}getlastmodified': 'Mon, 10 May 2021 11:15:05 GMT',
-        '{DAV:}getetag': '"c5383f85b730ac10a5817efbc469bcb2"',
-        '{DAV:}resourcetype': '',
-        '{http://owncloud.org/ns}downloadURL':
-          'http://host.docker.internal:8080/remote.php/dav/public-files/link/ownCloud Manual.pdf'
-      },
-      tusSupport: null
-    }
-  ]
-}
diff --git a/__fixtures__/recipients.js b/__fixtures__/recipients.js
deleted file mode 100644
index 9513f86d28f..00000000000
--- a/__fixtures__/recipients.js
+++ /dev/null
@@ -1,3 +0,0 @@
-export default {
-  users: [{ label: 'bob', value: { shareType: 0, shareWith: 'bob', userType: 0 } }]
-}
diff --git a/__fixtures__/sharedFiles.js b/__fixtures__/sharedFiles.js
deleted file mode 100644
index a83b70a14cf..00000000000
--- a/__fixtures__/sharedFiles.js
+++ /dev/null
@@ -1,156 +0,0 @@
-export default [
-  {
-    shareInfo: {
-      id: '38',
-      share_type: 3,
-      uid_owner: 'admin',
-      displayname_owner: 'admin',
-      permissions: 1,
-      stime: 1623242657,
-      parent: null,
-      expiration: null,
-      token: 'sADy5cUdrz931MV',
-      uid_file_owner: 'admin',
-      displayname_file_owner: 'admin',
-      additional_info_owner: null,
-      additional_info_file_owner: null,
-      path: '/Documents',
-      mimetype: 'httpd/unix-directory',
-      state: 0,
-      storage_id: 'home::admin',
-      storage: 2,
-      item_type: 'folder',
-      item_source: 3009,
-      file_source: 3009,
-      file_parent: 6,
-      file_target: '/Documents',
-      name: 'Quick action link',
-      url: 'http://host.docker.internal:8080/s/sADy5cUdrz931MV',
-      mail_send: 0,
-      attributes: null,
-      tags: [],
-      sharedWith: [
-        {
-          name: 'Quick action link',
-          link: true
-        }
-      ]
-    }
-  },
-  {
-    shareInfo: {
-      id: '64',
-      share_type: 3,
-      uid_owner: 'admin',
-      displayname_owner: 'admin',
-      permissions: 1,
-      stime: 1623242657,
-      parent: null,
-      expiration: null,
-      token: 'sADy5cUdrz931MV',
-      uid_file_owner: 'admin',
-      displayname_file_owner: 'admin',
-      additional_info_owner: null,
-      additional_info_file_owner: null,
-      path: '/.hidden-folder',
-      mimetype: 'httpd/unix-directory',
-      storage_id: 'home::admin',
-      storage: 2,
-      item_type: 'folder',
-      item_source: 3010,
-      file_source: 3010,
-      file_parent: 6,
-      file_target: '/.hidden-folder',
-      name: 'Quick action link',
-      url: 'http://host.docker.internal:8080/s/sADy5cUdrz931MV',
-      mail_send: 0,
-      attributes: null,
-      tags: [],
-      sharedWith: [
-        {
-          name: 'Quick action link',
-          link: true
-        }
-      ]
-    }
-  },
-  {
-    shareInfo: {
-      id: '39',
-      share_type: 3,
-      uid_owner: 'admin',
-      displayname_owner: 'admin',
-      permissions: 1,
-      stime: 1623242657,
-      parent: null,
-      expiration: null,
-      token: 'sADy5cUdrz931MV',
-      uid_file_owner: 'admin',
-      displayname_file_owner: 'admin',
-      additional_info_owner: null,
-      additional_info_file_owner: null,
-      path: '/Photos',
-      mimetype: 'httpd/unix-directory',
-      storage_id: 'home::admin',
-      storage: 2,
-      item_type: 'folder',
-      item_source: 3010,
-      file_source: 3010,
-      file_parent: 6,
-      file_target: '/Photos',
-      name: 'Quick action link',
-      url: 'http://host.docker.internal:8080/s/sADy5cUdrz931MV',
-      mail_send: 0,
-      attributes: null,
-      tags: [],
-      sharedWith: [
-        {
-          name: 'Quick action link',
-          link: true
-        }
-      ]
-    }
-  },
-  {
-    shareInfo: {
-      id: '30',
-      share_type: 0,
-      uid_owner: 'admin',
-      displayname_owner: 'admin',
-      permissions: 19,
-      stime: 1623242244,
-      parent: null,
-      expiration: null,
-      token: null,
-      uid_file_owner: 'admin',
-      displayname_file_owner: 'admin',
-      additional_info_owner: null,
-      additional_info_file_owner: null,
-      path: '/ownCloud Manual.pdf',
-      mimetype: 'text/plain',
-      storage_id: 'home::admin',
-      storage: 2,
-      item_type: 'file',
-      item_source: 3011,
-      file_source: 3011,
-      file_parent: 3039,
-      file_target: '/ownCloud Manual.pdf',
-      share_with: 'bob',
-      share_with_displayname: 'bob',
-      share_with_additional_info: null,
-      mail_send: 0,
-      attributes: null,
-      tags: ['_$!<Favorite>!$_'],
-      sharedWith: [
-        {
-          username: 'bob',
-          displayName: 'bob'
-        },
-        {
-          name: 'Quick action link',
-          link: true
-        }
-      ]
-    }
-  }
-]
diff --git a/__fixtures__/sharedViaLinkFiles.js b/__fixtures__/sharedViaLinkFiles.js
deleted file mode 100644
index e4308d95405..00000000000
--- a/__fixtures__/sharedViaLinkFiles.js
+++ /dev/null
@@ -1,150 +0,0 @@
-export default [
-  {
-    shareInfo: {
-      id: '38',
-      share_type: 3,
-      uid_owner: 'admin',
-      displayname_owner: 'admin',
-      permissions: 1,
-      stime: 1623242657,
-      parent: null,
-      expiration: null,
-      token: 'sADy5cUdrz931MV',
-      uid_file_owner: 'admin',
-      displayname_file_owner: 'admin',
-      additional_info_owner: null,
-      additional_info_file_owner: null,
-      path: '/Documents',
-      mimetype: 'httpd/unix-directory',
-      storage_id: 'home::admin',
-      storage: 2,
-      item_type: 'folder',
-      item_source: 3007,
-      file_source: 3007,
-      file_parent: 6,
-      file_target: '/Documents',
-      name: 'Quick action link',
-      url: 'http://host.docker.internal:8080/s/sADy5cUdrz931MV',
-      mail_send: 0,
-      attributes: null,
-      tags: [],
-      sharedWith: [
-        {
-          name: 'Quick action link',
-          link: true
-        }
-      ]
-    }
-  },
-  {
-    shareInfo: {
-      id: '57',
-      share_type: 3,
-      uid_owner: 'admin',
-      displayname_owner: 'admin',
-      permissions: 1,
-      stime: 1623242657,
-      parent: null,
-      expiration: null,
-      token: 'sADy5cUdrz931MV',
-      uid_file_owner: 'admin',
-      displayname_file_owner: 'admin',
-      additional_info_owner: null,
-      additional_info_file_owner: null,
-      path: '/.hidden-folder',
-      mimetype: 'httpd/unix-directory',
-      storage_id: 'home::admin',
-      storage: 2,
-      item_type: 'folder',
-      item_source: 3008,
-      file_source: 3008,
-      file_parent: 6,
-      file_target: '/.hidden-folder',
-      name: 'Quick action link',
-      url: 'http://host.docker.internal:8080/s/sADy5cUdrz931MV',
-      mail_send: 0,
-      attributes: null,
-      tags: [],
-      sharedWith: [
-        {
-          name: 'Quick action link',
-          link: true
-        }
-      ]
-    }
-  },
-  {
-    shareInfo: {
-      id: '39',
-      share_type: 3,
-      uid_owner: 'admin',
-      displayname_owner: 'admin',
-      permissions: 1,
-      stime: 1623242657,
-      parent: null,
-      expiration: null,
-      token: 'sADy5cUdrz931MV',
-      uid_file_owner: 'admin',
-      displayname_file_owner: 'admin',
-      additional_info_owner: null,
-      additional_info_file_owner: null,
-      path: '/Photos',
-      mimetype: 'httpd/unix-directory',
-      storage_id: 'home::admin',
-      storage: 2,
-      item_type: 'folder',
-      item_source: 3009,
-      file_source: 3009,
-      file_parent: 6,
-      file_target: '/Photos',
-      name: 'Quick action link',
-      url: 'http://host.docker.internal:8080/s/sADy5cUdrz931MV',
-      mail_send: 0,
-      attributes: null,
-      tags: [],
-      sharedWith: [
-        {
-          name: 'Quick action link',
-          link: true
-        }
-      ]
-    }
-  },
-  {
-    shareInfo: {
-      id: '40',
-      share_type: 3,
-      uid_owner: 'admin',
-      displayname_owner: 'admin',
-      permissions: 1,
-      stime: 1623242982,
-      parent: null,
-      expiration: null,
-      token: 'SqlIiKbZCgMy4Jq',
-      uid_file_owner: 'admin',
-      displayname_file_owner: 'admin',
-      additional_info_owner: null,
-      additional_info_file_owner: null,
-      path: '/ownCloud Manual.pdf',
-      mimetype: 'text/plain',
-      storage_id: 'home::admin',
-      storage: 2,
-      item_type: 'file',
-      item_source: 3010,
-      file_source: 3010,
-      file_parent: 3009,
-      file_target: '/ownCloud Manual.pdf',
-      name: 'Quick action link',
-      url: 'http://host.docker.internal:8080/s/SqlIiKbZCgMy4Jq',
-      mail_send: 0,
-      attributes: null,
-      tags: ['_$!<Favorite>!$_'],
-      sharedWith: [
-        {
-          name: 'Quick action link',
-          link: true
-        }
-      ]
-    }
-  }
-]
diff --git a/__fixtures__/sharedWithMeFiles.js b/__fixtures__/sharedWithMeFiles.js
deleted file mode 100644
index 9927c0fbfb3..00000000000
--- a/__fixtures__/sharedWithMeFiles.js
+++ /dev/null
@@ -1,134 +0,0 @@
-export default [
-  {
-    shareInfo: {
-      id: '22',
-      share_type: 0,
-      uid_owner: 'bob',
-      displayname_owner: 'bob',
-      permissions: 17,
-      stime: 1620810871,
-      parent: null,
-      expiration: null,
-      token: null,
-      uid_file_owner: 'bob',
-      displayname_file_owner: 'bob',
-      additional_info_owner: null,
-      additional_info_file_owner: null,
-      state: 2,
-      path: '/Documents',
-      mimetype: 'httpd/unix-directory',
-      storage_id: 'home::bob',
-      storage: 33,
-      item_type: 'folder',
-      item_source: 2243,
-      file_source: 2243,
-      file_parent: 1322,
-      file_target: '/Documents',
-      share_with: 'admin',
-      share_with_displayname: 'admin',
-      share_with_additional_info: null,
-      mail_send: 0,
-      attributes: null,
-      tags: []
-    }
-  },
-  {
-    shareInfo: {
-      id: '33',
-      share_type: 0,
-      uid_owner: 'bob',
-      displayname_owner: 'bob',
-      permissions: 17,
-      stime: 1620810871,
-      parent: null,
-      expiration: null,
-      token: null,
-      uid_file_owner: 'bob',
-      displayname_file_owner: 'bob',
-      additional_info_owner: null,
-      additional_info_file_owner: null,
-      state: 2,
-      path: '/.hidden-folder',
-      mimetype: 'httpd/unix-directory',
-      storage_id: 'home::bob',
-      storage: 33,
-      item_type: 'folder',
-      item_source: 2243,
-      file_source: 2243,
-      file_parent: 1322,
-      file_target: '/.hidden-folder',
-      share_with: 'admin',
-      share_with_displayname: 'admin',
-      share_with_additional_info: null,
-      mail_send: 0,
-      attributes: null,
-      tags: []
-    }
-  },
-  {
-    shareInfo: {
-      id: '23',
-      share_type: 0,
-      uid_owner: 'bob',
-      displayname_owner: 'bob',
-      permissions: 17,
-      stime: 1620810871,
-      parent: null,
-      expiration: null,
-      token: null,
-      uid_file_owner: 'bob',
-      displayname_file_owner: 'bob',
-      additional_info_owner: null,
-      additional_info_file_owner: null,
-      state: 2,
-      path: '/Photos',
-      mimetype: 'httpd/unix-directory',
-      storage_id: 'home::bob',
-      storage: 33,
-      item_type: 'folder',
-      item_source: 2244,
-      file_source: 2244,
-      file_parent: 1322,
-      file_target: '/Photos',
-      share_with: 'admin',
-      share_with_displayname: 'admin',
-      share_with_additional_info: null,
-      mail_send: 0,
-      attributes: null,
-      tags: []
-    }
-  },
-  {
-    shareInfo: {
-      id: '24',
-      share_type: 0,
-      uid_owner: 'bob',
-      displayname_owner: 'bob',
-      permissions: 19,
-      stime: 1623672189,
-      parent: null,
-      expiration: null,
-      token: null,
-      uid_file_owner: 'bob',
-      displayname_file_owner: 'bob',
-      additional_info_owner: null,
-      additional_info_file_owner: null,
-      state: 1,
-      path: '/ownCloud Manual.pdf',
-      mimetype: 'text/plain',
-      storage_id: 'home::bob',
-      storage: 33,
-      item_type: 'file',
-      item_source: 2248,
-      file_source: 2248,
-      file_parent: 1322,
-      file_target: '/ownCloud Manual.pdf',
-      share_with: 'admin',
-      share_with_displayname: 'admin',
-      share_with_additional_info: null,
-      mail_send: 0,
-      attributes: null,
-      tags: []
-    }
-  }
-]
diff --git a/__fixtures__/sidebarNavItems.js b/__fixtures__/sidebarNavItems.js
deleted file mode 100644
index ce8cd1cda9d..00000000000
--- a/__fixtures__/sidebarNavItems.js
+++ /dev/null
@@ -1,29 +0,0 @@
-export default [
-  {
-    name: "Personal",
-    icon: "folder",
-    route: {
-      name: "files-personal",
-      path: "/files/list/all"
-    },
-    active: true
-  },
-  {
-    name: "Shares",
-    icon: 'share-forward',
-    route: {
-      name: "files-shared-with-me",
-      path: "/files/list/shared-with-me"
-    },
-    active: false
-  },
-  {
-    name: "Deleted files",
-    icon: "delete",
-    route: {
-      name: "files-trashbin",
-      path: "/files/list/trash-bin"
-    },
-    active: false
-  }
-]
diff --git a/__fixtures__/users.js b/__fixtures__/users.js
deleted file mode 100644
index 6bb3e76c495..00000000000
--- a/__fixtures__/users.js
+++ /dev/null
@@ -1,36 +0,0 @@
-export default {
-  alice: {
-    quota: {
-      free: 37883293696,
-      used: 7546347,
-      total: 37890840043,
-      relative: 0.02,
-      definition: 'default'
-    },
-    email: {},
-    id: 'alice',
-    name: 'alice',
-    displayname: 'Alice Hansen',
-    additionalInfo: 'alice@example.org',
-    home: '/mnt/data/files/alice',
-    two_factor_auth_enabled: 'false',
-    uuid: 1
-  },
-  admin: {
-    quota: {
-      free: 37883293696,
-      used: 7546347,
-      total: 37890840043,
-      relative: 0.02,
-      definition: 'default'
-    },
-    email: {},
-    id: 'admin',
-    name: 'admin',
-    displayname: 'admin',
-    additionalInfo: 'admin@example.org',
-    home: '/mnt/data/files/admin',
-    two_factor_auth_enabled: 'false',
-    uuid: 2
-  }
-}
diff --git a/__mocks__/sdk.js b/__mocks__/sdk.js
deleted file mode 100644
index deca94ec800..00000000000
--- a/__mocks__/sdk.js
+++ /dev/null
@@ -1,160 +0,0 @@
-import fixtureFiles from '../__fixtures__/files'
-import fixtureUsers from '../__fixtures__/users'
-import fixtureFavoriteFiles from '../__fixtures__/favoriteFiles'
-import fixtureSharedFiles from '../__fixtures__/sharedFiles'
-import fixtureSharedViaLinksFiles from '../__fixtures__/sharedViaLinkFiles'
-import fixtureSharedWithMeFiles from '../__fixtures__/sharedWithMeFiles'
-import fixtureDeletedFiles from '../__fixtures__/deletedFiles'
-import fixturePublicFiles from '../__fixtures__/publicFiles'
-import fixtureRecipients from '../__fixtures__/recipients'
-
-const mockPath = (path) => {
-  if (path.startsWith('/files/')) {
-    path = '/' + path.split('/').splice(3).join('/')
-  }
-  return path
-}
-
-export default {
-  files: {
-    list: (path = '/') => {
-      return fixtureFiles[mockPath(path)]
-    },
-    getFavoriteFiles: () => fixtureFavoriteFiles,
-    fileInfo: (path) => {
-      return fixtureFiles[mockPath(path)][0]
-    }
-  },
-  users: {
-    getUser: (id) => fixtureUsers[id]
-  },
-  fileTrash: {
-    list: () => fixtureDeletedFiles
-  },
-  publicFiles: {
-    PUBLIC_LINK_ITEM_TYPE: '{http://owncloud.org/ns}public-link-item-type',
-    PUBLIC_LINK_PERMISSION: '{http://owncloud.org/ns}public-link-permission',
-    PUBLIC_LINK_EXPIRATION: '{http://owncloud.org/ns}public-link-expiration',
-    PUBLIC_LINK_SHARE_DATETIME: '{http://owncloud.org/ns}public-link-share-datetime',
-    PUBLIC_LINK_SHARE_OWNER: '{http://owncloud.org/ns}public-link-share-owner',
-    list: (path) => fixturePublicFiles[path]
-  },
-  shares: {
-    getShares: (path, options) => {
-      if (options?.share_types === '3') {
-        return Promise.resolve(fixtureSharedViaLinksFiles)
-      }
-
-      if (options?.shared_with_me === true) {
-        return Promise.resolve(fixtureSharedWithMeFiles)
-      }
-
-      return Promise.resolve(fixtureSharedFiles)
-    },
-    getRecipients,
-    shareFileWithUser: (path, id, params) =>
-      Promise.resolve({
-        shareInfo: {
-          id: '1',
-          share_type: 0,
-          uid_owner: 'alice', // TODO: get user dynamically
-          displayname_owner: 'alice', // TODO: get user dynamically
-          permissions: params.permissions,
-          stime: new Date().getTime(),
-          expiration: params.expirationDate,
-          uid_file_owner: 'alice', // TODO: get user dynamically
-          displayname_file_owner: 'alice', // TODO: get user dynamically
-          path,
-          item_type: 'folder', // TODO: get item type dynamically
-          item_source: 10,
-          file_source: 10,
-          file_parent: 6,
-          file_target: path,
-          share_with: id,
-          share_with_displayname: id
-        }
-      }),
-    shareFileWithGroup: () => Promise.resolve(),
-    updateShare: (id, params) => {
-      let shareInfo
-
-      if (params.name === 'Public link') {
-        shareInfo = {
-          id: 1,
-          share_type: 3,
-          permissions: params.permissions,
-          stime: new Date().getTime(),
-          expiration: params.expirationDate,
-          uid_file_owner: 'alice', // TODO: get user dynamically
-          displayname_file_owner: 'alice', // TODO: get user dynamically
-          path: '/Documents',
-          item_type: 'folder', // TODO: get item type dynamically
-          item_source: 10,
-          file_source: 10,
-          file_parent: 6,
-          file_target: '/Documents',
-          token: 'token',
-          url: 'url',
-          name: 'Public link'
-        }
-      } else {
-        shareInfo = {
-          id,
-          share_type: 0,
-          uid_owner: 'alice', // TODO: get user dynamically
-          displayname_owner: 'alice', // TODO: get user dynamically
-          permissions: params.permissions,
-          stime: new Date().getTime(),
-          uid_file_owner: 'alice', // TODO: get user dynamically
-          displayname_file_owner: 'alice', // TODO: get user dynamically
-          path: '/Documents', // TODO: get path dynamically
-          item_type: 'folder', // TODO: get item type dynamically
-          item_source: 10,
-          file_source: 10,
-          file_parent: 6,
-          file_target: '/Documents', // TODO: get path dynamically
-          share_with: 'bob', // TODO: get user dynamically
-          share_with_displayname: 'bob' // TODO: get user dynamically
-        }
-
-        if (params.expireDate) {
-          shareInfo.expiration = params.expireDate
-        }
-      }
-
-      const share = { shareInfo }
-
-      return Promise.resolve(share)
-    },
-    shareFileWithLink: (path, params) => {
-      const share = {
-        shareInfo: {
-          id: '1',
-          share_type: 3,
-          permissions: params.permissions,
-          stime: new Date().getTime(),
-          expiration: params.expirationDate,
-          uid_file_owner: 'alice', // TODO: get user dynamically
-          displayname_file_owner: 'alice', // TODO: get user dynamically
-          path,
-          item_type: 'folder', // TODO: get item type dynamically
-          item_source: 10,
-          file_source: 10,
-          file_parent: 6,
-          file_target: path,
-          token: 'token',
-          url: 'url',
-          name: 'Public link'
-        }
-      }
-
-      return Promise.resolve(share)
-    }
-  }
-}
-
-function getRecipients(query) {
-  const users = fixtureRecipients.users.filter((user) => user.label.includes(query))
-
-  return { exact: { users, groups: [], remotes: [] }, users: [], groups: [], remotes: [] }
-}
diff --git a/packages/web-app-files/src/components/SideBar/Shares/Collaborators/ListItem.vue b/packages/web-app-files/src/components/SideBar/Shares/Collaborators/ListItem.vue
index 8dab60129a4..a2370a1fbb1 100644
--- a/packages/web-app-files/src/components/SideBar/Shares/Collaborators/ListItem.vue
+++ b/packages/web-app-files/src/components/SideBar/Shares/Collaborators/ListItem.vue
@@ -164,10 +164,6 @@ export default defineComponent({
       return extractDomSelector(this.share.id)
     },
 
-    isGroup() {
-      return this.shareType === ShareTypes.group
-    },
-
     isUser() {
       return this.shareType === ShareTypes.user
     },
diff --git a/packages/web-app-files/src/components/SideBar/Shares/FileShares.vue b/packages/web-app-files/src/components/SideBar/Shares/FileShares.vue
index d2e435745d2..84f637bb170 100644
--- a/packages/web-app-files/src/components/SideBar/Shares/FileShares.vue
+++ b/packages/web-app-files/src/components/SideBar/Shares/FileShares.vue
@@ -37,6 +37,7 @@
       <div v-if="showShareToggle" class="oc-flex oc-flex-center">
         <oc-button
           appearance="raw"
+          class="toggle-shares-list-btn"
           @click="toggleShareesListCollapsed"
           v-text="collapseButtonTitle"
         />
diff --git a/packages/web-app-files/src/components/SideBar/Shares/SpaceMembers.vue b/packages/web-app-files/src/components/SideBar/Shares/SpaceMembers.vue
index 775bed0ec28..f8fe57274a9 100644
--- a/packages/web-app-files/src/components/SideBar/Shares/SpaceMembers.vue
+++ b/packages/web-app-files/src/components/SideBar/Shares/SpaceMembers.vue
@@ -15,6 +15,7 @@
           />
           <oc-button
             v-oc-tooltip="$gettext('Close filter')"
+            class="close-filter-btn"
             :aria-label="$gettext('Close filter')"
             appearance="raw"
             @click="toggleFilter"
@@ -25,6 +26,7 @@
         <oc-button
           v-else
           v-oc-tooltip="$gettext('Filter members')"
+          class="open-filter-btn"
           :aria-label="$gettext('Filter members')"
           appearance="raw"
           @click="toggleFilter"
diff --git a/packages/web-app-files/tests/__fixtures__/files.ts b/packages/web-app-files/tests/__fixtures__/files.ts
deleted file mode 100644
index a23f5601830..00000000000
--- a/packages/web-app-files/tests/__fixtures__/files.ts
+++ /dev/null
@@ -1,56 +0,0 @@
-import { Resource } from 'web-client'
-
-export const files: Resource[] = [
-  {
-    id: '1',
-    fileId: '1',
-    name: 'folder',
-    extension: '',
-    path: '/',
-    type: 'folder',
-    isFolder: true,
-    mdate: 'Mon, 12 Jul 2021 11:04:33 GMT',
-    size: '0',
-    indicators: [],
-    permissions: 'RDNVW',
-    starred: false,
-    etag: '"89128c0e8122002db57bd19c9ec33004"',
-    shareTypes: [],
-    downloadURL: '',
-    ownerDisplayName: 'admin',
-    ownerId: 'admin',
-    canDownload: () => true,
-    isReceivedShare: () => false,
-    canBeDeleted: () => false,
-    canRename: () => false,
-    canShare: () => false,
-    canDeny: () => false,
-    getDomSelector: jest.fn()
-  },
-  {
-    id: '2',
-    fileId: '2',
-    name: 'someFile.txt',
-    extension: 'txt',
-    path: '/',
-    type: 'file',
-    isFolder: false,
-    mdate: 'Mon, 12 Jul 2021 11:04:33 GMT',
-    size: '12',
-    indicators: [],
-    permissions: 'RDNVW',
-    starred: false,
-    etag: '"99128c0e8122002db57bd19c9ec33004"',
-    shareTypes: [],
-    downloadURL: '',
-    ownerDisplayName: 'admin',
-    ownerId: 'admin',
-    canDownload: () => true,
-    isReceivedShare: () => false,
-    canBeDeleted: () => true,
-    canRename: () => true,
-    canShare: () => true,
-    canDeny: () => false,
-    getDomSelector: jest.fn()
-  }
-]
diff --git a/packages/web-app-files/tests/__fixtures__/index.ts b/packages/web-app-files/tests/__fixtures__/index.ts
deleted file mode 100644
index 9a6d5a4d307..00000000000
--- a/packages/web-app-files/tests/__fixtures__/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export * from './files'
-export * from './spaces'
diff --git a/packages/web-app-files/tests/__fixtures__/spaces.ts b/packages/web-app-files/tests/__fixtures__/spaces.ts
deleted file mode 100644
index f5f00e742cd..00000000000
--- a/packages/web-app-files/tests/__fixtures__/spaces.ts
+++ /dev/null
@@ -1,130 +0,0 @@
-import { ProjectSpaceResource } from 'web-client/src/helpers'
-
-export const spaces: ProjectSpaceResource[] = [
-  {
-    id: '1',
-    fileId: '1',
-    name: 'Some space',
-    extension: '',
-    path: '/',
-    type: 'space',
-    isFolder: false,
-    mdate: 'Mon, 12 Jul 2021 11:04:33 GMT',
-    size: '0',
-    indicators: [],
-    permissions: 'RDNVW',
-    starred: false,
-    etag: '"89128c0e8122002db57bd19c9ec33004"',
-    shareTypes: [],
-    downloadURL: '',
-    disabled: false,
-    canDownload: () => true,
-    isReceivedShare: () => false,
-    canBeDeleted: () => false,
-    canRename: () => false,
-    canShare: () => false,
-    canDeny: () => false,
-    canEditDescription: () => true,
-    canEditImage: () => true,
-    canDisable: () => true,
-    canRestore: () => true,
-    isViewer: () => true,
-    isEditor: () => true,
-    isManager: () => true,
-    webDavTrashPath: '',
-    root: {
-      id: '',
-      remoteItem: { id: '', name: '' },
-      webDavUrl: ''
-    },
-    getDomSelector: jest.fn(),
-    getWebDavUrl: jest.fn(),
-    getWebDavTrashUrl: jest.fn(),
-    getDriveAliasAndItem: jest.fn(),
-    driveType: 'project'
-  },
-  {
-    id: '2',
-    fileId: '2',
-    name: 'Another space',
-    extension: '',
-    path: '/',
-    type: 'space',
-    isFolder: false,
-    mdate: 'Mon, 12 Jul 2021 11:04:33 GMT',
-    size: '12',
-    indicators: [],
-    permissions: 'RDNVW',
-    starred: false,
-    etag: '"99128c0e8122002db57bd19c9ec33004"',
-    shareTypes: [],
-    downloadURL: '',
-    disabled: false,
-    canDownload: () => true,
-    isReceivedShare: () => false,
-    canBeDeleted: () => false,
-    canRename: () => false,
-    canShare: () => false,
-    canDeny: () => false,
-    canEditDescription: () => true,
-    canEditImage: () => true,
-    canDisable: () => true,
-    canRestore: () => true,
-    isViewer: () => true,
-    isEditor: () => true,
-    isManager: () => true,
-    webDavTrashPath: '',
-    root: {
-      id: '',
-      remoteItem: { id: '', name: '' },
-      webDavUrl: ''
-    },
-    getDomSelector: jest.fn(),
-    getWebDavUrl: jest.fn(),
-    getWebDavTrashUrl: jest.fn(),
-    getDriveAliasAndItem: jest.fn(),
-    driveType: 'project'
-  },
-  {
-    id: '3',
-    fileId: '3',
-    name: 'Disabled space',
-    extension: '',
-    path: '/',
-    type: 'space',
-    isFolder: false,
-    mdate: 'Mon, 12 Jul 2021 11:04:33 GMT',
-    size: '12',
-    indicators: [],
-    permissions: 'RDNVW',
-    starred: false,
-    etag: '"69128c0e8122002db57bd19c9ec33004"',
-    shareTypes: [],
-    downloadURL: '',
-    disabled: true,
-    canDownload: () => true,
-    isReceivedShare: () => false,
-    canBeDeleted: () => false,
-    canRename: () => false,
-    canShare: () => false,
-    canDeny: () => false,
-    canEditDescription: () => true,
-    canEditImage: () => true,
-    canDisable: () => true,
-    canRestore: () => true,
-    isViewer: () => true,
-    isEditor: () => true,
-    isManager: () => true,
-    webDavTrashPath: '',
-    root: {
-      id: '',
-      remoteItem: { id: '', name: '' },
-      webDavUrl: ''
-    },
-    getDomSelector: jest.fn(),
-    getWebDavUrl: jest.fn(),
-    getWebDavTrashUrl: jest.fn(),
-    getDriveAliasAndItem: jest.fn(),
-    driveType: 'project'
-  }
-]
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.ts
similarity index 91%
rename from packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
rename to packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.ts
index d39b1040f41..7a169512d6b 100644
--- a/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
+++ b/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.ts
@@ -1,21 +1,12 @@
-import { createLocalVue, shallowMount } from '@vue/test-utils'
-import Files from '@/__fixtures__/files'
+import { shallowMount } from '@vue/test-utils'
 import Vuex from 'vuex'
-import DesignSystem from 'owncloud-design-system'
-import GetTextPlugin from 'vue-gettext'
-
 import AppBar from 'web-app-files/src/components/AppBar/AppBar.vue'
+import { mockDeep } from 'jest-mock-extended'
+import { Resource } from 'web-client'
+import { defaultLocalVue } from 'web-test-helpers/src/localVue/defaultLocalVue'
 
-const localVue = createLocalVue()
-localVue.use(Vuex)
-localVue.use(DesignSystem)
-localVue.use(GetTextPlugin, {
-  translations: 'does-not-matter.json',
-  silent: true
-})
-
-const selectedFiles = [Files['/'][1], Files['/'][4]]
-
+const localVue = defaultLocalVue()
+const selectedFiles = [mockDeep<Resource>(), mockDeep<Resource>()]
 const actionSlot = "<button class='action-slot'>Click</button>"
 const contextMenuSlot = "<button class='context-menu-slot'>Click</button>"
 const contentSlot = "<div class='content-slot'>Foo</div>"
@@ -124,9 +115,9 @@ describe('AppBar component', () => {
 })
 
 function getShallowWrapper(
-  store = {},
+  store,
   slots = {},
-  props = {
+  props: { [key: string]: any } = {
     breadcrumbs: [],
     hasBulkActions: false,
     hasSharesNavigation: false,
diff --git a/packages/web-app-files/tests/unit/components/AppBar/__snapshots__/AppBar.spec.js.snap b/packages/web-app-files/tests/unit/components/AppBar/__snapshots__/AppBar.spec.ts.snap
similarity index 100%
rename from packages/web-app-files/tests/unit/components/AppBar/__snapshots__/AppBar.spec.js.snap
rename to packages/web-app-files/tests/unit/components/AppBar/__snapshots__/AppBar.spec.ts.snap
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/RecipientContainer.spec.js b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/RecipientContainer.spec.ts
similarity index 51%
rename from packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/RecipientContainer.spec.js
rename to packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/RecipientContainer.spec.ts
index 7c12ba3259c..1cb3fd959c2 100644
--- a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/RecipientContainer.spec.js
+++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/RecipientContainer.spec.ts
@@ -1,70 +1,39 @@
-import { createLocalVue, mount } from '@vue/test-utils'
-import GetTextPlugin from 'vue-gettext'
+import { mount } from '@vue/test-utils'
 import Vuex from 'vuex'
-import DesignSystem from 'owncloud-design-system'
-
-import Users from '@/__fixtures__/users'
-import Collaborators from '@/__fixtures__/collaborators'
-import SharedFiles from '@/__fixtures__/sharedFiles'
-
 import RecipientContainer from 'web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/RecipientContainer.vue'
-import { buildSharedResource } from 'web-client/src/helpers'
 import { ShareTypes } from 'web-client/src/helpers/share'
+import { defaultLocalVue } from 'web-test-helpers/src/localVue/defaultLocalVue'
 
 jest.mock('web-app-files/src/helpers/user/avatarUrl', () => ({
   avatarUrl: jest.fn().mockReturnValue('avatarUrl')
 }))
 
-const user = Users.admin
-const collaborators = Collaborators
+const localVue = defaultLocalVue()
 
-const localVue = createLocalVue()
-localVue.use(DesignSystem)
-localVue.use(Vuex)
-localVue.use(GetTextPlugin, {
-  translations: 'does-not-matter.json',
-  silent: true
+const getRecipient = (shareType: number | string = ShareTypes.user.value) => ({
+  label: 'Albert Einstein',
+  value: {
+    shareType,
+    shareWith: 'einstein',
+    shareWithAdditionalInfo: 'einstein@example.org'
+  }
 })
 
 describe('InviteCollaborator RecipientContainer', () => {
   describe('renders a recipient with a deselect button', () => {
     it.each(ShareTypes.authenticated)('different recipients for different shareTypes', (type) => {
-      const { collaborator } = collaborators.filter((sharee) => sharee.shareType === type.value)[0]
-      const recipient = {
-        label: collaborator.displayName,
-        value: {
-          shareType: type.key,
-          shareWith: collaborator.name,
-          shareWithAdditionalInfo: collaborator.additionalInfo
-        }
-      }
+      const recipient = getRecipient(type.key)
       const wrapper = getMountedWrapper(recipient)
       expect(wrapper).toMatchSnapshot()
     })
   })
   it('displays an avatar image if capability is present', () => {
-    const { collaborator } = collaborators[0]
-    const recipient = {
-      label: collaborator.displayName,
-      value: {
-        shareType: ShareTypes.user.value,
-        shareWith: collaborator.name,
-        shareWithAdditionalInfo: collaborator.additionalInfo
-      }
-    }
+    const recipient = getRecipient()
     const wrapper = getMountedWrapper(recipient, true)
     expect(wrapper).toMatchSnapshot()
   })
   it('emits an event if deselect button is clicked', async () => {
-    const { collaborator } = collaborators[0]
-    const recipient = {
-      label: collaborator.displayName,
-      value: {
-        shareType: ShareTypes.user.value,
-        shareWith: collaborator.name,
-        shareWithAdditionalInfo: collaborator.additionalInfo
-      }
-    }
+    const recipient = getRecipient()
     const wrapper = getMountedWrapper(recipient, true)
     const spyOnDeselect = wrapper.vm.deselect.mockImplementation()
     const button = wrapper.find('.files-share-invite-recipient-btn-remove')
@@ -75,19 +44,8 @@ describe('InviteCollaborator RecipientContainer', () => {
 
 const storeOptions = (avatarsEnabled) => {
   return {
-    state: {
-      user
-    },
-    modules: {
-      Files: {
-        namespaced: true,
-        getters: {
-          highlightedFile: () => buildSharedResource(SharedFiles.json().ocs.data[0], true)
-        }
-      }
-    },
     getters: {
-      user: () => user,
+      user: () => ({ id: 1 }),
       capabilities: () => {
         return {
           files_sharing: {
@@ -97,12 +55,6 @@ const storeOptions = (avatarsEnabled) => {
                 enabled: true,
                 days: 10
               }
-            },
-            group: {
-              expire_date: {
-                enabled: true,
-                days: 10
-              }
             }
           }
         }
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/__snapshots__/RecipientContainer.spec.js.snap b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/__snapshots__/RecipientContainer.spec.ts.snap
similarity index 62%
rename from packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/__snapshots__/RecipientContainer.spec.js.snap
rename to packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/__snapshots__/RecipientContainer.spec.ts.snap
index 169f971fb3c..73df2c03f34 100644
--- a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/__snapshots__/RecipientContainer.spec.js.snap
+++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/__snapshots__/RecipientContainer.spec.ts.snap
@@ -9,10 +9,10 @@ exports[`InviteCollaborator RecipientContainer displays an avatar image if capab
 
 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="user" 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="user" 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-Albert Einstein"><ocicon-stub name="user" 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 3`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-guest-user"><ocicon-stub name="user" 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-Albert Einstein"><ocicon-stub name="user" 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 4`] = `<span class="oc-recipient files-share-invite-recipient" data-testid="recipient-container-remote-user"><ocicon-stub name="user" 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-Albert Einstein"><ocicon-stub name="user" 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="user" 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/SideBar/Shares/Collaborators/ListItem.spec.js b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/ListItem.spec.js
deleted file mode 100644
index f68df8594aa..00000000000
--- a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/ListItem.spec.js
+++ /dev/null
@@ -1,155 +0,0 @@
-import { createLocalVue, mount } from '@vue/test-utils'
-import Vuex from 'vuex'
-import ListItem from 'web-app-files/src/components/SideBar/Shares/Collaborators/ListItem.vue'
-import stubs from '@/tests/unit/stubs'
-import GetTextPlugin from 'vue-gettext'
-import Users from '@/__fixtures__/users'
-import { peopleRoleViewerFolder, ShareTypes } from 'web-client/src/helpers/share'
-import VueCompositionAPI from '@vue/composition-api'
-
-jest.mock('uuid', () => ({
-  v4: () => {
-    return '00000000-0000-0000-0000-000000000000'
-  }
-}))
-
-const localVue = createLocalVue()
-localVue.use(Vuex)
-localVue.use(VueCompositionAPI)
-localVue.use(GetTextPlugin, {
-  translations: 'does-not-matter.json',
-  silent: true
-})
-
-const selectors = {
-  userAvatarImage: 'avatar-image-stub.files-collaborators-collaborator-indicator',
-  notUserAvatar: 'oc-avatar-item-stub.files-collaborators-collaborator-indicator',
-  collaboratorAdditionalInfo: '.files-collaborators-collaborator-additional-info',
-  collaboratorName: '.files-collaborators-collaborator-name',
-  accessDetailsButton: '.files-collaborators-collaborator-access-details-button',
-  collaboratorRole: '.files-collaborators-collaborator-role',
-  collaboratorEdit: '.files-collaborators-collaborator-edit',
-  shareInheritanceIndicators: '.oc-resource-indicators'
-}
-
-describe('Collaborator ListItem component', () => {
-  describe('displays the correct image/icon according to the shareType', () => {
-    describe('user share type', () => {
-      it('should display a users avatar', () => {
-        const wrapper = createWrapper({ shareType: ShareTypes.user.value })
-        expect(wrapper.find(selectors.userAvatarImage).exists()).toBeTruthy()
-        expect(wrapper.find(selectors.notUserAvatar).exists()).toBeFalsy()
-      })
-      it('sets user info on the avatar', () => {
-        const wrapper = createWrapper()
-        expect(wrapper.find(selectors.userAvatarImage).attributes('userid')).toEqual('brian')
-        expect(wrapper.find(selectors.userAvatarImage).attributes('user-name')).toEqual(
-          'Brian Murphy'
-        )
-      })
-    })
-    describe('non-user share types', () => {
-      it.each(
-        ShareTypes.all.filter(
-          (shareType) => ![ShareTypes.user, ShareTypes.space].includes(shareType)
-        )
-      )('should display an oc-avatar-item for any non-user share types', (shareType) => {
-        const wrapper = createWrapper({ shareType: shareType.value })
-        expect(wrapper.find(selectors.userAvatarImage).exists()).toBeFalsy()
-        expect(wrapper.find(selectors.notUserAvatar).exists()).toBeTruthy()
-        expect(wrapper.find(selectors.notUserAvatar).attributes().name).toEqual(shareType.key)
-      })
-    })
-  })
-  describe('share info', () => {
-    it('shows the collaborator display name', () => {
-      const wrapper = createWrapper()
-      expect(wrapper.find(selectors.collaboratorName).text()).toEqual('Brian Murphy')
-    })
-  })
-  describe('modifiable property', () => {
-    it('shows interactive elements when modifiable', () => {
-      const wrapper = createWrapper({ modifiable: true })
-      expect(wrapper.find(selectors.collaboratorRole).exists()).toBeTruthy()
-    })
-    it('hides interactive elements when not modifiable', () => {
-      const wrapper = createWrapper({ modifiable: false })
-      expect(wrapper.find(selectors.collaboratorRole).exists()).toBeFalsy()
-    })
-  })
-  describe('share inheritance indicators', () => {
-    it('show when sharedParentRoute is given', () => {
-      const wrapper = createWrapper({
-        sharedParentRoute: { params: { driveAliasAndItem: '/folder' } }
-      })
-      expect(wrapper.find(selectors.shareInheritanceIndicators).exists()).toBeTruthy()
-      expect(wrapper).toMatchSnapshot()
-    })
-    it('do not show when sharedParentRoute is not given', () => {
-      const wrapper = createWrapper()
-      expect(wrapper.find(selectors.shareInheritanceIndicators).exists()).toBeFalsy()
-    })
-  })
-})
-
-function createWrapper({
-  shareType = ShareTypes.user.value,
-  collaborator = {
-    name: 'brian',
-    displayName: 'Brian Murphy',
-    additionalInfo: 'brian@owncloud.com'
-  },
-  owner = {
-    name: 'marie',
-    displayName: 'Marie Curie',
-    additionalInfo: 'marie@owncloud.com'
-  },
-  role = peopleRoleViewerFolder,
-  modifiable = true,
-  sharedParentRoute = null
-} = {}) {
-  return mount(ListItem, {
-    store: new Vuex.Store({
-      state: {
-        user: Users.alice
-      },
-      modules: {
-        Files: {
-          namespaced: true,
-          getters: {
-            highlightedFile: function () {
-              return { type: 'folder', isFolder: true }
-            }
-          }
-        }
-      }
-    }),
-    propsData: {
-      share: {
-        id: 'asdf',
-        collaborator,
-        owner,
-        shareType,
-        role
-      },
-      modifiable,
-      sharedParentRoute
-    },
-    localVue,
-    stubs: {
-      ...stubs,
-      'oc-table-simple': true,
-      'oc-tr': true,
-      'oc-td': true,
-      'oc-tag': true,
-      'oc-pagination': true,
-      'oc-avatar-item': true,
-      'role-dropdown': true,
-      'edit-dropdown': true,
-      translate: false
-    },
-    directives: {
-      'oc-tooltip': jest.fn()
-    }
-  })
-}
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/ListItem.spec.ts b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/ListItem.spec.ts
new file mode 100644
index 00000000000..f8aabb2999c
--- /dev/null
+++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/ListItem.spec.ts
@@ -0,0 +1,237 @@
+import { createLocalVue, mount } from '@vue/test-utils'
+import Vuex from 'vuex'
+import ListItem from 'web-app-files/src/components/SideBar/Shares/Collaborators/ListItem.vue'
+import GetTextPlugin from 'vue-gettext'
+import {
+  peopleRoleViewerFile,
+  peopleRoleViewerFolder,
+  SharePermissions,
+  ShareTypes
+} from 'web-client/src/helpers/share'
+import VueCompositionAPI from '@vue/composition-api'
+import { defaultStubs } from 'web-test-helpers/src/mocks/defaultStubs'
+import { defaultStoreMockOptions } from 'web-test-helpers/src/mocks/store/defaultStoreMockOptions'
+import { defaultComponentMocks } from 'web-test-helpers/src/mocks/defaultComponentMocks'
+
+jest.mock('uuid', () => ({
+  v4: () => {
+    return '00000000-0000-0000-0000-000000000000'
+  }
+}))
+
+const localVue = createLocalVue()
+localVue.use(Vuex)
+localVue.use(VueCompositionAPI)
+localVue.use(GetTextPlugin, {
+  translations: 'does-not-matter.json',
+  silent: true
+})
+
+const selectors = {
+  userAvatarImage: 'avatar-image-stub.files-collaborators-collaborator-indicator',
+  notUserAvatar: 'oc-avatar-item-stub.files-collaborators-collaborator-indicator',
+  collaboratorAdditionalInfo: '.files-collaborators-collaborator-additional-info',
+  collaboratorName: '.files-collaborators-collaborator-name',
+  accessDetailsButton: '.files-collaborators-collaborator-access-details-button',
+  collaboratorRole: '.files-collaborators-collaborator-role',
+  collaboratorEdit: '.files-collaborators-collaborator-edit',
+  shareInheritanceIndicators: '.oc-resource-indicators',
+  expirationDateIcon: '[data-testid="recipient-info-expiration-date"]'
+}
+
+describe('Collaborator ListItem component', () => {
+  describe('displays the correct image/icon according to the shareType', () => {
+    describe('user and space share type', () => {
+      it.each([ShareTypes.user.value, ShareTypes.space.value])(
+        'should display a users avatar',
+        (shareType) => {
+          const wrapper = createWrapper({ shareType })
+          expect(wrapper.find(selectors.userAvatarImage).exists()).toBeTruthy()
+          expect(wrapper.find(selectors.notUserAvatar).exists()).toBeFalsy()
+        }
+      )
+      it('sets user info on the avatar', () => {
+        const wrapper = createWrapper()
+        expect(wrapper.find(selectors.userAvatarImage).attributes('userid')).toEqual('brian')
+        expect(wrapper.find(selectors.userAvatarImage).attributes('user-name')).toEqual(
+          'Brian Murphy'
+        )
+      })
+    })
+    describe('non-user share types', () => {
+      it.each(
+        ShareTypes.all.filter(
+          (shareType) => ![ShareTypes.user, ShareTypes.space].includes(shareType)
+        )
+      )('should display an oc-avatar-item for any non-user share types', (shareType) => {
+        const wrapper = createWrapper({ shareType: shareType.value })
+        expect(wrapper.find(selectors.userAvatarImage).exists()).toBeFalsy()
+        expect(wrapper.find(selectors.notUserAvatar).exists()).toBeTruthy()
+        expect(wrapper.find(selectors.notUserAvatar).attributes().name).toEqual(shareType.key)
+      })
+    })
+  })
+  describe('share info', () => {
+    it('shows the collaborator display name', () => {
+      const wrapper = createWrapper()
+      expect(wrapper.find(selectors.collaboratorName).text()).toEqual('Brian Murphy')
+    })
+    it('shows the share expiration date if given', () => {
+      const wrapper = createWrapper({ expires: new Date() })
+      expect(wrapper.find(selectors.expirationDateIcon).exists()).toBeTruthy()
+    })
+  })
+  describe('modifiable property', () => {
+    it('shows interactive elements when modifiable', () => {
+      const wrapper = createWrapper({ modifiable: true })
+      expect(wrapper.find(selectors.collaboratorRole).exists()).toBeTruthy()
+    })
+    it('hides interactive elements when not modifiable', () => {
+      const wrapper = createWrapper({ modifiable: false })
+      expect(wrapper.find(selectors.collaboratorRole).exists()).toBeFalsy()
+    })
+  })
+  describe('share inheritance indicators', () => {
+    it('show when sharedParentRoute is given', () => {
+      const wrapper = createWrapper({
+        sharedParentRoute: { params: { driveAliasAndItem: '/folder' } }
+      })
+      expect(wrapper.find(selectors.shareInheritanceIndicators).exists()).toBeTruthy()
+      expect(wrapper).toMatchSnapshot()
+    })
+    it('do not show when sharedParentRoute is not given', () => {
+      const wrapper = createWrapper()
+      expect(wrapper.find(selectors.shareInheritanceIndicators).exists()).toBeFalsy()
+    })
+  })
+  describe('remove share', () => {
+    it('emits the "removeShare" event', () => {
+      const wrapper = createWrapper()
+      wrapper.find('edit-dropdown-stub').vm.$emit('removeShare')
+      expect(wrapper.emitted().onDelete).toBeTruthy()
+    })
+  })
+  describe('change share role', () => {
+    it('calls "changeShare" for regular resources', () => {
+      const wrapper = createWrapper()
+      const changeShareStub = jest.spyOn(wrapper.vm, 'changeShare')
+      wrapper.find('role-dropdown-stub').vm.$emit('optionChange', {
+        role: peopleRoleViewerFile,
+        permissions: [SharePermissions.read]
+      })
+      expect(changeShareStub).toHaveBeenCalled()
+    })
+    it('calls "changeSpaceMember" for space resources', () => {
+      const wrapper = createWrapper({ shareType: ShareTypes.space.value })
+      const changeShareStub = jest.spyOn(wrapper.vm, 'changeSpaceMember')
+      wrapper.find('role-dropdown-stub').vm.$emit('optionChange', {
+        role: peopleRoleViewerFile,
+        permissions: [SharePermissions.read]
+      })
+      expect(changeShareStub).toHaveBeenCalled()
+    })
+    it('shows a message on error', () => {
+      jest.spyOn(console, 'error').mockImplementation(() => undefined)
+      const wrapper = createWrapper()
+      jest.spyOn(wrapper.vm, 'saveShareChanges').mockImplementation(() => {
+        throw new Error()
+      })
+      const changeShareStub = jest.spyOn(wrapper.vm, 'changeShare')
+      const showMessageStub = jest.spyOn(wrapper.vm, 'showMessage')
+      wrapper.find('role-dropdown-stub').vm.$emit('optionChange', {
+        role: peopleRoleViewerFile,
+        permissions: [SharePermissions.read]
+      })
+      expect(changeShareStub).not.toHaveBeenCalled()
+      expect(showMessageStub).toHaveBeenCalled()
+    })
+  })
+  describe('change expiration date', () => {
+    it('calls "changeShare" for regular resources', () => {
+      const wrapper = createWrapper()
+      const changeShareStub = jest.spyOn(wrapper.vm, 'changeShare')
+      wrapper
+        .find('edit-dropdown-stub')
+        .vm.$emit('expirationDateChanged', { shareExpirationChanged: new Date() })
+      expect(changeShareStub).toHaveBeenCalled()
+    })
+    it('shows a message on error', () => {
+      jest.spyOn(console, 'error').mockImplementation(() => undefined)
+      const wrapper = createWrapper()
+      jest.spyOn(wrapper.vm, 'saveShareChanges').mockImplementation(() => {
+        throw new Error()
+      })
+      const changeShareStub = jest.spyOn(wrapper.vm, 'changeShare')
+      const showMessageStub = jest.spyOn(wrapper.vm, 'showMessage')
+      wrapper
+        .find('edit-dropdown-stub')
+        .vm.$emit('expirationDateChanged', { shareExpirationChanged: new Date() })
+      expect(changeShareStub).not.toHaveBeenCalled()
+      expect(showMessageStub).toHaveBeenCalled()
+    })
+  })
+})
+
+function createWrapper({
+  shareType = ShareTypes.user.value,
+  collaborator = {
+    name: 'brian',
+    displayName: 'Brian Murphy',
+    additionalInfo: 'brian@owncloud.com'
+  },
+  owner = {
+    name: 'marie',
+    displayName: 'Marie Curie',
+    additionalInfo: 'marie@owncloud.com'
+  },
+  role = peopleRoleViewerFolder,
+  modifiable = true,
+  expires = undefined,
+  sharedParentRoute = null
+} = {}) {
+  const storeOptions = {
+    ...defaultStoreMockOptions,
+    state: { user: { id: '1' } }
+  }
+  storeOptions.modules.Files.getters.highlightedFile.mockImplementation(() => ({
+    type: 'folder',
+    isFolder: true
+  }))
+  storeOptions.modules.Files.actions.changeShare = jest.fn()
+  return mount(ListItem, {
+    store: new Vuex.Store(storeOptions),
+    mocks: defaultComponentMocks(),
+    propsData: {
+      share: {
+        id: 'asdf',
+        collaborator,
+        owner,
+        shareType,
+        expires,
+        role
+      },
+      modifiable,
+      sharedParentRoute
+    },
+    localVue,
+    stubs: {
+      ...defaultStubs,
+      'oc-icon': true,
+      'avatar-image': true,
+      'router-link': true,
+      'oc-info-drop': true,
+      'oc-table-simple': true,
+      'oc-tr': true,
+      'oc-td': true,
+      'oc-tag': true,
+      'oc-pagination': true,
+      'oc-avatar-item': true,
+      'role-dropdown': true,
+      'edit-dropdown': true,
+      translate: false
+    },
+    directives: {
+      'oc-tooltip': jest.fn()
+    }
+  })
+}
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.js.snap b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.ts.snap
similarity index 95%
rename from packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.js.snap
rename to packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.ts.snap
index a577a364cd7..6a1b953b6e7 100644
--- a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.js.snap
+++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.ts.snap
@@ -8,7 +8,7 @@ exports[`Collaborator ListItem component share inheritance indicators show when
         <avatar-image-stub userid="brian" user-name="Brian Murphy" width="36" class="files-collaborators-collaborator-indicator"></avatar-image-stub>
       </div>
       <div class="oc-pl-s oc-text-truncate">
-        <div class="oc-text-truncate"><span aria-hidden="true" class="files-collaborators-collaborator-name">Brian Murphy</span> <span class="oc-invisible-sr">Share receiver name: Brian Murphy (brian@owncloud.com)</span></div>
+        <div class="oc-text-truncate"><span aria-hidden="true" class="files-collaborators-collaborator-name">Brian Murphy</span> <span class="oc-invisible-sr"></span></div>
         <div>
           <div class="oc-flex oc-flex-nowrap oc-flex-middle">
             <role-dropdown-stub resource="[object Object]" existingrole="[object Object]" existingpermissions="" domselector="asdf" allowsharepermission="true" class="files-collaborators-collaborator-role"></role-dropdown-stub>
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/FileShares.spec.js b/packages/web-app-files/tests/unit/components/SideBar/Shares/FileShares.spec.js
deleted file mode 100644
index 0cd5b382356..00000000000
--- a/packages/web-app-files/tests/unit/components/SideBar/Shares/FileShares.spec.js
+++ /dev/null
@@ -1,347 +0,0 @@
-import { createLocalVue, mount, shallowMount } from '@vue/test-utils'
-import mockAxios from 'jest-mock-axios'
-import VueCompositionAPI from '@vue/composition-api'
-import GetTextPlugin from 'vue-gettext'
-import Vuex from 'vuex'
-import DesignSystem from 'owncloud-design-system'
-import stubs from '@/tests/unit/stubs'
-import Users from '@/__fixtures__/users'
-import Collaborators from '@/__fixtures__/collaborators'
-import { spaceRoleManager } from 'web-client/src/helpers/share'
-import * as reactivityComposables from 'web-pkg/src/composables/reactivity'
-import * as routerComposables from 'web-pkg/src/composables/router'
-import FileShares from 'web-app-files/src/components/SideBar/Shares/FileShares.vue'
-import { buildSpace } from 'web-client/src/helpers'
-import { clientService } from 'web-pkg/src/services'
-
-const localVue = createLocalVue()
-localVue.prototype.$clientService = clientService
-localVue.use(DesignSystem)
-localVue.use(Vuex)
-localVue.use(VueCompositionAPI)
-localVue.use(GetTextPlugin, {
-  translations: 'does-not-matter.json',
-  silent: true
-})
-
-jest.mock('web-pkg/src/composables/reactivity')
-jest.mock('web-pkg/src/composables/router')
-
-const user = Users.alice
-const collaborators = [Collaborators[0], Collaborators[1]]
-const storageId = '1'
-
-const selectors = {
-  firstCollaboratorListItem: `div[data-testid="collaborator-user-item-${Collaborators[0].collaborator.name}"]`
-}
-
-describe('FileShares', () => {
-  it('renders loading spinner while loading', () => {
-    const wrapper = getShallowMountedWrapper(
-      {
-        user
-      },
-      true
-    )
-    expect(wrapper).toMatchSnapshot()
-  })
-
-  describe('if currentUser can share', () => {
-    it('initially renders add people dialog', () => {
-      const wrapper = getShallowMountedWrapper({
-        user
-      })
-      expect(wrapper).toMatchSnapshot()
-    })
-  })
-
-  describe('if currentUser can not share', () => {
-    it('initially renders no share permission message', () => {
-      const wrapper = getShallowMountedWrapper({
-        user,
-        canShare: false
-      })
-      expect(wrapper).toMatchSnapshot()
-    })
-  })
-
-  describe('if there are no collaborators', () => {
-    it('does not render avatar wrapper or collaborator list', () => {
-      const wrapper = getShallowMountedWrapper({
-        user
-      })
-      expect(wrapper).toMatchSnapshot()
-    })
-  })
-
-  describe('if there are collaborators present', () => {
-    it('renders sharedWithLabel and sharee list', () => {
-      const wrapper = getShallowMountedWrapper({
-        user,
-        outgoingCollaborators: collaborators
-      })
-      expect(wrapper).toMatchSnapshot()
-    })
-
-    it('reacts on delete events by collaborator list items', async () => {
-      const spyOnCollaboratorDeleteTrigger = jest
-        .spyOn(FileShares.methods, '$_ocCollaborators_deleteShare_trigger')
-        .mockImplementation()
-      const wrapper = getMountedWrapper({
-        user,
-        outgoingCollaborators: collaborators
-      })
-      wrapper.find(selectors.firstCollaboratorListItem).vm.$emit('onDelete')
-      await wrapper.vm.$nextTick()
-      expect(spyOnCollaboratorDeleteTrigger).toHaveBeenCalledTimes(1)
-    })
-    it('correctly passes the shared parent route to the collaborator list item', () => {
-      const wrapper = getShallowMountedWrapper({
-        user,
-        outgoingCollaborators: [{ ...Collaborators[0], indirect: true }]
-      })
-      expect(wrapper).toMatchSnapshot()
-    })
-  })
-
-  describe('current space', () => {
-    afterEach(() => {
-      mockAxios.reset()
-    })
-    it('loads space members if a space is given', () => {
-      mockAxios.request.mockImplementationOnce(() => {
-        return Promise.resolve({
-          data: { role: spaceRoleManager.name }
-        })
-      })
-
-      const spaceMock = buildSpace({
-        id: '1',
-        driveType: 'project',
-        root: {
-          permissions: [
-            {
-              roles: ['manager'],
-              grantedTo: [{ user: { id: user.uuid } }]
-            }
-          ]
-        }
-      })
-      const wrapper = getShallowMountedWrapper({
-        user,
-        spaces: [spaceMock],
-        spaceMembers: [{ id: 1 }],
-        currentUserIsMemberOfSpace: true
-      })
-      expect(wrapper.find('#space-collaborators-list').exists()).toBeTruthy()
-    })
-    it('does not load space members if no space is given', () => {
-      const wrapper = getShallowMountedWrapper({
-        user,
-        spaceMembers: [{ id: 1 }]
-      })
-
-      expect(wrapper.find('#space-collaborators-list').exists()).toBeFalsy()
-    })
-  })
-})
-
-function getResource({
-  filename = 'testFile',
-  extension = 'txt',
-  type = 'file',
-  owner = 'user0',
-  canShare = true
-}) {
-  return {
-    id: '4',
-    fileId: '4',
-    icon: type,
-    name: type === 'file' ? `${filename}.${extension}` : filename,
-    extension: extension,
-    path: type === 'file' ? `/${filename}.${extension}` : `/${filename}`,
-    type,
-    isFolder: type === 'folder',
-    mdate: 'Mon, 12 Jul 2021 11:04:33 GMT',
-    size: '163',
-    indicators: [],
-    permissions: 'RDNVW',
-    starred: false,
-    etag: '"89128c0e8122002db57bd19c9ec33004"',
-    shareTypes: [],
-    downloadURL: '',
-    ownerDisplayName: owner.displayname,
-    ownerId: owner.id,
-    canDownload: () => true,
-    isReceivedShare: () => true,
-    canBeDeleted: () => true,
-    canRename: () => true,
-    canShare: () => canShare,
-    canDeny: () => false
-  }
-}
-
-const storeOptions = (data) => {
-  const {
-    user,
-    outgoingCollaborators = [],
-    incomingCollaborators = [],
-    canShare = true,
-    spaces = [],
-    spaceMembers = []
-  } = data
-  return {
-    actions: {
-      createModal: jest.fn(),
-      hideModal: jest.fn(),
-      showMessage: jest.fn()
-    },
-    state: {
-      user
-    },
-    modules: {
-      Files: {
-        state: {
-          incomingShares: incomingCollaborators,
-          sharesTree: { [Collaborators[0].path]: [Collaborators[0]] }
-        },
-        namespaced: true,
-        getters: {
-          highlightedFile: () => {
-            return getResource({ filename: 'testfile', extension: 'jpg', type: 'file', canShare })
-          },
-          currentFileOutgoingCollaborators: () => outgoingCollaborators,
-          sharesTreeLoading: () => false
-        },
-        actions: {
-          loadSharesTree: jest.fn(),
-          deleteShare: jest.fn()
-        },
-        mutations: {
-          SET_HIGHLIGHTED_FILE(state, file) {
-            const newFile = getResource(file)
-            state.highlightedFile = newFile
-          }
-        }
-      },
-      runtime: {
-        namespaced: true,
-        modules: {
-          auth: {
-            namespaced: true,
-            getters: {
-              accessToken: () => 'GFwHKXdsMgoFwt'
-            }
-          },
-          spaces: {
-            namespaced: true,
-            state: { spaces },
-            getters: {
-              spaceMembers: () => spaceMembers
-            }
-          }
-        }
-      }
-    },
-    getters: {
-      configuration: jest.fn(() => ({
-        options: {
-          sidebar: {
-            shares: {
-              showAllOnLoad: false
-            }
-          }
-        },
-        server: 'http://example.com/'
-      })),
-      user: () => user,
-      capabilities: () => {
-        return {
-          files_sharing: {
-            user: {
-              expire_date: {
-                enabled: true,
-                days: 10
-              }
-            },
-            group: {
-              expire_date: {
-                enabled: true,
-                days: 10
-              }
-            }
-          }
-        }
-      }
-    }
-  }
-}
-
-function getMountedWrapper(data) {
-  routerComposables.useRouteParam.mockReturnValue(() => storageId)
-
-  return mount(FileShares, {
-    localVue,
-    provide: {
-      incomingParentShare: {}
-    },
-    setup: () => ({
-      currentStorageId: storageId
-    }),
-    store: createStore(data),
-    stubs: {
-      ...stubs,
-      'oc-button': false
-    },
-    mocks: {
-      $router: {
-        currentRoute: { name: 'some-route' },
-        resolve: (r) => {
-          return {
-            href: r.name
-          }
-        }
-      }
-    }
-  })
-}
-
-function getShallowMountedWrapper(data, loading = false) {
-  reactivityComposables.useDebouncedRef.mockImplementationOnce(() => loading)
-  routerComposables.useRouteParam.mockReturnValue(() => storageId)
-  const { spaces = [], currentUserIsMemberOfSpace } = data
-
-  return shallowMount(FileShares, {
-    localVue,
-    setup: () => ({
-      currentStorageId: storageId,
-      hasResharing: false,
-      currentUserIsMemberOfSpace
-    }),
-    provide: {
-      incomingParentShare: {}
-    },
-    store: createStore(data),
-    stubs: {
-      ...stubs,
-      'oc-button': true
-    },
-    propsData: {
-      space: spaces.length ? spaces[0] : null
-    },
-    mocks: {
-      $router: {
-        currentRoute: { name: 'some-route' },
-        resolve: (r) => {
-          return {
-            href: r.name
-          }
-        }
-      }
-    }
-  })
-}
-
-function createStore(data) {
-  return new Vuex.Store(storeOptions(data))
-}
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/FileShares.spec.ts b/packages/web-app-files/tests/unit/components/SideBar/Shares/FileShares.spec.ts
new file mode 100644
index 00000000000..2e2477e6cd8
--- /dev/null
+++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/FileShares.spec.ts
@@ -0,0 +1,224 @@
+import { mount, shallowMount } from '@vue/test-utils'
+import Vuex from 'vuex'
+import FileShares from 'web-app-files/src/components/SideBar/Shares/FileShares.vue'
+import { defaultStubs } from 'web-test-helpers/src/mocks/defaultStubs'
+import { defaultStoreMockOptions } from 'web-test-helpers/src/mocks/store/defaultStoreMockOptions'
+import { defaultComponentMocks } from 'web-test-helpers/src/mocks/defaultComponentMocks'
+import { mockDeep } from 'jest-mock-extended'
+import { Resource } from 'web-client'
+import { SpaceResource } from 'web-client/src/helpers'
+import { defaultLocalVue } from 'web-test-helpers/src/localVue/defaultLocalVue'
+import { v4 as uuidV4 } from 'uuid'
+import { Share, ShareTypes } from 'web-client/src/helpers/share'
+
+const localVue = defaultLocalVue()
+
+const getCollaborator = () => ({
+  shareType: 0,
+  id: uuidV4(),
+  collaborator: {
+    name: 'einstein',
+    displayName: 'Albert Einstein',
+    additionalInfo: 'einstein@example.org'
+  },
+  owner: {
+    name: 'admin',
+    displayName: 'Admin',
+    additionalInfo: 'admin@example.org'
+  },
+  fileOwner: {
+    name: 'admin',
+    displayName: 'Admin',
+    additionalInfo: 'admin@example.org'
+  },
+  file: {},
+  stime: '1639152810',
+  permissions: 15,
+  path: "/Neuer Ordner-'singe'",
+  key: 'collaborator-f5c28709-b921-4ec8-b39a-4c243709b514'
+})
+
+describe('FileShares', () => {
+  describe('invite collaborator form', () => {
+    it('renders the form when the resource can be shared', () => {
+      const resource = mockDeep<Resource>({ isReceivedShare: () => false, canShare: () => true })
+      const wrapper = getWrapper({ resource })
+      expect(wrapper.find('invite-collaborator-form-stub').exists()).toBeTruthy()
+    })
+    it('does not render the form when the resource can not be shared', () => {
+      const resource = mockDeep<Resource>({ isReceivedShare: () => false, canShare: () => false })
+      const wrapper = getWrapper({ resource })
+      expect(wrapper.find('invite-collaborator-form-stub').exists()).toBeFalsy()
+    })
+    it('does render the form when the resource is a received share and re-sharing is enabled', () => {
+      const resource = mockDeep<Resource>({ isReceivedShare: () => true, canShare: () => true })
+      const wrapper = getWrapper({ resource })
+      expect(wrapper.find('invite-collaborator-form-stub').exists()).toBeTruthy()
+    })
+    it('does not render the form when the resource is a received share and re-sharing is disabled', () => {
+      const resource = mockDeep<Resource>({ isReceivedShare: () => true, canShare: () => true })
+      const wrapper = getWrapper({ resource, hasReSharing: false })
+      expect(wrapper.find('invite-collaborator-form-stub').exists()).toBeFalsy()
+    })
+  })
+
+  describe('collaborators list', () => {
+    const collaborators = [
+      getCollaborator(),
+      getCollaborator(),
+      getCollaborator(),
+      getCollaborator()
+    ]
+
+    it('renders sharedWithLabel and sharee list', () => {
+      const wrapper = getWrapper({ collaborators })
+      expect(wrapper.find('#files-collaborators-list').exists()).toBeTruthy()
+      expect(wrapper.findAll('#files-collaborators-list li').length).toBe(collaborators.length)
+      expect(wrapper).toMatchSnapshot()
+    })
+    it('reacts on delete events', async () => {
+      const spyOnCollaboratorDeleteTrigger = jest
+        .spyOn((FileShares as any).methods, '$_ocCollaborators_deleteShare_trigger')
+        .mockImplementation()
+      const wrapper = getWrapper({ collaborators })
+      wrapper.find('collaborator-list-item-stub').vm.$emit('onDelete')
+      await wrapper.vm.$nextTick()
+      expect(spyOnCollaboratorDeleteTrigger).toHaveBeenCalledTimes(1)
+    })
+    it('correctly passes the shared parent route to the collaborator list item', () => {
+      const indirectCollaborator = { ...getCollaborator(), indirect: true }
+      const sharesTree = { [indirectCollaborator.path]: {} }
+      const wrapper = getWrapper({ collaborators: [indirectCollaborator], sharesTree })
+      expect(wrapper.find('collaborator-list-item-stub').props().sharedParentRoute).toBeDefined()
+      expect(wrapper).toMatchSnapshot()
+    })
+    it('lists indirect outgoing shares', () => {
+      const parentPath = '/parent'
+      const resource = mockDeep<Resource>({ path: `${parentPath}/child` })
+      const sharesTree = {
+        [parentPath]: [
+          mockDeep<Share>({
+            outgoing: true,
+            shareType: ShareTypes.user.value,
+            ...getCollaborator()
+          })
+        ]
+      }
+      const wrapper = getWrapper({ sharesTree, resource })
+      expect(wrapper.find('collaborator-list-item-stub').props().sharedParentRoute).toBeDefined()
+    })
+    it('toggles the share list', async () => {
+      const showAllOnLoad = true
+      const wrapper = getWrapper({ mountType: mount, collaborators })
+      expect(wrapper.vm.sharesListCollapsed).toBe(!showAllOnLoad)
+      await wrapper.find('.toggle-shares-list-btn').trigger('click')
+      expect(wrapper.vm.sharesListCollapsed).toBe(showAllOnLoad)
+    })
+  })
+
+  describe('current space', () => {
+    it('loads space members if a space is given and the current user is member', () => {
+      const user = { id: '1' }
+      const space = mockDeep<SpaceResource>({ driveType: 'project' })
+      const spaceMembers = [{ collaborator: { name: user.id } }, { collaborator: { name: '2' } }]
+      const collaborator = getCollaborator()
+      collaborator.collaborator = { ...collaborator.collaborator, name: user.id }
+      const wrapper = getWrapper({ space, collaborators: [collaborator], user, spaceMembers })
+      expect(wrapper.find('#space-collaborators-list').exists()).toBeTruthy()
+      expect(wrapper.findAll('#space-collaborators-list li').length).toBe(spaceMembers.length)
+      expect(wrapper).toMatchSnapshot()
+    })
+    it('does not load space members if a space is given but the current user not a member', () => {
+      const user = { id: '1' }
+      const space = mockDeep<SpaceResource>({ driveType: 'project' })
+      const spaceMembers = [{ collaborator: { name: `${user}-2` } }]
+      const collaborator = getCollaborator()
+      collaborator.collaborator = { ...collaborator.collaborator, name: user.id }
+      const wrapper = getWrapper({ space, collaborators: [collaborator], user, spaceMembers })
+      expect(wrapper.find('#space-collaborators-list').exists()).toBeFalsy()
+    })
+  })
+
+  describe('"$_ocCollaborators_deleteShare" method', () => {
+    it('calls "deleteShare" when successful', async () => {
+      const wrapper = getWrapper()
+      const deleteShareSpy = jest.spyOn(wrapper.vm, 'deleteShare')
+      const share = mockDeep<Share>()
+      await wrapper.vm.$_ocCollaborators_deleteShare(share)
+      expect(deleteShareSpy).toHaveBeenCalled()
+    })
+    it('shows a message when an error occurs', async () => {
+      jest.spyOn(console, 'error').mockImplementation(() => undefined)
+      const wrapper = getWrapper()
+      jest.spyOn(wrapper.vm, 'deleteShare').mockRejectedValue(new Error())
+      const showMessageSpy = jest.spyOn(wrapper.vm, 'showMessage')
+      const share = mockDeep<Share>()
+      await wrapper.vm.$_ocCollaborators_deleteShare(share)
+      expect(showMessageSpy).toHaveBeenCalled()
+    })
+    it('removes file when the last share on the "Shared with others"-page has been removed', async () => {
+      const wrapper = getWrapper({
+        collaborators: [getCollaborator()],
+        currentRouteName: 'files-shares-with-others'
+      })
+      const deleteShareSpy = jest.spyOn(wrapper.vm, 'deleteShare')
+      const removeFilesSpy = jest.spyOn(wrapper.vm, 'REMOVE_FILES')
+      const share = mockDeep<Share>()
+      await wrapper.vm.$_ocCollaborators_deleteShare(share)
+      expect(deleteShareSpy).toHaveBeenCalled()
+      expect(removeFilesSpy).toHaveBeenCalled()
+    })
+  })
+})
+
+function getWrapper({
+  mountType = shallowMount,
+  resource = mockDeep<Resource>({ isReceivedShare: () => false, canShare: () => true }),
+  hasReSharing = true,
+  space = mockDeep<SpaceResource>(),
+  collaborators = [],
+  sharesTree = {},
+  spaceMembers = [],
+  user = { id: '1' },
+  showAllOnLoad = true,
+  currentRouteName = 'files-spaces-generic'
+} = {}) {
+  const storeOptions = {
+    ...defaultStoreMockOptions,
+    state: { user },
+    getters: {
+      ...defaultStoreMockOptions.getters,
+      user: () => user,
+      capabilities: jest.fn(() => ({
+        files_sharing: { resharing: hasReSharing }
+      })),
+      configuration: jest.fn(() => ({
+        options: { contextHelpers: true, sidebar: { shares: { showAllOnLoad } } }
+      }))
+    }
+  }
+  storeOptions.modules.Files.state.sharesTree = sharesTree
+  storeOptions.modules.runtime.modules.spaces.getters.spaceMembers.mockImplementation(
+    () => spaceMembers
+  )
+  storeOptions.modules.Files.getters.highlightedFile.mockImplementation(() => resource)
+  storeOptions.modules.Files.getters.currentFileOutgoingCollaborators.mockImplementation(
+    () => collaborators
+  )
+  const store = new Vuex.Store(storeOptions)
+  return mountType(FileShares, {
+    localVue,
+    provide: {
+      incomingParentShare: {}
+    },
+    store,
+    stubs: {
+      ...defaultStubs,
+      'oc-button': false,
+      'invite-collaborator-form': true,
+      'collaborator-list-item': true
+    },
+    propsData: { space },
+    mocks: defaultComponentMocks({ currentRoute: { name: currentRouteName } })
+  })
+}
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/SpaceMembers.spec.js b/packages/web-app-files/tests/unit/components/SideBar/Shares/SpaceMembers.spec.js
deleted file mode 100644
index 8d1bd3408cf..00000000000
--- a/packages/web-app-files/tests/unit/components/SideBar/Shares/SpaceMembers.spec.js
+++ /dev/null
@@ -1,256 +0,0 @@
-import SpaceMembers from 'web-app-files/src/components/SideBar/Shares/SpaceMembers.vue'
-import { createLocalVue, mount, shallowMount } from '@vue/test-utils'
-import GetTextPlugin from 'vue-gettext'
-import Vuex from 'vuex'
-import DesignSystem from 'owncloud-design-system'
-import Users from '@/__fixtures__/users'
-import { spaceRoleManager, spaceRoleViewer, ShareTypes } from 'web-client/src/helpers/share'
-import VueCompositionAPI from '@vue/composition-api'
-
-const localVue = createLocalVue()
-localVue.use(DesignSystem)
-localVue.use(Vuex)
-localVue.use(VueCompositionAPI)
-localVue.use(GetTextPlugin, {
-  translations: 'does-not-matter.json',
-  silent: true
-})
-
-const user = Users.alice
-const spaceMock = {
-  type: 'space',
-  name: ' space',
-  id: '1',
-  mdate: 'Wed, 21 Oct 2015 07:28:00 GMT',
-  spaceQuota: {
-    used: 100,
-    total: 1000
-  }
-}
-
-const spaceMembers = [
-  {
-    id: '1',
-    shareType: ShareTypes.space.value,
-    collaborator: {
-      name: user.id,
-      displayName: user.displayname
-    },
-    role: {
-      name: spaceRoleManager.name
-    }
-  },
-  {
-    id: '2',
-    shareType: ShareTypes.space.value,
-    collaborator: {
-      onPremisesSamAccountName: 'Einstein',
-      displayName: 'einstein'
-    },
-    role: {
-      name: spaceRoleViewer.name
-    }
-  },
-  {
-    id: '3',
-    shareType: ShareTypes.space.value,
-    collaborator: {
-      onPremisesSamAccountName: 'Marie',
-      displayName: 'marie'
-    },
-    role: {
-      name: spaceRoleManager.name
-    }
-  }
-]
-
-describe('SpaceMembers', () => {
-  it('renders loading spinner while loading', () => {
-    const wrapper = getShallowMountedWrapper(
-      {
-        user
-      },
-      true
-    )
-    expect(wrapper).toMatchSnapshot()
-  })
-  describe('if currentUser can share', () => {
-    it('initially renders add people dialog', () => {
-      const wrapper = getShallowMountedWrapper({
-        user,
-        spaceMembers: [spaceMembers[0]]
-      })
-      expect(wrapper).toMatchSnapshot()
-    })
-  })
-
-  describe('if currentUser can not share', () => {
-    it('other shares are listed, but creating/editing shares is not possible', () => {
-      const wrapper = getShallowMountedWrapper({
-        user,
-        spaceMembers: [spaceMembers[1]]
-      })
-      expect(wrapper).toMatchSnapshot()
-    })
-  })
-
-  describe('if currentUser is manager', () => {
-    it('allows role edit of the current user if another user is manager', () => {
-      const wrapper = getShallowMountedWrapper({
-        user,
-        spaceMembers
-      })
-      expect(wrapper).toMatchSnapshot()
-    })
-    it('does not allow role edit of the current user if they are the only manager', () => {
-      const wrapper = getShallowMountedWrapper({
-        user,
-        spaceMembers: [spaceMembers[0], spaceMembers[1]]
-      })
-      expect(wrapper).toMatchSnapshot()
-    })
-  })
-
-  describe('if currentUser can delete', () => {
-    it('reacts on delete events by collaborator list items', async () => {
-      const wrapper = getMountedWrapper({
-        user,
-        spaceMembers
-      })
-
-      const spyOnCollaboratorDeleteTrigger = jest.spyOn(
-        wrapper.vm,
-        '$_ocCollaborators_deleteShare_trigger'
-      )
-      wrapper
-        .find(`div[data-testid="collaborator-user-item-${spaceMembers[0].collaborator.name}"]`)
-        .vm.$emit('onDelete')
-      await wrapper.vm.$nextTick()
-      expect(spyOnCollaboratorDeleteTrigger).toHaveBeenCalledTimes(1)
-    })
-  })
-})
-
-const storeOptions = (data, isInLoadingState) => {
-  const { user, spaceMembers = [] } = data
-
-  return {
-    actions: {
-      createModal: jest.fn(),
-      hideModal: jest.fn(),
-      showMessage: jest.fn()
-    },
-    state: {
-      user
-    },
-    modules: {
-      Files: {
-        namespaced: true,
-        getters: {
-          highlightedFile: () => spaceMock,
-          sharesTreeLoading: () => false
-        },
-        actions: {
-          deleteShare: jest.fn()
-        },
-        mutations: {
-          SET_HIGHLIGHTED_FILE(state, file) {
-            state.highlightedFile = spaceMock
-          }
-        }
-      },
-      runtime: {
-        namespaced: true,
-        modules: {
-          spaces: {
-            namespaced: true,
-            getters: {
-              spaceMembers: () => spaceMembers
-            }
-          }
-        }
-      }
-    },
-    getters: {
-      configuration: jest.fn(() => ({
-        server: 'http://example.com/',
-        currentTheme: {
-          general: {
-            name: 'some-company'
-          }
-        }
-      })),
-      user: () => user,
-      capabilities: () => {
-        return {
-          files_sharing: {
-            user: {
-              expire_date: {
-                enabled: true,
-                days: 10
-              }
-            },
-            group: {
-              expire_date: {
-                enabled: true,
-                days: 10
-              }
-            }
-          }
-        }
-      }
-    }
-  }
-}
-
-function getShallowMountedWrapper(data, loading = false) {
-  return shallowMount(SpaceMembers, {
-    localVue,
-    store: createStore(data, loading),
-    stubs: {
-      'oc-button': true,
-      'oc-icon': true,
-      'oc-spinner': true
-    },
-    provide: {
-      displayedItem: {
-        value: spaceMock
-      }
-    }
-  })
-}
-
-function getMountedWrapper(data, loading = false) {
-  return mount(SpaceMembers, {
-    localVue,
-    store: createStore(data, loading),
-    stubs: {
-      'oc-button': true,
-      'oc-icon': true,
-      'oc-spinner': true,
-      'avatar-image': true,
-      'role-dropdown': true,
-      'edit-dropdown': true
-    },
-    mocks: {
-      $router: {
-        go: jest.fn(),
-        push: jest.fn(),
-        currentRoute: {
-          name: 'some-route',
-          query: { page: 1 }
-        },
-        resolve: (r) => ({ href: r.name })
-      }
-    },
-    provide: {
-      displayedItem: {
-        value: spaceMock
-      }
-    }
-  })
-}
-
-function createStore(data, loading) {
-  return new Vuex.Store(storeOptions(data, loading))
-}
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/SpaceMembers.spec.ts b/packages/web-app-files/tests/unit/components/SideBar/Shares/SpaceMembers.spec.ts
new file mode 100644
index 00000000000..8dd6bca6279
--- /dev/null
+++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/SpaceMembers.spec.ts
@@ -0,0 +1,192 @@
+import SpaceMembers from 'web-app-files/src/components/SideBar/Shares/SpaceMembers.vue'
+import { mount, shallowMount } from '@vue/test-utils'
+import Vuex from 'vuex'
+import {
+  spaceRoleManager,
+  spaceRoleViewer,
+  ShareTypes,
+  spaceRoleEditor,
+  Share
+} from 'web-client/src/helpers/share'
+import { mockDeep } from 'jest-mock-extended'
+import { defaultLocalVue } from 'web-test-helpers/src/localVue/defaultLocalVue'
+import { defaultStoreMockOptions } from 'web-test-helpers/src/mocks/store/defaultStoreMockOptions'
+import { SpaceResource, User } from 'web-client/src/helpers'
+import { defaultComponentMocks } from 'web-test-helpers/src/mocks/defaultComponentMocks'
+
+const localVue = defaultLocalVue()
+
+const memberMocks = {
+  [spaceRoleManager.name]: {
+    id: '1',
+    shareType: ShareTypes.space.value,
+    collaborator: {
+      name: 'alice',
+      displayName: 'alice'
+    },
+    role: {
+      name: spaceRoleManager.name
+    }
+  },
+  [spaceRoleEditor.name]: {
+    id: '2',
+    shareType: ShareTypes.space.value,
+    collaborator: {
+      onPremisesSamAccountName: 'Einstein',
+      displayName: 'einstein'
+    },
+    role: {
+      name: spaceRoleEditor.name
+    }
+  },
+  [spaceRoleViewer.name]: {
+    id: '3',
+    shareType: ShareTypes.space.value,
+    collaborator: {
+      onPremisesSamAccountName: 'Marie',
+      displayName: 'marie'
+    },
+    role: {
+      name: spaceRoleViewer.name
+    }
+  }
+}
+
+describe('SpaceMembers', () => {
+  describe('invite collaborator form', () => {
+    it('renders the form when the current user is a manager of the space', () => {
+      const user = mockDeep<User>({ id: memberMocks.manager.collaborator.name })
+      const wrapper = getWrapper({ user })
+      expect(wrapper.find('invite-collaborator-form-stub').exists()).toBeTruthy()
+      expect(wrapper).toMatchSnapshot()
+    })
+    it.each([spaceRoleViewer.name, spaceRoleEditor.name])(
+      'does not render the form when the current user is no manager of the space',
+      (role) => {
+        const user = mockDeep<User>({ id: memberMocks[role].collaborator.name })
+        const wrapper = getWrapper({ user })
+        expect(wrapper.find('invite-collaborator-form-stub').exists()).toBeFalsy()
+      }
+    )
+  })
+
+  describe('existing members', () => {
+    it('can edit when current user is manager of the space', () => {
+      const user = mockDeep<User>({ id: memberMocks.manager.collaborator.name })
+      const wrapper = getWrapper({ user })
+      expect(wrapper.findAll('collaborator-list-item-stub').at(1).props().modifiable).toEqual(true)
+      expect(wrapper).toMatchSnapshot()
+    })
+    it.each([spaceRoleViewer.name, spaceRoleEditor.name])(
+      'can not edit when current user is not a manager of the space',
+      (role) => {
+        const user = mockDeep<User>({ id: memberMocks[role].collaborator.name })
+        const wrapper = getWrapper({ user })
+        expect(wrapper.findAll('collaborator-list-item-stub').at(1).props().modifiable).toEqual(
+          false
+        )
+      }
+    )
+  })
+
+  describe('deleting members', () => {
+    it('reacts on delete events by collaborator list items', async () => {
+      const spyOnCollaboratorDeleteTrigger = jest.spyOn(
+        (SpaceMembers as any).methods,
+        '$_ocCollaborators_deleteShare_trigger'
+      )
+
+      const user = mockDeep<User>({ id: memberMocks.manager.collaborator.name })
+      const wrapper = getWrapper({ user })
+      wrapper.find('collaborator-list-item-stub').vm.$emit('onDelete')
+      await wrapper.vm.$nextTick()
+      expect(spyOnCollaboratorDeleteTrigger).toHaveBeenCalledTimes(1)
+    })
+    it('calls "deleteSpaceMember" when successful', async () => {
+      const wrapper = getWrapper()
+      const deleteSpaceMemberSpy = jest.spyOn(wrapper.vm, 'deleteSpaceMember')
+      const share = mockDeep<Share>()
+      await wrapper.vm.$_ocCollaborators_deleteShare(share)
+      expect(deleteSpaceMemberSpy).toHaveBeenCalled()
+    })
+    it('shows a message when an error occurs', async () => {
+      jest.spyOn(console, 'error').mockImplementation(() => undefined)
+      const wrapper = getWrapper()
+      jest.spyOn(wrapper.vm, 'deleteSpaceMember').mockRejectedValue(new Error())
+      const showMessageSpy = jest.spyOn(wrapper.vm, 'showMessage')
+      const share = mockDeep<Share>()
+      await wrapper.vm.$_ocCollaborators_deleteShare(share)
+      expect(showMessageSpy).toHaveBeenCalled()
+    })
+    it('redirects to the "files-spaces-projects"-page when the current user has been removed', async () => {
+      const user = mockDeep<User>({ id: memberMocks.manager.collaborator.name })
+      const wrapper = getWrapper({ user })
+      jest.spyOn(wrapper.vm, 'deleteSpaceMember')
+      await wrapper.vm.$_ocCollaborators_deleteShare(memberMocks.manager)
+      expect(wrapper.vm.$router.push).toHaveBeenCalled()
+    })
+    it('refreshes the page when the current user has been removed on the "files-spaces-projects"-page', async () => {
+      const user = mockDeep<User>({ id: memberMocks.manager.collaborator.name })
+      const wrapper = getWrapper({ user, currentRouteName: 'files-spaces-projects' })
+      jest.spyOn(wrapper.vm, 'deleteSpaceMember')
+      await wrapper.vm.$_ocCollaborators_deleteShare(memberMocks.manager)
+      expect(wrapper.vm.$router.go).toHaveBeenCalled()
+    })
+  })
+
+  describe('filter', () => {
+    it('toggles the filter on click', async () => {
+      const user = mockDeep<User>({ id: memberMocks.manager.collaborator.name })
+      const wrapper = getWrapper({ mountType: mount, user })
+      expect(wrapper.vm.isFilterOpen).toBeFalsy()
+      await wrapper.find('.open-filter-btn').trigger('click')
+      expect(wrapper.vm.isFilterOpen).toBeTruthy()
+      expect(wrapper).toMatchSnapshot()
+    })
+  })
+})
+
+function getWrapper({
+  mountType = shallowMount,
+  space = mockDeep<SpaceResource>(),
+  spaceMembers = [memberMocks.manager, memberMocks.editor, memberMocks.viewer],
+  user = mockDeep<User>(),
+  currentRouteName = 'files-spaces-generic'
+} = {}) {
+  const storeOptions = {
+    ...defaultStoreMockOptions,
+    state: { user },
+    getters: {
+      ...defaultStoreMockOptions.getters,
+      user: () => user,
+      configuration: jest.fn(() => ({
+        options: { contextHelpers: true, sidebar: { shares: { showAllOnLoad: true } } }
+      }))
+    }
+  }
+  storeOptions.modules.runtime.modules.spaces.getters.spaceMembers.mockImplementation(
+    () => spaceMembers
+  )
+  storeOptions.modules.Files.getters.highlightedFile.mockImplementation(() => space)
+  const store = new Vuex.Store(storeOptions)
+  return mountType(SpaceMembers, {
+    localVue,
+    store,
+    mocks: defaultComponentMocks({ currentRoute: { name: currentRouteName } }),
+    stubs: {
+      'oc-button': false,
+      'oc-icon': true,
+      'oc-spinner': true,
+      'avatar-image': true,
+      'role-dropdown': true,
+      'edit-dropdown': true,
+      'invite-collaborator-form': true,
+      'collaborator-list-item': true
+    },
+    provide: {
+      displayedItem: {
+        value: space
+      }
+    }
+  })
+}
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/__snapshots__/FileShares.spec.js.snap b/packages/web-app-files/tests/unit/components/SideBar/Shares/__snapshots__/FileShares.spec.js.snap
deleted file mode 100644
index 711a9d915e2..00000000000
--- a/packages/web-app-files/tests/unit/components/SideBar/Shares/__snapshots__/FileShares.spec.js.snap
+++ /dev/null
@@ -1,96 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`FileShares if currentUser can not share initially renders no share permission message 1`] = `
-<div id="oc-files-sharing-sidebar" class="oc-position-relative">
-  <div class="oc-flex">
-    <h3 class="oc-text-bold oc-text-medium oc-m-rm" data-msgid="Share with people" data-current-language="en_US">Share with people</h3>
-    <!---->
-  </div>
-  <p data-testid="files-collaborators-no-reshare-permissions-message">You don't have permission to share this file.</p>
-  <!---->
-  <!---->
-  <!---->
-</div>
-`;
-
-exports[`FileShares if currentUser can share initially renders add people dialog 1`] = `
-<div id="oc-files-sharing-sidebar" class="oc-position-relative">
-  <div class="oc-flex">
-    <h3 class="oc-text-bold oc-text-medium oc-m-rm" data-msgid="Share with people" data-current-language="en_US">Share with people</h3>
-    <!---->
-  </div>
-  <p data-testid="files-collaborators-no-reshare-permissions-message">You don't have permission to share this file.</p>
-  <!---->
-  <!---->
-  <!---->
-</div>
-`;
-
-exports[`FileShares if there are collaborators present correctly passes the shared parent route to the collaborator list item 1`] = `
-<div id="oc-files-sharing-sidebar" class="oc-position-relative">
-  <div class="oc-flex">
-    <h3 class="oc-text-bold oc-text-medium oc-m-rm" data-msgid="Share with people" data-current-language="en_US">Share with people</h3>
-    <!---->
-  </div>
-  <p data-testid="files-collaborators-no-reshare-permissions-message">You don't have permission to share this file.</p>
-  <div class="avatars-wrapper oc-flex oc-flex-middle oc-flex-between">
-    <h4 class="oc-text-bold oc-my-rm">Shared with</h4>
-  </div>
-  <ul id="files-collaborators-list" aria-label="Share receivers" class="oc-list oc-list-divider oc-overflow-hidden oc-m-rm">
-    <li>
-      <collaborator-list-item-stub share="[object Object]"></collaborator-list-item-stub>
-    </li>
-  </ul>
-  <!---->
-  <!---->
-</div>
-`;
-
-exports[`FileShares if there are collaborators present renders sharedWithLabel and sharee list 1`] = `
-<div id="oc-files-sharing-sidebar" class="oc-position-relative">
-  <div class="oc-flex">
-    <h3 class="oc-text-bold oc-text-medium oc-m-rm" data-msgid="Share with people" data-current-language="en_US">Share with people</h3>
-    <!---->
-  </div>
-  <p data-testid="files-collaborators-no-reshare-permissions-message">You don't have permission to share this file.</p>
-  <div class="avatars-wrapper oc-flex oc-flex-middle oc-flex-between">
-    <h4 class="oc-text-bold oc-my-rm">Shared with</h4>
-  </div>
-  <ul id="files-collaborators-list" aria-label="Share receivers" class="oc-list oc-list-divider oc-overflow-hidden oc-m-rm">
-    <li>
-      <collaborator-list-item-stub share="[object Object]" modifiable="true"></collaborator-list-item-stub>
-    </li>
-    <li>
-      <collaborator-list-item-stub share="[object Object]" modifiable="true"></collaborator-list-item-stub>
-    </li>
-  </ul>
-  <!---->
-  <!---->
-</div>
-`;
-
-exports[`FileShares if there are no collaborators does not render avatar wrapper or collaborator list 1`] = `
-<div id="oc-files-sharing-sidebar" class="oc-position-relative">
-  <div class="oc-flex">
-    <h3 class="oc-text-bold oc-text-medium oc-m-rm" data-msgid="Share with people" data-current-language="en_US">Share with people</h3>
-    <!---->
-  </div>
-  <p data-testid="files-collaborators-no-reshare-permissions-message">You don't have permission to share this file.</p>
-  <!---->
-  <!---->
-  <!---->
-</div>
-`;
-
-exports[`FileShares renders loading spinner while loading 1`] = `
-<div id="oc-files-sharing-sidebar" class="oc-position-relative">
-  <div class="oc-flex">
-    <h3 class="oc-text-bold oc-text-medium oc-m-rm" data-msgid="Share with people" data-current-language="en_US">Share with people</h3>
-    <!---->
-  </div>
-  <p data-testid="files-collaborators-no-reshare-permissions-message">You don't have permission to share this file.</p>
-  <!---->
-  <!---->
-  <!---->
-</div>
-`;
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/__snapshots__/FileShares.spec.ts.snap b/packages/web-app-files/tests/unit/components/SideBar/Shares/__snapshots__/FileShares.spec.ts.snap
new file mode 100644
index 00000000000..ee3851f85cc
--- /dev/null
+++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/__snapshots__/FileShares.spec.ts.snap
@@ -0,0 +1,81 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`FileShares collaborators list correctly passes the shared parent route to the collaborator list item 1`] = `
+<div id="oc-files-sharing-sidebar" class="oc-position-relative">
+  <div class="oc-flex">
+    <h3 class="oc-text-bold oc-text-medium oc-m-rm">Share with people</h3>
+    <oc-contextual-helper-stub title="Invite specific people" text="Enter a name or group to share this item." list="[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]" endtext="" readmorelink="https://doc.owncloud.com/webui/next/owncloud_web/web_for_users.html#sharing" class="oc-pl-xs"></oc-contextual-helper-stub>
+  </div>
+  <invite-collaborator-form-stub savebuttonlabel="Share" invitelabel="" class="oc-my-s"></invite-collaborator-form-stub>
+  <div class="avatars-wrapper oc-flex oc-flex-middle oc-flex-between">
+    <h4 class="oc-text-bold oc-my-rm">Shared with</h4>
+  </div>
+  <ul id="files-collaborators-list" aria-label="Share receivers" class="oc-list oc-list-divider oc-overflow-hidden oc-m-rm">
+    <li>
+      <collaborator-list-item-stub share="[object Object]" sharedparentroute="[object Object]"></collaborator-list-item-stub>
+    </li>
+  </ul>
+  <!---->
+  <!---->
+</div>
+`;
+
+exports[`FileShares collaborators list renders sharedWithLabel and sharee list 1`] = `
+<div id="oc-files-sharing-sidebar" class="oc-position-relative">
+  <div class="oc-flex">
+    <h3 class="oc-text-bold oc-text-medium oc-m-rm">Share with people</h3>
+    <oc-contextual-helper-stub title="Invite specific people" text="Enter a name or group to share this item." list="[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]" endtext="" readmorelink="https://doc.owncloud.com/webui/next/owncloud_web/web_for_users.html#sharing" class="oc-pl-xs"></oc-contextual-helper-stub>
+  </div>
+  <invite-collaborator-form-stub savebuttonlabel="Share" invitelabel="" class="oc-my-s"></invite-collaborator-form-stub>
+  <div class="avatars-wrapper oc-flex oc-flex-middle oc-flex-between">
+    <h4 class="oc-text-bold oc-my-rm">Shared with</h4>
+  </div>
+  <ul id="files-collaborators-list" aria-label="Share receivers" class="oc-list oc-list-divider oc-overflow-hidden oc-m-rm">
+    <li>
+      <collaborator-list-item-stub share="[object Object]" modifiable="true"></collaborator-list-item-stub>
+    </li>
+    <li>
+      <collaborator-list-item-stub share="[object Object]" modifiable="true"></collaborator-list-item-stub>
+    </li>
+    <li>
+      <collaborator-list-item-stub share="[object Object]" modifiable="true"></collaborator-list-item-stub>
+    </li>
+    <li>
+      <collaborator-list-item-stub share="[object Object]" modifiable="true"></collaborator-list-item-stub>
+    </li>
+  </ul>
+  <div class="oc-flex oc-flex-center">
+    <oc-button-stub type="button" size="medium" submit="button" variation="passive" appearance="raw" justifycontent="center" gapsize="medium" class="toggle-shares-list-btn">Show less</oc-button-stub>
+  </div>
+  <!---->
+</div>
+`;
+
+exports[`FileShares current space loads space members if a space is given and the current user is member 1`] = `
+<div id="oc-files-sharing-sidebar" class="oc-position-relative">
+  <div class="oc-flex">
+    <h3 class="oc-text-bold oc-text-medium oc-m-rm">Share with people</h3>
+    <oc-contextual-helper-stub title="Invite specific people" text="Enter a name or group to share this item." list="[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]" endtext="" readmorelink="https://doc.owncloud.com/webui/next/owncloud_web/web_for_users.html#sharing" class="oc-pl-xs"></oc-contextual-helper-stub>
+  </div>
+  <invite-collaborator-form-stub savebuttonlabel="Share" invitelabel="" class="oc-my-s"></invite-collaborator-form-stub>
+  <div class="avatars-wrapper oc-flex oc-flex-middle oc-flex-between">
+    <h4 class="oc-text-bold oc-my-rm">Shared with</h4>
+  </div>
+  <ul id="files-collaborators-list" aria-label="Share receivers" class="oc-list oc-list-divider oc-overflow-hidden oc-mb-l">
+    <li>
+      <collaborator-list-item-stub share="[object Object]"></collaborator-list-item-stub>
+    </li>
+  </ul>
+  <!---->
+  <h4 class="oc-text-bold oc-my-s">Space members</h4>
+  <ul id="space-collaborators-list" aria-label="Space members" class="oc-list oc-list-divider oc-overflow-hidden oc-m-rm">
+    <li>
+      <collaborator-list-item-stub share="[object Object]"></collaborator-list-item-stub>
+    </li>
+    <li>
+      <collaborator-list-item-stub share="[object Object]"></collaborator-list-item-stub>
+    </li>
+  </ul>
+  <!---->
+</div>
+`;
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/__snapshots__/SpaceMembers.spec.js.snap b/packages/web-app-files/tests/unit/components/SideBar/Shares/__snapshots__/SpaceMembers.spec.js.snap
deleted file mode 100644
index dde9abf88d8..00000000000
--- a/packages/web-app-files/tests/unit/components/SideBar/Shares/__snapshots__/SpaceMembers.spec.js.snap
+++ /dev/null
@@ -1,116 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`SpaceMembers if currentUser can not share other shares are listed, but creating/editing shares is not possible 1`] = `
-<div id="oc-files-sharing-sidebar" class="oc-position-relative">
-  <div class="oc-flex oc-flex-between oc-flex-center oc-flex-middle">
-    <div class="oc-flex oc-py-s">
-      <h3 class="oc-text-bold oc-text-medium oc-m-rm" data-msgid="Members" data-current-language="en_US">Members</h3>
-      <!---->
-    </div>
-    <div class="oc-flex">
-      <oc-button-stub type="button" size="medium" arialabel="Filter members" submit="button" variation="passive" appearance="raw" justifycontent="center" gapsize="medium">
-        <oc-icon-stub name="search" filltype="line" accessiblelabel="" type="span" size="small" variation="passive" color=""></oc-icon-stub>
-      </oc-button-stub>
-    </div>
-  </div>
-  <!---->
-  <ul id="files-collaborators-list" aria-label="Space members" class="oc-list oc-list-divider oc-overflow-hidden oc-m-rm">
-    <li>
-      <collaborator-list-item-stub share="[object Object]"></collaborator-list-item-stub>
-    </li>
-  </ul>
-</div>
-`;
-
-exports[`SpaceMembers if currentUser can share initially renders add people dialog 1`] = `
-<div id="oc-files-sharing-sidebar" class="oc-position-relative">
-  <div class="oc-flex oc-flex-between oc-flex-center oc-flex-middle">
-    <div class="oc-flex oc-py-s">
-      <h3 class="oc-text-bold oc-text-medium oc-m-rm" data-msgid="Members" data-current-language="en_US">Members</h3>
-      <!---->
-    </div>
-    <div class="oc-flex">
-      <oc-button-stub type="button" size="medium" arialabel="Filter members" submit="button" variation="passive" appearance="raw" justifycontent="center" gapsize="medium">
-        <oc-icon-stub name="search" filltype="line" accessiblelabel="" type="span" size="small" variation="passive" color=""></oc-icon-stub>
-      </oc-button-stub>
-    </div>
-  </div>
-  <invite-collaborator-form-stub savebuttonlabel="Add" invitelabel="Add members" class="oc-my-s"></invite-collaborator-form-stub>
-  <ul id="files-collaborators-list" aria-label="Space members" class="oc-list oc-list-divider oc-overflow-hidden oc-m-rm">
-    <li>
-      <collaborator-list-item-stub share="[object Object]"></collaborator-list-item-stub>
-    </li>
-  </ul>
-</div>
-`;
-
-exports[`SpaceMembers if currentUser is manager allows role edit of the current user if another user is manager 1`] = `
-<div id="oc-files-sharing-sidebar" class="oc-position-relative">
-  <div class="oc-flex oc-flex-between oc-flex-center oc-flex-middle">
-    <div class="oc-flex oc-py-s">
-      <h3 class="oc-text-bold oc-text-medium oc-m-rm" data-msgid="Members" data-current-language="en_US">Members</h3>
-      <!---->
-    </div>
-    <div class="oc-flex">
-      <oc-button-stub type="button" size="medium" arialabel="Filter members" submit="button" variation="passive" appearance="raw" justifycontent="center" gapsize="medium">
-        <oc-icon-stub name="search" filltype="line" accessiblelabel="" type="span" size="small" variation="passive" color=""></oc-icon-stub>
-      </oc-button-stub>
-    </div>
-  </div>
-  <invite-collaborator-form-stub savebuttonlabel="Add" invitelabel="Add members" class="oc-my-s"></invite-collaborator-form-stub>
-  <ul id="files-collaborators-list" aria-label="Space members" class="oc-list oc-list-divider oc-overflow-hidden oc-m-rm">
-    <li>
-      <collaborator-list-item-stub share="[object Object]" modifiable="true"></collaborator-list-item-stub>
-    </li>
-    <li>
-      <collaborator-list-item-stub share="[object Object]" modifiable="true"></collaborator-list-item-stub>
-    </li>
-    <li>
-      <collaborator-list-item-stub share="[object Object]" modifiable="true"></collaborator-list-item-stub>
-    </li>
-  </ul>
-</div>
-`;
-
-exports[`SpaceMembers if currentUser is manager does not allow role edit of the current user if they are the only manager 1`] = `
-<div id="oc-files-sharing-sidebar" class="oc-position-relative">
-  <div class="oc-flex oc-flex-between oc-flex-center oc-flex-middle">
-    <div class="oc-flex oc-py-s">
-      <h3 class="oc-text-bold oc-text-medium oc-m-rm" data-msgid="Members" data-current-language="en_US">Members</h3>
-      <!---->
-    </div>
-    <div class="oc-flex">
-      <oc-button-stub type="button" size="medium" arialabel="Filter members" submit="button" variation="passive" appearance="raw" justifycontent="center" gapsize="medium">
-        <oc-icon-stub name="search" filltype="line" accessiblelabel="" type="span" size="small" variation="passive" color=""></oc-icon-stub>
-      </oc-button-stub>
-    </div>
-  </div>
-  <invite-collaborator-form-stub savebuttonlabel="Add" invitelabel="Add members" class="oc-my-s"></invite-collaborator-form-stub>
-  <ul id="files-collaborators-list" aria-label="Space members" class="oc-list oc-list-divider oc-overflow-hidden oc-m-rm">
-    <li>
-      <collaborator-list-item-stub share="[object Object]"></collaborator-list-item-stub>
-    </li>
-    <li>
-      <collaborator-list-item-stub share="[object Object]" modifiable="true"></collaborator-list-item-stub>
-    </li>
-  </ul>
-</div>
-`;
-
-exports[`SpaceMembers renders loading spinner while loading 1`] = `
-<div id="oc-files-sharing-sidebar" class="oc-position-relative">
-  <div class="oc-flex oc-flex-between oc-flex-center oc-flex-middle">
-    <div class="oc-flex oc-py-s">
-      <h3 class="oc-text-bold oc-text-medium oc-m-rm" data-msgid="Members" data-current-language="en_US">Members</h3>
-      <!---->
-    </div>
-    <div class="oc-flex">
-      <oc-button-stub type="button" size="medium" arialabel="Filter members" submit="button" variation="passive" appearance="raw" justifycontent="center" gapsize="medium">
-        <oc-icon-stub name="search" filltype="line" accessiblelabel="" type="span" size="small" variation="passive" color=""></oc-icon-stub>
-      </oc-button-stub>
-    </div>
-  </div>
-  <!---->
-  <!---->
-</div>
-`;
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/__snapshots__/SpaceMembers.spec.ts.snap b/packages/web-app-files/tests/unit/components/SideBar/Shares/__snapshots__/SpaceMembers.spec.ts.snap
new file mode 100644
index 00000000000..e338ab9cc4c
--- /dev/null
+++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/__snapshots__/SpaceMembers.spec.ts.snap
@@ -0,0 +1,112 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`SpaceMembers existing members can edit when current user is manager of the space 1`] = `
+<div id="oc-files-sharing-sidebar" class="oc-position-relative">
+  <div class="oc-flex oc-flex-between oc-flex-center oc-flex-middle">
+    <div class="oc-flex oc-py-s">
+      <h3 class="oc-text-bold oc-text-medium oc-m-rm">Members</h3>
+      <oc-contextual-helper-stub title="Add members to this Space" text="Enter a name to add people or groups as members to this Space." list="[object Object],[object Object],[object Object],[object Object]" endtext="" readmorelink="https://doc.owncloud.com/webui/next/owncloud_web/web_for_users.html#sharing" class="oc-pl-xs"></oc-contextual-helper-stub>
+    </div>
+    <div class="oc-flex">
+      <oc-button-stub type="button" size="medium" arialabel="Filter members" submit="button" variation="passive" appearance="raw" justifycontent="center" gapsize="medium" class="open-filter-btn">
+        <oc-icon-stub name="search" filltype="line" accessiblelabel="" type="span" size="small" variation="passive" color=""></oc-icon-stub>
+      </oc-button-stub>
+    </div>
+  </div>
+  <invite-collaborator-form-stub savebuttonlabel="Add" invitelabel="Add members" class="oc-my-s"></invite-collaborator-form-stub>
+  <ul id="files-collaborators-list" aria-label="Space members" class="oc-list oc-list-divider oc-overflow-hidden oc-m-rm">
+    <li>
+      <collaborator-list-item-stub share="[object Object]"></collaborator-list-item-stub>
+    </li>
+    <li>
+      <collaborator-list-item-stub share="[object Object]" modifiable="true"></collaborator-list-item-stub>
+    </li>
+    <li>
+      <collaborator-list-item-stub share="[object Object]" modifiable="true"></collaborator-list-item-stub>
+    </li>
+  </ul>
+</div>
+`;
+
+exports[`SpaceMembers filter toggles the filter on click 1`] = `
+<div id="oc-files-sharing-sidebar" class="oc-position-relative">
+  <div class="oc-flex oc-flex-between oc-flex-center oc-flex-middle">
+    <div class="oc-flex oc-py-s">
+      <h3 class="oc-text-bold oc-text-medium oc-m-rm">Members</h3>
+      <div class="oc-contextual-helper oc-pl-xs"><button 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="oc-contextual-helper-4-button">
+          <oc-icon-stub name="question" filltype="line" accessiblelabel="" type="span" size="small" variation="passive" color=""></oc-icon-stub>
+        </button>
+        <div id="oc-contextual-helper-4" class="oc-drop oc-box-shadow-medium oc-rounded oc-width-1-1 oc-info-drop">
+          <div class="oc-card oc-card-body oc-background-secondary oc-p-m">
+            <div class="info-drop-content">
+              <div class="oc-flex oc-flex-between info-header oc-border-b oc-pb-s"><span class="oc-m-rm info-title">Add members to this Space</span> <button 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">
+                  <oc-icon-stub name="close" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color=""></oc-icon-stub>
+                </button></div>
+              <p class="info-text">Enter a name to add people or groups as members to this Space.</p>
+              <dl class="info-list">
+                <dt>What members can do</dt>
+                <dd>Members can see who else has access to this space and can access all files in this space. Read or write permissions can be set by the member’s role such as “Viewer” or “Editor”.</dd>
+                <dt>What Space managers can do</dt>
+                <dd>Members with the Manager role can edit all properties and content of a Space, such as adding or removing members, sharing subfolders with non-members, or creating links to share.</dd>
+              </dl>
+              <!----> <a href="https://doc.owncloud.com/webui/next/owncloud_web/web_for_users.html#sharing" target="_blank" class="info-more-link oc-button oc-rounded oc-button-s oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw">Read more</a>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="oc-flex">
+      <div class="oc-flex">
+        <div class="oc-text-truncate space-members-filter oc-mr-s"><label for="oc-textinput-5" class="oc-label"></label>
+          <div class="oc-position-relative"><input id="oc-textinput-5" aria-invalid="false" type="text" placeholder="Filter members" class="oc-text-input oc-rounded">
+            <!---->
+          </div>
+          <!---->
+        </div> <button aria-label="Close filter" type="button" class="close-filter-btn oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw">
+          <oc-icon-stub name="close" filltype="line" accessiblelabel="" type="span" size="small" variation="passive" color=""></oc-icon-stub>
+        </button>
+      </div>
+    </div>
+  </div>
+  <invite-collaborator-form-stub savebuttonlabel="Add" invitelabel="Add members" class="oc-my-s"></invite-collaborator-form-stub>
+  <ul id="files-collaborators-list" aria-label="Space members" class="oc-list oc-list-divider oc-overflow-hidden oc-m-rm">
+    <li>
+      <collaborator-list-item-stub share="[object Object]"></collaborator-list-item-stub>
+    </li>
+    <li>
+      <collaborator-list-item-stub share="[object Object]" modifiable="true"></collaborator-list-item-stub>
+    </li>
+    <li>
+      <collaborator-list-item-stub share="[object Object]" modifiable="true"></collaborator-list-item-stub>
+    </li>
+  </ul>
+</div>
+`;
+
+exports[`SpaceMembers invite collaborator form renders the form when the current user is a manager of the space 1`] = `
+<div id="oc-files-sharing-sidebar" class="oc-position-relative">
+  <div class="oc-flex oc-flex-between oc-flex-center oc-flex-middle">
+    <div class="oc-flex oc-py-s">
+      <h3 class="oc-text-bold oc-text-medium oc-m-rm">Members</h3>
+      <oc-contextual-helper-stub title="Add members to this Space" text="Enter a name to add people or groups as members to this Space." list="[object Object],[object Object],[object Object],[object Object]" endtext="" readmorelink="https://doc.owncloud.com/webui/next/owncloud_web/web_for_users.html#sharing" class="oc-pl-xs"></oc-contextual-helper-stub>
+    </div>
+    <div class="oc-flex">
+      <oc-button-stub type="button" size="medium" arialabel="Filter members" submit="button" variation="passive" appearance="raw" justifycontent="center" gapsize="medium" class="open-filter-btn">
+        <oc-icon-stub name="search" filltype="line" accessiblelabel="" type="span" size="small" variation="passive" color=""></oc-icon-stub>
+      </oc-button-stub>
+    </div>
+  </div>
+  <invite-collaborator-form-stub savebuttonlabel="Add" invitelabel="Add members" class="oc-my-s"></invite-collaborator-form-stub>
+  <ul id="files-collaborators-list" aria-label="Space members" class="oc-list oc-list-divider oc-overflow-hidden oc-m-rm">
+    <li>
+      <collaborator-list-item-stub share="[object Object]"></collaborator-list-item-stub>
+    </li>
+    <li>
+      <collaborator-list-item-stub share="[object Object]" modifiable="true"></collaborator-list-item-stub>
+    </li>
+    <li>
+      <collaborator-list-item-stub share="[object Object]" modifiable="true"></collaborator-list-item-stub>
+    </li>
+  </ul>
+</div>
+`;
diff --git a/packages/web-app-files/tests/unit/components/Spaces/ReadmeContentModal.spec.js b/packages/web-app-files/tests/unit/components/Spaces/ReadmeContentModal.spec.ts
similarity index 59%
rename from packages/web-app-files/tests/unit/components/Spaces/ReadmeContentModal.spec.js
rename to packages/web-app-files/tests/unit/components/Spaces/ReadmeContentModal.spec.ts
index 7717079d9c9..e4977e74190 100644
--- a/packages/web-app-files/tests/unit/components/Spaces/ReadmeContentModal.spec.js
+++ b/packages/web-app-files/tests/unit/components/Spaces/ReadmeContentModal.spec.ts
@@ -1,10 +1,12 @@
 import Vuex from 'vuex'
 import { mount, createLocalVue } from '@vue/test-utils'
 import ReadmeContentModal from 'web-app-files/src/components/Spaces/ReadmeContentModal.vue'
-import stubs from 'tests/unit/stubs'
-// eslint-disable-next-line jest/no-mocks-import
-import sdkMock from '@/__mocks__/sdk'
 import { createStore } from 'vuex-extensions'
+import { mockDeep } from 'jest-mock-extended'
+import { OwnCloudSdk } from 'web-client/src/types'
+import { defaultStubs } from 'web-test-helpers/src/mocks/defaultStubs'
+import { defaultComponentMocks } from 'web-test-helpers/src/mocks/defaultComponentMocks'
+import { defaultStoreMockOptions } from 'web-test-helpers/src/mocks/store/defaultStoreMockOptions'
 
 const localVue = createLocalVue()
 localVue.use(Vuex)
@@ -22,7 +24,7 @@ describe('ReadmeContentModal', () => {
     })
 
     it('should show message on error', async () => {
-      jest.spyOn(console, 'error').mockImplementation(() => {})
+      jest.spyOn(console, 'error').mockImplementation(() => undefined)
       const wrapper = getWrapper(false)
       const showMessageStub = jest.spyOn(wrapper.vm, 'showMessage')
       await wrapper.vm.editReadme()
@@ -33,13 +35,15 @@ describe('ReadmeContentModal', () => {
 })
 
 function getWrapper(resolvePutFileContents = true) {
+  const clientMock = mockDeep<OwnCloudSdk>()
   return mount(ReadmeContentModal, {
     localVue,
     mocks: {
+      ...defaultComponentMocks(),
       $client: {
-        ...sdkMock,
+        ...clientMock,
         files: {
-          ...sdkMock.files,
+          ...clientMock.files,
           putFileContents: jest.fn().mockImplementation(() => {
             if (resolvePutFileContents) {
               return Promise.resolve('readme')
@@ -50,28 +54,9 @@ function getWrapper(resolvePutFileContents = true) {
             return Promise.resolve('readme')
           })
         }
-      },
-      $gettext: jest.fn(),
-      $gettextInterpolate: jest.fn()
-    },
-    store: createStore(Vuex.Store, {
-      actions: {
-        showMessage: jest.fn()
-      },
-      getters: {
-        configuration: () => ({
-          server: 'https://example.com'
-        })
-      },
-      modules: {
-        Files: {
-          namespaced: true,
-          mutations: {
-            UPDATE_RESOURCE_FIELD: jest.fn()
-          }
-        }
       }
-    }),
+    },
+    store: createStore(Vuex.Store, defaultStoreMockOptions),
     propsData: {
       cancel: jest.fn(),
       space: {
@@ -82,23 +67,6 @@ function getWrapper(resolvePutFileContents = true) {
         }
       }
     },
-    modules: {
-      Files: {
-        namespaced: true,
-        mutations: {
-          UPDATE_RESOURCE_FIELD: jest.fn()
-        },
-        state: {
-          currentFolder: {
-            id: '1fe58d8b-aa69-4c22-baf7-97dd57479f22',
-            spaceReadmeData: {
-              webDavUrl:
-                'https://localhost:9200/dav/spaces/1fe58d8b-aa69-4c22-baf7-97dd57479f22/.space/readme.md'
-            }
-          }
-        }
-      }
-    },
-    stubs: { ...stubs, portal: true, 'oc-modal': true }
+    stubs: { ...defaultStubs, portal: true, 'oc-modal': true }
   })
 }
diff --git a/packages/web-app-files/tests/unit/mixins/actions/emptyTrashBin.spec.js b/packages/web-app-files/tests/unit/mixins/actions/emptyTrashBin.spec.ts
similarity index 79%
rename from packages/web-app-files/tests/unit/mixins/actions/emptyTrashBin.spec.js
rename to packages/web-app-files/tests/unit/mixins/actions/emptyTrashBin.spec.ts
index 91d707d00f5..23e5cf2f1b9 100644
--- a/packages/web-app-files/tests/unit/mixins/actions/emptyTrashBin.spec.js
+++ b/packages/web-app-files/tests/unit/mixins/actions/emptyTrashBin.spec.ts
@@ -1,17 +1,18 @@
 import Vuex from 'vuex'
 import { createStore } from 'vuex-extensions'
 import { mount, createLocalVue } from '@vue/test-utils'
-import EmptyTashBin from 'web-app-files/src/mixins/actions/emptyTrashBin.js'
+import EmptyTrashBin from 'web-app-files/src/mixins/actions/emptyTrashBin.js'
 import { createLocationTrash, createLocationSpaces } from '../../../../src/router'
-// eslint-disable-next-line jest/no-mocks-import
-import sdkMock from '@/__mocks__/sdk'
+import { mockDeep } from 'jest-mock-extended'
+import { OwnCloudSdk } from 'web-client/src/types'
+import { defaultStoreMockOptions } from 'web-test-helpers/src/mocks/store/defaultStoreMockOptions'
 
 const localVue = createLocalVue()
 localVue.use(Vuex)
 
 const Component = {
-  render() {},
-  mixins: [EmptyTashBin]
+  template: '<div></div>',
+  mixins: [EmptyTrashBin]
 }
 
 describe('emptyTrashBin', () => {
@@ -62,7 +63,7 @@ describe('emptyTrashBin', () => {
     })
 
     it('should show message on error', async () => {
-      jest.spyOn(console, 'error').mockImplementation(() => {})
+      jest.spyOn(console, 'error').mockImplementation(() => undefined)
 
       const wrapper = getWrapper({ resolveClearTrashBin: false })
       const showMessageStub = jest.spyOn(wrapper.vm, 'showMessage')
@@ -78,6 +79,7 @@ function getWrapper({
   resolveClearTrashBin = true,
   driveType = 'personal'
 } = {}) {
+  const clientMock = mockDeep<OwnCloudSdk>()
   return mount(Component, {
     localVue,
     mocks: {
@@ -93,9 +95,9 @@ function getWrapper({
       $pgettext: jest.fn(),
       space: { driveType, isEditor: () => false, isManager: () => false },
       $client: {
-        ...sdkMock,
+        ...clientMock,
         fileTrash: {
-          ...sdkMock.files,
+          ...clientMock.files,
           clearTrashBin: jest.fn().mockImplementation(() => {
             if (resolveClearTrashBin) {
               return Promise.resolve({})
@@ -106,33 +108,10 @@ function getWrapper({
       }
     },
     store: createStore(Vuex.Store, {
-      actions: {
-        createModal: jest.fn(),
-        hideModal: jest.fn(),
-        showMessage: jest.fn()
-      },
-      getters: {
-        configuration: () => ({
-          server: 'https://example.com'
-        }),
-        capabilities: () => {}
-      },
+      ...defaultStoreMockOptions,
       modules: {
-        user: {
-          state: {
-            id: 'alice',
-            uuid: 1
-          }
-        },
-        Files: {
-          namespaced: true,
-          mutations: {
-            REMOVE_FILE: jest.fn()
-          },
-          actions: {
-            clearTrashBin: jest.fn()
-          }
-        }
+        ...defaultStoreMockOptions.modules,
+        user: { state: { uuid: 1 } }
       }
     })
   })
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.ts
similarity index 84%
rename from packages/web-app-files/tests/unit/mixins/actions/restore.spec.js
rename to packages/web-app-files/tests/unit/mixins/actions/restore.spec.ts
index 45aa5772c74..c55966494e2 100644
--- a/packages/web-app-files/tests/unit/mixins/actions/restore.spec.js
+++ b/packages/web-app-files/tests/unit/mixins/actions/restore.spec.ts
@@ -1,16 +1,17 @@
 import Vuex from 'vuex'
 import { createStore } from 'vuex-extensions'
 import { mount, createLocalVue } from '@vue/test-utils'
-import Restore from 'web-app-files/src/mixins/actions/restore.ts'
+import Restore from 'web-app-files/src/mixins/actions/restore'
 import { createLocationTrash, createLocationSpaces } from 'web-app-files/src/router'
-// eslint-disable-next-line jest/no-mocks-import
-import sdkMock from '@/__mocks__/sdk'
+import { mockDeep } from 'jest-mock-extended'
+import { OwnCloudSdk } from 'web-client/src/types'
+import { defaultStoreMockOptions } from 'web-test-helpers/src/mocks/store/defaultStoreMockOptions'
 
 const localVue = createLocalVue()
 localVue.use(Vuex)
 
 const Component = {
-  render() {},
+  template: '<div></div>',
   mixins: [Restore]
 }
 
@@ -58,7 +59,7 @@ describe('restore', () => {
     })
 
     it('should show message on error', async () => {
-      jest.spyOn(console, 'error').mockImplementation(() => {})
+      jest.spyOn(console, 'error').mockImplementation(() => undefined)
 
       const wrapper = getWrapper({ resolveClearTrashBin: false })
       const showMessageStub = jest.spyOn(wrapper.vm, 'showMessage')
@@ -99,6 +100,7 @@ function getWrapper({
   resolveClearTrashBin: resolveRestore = true,
   driveType = 'personal'
 } = {}) {
+  const clientMock = mockDeep<OwnCloudSdk>()
   return mount(Component, {
     localVue,
     mocks: {
@@ -128,9 +130,9 @@ function getWrapper({
         }
       },
       $client: {
-        ...sdkMock,
+        ...clientMock,
+        users: { getUser: () => ({ quota: {} }) },
         fileTrash: {
-          ...sdkMock.files,
           restore: jest.fn().mockImplementation(() => {
             if (resolveRestore) {
               return Promise.resolve({})
@@ -141,36 +143,10 @@ function getWrapper({
       }
     },
     store: createStore(Vuex.Store, {
-      actions: {
-        createModal: jest.fn(),
-        hideModal: jest.fn(),
-        showMessage: jest.fn()
-      },
-      getters: {
-        configuration: () => ({
-          server: 'https://example.com'
-        }),
-        capabilities: () => {}
-      },
+      ...defaultStoreMockOptions,
       modules: {
-        user: {
-          state: {
-            id: 'alice',
-            uuid: 1
-          }
-        },
-        Files: {
-          namespaced: true,
-          mutations: {
-            REMOVE_FILE: jest.fn()
-          },
-          actions: {
-            removeFilesFromTrashbin: jest.fn()
-          }
-        }
-      },
-      mutations: {
-        SET_QUOTA: () => jest.fn()
+        ...defaultStoreMockOptions.modules,
+        user: { state: { uuid: 1 } }
       }
     })
   })
diff --git a/packages/web-app-files/tests/unit/mixins/spaces/setReadme.spec.js b/packages/web-app-files/tests/unit/mixins/spaces/setReadme.spec.ts
similarity index 70%
rename from packages/web-app-files/tests/unit/mixins/spaces/setReadme.spec.js
rename to packages/web-app-files/tests/unit/mixins/spaces/setReadme.spec.ts
index 949742e716e..950e01640c6 100644
--- a/packages/web-app-files/tests/unit/mixins/spaces/setReadme.spec.js
+++ b/packages/web-app-files/tests/unit/mixins/spaces/setReadme.spec.ts
@@ -2,27 +2,32 @@ import Vuex from 'vuex'
 import { createStore } from 'vuex-extensions'
 import { mount, createLocalVue } from '@vue/test-utils'
 import setReadme from 'web-app-files/src/mixins/spaces/actions/setReadme.js'
-import { createLocationSpaces } from '../../../../src/router'
-// eslint-disable-next-line jest/no-mocks-import
-import sdkMock from '@/__mocks__/sdk'
 import { buildSpace } from 'web-client/src/helpers'
+import { mockDeep } from 'jest-mock-extended'
+import { OwnCloudSdk } from 'web-client/src/types'
+import { defaultStoreMockOptions } from 'web-test-helpers/src/mocks/store/defaultStoreMockOptions'
+import { defaultComponentMocks } from 'web-test-helpers/src/mocks/defaultComponentMocks'
+
 const localVue = createLocalVue()
 localVue.use(Vuex)
 
 describe('setReadme', () => {
   const Component = {
-    render() {},
+    template: '<div></div>',
     mixins: [setReadme]
   }
 
-  function getWrapper(resolveGetFileContents = true, space) {
+  function getWrapper(resolveGetFileContents = true, space = undefined) {
+    const clientMock = mockDeep<OwnCloudSdk>()
+    const defaultMocks = defaultComponentMocks({ currentRoute: { name: 'files-spaces-generic' } })
     return mount(Component, {
       localVue,
       mocks: {
+        ...defaultMocks,
         $client: {
-          ...sdkMock,
+          ...clientMock,
           files: {
-            ...sdkMock.files,
+            ...clientMock.files,
             getFileContents: jest.fn().mockImplementation(() => {
               if (resolveGetFileContents) {
                 return Promise.resolve('readme')
@@ -34,61 +39,13 @@ describe('setReadme', () => {
               .mockImplementation(() => Promise.resolve({ ETag: '60c7243c2e7f1' }))
           }
         },
-        $route: {
-          params: { storageId: 1 }
-        },
-        $router: {
-          currentRoute: createLocationSpaces('files-spaces-generic'),
-          resolve: (r) => {
-            return { href: r.name }
-          }
-        },
-        $gettext: jest.fn(),
         space
       },
-      provide: {
-        currentSpace: {
-          value: space
-        }
-      },
       store: createStore(Vuex.Store, {
-        actions: {
-          createModal: jest.fn(),
-          hideModal: jest.fn(),
-          showMessage: jest.fn(),
-          setModalInputErrorMessage: jest.fn()
-        },
-        getters: {
-          configuration: () => ({
-            server: 'https://example.com'
-          })
-        },
+        ...defaultStoreMockOptions,
         modules: {
-          user: {
-            state: {
-              id: 'alice',
-              uuid: 1
-            }
-          },
-          Files: {
-            namespaced: true,
-            state: {
-              currentFolder: {
-                id: '1fe58d8b-aa69-4c22-baf7-97dd57479f22'
-              }
-            }
-          },
-          runtime: {
-            namespaced: true,
-            modules: {
-              spaces: {
-                namespaced: true,
-                mutations: {
-                  UPDATE_SPACE_FIELD: jest.fn()
-                }
-              }
-            }
-          }
+          ...defaultStoreMockOptions.modules,
+          user: { state: { uuid: 1 } }
         }
       })
     })
@@ -158,7 +115,7 @@ describe('setReadme', () => {
     })
 
     it('should show message on error', async () => {
-      jest.spyOn(console, 'error').mockImplementation(() => {})
+      jest.spyOn(console, 'error').mockImplementation(() => undefined)
       const wrapper = getWrapper(false, { id: 1 })
       const showMessageStub = jest.spyOn(wrapper.vm, 'showMessage')
       await wrapper.vm.$_setSpaceReadme_trigger({
diff --git a/packages/web-app-files/tests/unit/mixins/spaces/uploadImage.spec.js b/packages/web-app-files/tests/unit/mixins/spaces/uploadImage.spec.ts
similarity index 60%
rename from packages/web-app-files/tests/unit/mixins/spaces/uploadImage.spec.js
rename to packages/web-app-files/tests/unit/mixins/spaces/uploadImage.spec.ts
index a706f232369..427dede1850 100644
--- a/packages/web-app-files/tests/unit/mixins/spaces/uploadImage.spec.js
+++ b/packages/web-app-files/tests/unit/mixins/spaces/uploadImage.spec.ts
@@ -2,22 +2,26 @@ import Vuex from 'vuex'
 import { createStore } from 'vuex-extensions'
 import { mount, createLocalVue } from '@vue/test-utils'
 import uploadImage from 'web-app-files/src/mixins/spaces/actions/uploadImage.js'
-import { createLocationSpaces } from '../../../../src/router'
-import mockAxios from 'jest-mock-axios'
-// eslint-disable-next-line jest/no-mocks-import
-import sdkMock from '@/__mocks__/sdk'
 import { thumbnailService } from '../../../../src/services'
+import { mockDeep } from 'jest-mock-extended'
+import { OwnCloudSdk } from 'web-client/src/types'
+import { Graph } from 'web-client'
+import { clientService } from 'web-pkg'
+import { defaultComponentMocks } from 'web-test-helpers/src/mocks/defaultComponentMocks'
+import { defaultStoreMockOptions } from 'web-test-helpers/src/mocks/store/defaultStoreMockOptions'
 
 const localVue = createLocalVue()
 localVue.use(Vuex)
 
 describe('uploadImage', () => {
   const Component = {
-    render() {},
+    template: '<div></div>',
     mixins: [uploadImage]
   }
 
   function getWrapper(resolvePutFileContents = true) {
+    const clientMock = mockDeep<OwnCloudSdk>()
+    const defaultMocks = defaultComponentMocks({ currentRoute: { name: 'files-spaces-generic' } })
     return mount(Component, {
       localVue,
       data: () => ({
@@ -26,16 +30,11 @@ describe('uploadImage', () => {
         }
       }),
       mocks: {
-        $router: {
-          currentRoute: createLocationSpaces('files-spaces-projects'),
-          resolve: (r) => {
-            return { href: r.name }
-          }
-        },
+        ...defaultMocks,
         $client: {
-          ...sdkMock,
+          ...clientMock,
           files: {
-            ...sdkMock.files,
+            ...clientMock.files,
             putFileContents: jest.fn().mockImplementation(() => {
               if (resolvePutFileContents) {
                 return Promise.resolve({
@@ -45,42 +44,10 @@ describe('uploadImage', () => {
               }
               return Promise.reject(new Error(''))
             })
-          },
-          $gettext: jest.fn()
-        }
-      },
-      store: createStore(Vuex.Store, {
-        actions: {
-          createModal: jest.fn(),
-          hideModal: jest.fn(),
-          showMessage: jest.fn(),
-          setModalInputErrorMessage: jest.fn()
-        },
-        getters: {
-          configuration: () => ({
-            server: 'https://example.com'
-          })
-        },
-        modules: {
-          runtime: {
-            namespaced: true,
-            modules: {
-              auth: {
-                namespaced: true,
-                getters: {
-                  accessToken: () => ''
-                }
-              },
-              spaces: {
-                namespaced: true,
-                mutations: {
-                  UPDATE_SPACE_FIELD: jest.fn()
-                }
-              }
-            }
           }
         }
-      })
+      },
+      store: createStore(Vuex.Store, defaultStoreMockOptions)
     })
   }
 
@@ -96,9 +63,11 @@ describe('uploadImage', () => {
 
   describe('method "$_uploadImage_uploadImageSpace"', () => {
     it('should show message on success', async () => {
-      mockAxios.request.mockImplementationOnce(() => {
-        return Promise.resolve({ data: { special: [{ specialFolder: { name: 'image' } }] } })
+      const responseMock = { data: { special: [{ specialFolder: { name: 'image' } }] } }
+      const graphMock = mockDeep<Graph>({
+        drives: { updateDrive: jest.fn().mockResolvedValue(responseMock) }
       })
+      jest.spyOn(clientService, 'graphAuthenticated').mockImplementation(() => graphMock)
 
       const wrapper = getWrapper()
       const showMessageStub = jest.spyOn(wrapper.vm, 'showMessage')
@@ -112,7 +81,7 @@ describe('uploadImage', () => {
     })
 
     it('should show message on error', async () => {
-      jest.spyOn(console, 'error').mockImplementation(() => {})
+      jest.spyOn(console, 'error').mockImplementation(() => undefined)
       const wrapper = getWrapper(false)
       const showMessageStub = jest.spyOn(wrapper.vm, 'showMessage')
       await wrapper.vm.$_uploadImage_uploadImageSpace({
diff --git a/packages/web-app-files/tests/unit/store/getters.spec.js b/packages/web-app-files/tests/unit/store/getters.spec.ts
similarity index 69%
rename from packages/web-app-files/tests/unit/store/getters.spec.js
rename to packages/web-app-files/tests/unit/store/getters.spec.ts
index a8f83ffde05..069cd3578c5 100644
--- a/packages/web-app-files/tests/unit/store/getters.spec.js
+++ b/packages/web-app-files/tests/unit/store/getters.spec.ts
@@ -1,11 +1,13 @@
 import getters from 'web-app-files/src/store/getters'
-import FixtureFiles from '@/__fixtures__/files'
+import { mockDeep } from 'jest-mock-extended'
+import { Resource } from 'web-client'
 
 let state
+const mockedFiles = [mockDeep<Resource>(), mockDeep<Resource>(), mockDeep<Resource>()]
 describe('Getters', () => {
   beforeEach(() => {
     state = {
-      files: FixtureFiles['/'],
+      files: mockedFiles,
       searchTermGlobal: '',
       areHiddenFilesShown: true
     }
@@ -23,7 +25,7 @@ describe('Getters', () => {
       const { activeFiles, filesAll } = getters
       const result = activeFiles(state, { filesAll: filesAll(state) })
 
-      expect(result.length).toEqual(5)
+      expect(result.length).toEqual(mockedFiles.length)
     })
   })
 })
diff --git a/packages/web-app-files/tests/unit/views/Favorites.spec.ts b/packages/web-app-files/tests/unit/views/Favorites.spec.ts
index 572f57eabd6..b3519fca767 100644
--- a/packages/web-app-files/tests/unit/views/Favorites.spec.ts
+++ b/packages/web-app-files/tests/unit/views/Favorites.spec.ts
@@ -5,11 +5,12 @@ import { defaultComponentMocks } from 'web-test-helpers/src/mocks/defaultCompone
 import { createStore } from 'vuex-extensions'
 import { defaultLocalVue } from 'web-test-helpers/src/localVue/defaultLocalVue'
 import Vuex from 'vuex'
-import { files } from '../../__fixtures__'
 import { useResourcesViewDefaults } from 'web-app-files/src/composables'
 import { useResourcesViewDefaultsMock } from 'web-app-files/tests/mocks/useResourcesViewDefaultsMock'
 import { ref } from '@vue/composition-api'
 import { defaultStubs } from 'web-test-helpers/src/mocks/defaultStubs'
+import { mockDeep } from 'jest-mock-extended'
+import { Resource } from 'web-client'
 
 jest.mock('web-app-files/src/composables')
 
@@ -33,7 +34,7 @@ describe('Favorites view', () => {
       expect(wrapper.find('.no-content-message').exists()).toBeTruthy()
     })
     it('shows the files table when files are available', () => {
-      const { wrapper } = getMountedWrapper({ files })
+      const { wrapper } = getMountedWrapper({ files: [mockDeep<Resource>()] })
       expect(wrapper.find('.no-content-message').exists()).toBeFalsy()
       expect(wrapper.find('resource-table-stub').exists()).toBeTruthy()
     })
diff --git a/packages/web-app-files/tests/unit/views/shares/SharedViaLink.spec.ts b/packages/web-app-files/tests/unit/views/shares/SharedViaLink.spec.ts
index 12c7c923af3..50e6ea61bff 100644
--- a/packages/web-app-files/tests/unit/views/shares/SharedViaLink.spec.ts
+++ b/packages/web-app-files/tests/unit/views/shares/SharedViaLink.spec.ts
@@ -5,11 +5,12 @@ import { defaultComponentMocks } from 'web-test-helpers/src/mocks/defaultCompone
 import { createStore } from 'vuex-extensions'
 import { defaultLocalVue } from 'web-test-helpers/src/localVue/defaultLocalVue'
 import Vuex from 'vuex'
-import { files } from '../../../__fixtures__/files'
 import { useResourcesViewDefaults } from 'web-app-files/src/composables'
 import { useResourcesViewDefaultsMock } from 'web-app-files/tests/mocks/useResourcesViewDefaultsMock'
 import { ref } from '@vue/composition-api'
 import { defaultStubs } from 'web-test-helpers/src/mocks/defaultStubs'
+import { mockDeep } from 'jest-mock-extended'
+import { Resource } from 'web-client'
 
 jest.mock('web-app-files/src/composables')
 
@@ -33,10 +34,13 @@ describe('SharedViaLink view', () => {
       expect(wrapper.find('.no-content-message').exists()).toBeTruthy()
     })
     it('shows the files table when files are available', () => {
-      const { wrapper } = getMountedWrapper({ files })
+      const mockedFiles = [mockDeep<Resource>(), mockDeep<Resource>()]
+      const { wrapper } = getMountedWrapper({ files: mockedFiles })
       expect(wrapper.find('.no-content-message').exists()).toBeFalsy()
       expect(wrapper.find('resource-table-stub').exists()).toBeTruthy()
-      expect(wrapper.find('resource-table-stub').props().resources.length).toEqual(2)
+      expect(wrapper.find('resource-table-stub').props().resources.length).toEqual(
+        mockedFiles.length
+      )
     })
   })
 })
diff --git a/packages/web-app-files/tests/unit/views/shares/SharedWithMe.spec.ts b/packages/web-app-files/tests/unit/views/shares/SharedWithMe.spec.ts
index 6e890bd2599..ecadae857a0 100644
--- a/packages/web-app-files/tests/unit/views/shares/SharedWithMe.spec.ts
+++ b/packages/web-app-files/tests/unit/views/shares/SharedWithMe.spec.ts
@@ -5,13 +5,14 @@ import { defaultComponentMocks } from 'web-test-helpers/src/mocks/defaultCompone
 import { createStore } from 'vuex-extensions'
 import { defaultLocalVue } from 'web-test-helpers/src/localVue/defaultLocalVue'
 import Vuex from 'vuex'
-import { files } from '../../../__fixtures__/files'
 import { useResourcesViewDefaults, useSort } from 'web-app-files/src/composables'
 import { useResourcesViewDefaultsMock } from 'web-app-files/tests/mocks/useResourcesViewDefaultsMock'
 import { ShareStatus } from 'web-client/src/helpers/share'
 import { ref } from '@vue/composition-api'
 import { defaultStubs } from 'web-test-helpers/src/mocks/defaultStubs'
 import { useSortMock } from 'web-app-files/tests/mocks/useSortMock'
+import { mockDeep } from 'jest-mock-extended'
+import { Resource } from 'web-client'
 
 jest.mock('web-app-files/src/composables')
 
@@ -43,13 +44,13 @@ describe('SharedWithMe view', () => {
     describe('pending', () => {
       it('shows when a share is pending', () => {
         const { wrapper } = getMountedWrapper({
-          files: [{ ...files[1], status: ShareStatus.pending }]
+          files: [mockDeep<Resource>({ status: ShareStatus.pending })]
         })
         expect(wrapper.find('#files-shared-with-me-pending-section').exists()).toBeTruthy()
       })
       it('does not show when no share is pending', () => {
         const { wrapper } = getMountedWrapper({
-          files: [{ ...files[1], status: ShareStatus.accepted }]
+          files: [mockDeep<Resource>({ status: ShareStatus.accepted })]
         })
         expect(wrapper.find('#files-shared-with-me-pending-section').exists()).toBeFalsy()
       })
@@ -57,7 +58,7 @@ describe('SharedWithMe view', () => {
     describe('accepted', () => {
       it('shows an accepted share', () => {
         const { wrapper } = getMountedWrapper({
-          files: [{ ...files[1], status: ShareStatus.accepted }]
+          files: [mockDeep<Resource>({ status: ShareStatus.accepted })]
         })
         expect(wrapper.find('#files-shared-with-me-accepted-section').exists()).toBeTruthy()
         expect(wrapper.find('#files-shared-with-me-accepted-section').props().items.length).toEqual(
@@ -68,7 +69,7 @@ describe('SharedWithMe view', () => {
     describe('declined', () => {
       it('shows a declined share', async () => {
         const { wrapper } = getMountedWrapper({
-          files: [{ ...files[1], status: ShareStatus.declined }]
+          files: [mockDeep<Resource>({ status: ShareStatus.declined })]
         })
         await wrapper.vm.loadResourcesTask.last
         expect(wrapper.find('#files-shared-with-me-declined-section').exists()).toBeTruthy()
diff --git a/packages/web-app-files/tests/unit/views/shares/SharedWithOthers.spec.ts b/packages/web-app-files/tests/unit/views/shares/SharedWithOthers.spec.ts
index 32949b646a3..d97fcefb0a3 100644
--- a/packages/web-app-files/tests/unit/views/shares/SharedWithOthers.spec.ts
+++ b/packages/web-app-files/tests/unit/views/shares/SharedWithOthers.spec.ts
@@ -5,11 +5,13 @@ import { defaultComponentMocks } from 'web-test-helpers/src/mocks/defaultCompone
 import { createStore } from 'vuex-extensions'
 import { defaultLocalVue } from 'web-test-helpers/src/localVue/defaultLocalVue'
 import Vuex from 'vuex'
-import { files } from '../../../__fixtures__/files'
 import { useResourcesViewDefaults } from 'web-app-files/src/composables'
 import { useResourcesViewDefaultsMock } from 'web-app-files/tests/mocks/useResourcesViewDefaultsMock'
 import { ref } from '@vue/composition-api'
 import { defaultStubs } from 'web-test-helpers/src/mocks/defaultStubs'
+import { mockDeep } from 'jest-mock-extended'
+import { Resource } from 'web-client'
+import mocked = jest.mocked
 
 jest.mock('web-app-files/src/composables')
 
@@ -33,10 +35,13 @@ describe('SharedWithOthers view', () => {
       expect(wrapper.find('.no-content-message').exists()).toBeTruthy()
     })
     it('shows the files table when files are available', () => {
-      const { wrapper } = getMountedWrapper({ files })
+      const mockedFiles = [mockDeep<Resource>(), mockDeep<Resource>()]
+      const { wrapper } = getMountedWrapper({ files: mockedFiles })
       expect(wrapper.find('.no-content-message').exists()).toBeFalsy()
       expect(wrapper.find('resource-table-stub').exists()).toBeTruthy()
-      expect(wrapper.find('resource-table-stub').props().resources.length).toEqual(2)
+      expect(wrapper.find('resource-table-stub').props().resources.length).toEqual(
+        mockedFiles.length
+      )
     })
   })
 })
diff --git a/packages/web-app-files/tests/unit/views/spaces/DriveResolver.spec.ts b/packages/web-app-files/tests/unit/views/spaces/DriveResolver.spec.ts
index 9ed6d1f5370..6ef8b850158 100644
--- a/packages/web-app-files/tests/unit/views/spaces/DriveResolver.spec.ts
+++ b/packages/web-app-files/tests/unit/views/spaces/DriveResolver.spec.ts
@@ -6,13 +6,12 @@ import { createStore } from 'vuex-extensions'
 import { defaultLocalVue } from 'web-test-helpers/src/localVue/defaultLocalVue'
 import Vuex from 'vuex'
 import { useDriveResolver } from 'web-pkg/src/composables'
-import { spaces } from 'web-app-files/tests/__fixtures__'
 import { computed, ref } from '@vue/composition-api'
 import { defaultStubs } from 'web-test-helpers/src/mocks/defaultStubs'
 import { mockDeep } from 'jest-mock-extended'
 import { ClientService } from 'web-pkg/src'
 import { locationPublicUpload } from 'web-app-files/src/router/public'
-import { PublicSpaceResource } from 'web-client/src/helpers'
+import { PublicSpaceResource, SpaceResource } from 'web-client/src/helpers'
 import { SharePermissionBit } from 'web-client/src/helpers/share'
 
 jest.mock('web-pkg/src/composables/driveResolver')
@@ -24,13 +23,15 @@ describe('DriveResolver view', () => {
   })
   it('renders the "generic-trash"-component when on a trash route', () => {
     const { wrapper } = getMountedWrapper({
-      space: spaces[0],
+      space: mockDeep<SpaceResource>({ driveType: 'project' }),
       currentRouteName: 'files-trash-generic'
     })
     expect(wrapper.find('generic-trash-stub').exists()).toBeTruthy()
   })
   it('renders the "generic-space"-component when a space is given', () => {
-    const { wrapper } = getMountedWrapper({ space: spaces[0] })
+    const { wrapper } = getMountedWrapper({
+      space: mockDeep<SpaceResource>({ driveType: 'project' })
+    })
     expect(wrapper.find('generic-space-stub').exists()).toBeTruthy()
   })
   it('redirects to the public drop page in a public context with "upload-only"-permissions', async () => {
diff --git a/packages/web-app-files/tests/unit/views/spaces/GenericSpace.spec.ts b/packages/web-app-files/tests/unit/views/spaces/GenericSpace.spec.ts
index 2952e9aa107..5e8b1273947 100644
--- a/packages/web-app-files/tests/unit/views/spaces/GenericSpace.spec.ts
+++ b/packages/web-app-files/tests/unit/views/spaces/GenericSpace.spec.ts
@@ -5,13 +5,12 @@ import { defaultComponentMocks } from 'web-test-helpers/src/mocks/defaultCompone
 import { createStore } from 'vuex-extensions'
 import { defaultLocalVue } from 'web-test-helpers/src/localVue/defaultLocalVue'
 import Vuex from 'vuex'
-import { files, spaces } from '../../../__fixtures__'
 import { useResourcesViewDefaults } from 'web-app-files/src/composables'
 import { useResourcesViewDefaultsMock } from 'web-app-files/tests/mocks/useResourcesViewDefaultsMock'
 import { ref } from '@vue/composition-api'
 import { defaultStubs } from 'web-test-helpers/src/mocks/defaultStubs'
 import { mockDeep } from 'jest-mock-extended'
-import { SpaceResource } from 'web-client/src/helpers'
+import { Resource, SpaceResource } from 'web-client/src/helpers'
 
 jest.mock('web-app-files/src/composables')
 
@@ -33,7 +32,7 @@ describe('GenericSpace view', () => {
       const { wrapper } = getMountedWrapper({
         props: {
           item: '/someFolder',
-          space: spaces[0]
+          space: mockDeep<SpaceResource>({ driveType: 'project' })
         }
       })
       expect(wrapper.find('space-header-stub').exists()).toBeFalsy()
@@ -41,7 +40,7 @@ describe('GenericSpace view', () => {
     it('renders the space header on a space frontpage', () => {
       const { wrapper } = getMountedWrapper({
         props: {
-          space: spaces[0]
+          space: mockDeep<SpaceResource>({ driveType: 'project' })
         }
       })
       expect(wrapper.find('space-header-stub').exists()).toBeTruthy()
@@ -58,7 +57,7 @@ describe('GenericSpace view', () => {
       expect(wrapper.find('.no-content-message').exists()).toBeTruthy()
     })
     it('shows the files table when files are available', () => {
-      const { wrapper } = getMountedWrapper({ files })
+      const { wrapper } = getMountedWrapper({ files: [mockDeep<Resource>()] })
       expect(wrapper.find('.no-content-message').exists()).toBeFalsy()
       expect(wrapper.find('resource-table-stub').exists()).toBeTruthy()
     })
@@ -71,18 +70,25 @@ describe('GenericSpace view', () => {
     ])('include root item(s)', (data) => {
       const { driveType } = data
       const space = { id: 1, getDriveAliasAndItem: jest.fn(), driveType }
-      const { wrapper } = getMountedWrapper({ files, props: { space } })
+      const { wrapper } = getMountedWrapper({ files: [mockDeep<Resource>()], props: { space } })
       expect(wrapper.find('app-bar-stub').props().breadcrumbs.length).toBe(data.expectedItems)
     })
     it('include the root item and the current folder', () => {
       const folderName = 'someFolder'
-      const { wrapper } = getMountedWrapper({ files, props: { item: `/${folderName}` } })
+      const { wrapper } = getMountedWrapper({
+        files: [mockDeep<Resource>()],
+        props: { item: `/${folderName}` }
+      })
       expect(wrapper.find('app-bar-stub').props().breadcrumbs.length).toBe(2)
       expect(wrapper.find('app-bar-stub').props().breadcrumbs[1].text).toEqual(folderName)
     })
     it('omit the "page"-query of the current route', () => {
       const currentRoute = { name: 'files-spaces-generic', path: '/', query: { page: '2' } }
-      const { wrapper } = getMountedWrapper({ files, props: { item: 'someFolder' }, currentRoute })
+      const { wrapper } = getMountedWrapper({
+        files: [mockDeep<Resource>()],
+        props: { item: 'someFolder' },
+        currentRoute
+      })
       const breadCrumbItem = wrapper.find('app-bar-stub').props().breadcrumbs[0]
       expect(breadCrumbItem.to.query.page).toBeUndefined()
     })
diff --git a/packages/web-app-files/tests/unit/views/spaces/GenericTrash.spec.ts b/packages/web-app-files/tests/unit/views/spaces/GenericTrash.spec.ts
index a8ce4bcb605..6e71581362a 100644
--- a/packages/web-app-files/tests/unit/views/spaces/GenericTrash.spec.ts
+++ b/packages/web-app-files/tests/unit/views/spaces/GenericTrash.spec.ts
@@ -5,11 +5,13 @@ import { defaultComponentMocks } from 'web-test-helpers/src/mocks/defaultCompone
 import { createStore } from 'vuex-extensions'
 import { defaultLocalVue } from 'web-test-helpers/src/localVue/defaultLocalVue'
 import Vuex from 'vuex'
-import { files, spaces } from '../../../__fixtures__'
 import { useResourcesViewDefaults } from 'web-app-files/src/composables'
 import { useResourcesViewDefaultsMock } from 'web-app-files/tests/mocks/useResourcesViewDefaultsMock'
 import { ref } from '@vue/composition-api'
 import { defaultStubs } from 'web-test-helpers/src/mocks/defaultStubs'
+import { mockDeep } from 'jest-mock-extended'
+import { Resource } from 'web-client'
+import { SpaceResource } from 'web-client/src/helpers'
 
 jest.mock('web-app-files/src/composables')
 
@@ -27,8 +29,9 @@ describe('GenericTrash view', () => {
     expect(wrapper.find('app-bar-stub').props().breadcrumbs[1].text).toEqual('Personal space')
   })
   it('shows the project space breadcrumb', () => {
-    const { wrapper } = getMountedWrapper({ props: { space: spaces[0] } })
-    expect(wrapper.find('app-bar-stub').props().breadcrumbs[1].text).toEqual(spaces[0].name)
+    const space = mockDeep<SpaceResource>({ driveType: 'project' })
+    const { wrapper } = getMountedWrapper({ props: { space } })
+    expect(wrapper.find('app-bar-stub').props().breadcrumbs[1].text).toEqual(space.name)
   })
   describe('different files view states', () => {
     it('shows the loading spinner during loading', () => {
@@ -41,7 +44,7 @@ describe('GenericTrash view', () => {
       expect(wrapper.find('.no-content-message').exists()).toBeTruthy()
     })
     it('shows the files table when files are available', () => {
-      const { wrapper } = getMountedWrapper({ files })
+      const { wrapper } = getMountedWrapper({ files: [mockDeep<Resource>()] })
       expect(wrapper.find('.no-content-message').exists()).toBeFalsy()
       expect(wrapper.find('resource-table-stub').exists()).toBeTruthy()
     })
diff --git a/packages/web-app-files/tests/unit/views/spaces/Projects.spec.ts b/packages/web-app-files/tests/unit/views/spaces/Projects.spec.ts
index 8b54605069d..9b0bf94bf03 100644
--- a/packages/web-app-files/tests/unit/views/spaces/Projects.spec.ts
+++ b/packages/web-app-files/tests/unit/views/spaces/Projects.spec.ts
@@ -5,8 +5,9 @@ import { defaultComponentMocks } from 'web-test-helpers/src/mocks/defaultCompone
 import { createStore } from 'vuex-extensions'
 import { defaultLocalVue } from 'web-test-helpers/src/localVue/defaultLocalVue'
 import Vuex from 'vuex'
-import { spaces } from '../../../__fixtures__/spaces'
 import { defaultStubs } from 'web-test-helpers/src/mocks/defaultStubs'
+import { mockDeep } from 'jest-mock-extended'
+import { SpaceResource } from 'web-client/src/helpers'
 
 describe('Projects view', () => {
   it('appBar always present', () => {
@@ -29,12 +30,28 @@ describe('Projects view', () => {
       expect(wrapper.find('.no-content-message').exists()).toBeTruthy()
     })
     it('lists all available project spaces', async () => {
-      const { wrapper } = getMountedWrapper({ spaces: [spaces[0], spaces[1], spaces[2]] })
+      const spaces = [
+        mockDeep<SpaceResource>({
+          id: '1',
+          name: 'Some space',
+          driveType: 'project',
+          description: 'desc'
+        }),
+        mockDeep<SpaceResource>({
+          id: '2',
+          name: 'Some other space',
+          driveType: 'project',
+          description: 'desc'
+        })
+      ]
+      const { wrapper } = getMountedWrapper({ spaces })
       await wrapper.vm.loadResourcesTask.last
+      // "space" is undefined for "space-context-actions", seems to be a bug because it's definitely not
+      // {{ space }} -> undefined, {{ space.id }} -> "1"
       expect(wrapper).toMatchSnapshot()
       expect(wrapper.find('.no-content-message').exists()).toBeFalsy()
       expect(wrapper.find('.spaces-list').exists()).toBeTruthy()
-      expect(wrapper.findAll('.spaces-list-item').length).toEqual(3)
+      expect(wrapper.findAll('.spaces-list-item').length).toEqual(spaces.length)
     })
   })
 })
@@ -57,7 +74,7 @@ function getMountedWrapper({ mocks = {}, spaces = [] } = {}) {
       localVue,
       mocks: defaultMocks,
       store,
-      stubs: defaultStubs
+      stubs: { ...defaultStubs, 'space-context-actions': true }
     })
   }
 }
diff --git a/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.ts.snap b/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.ts.snap
index 1fffd9e8e74..9f096cca559 100644
--- a/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.ts.snap
+++ b/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.ts.snap
@@ -8,188 +8,44 @@ exports[`Projects view different files view states lists all available project s
       <div class="spaces-list oc-px-m oc-mt-l">
         <ul class="oc-list oc-my-rm oc-mx-rm oc-flex">
           <li class="spaces-list-item oc-mb-m oc-mr-m">
-            <div data-space-id="2" class="spaces-list-card oc-card oc-card-default oc-rounded">
-              <div class="oc-card-media-top oc-border-b">
-                <router-link-stub to="[object Object]">
-                  <!----> <span class="space-default-image oc-px-m oc-py-m oc-icon oc-icon-xxl oc-icon-passive"><!----></span>
-                </router-link-stub>
-              </div>
-              <div class="oc-card-body oc-p-s">
-                <div class="oc-flex oc-flex-between oc-flex-middle">
-                  <div class="oc-flex oc-flex-middle oc-text-truncate"><span class="oc-mr-s oc-icon oc-icon-m oc-icon-passive"><!----></span>
-                    <router-link-stub to="[object Object]" class="space-name oc-text-left oc-text-truncate"><span>Another space</span></router-link-stub>
-                  </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-undefined"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
-                      <div id="space-context-drop-undefined" class="oc-drop oc-box-shadow-medium oc-rounded" options="[object Object]">
-                        <div class="oc-card oc-card-body oc-background-secondary oc-p-s">
-                          <div>
-                            <div id="oc-files-context-menu">
-                              <ul id="oc-files-context-actions-members" class="oc-list oc-my-rm oc-mx-rm oc-files-context-actions oc-pb-s oc-files-context-actions-border">
-                                <li class="oc-files-context-action oc-px-s oc-rounded oc-menu-item-hover"><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"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Members</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                              </ul>
-                              <ul id="oc-files-context-actions-primaryActions" class="oc-list oc-my-rm oc-mx-rm 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 oc-menu-item-hover"><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-edit-description-trigger action-menu-item" data-testid="action-handler"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Edit subtitle</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                                <li class="oc-files-context-action oc-px-s oc-rounded oc-menu-item-hover"><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-upload-space-image-trigger action-menu-item" data-testid="action-handler"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Edit image</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                              </ul>
-                              <ul id="oc-files-context-actions-secondaryActions" class="oc-list oc-my-rm oc-mx-rm 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 oc-menu-item-hover"><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-disable-trigger action-menu-item" data-testid="action-handler"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Disable</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                                <li class="oc-files-context-action oc-px-s oc-rounded oc-menu-item-hover"><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-restore-trigger action-menu-item" data-testid="action-handler"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Enable</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                              </ul>
-                              <ul id="oc-files-context-actions-trashBin" class="oc-list oc-my-rm oc-mx-rm oc-files-context-actions oc-pt-s">
-                                <li class="oc-files-context-action oc-px-s oc-rounded oc-menu-item-hover"><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"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Deleted files</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                              </ul>
-                            </div>
-                            <!---->
-                            <!----> <input id="space-image-upload-input" type="file" name="file" multiple="multiple" tabindex="-1" accept="image/*">
-                          </div>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </div>
-                <!---->
-              </div>
-            </div>
-          </li>
-          <li class="spaces-list-item oc-mb-m oc-mr-m">
-            <div data-space-id="3" class="spaces-list-card oc-card oc-card-default oc-rounded state-trashed">
+            <div data-space-id="2" class="spaces-list-card oc-card oc-card-default oc-rounded state-trashed">
               <div class="oc-card-media-top oc-border-b"><button 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-position-absolute space-disabled-indicator oc-tag oc-tag-m oc-tag-span"><span>Disabled</span></span> <span class="space-default-image oc-px-m oc-py-m oc-icon oc-icon-xxl oc-icon-passive"><!----></span></button></div>
               <div class="oc-card-body oc-p-s">
                 <div class="oc-flex oc-flex-between oc-flex-middle">
-                  <div class="oc-flex oc-flex-middle oc-text-truncate"><span class="oc-mr-s oc-icon oc-icon-m oc-icon-passive"><!----></span> <button type="button" class="space-name oc-text-left oc-text-truncate oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><span>Disabled space</span></button></div>
+                  <div class="oc-flex oc-flex-middle oc-text-truncate"><span class="oc-mr-s oc-icon oc-icon-m oc-icon-passive"><!----></span> <button type="button" class="space-name oc-text-left oc-text-truncate oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><span>Some other space</span></button></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-undefined"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
                       <div id="space-context-drop-undefined" class="oc-drop oc-box-shadow-medium oc-rounded" options="[object Object]">
                         <div class="oc-card oc-card-body oc-background-secondary oc-p-s">
-                          <div>
-                            <div id="oc-files-context-menu">
-                              <ul id="oc-files-context-actions-members" class="oc-list oc-my-rm oc-mx-rm oc-files-context-actions oc-pb-s oc-files-context-actions-border">
-                                <li class="oc-files-context-action oc-px-s oc-rounded oc-menu-item-hover"><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"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Members</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                              </ul>
-                              <ul id="oc-files-context-actions-primaryActions" class="oc-list oc-my-rm oc-mx-rm 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 oc-menu-item-hover"><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-edit-description-trigger action-menu-item" data-testid="action-handler"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Edit subtitle</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                                <li class="oc-files-context-action oc-px-s oc-rounded oc-menu-item-hover"><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-upload-space-image-trigger action-menu-item" data-testid="action-handler"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Edit image</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                              </ul>
-                              <ul id="oc-files-context-actions-secondaryActions" class="oc-list oc-my-rm oc-mx-rm 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 oc-menu-item-hover"><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-disable-trigger action-menu-item" data-testid="action-handler"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Disable</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                                <li class="oc-files-context-action oc-px-s oc-rounded oc-menu-item-hover"><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-restore-trigger action-menu-item" data-testid="action-handler"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Enable</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                              </ul>
-                              <ul id="oc-files-context-actions-trashBin" class="oc-list oc-my-rm oc-mx-rm oc-files-context-actions oc-pt-s">
-                                <li class="oc-files-context-action oc-px-s oc-rounded oc-menu-item-hover"><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"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Deleted files</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                              </ul>
-                            </div>
-                            <!---->
-                            <!----> <input id="space-image-upload-input" type="file" name="file" multiple="multiple" tabindex="-1" accept="image/*">
-                          </div>
+                          <space-context-actions-stub space="undefined" items="undefined"></space-context-actions-stub>
                         </div>
                       </div>
                     </div>
                   </div>
                 </div>
-                <!---->
+                <p class="oc-text-left oc-ml-xs oc-mt-xs oc-mb-rm oc-text-truncate"><small>desc</small></p>
               </div>
             </div>
           </li>
           <li class="spaces-list-item oc-mb-m oc-mr-m">
-            <div data-space-id="1" class="spaces-list-card oc-card oc-card-default oc-rounded">
-              <div class="oc-card-media-top oc-border-b">
-                <router-link-stub to="[object Object]">
-                  <!----> <span class="space-default-image oc-px-m oc-py-m oc-icon oc-icon-xxl oc-icon-passive"><!----></span>
-                </router-link-stub>
-              </div>
+            <div data-space-id="1" class="spaces-list-card oc-card oc-card-default oc-rounded state-trashed">
+              <div class="oc-card-media-top oc-border-b"><button 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-position-absolute space-disabled-indicator oc-tag oc-tag-m oc-tag-span"><span>Disabled</span></span> <span class="space-default-image oc-px-m oc-py-m oc-icon oc-icon-xxl oc-icon-passive"><!----></span></button></div>
               <div class="oc-card-body oc-p-s">
                 <div class="oc-flex oc-flex-between oc-flex-middle">
-                  <div class="oc-flex oc-flex-middle oc-text-truncate"><span class="oc-mr-s oc-icon oc-icon-m oc-icon-passive"><!----></span>
-                    <router-link-stub to="[object Object]" class="space-name oc-text-left oc-text-truncate"><span>Some space</span></router-link-stub>
-                  </div>
+                  <div class="oc-flex oc-flex-middle oc-text-truncate"><span class="oc-mr-s oc-icon oc-icon-m oc-icon-passive"><!----></span> <button type="button" class="space-name oc-text-left oc-text-truncate oc-button oc-rounded oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw"><span>Some space</span></button></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-undefined"><span class="oc-icon oc-icon-m oc-icon-passive"><!----></span></button>
                       <div id="space-context-drop-undefined" class="oc-drop oc-box-shadow-medium oc-rounded" options="[object Object]">
                         <div class="oc-card oc-card-body oc-background-secondary oc-p-s">
-                          <div>
-                            <div id="oc-files-context-menu">
-                              <ul id="oc-files-context-actions-members" class="oc-list oc-my-rm oc-mx-rm oc-files-context-actions oc-pb-s oc-files-context-actions-border">
-                                <li class="oc-files-context-action oc-px-s oc-rounded oc-menu-item-hover"><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"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Members</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                              </ul>
-                              <ul id="oc-files-context-actions-primaryActions" class="oc-list oc-my-rm oc-mx-rm 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 oc-menu-item-hover"><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-edit-description-trigger action-menu-item" data-testid="action-handler"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Edit subtitle</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                                <li class="oc-files-context-action oc-px-s oc-rounded oc-menu-item-hover"><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-upload-space-image-trigger action-menu-item" data-testid="action-handler"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Edit image</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                              </ul>
-                              <ul id="oc-files-context-actions-secondaryActions" class="oc-list oc-my-rm oc-mx-rm 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 oc-menu-item-hover"><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-disable-trigger action-menu-item" data-testid="action-handler"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Disable</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                                <li class="oc-files-context-action oc-px-s oc-rounded oc-menu-item-hover"><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-restore-trigger action-menu-item" data-testid="action-handler"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Enable</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                              </ul>
-                              <ul id="oc-files-context-actions-trashBin" class="oc-list oc-my-rm oc-mx-rm oc-files-context-actions oc-pt-s">
-                                <li class="oc-files-context-action oc-px-s oc-rounded oc-menu-item-hover"><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"><span class="oc-icon oc-icon-m oc-icon-passive" data-testid="action-icon"><!----></span> <span data-testid="action-label" class="oc-files-context-action-label">Deleted files</span>
-                                    <!---->
-                                    <!---->
-                                  </button></li>
-                              </ul>
-                            </div>
-                            <!---->
-                            <!----> <input id="space-image-upload-input" type="file" name="file" multiple="multiple" tabindex="-1" accept="image/*">
-                          </div>
+                          <space-context-actions-stub space="undefined" items="undefined"></space-context-actions-stub>
                         </div>
                       </div>
                     </div>
                   </div>
                 </div>
-                <!---->
+                <p class="oc-text-left oc-ml-xs oc-mt-xs oc-mb-rm oc-text-truncate"><small>desc</small></p>
               </div>
             </div>
           </li>
diff --git a/packages/web-app-search/tests/unit/portals/SearchBar.spec.ts b/packages/web-app-search/tests/unit/portals/SearchBar.spec.ts
index 6a5c05a328a..170063e3314 100644
--- a/packages/web-app-search/tests/unit/portals/SearchBar.spec.ts
+++ b/packages/web-app-search/tests/unit/portals/SearchBar.spec.ts
@@ -92,6 +92,7 @@ afterEach(() => {
 })
 
 describe('Search Bar portal component', () => {
+  jest.spyOn(console, 'warn').mockImplementation(undefined)
   test('does not render a search field if no availableProviders given', () => {
     wrapper = getMountedWrapper({ data: { providerStore: { availableProviders: [] } } })
     expect(wrapper.element.innerHTML).toBeFalsy()
diff --git a/packages/web-client/src/helpers/resource/types.ts b/packages/web-client/src/helpers/resource/types.ts
index 6f189b5caca..b3008cfd250 100644
--- a/packages/web-client/src/helpers/resource/types.ts
+++ b/packages/web-client/src/helpers/resource/types.ts
@@ -50,6 +50,7 @@ export interface Resource {
   canDisable?(): boolean
   canEditImage?(): boolean
   canEditReadme?(): boolean
+  canEditSpaceQuota?(): boolean
 
   isReceivedShare?(): boolean
   isMounted?(): boolean
diff --git a/packages/web-client/src/helpers/share/share.ts b/packages/web-client/src/helpers/share/share.ts
index 2cd77ca5d83..177e0c5ac57 100644
--- a/packages/web-client/src/helpers/share/share.ts
+++ b/packages/web-client/src/helpers/share/share.ts
@@ -23,4 +23,5 @@ export interface Share {
   customPermissions?: SharePermission[]
   expires?: Date
   quicklink?: boolean
+  outgoing?: boolean
 }
diff --git a/packages/web-runtime/tests/__fixtures__/sidebarNavItems.ts b/packages/web-runtime/tests/__fixtures__/sidebarNavItems.ts
new file mode 100644
index 00000000000..b69440d6c97
--- /dev/null
+++ b/packages/web-runtime/tests/__fixtures__/sidebarNavItems.ts
@@ -0,0 +1,29 @@
+export default [
+  {
+    name: 'Personal',
+    icon: 'folder',
+    route: {
+      name: 'files-personal',
+      path: '/files/list/all'
+    },
+    active: true
+  },
+  {
+    name: 'Shares',
+    icon: 'share-forward',
+    route: {
+      name: 'files-shared-with-me',
+      path: '/files/list/shared-with-me'
+    },
+    active: false
+  },
+  {
+    name: 'Deleted files',
+    icon: 'delete',
+    route: {
+      name: 'files-trashbin',
+      path: '/files/list/trash-bin'
+    },
+    active: false
+  }
+]
diff --git a/packages/web-runtime/tests/unit/components/SidebarNav/SidebarNav.spec.js b/packages/web-runtime/tests/unit/components/SidebarNav/SidebarNav.spec.js
index 1746df1df23..97e3b6d9ad2 100644
--- a/packages/web-runtime/tests/unit/components/SidebarNav/SidebarNav.spec.js
+++ b/packages/web-runtime/tests/unit/components/SidebarNav/SidebarNav.spec.js
@@ -5,7 +5,7 @@ import DesignSystem from 'owncloud-design-system'
 import SidebarNav from 'web-runtime/src/components/SidebarNav/SidebarNav.vue'
 
 import stubs from '../../../../../../tests/unit/stubs'
-import sidebarNavItemFixtures from '../../../../../../__fixtures__/sidebarNavItems'
+import sidebarNavItemFixtures from '../../../__fixtures__/sidebarNavItems'
 
 jest.mock('uuid', () => ({
   v4: () => {
diff --git a/packages/web-runtime/tests/unit/components/SidebarNav/SidebarNavItem.spec.js b/packages/web-runtime/tests/unit/components/SidebarNav/SidebarNavItem.spec.js
index abede740ea4..64438caab8e 100644
--- a/packages/web-runtime/tests/unit/components/SidebarNav/SidebarNavItem.spec.js
+++ b/packages/web-runtime/tests/unit/components/SidebarNav/SidebarNavItem.spec.js
@@ -4,7 +4,7 @@ import DesignSystem from 'owncloud-design-system'
 import GetTextPlugin from 'vue-gettext'
 
 import SidebarNavItem from 'web-runtime/src/components/SidebarNav/SidebarNavItem.vue'
-import sidebarNavItemFixtures from '../../../../../../__fixtures__/sidebarNavItems'
+import sidebarNavItemFixtures from '../../../__fixtures__/sidebarNavItems'
 
 const localVue = createLocalVue()
 localVue.use(Vuex)
diff --git a/packages/web-test-helpers/src/mocks/store/defaultStoreMockOptions.ts b/packages/web-test-helpers/src/mocks/store/defaultStoreMockOptions.ts
index 7bbafea22ba..9f54cb20588 100644
--- a/packages/web-test-helpers/src/mocks/store/defaultStoreMockOptions.ts
+++ b/packages/web-test-helpers/src/mocks/store/defaultStoreMockOptions.ts
@@ -18,5 +18,8 @@ export const defaultStoreMockOptions = {
     toggleModalConfirmButton: jest.fn(),
     showMessage: jest.fn(),
     setModalInputErrorMessage: jest.fn()
+  },
+  mutations: {
+    SET_QUOTA: () => jest.fn()
   }
 } // FIXME: when we switch to TypeScript 4.9: satisfies StoreOptionsExtended<any>
diff --git a/packages/web-test-helpers/src/mocks/store/filesModuleMockOptions.ts b/packages/web-test-helpers/src/mocks/store/filesModuleMockOptions.ts
index 0ce4cf8d5a6..bd7d060f329 100644
--- a/packages/web-test-helpers/src/mocks/store/filesModuleMockOptions.ts
+++ b/packages/web-test-helpers/src/mocks/store/filesModuleMockOptions.ts
@@ -1,11 +1,16 @@
 export const filesModuleMockOptions = {
   Files: {
     namespaced: true,
+    state: {
+      sharesTree: {}
+    },
     getters: {
       currentFolder: jest.fn(),
       files: jest.fn(() => []),
       activeFiles: jest.fn(),
       highlightedFile: jest.fn(),
+      currentFileOutgoingCollaborators: jest.fn(() => []),
+      indirectOutgoingShares: jest.fn(() => []),
       clipboardResources: jest.fn(() => []),
       selectedFiles: jest.fn()
     },
@@ -20,6 +25,8 @@ export const filesModuleMockOptions = {
       SET_CURRENT_FOLDER: jest.fn(),
       LOAD_FILES: jest.fn(),
       UPDATE_RESOURCE_FIELD: jest.fn(),
+      REMOVE_FILE: jest.fn(),
+      REMOVE_FILES: jest.fn(),
       CLEAR_FILES_SEARCHED: jest.fn()
     },
     actions: {
@@ -27,7 +34,11 @@ export const filesModuleMockOptions = {
       pasteSelectedFiles: jest.fn(),
       clearClipboardFiles: jest.fn(),
       loadIndicators: jest.fn(),
-      loadSharesTree: jest.fn()
+      deleteShare: jest.fn(),
+      clearTrashBin: jest.fn(),
+      removeFilesFromTrashbin: jest.fn(),
+      loadSharesTree: jest.fn(),
+      changeShare: jest.fn()
     }
   }
 }
diff --git a/packages/web-test-helpers/src/mocks/store/runtimeModuleMockOptions.ts b/packages/web-test-helpers/src/mocks/store/runtimeModuleMockOptions.ts
index 599e69b62db..85860171641 100644
--- a/packages/web-test-helpers/src/mocks/store/runtimeModuleMockOptions.ts
+++ b/packages/web-test-helpers/src/mocks/store/runtimeModuleMockOptions.ts
@@ -5,7 +5,8 @@ export const runtimeModuleMockOptions = {
       spaces: {
         namespaced: true,
         getters: {
-          spaces: jest.fn(() => [])
+          spaces: jest.fn(() => []),
+          spaceMembers: jest.fn(() => [])
         },
         mutations: {
           UPDATE_SPACE_FIELD: jest.fn(),
@@ -13,6 +14,8 @@ export const runtimeModuleMockOptions = {
         },
         actions: {
           loadSpaceMembers: jest.fn(),
+          changeSpaceMember: jest.fn(),
+          deleteSpaceMember: jest.fn(),
           reloadProjectSpaces: jest.fn()
         }
       }