diff --git a/packages/web-app-files/src/composables/extensions/useFolderViews.ts b/packages/web-app-files/src/composables/extensions/useFolderViews.ts
index 73cf37f39a9..80e6877f669 100644
--- a/packages/web-app-files/src/composables/extensions/useFolderViews.ts
+++ b/packages/web-app-files/src/composables/extensions/useFolderViews.ts
@@ -1,7 +1,6 @@
 import { FolderViewExtension } from '@ownclouders/web-pkg'
 import { useGettext } from 'vue3-gettext'
-import { ResourceTable } from '@ownclouders/web-pkg'
-import ResourceTiles from '../../components/FilesList/ResourceTiles.vue'
+import { ResourceTable, ResourceTiles } from '@ownclouders/web-pkg'
 
 export const useFolderViews = (): FolderViewExtension[] => {
   const { $gettext } = useGettext()
diff --git a/packages/web-app-files/src/composables/resourcesViewDefaults/useResourcesViewDefaults.ts b/packages/web-app-files/src/composables/resourcesViewDefaults/useResourcesViewDefaults.ts
index e4978ecd8df..ae9eb55cb5b 100644
--- a/packages/web-app-files/src/composables/resourcesViewDefaults/useResourcesViewDefaults.ts
+++ b/packages/web-app-files/src/composables/resourcesViewDefaults/useResourcesViewDefaults.ts
@@ -10,10 +10,11 @@ import {
   useResourcesStore
 } from '@ownclouders/web-pkg'
 import { useSideBar } from '@ownclouders/web-pkg'
-
 import { queryItemAsString, useRouteQuery } from '@ownclouders/web-pkg'
-import { determineSortFields as determineResourceTableSortFields } from '@ownclouders/web-pkg'
-import { determineSortFields as determineResourceTilesSortFields } from '../../helpers/ui/resourceTiles'
+import {
+  determineResourceTableSortFields,
+  determineResourceTilesSortFields
+} from '@ownclouders/web-pkg'
 import { Task } from 'vue-concurrency'
 import { Resource } from '@ownclouders/web-client'
 import { useSelectedResources, SelectedResourcesResult } from '@ownclouders/web-pkg'
diff --git a/packages/web-app-files/src/helpers/ui/index.ts b/packages/web-app-files/src/helpers/ui/index.ts
index 50e6d766a79..10d773d27d5 100644
--- a/packages/web-app-files/src/helpers/ui/index.ts
+++ b/packages/web-app-files/src/helpers/ui/index.ts
@@ -1,2 +1 @@
 export * as fileList from './filesList'
-export * as resourceTiles from './resourceTiles'
diff --git a/packages/web-app-files/src/views/spaces/GenericSpace.vue b/packages/web-app-files/src/views/spaces/GenericSpace.vue
index 91f6438ce16..398da5d9299 100644
--- a/packages/web-app-files/src/views/spaces/GenericSpace.vue
+++ b/packages/web-app-files/src/views/spaces/GenericSpace.vue
@@ -185,7 +185,7 @@ import ListInfo from '../../components/FilesList/ListInfo.vue'
 import NotFoundMessage from '../../components/FilesList/NotFoundMessage.vue'
 import QuickActions from '../../components/FilesList/QuickActions.vue'
 import ResourceDetails from '../../components/FilesList/ResourceDetails.vue'
-import ResourceTiles from '../../components/FilesList/ResourceTiles.vue'
+import { ResourceTiles } from '@ownclouders/web-pkg'
 import SpaceHeader from '../../components/Spaces/SpaceHeader.vue'
 import WhitespaceContextMenu from 'web-app-files/src/components/Spaces/WhitespaceContextMenu.vue'
 import { eventBus } from '@ownclouders/web-pkg'
diff --git a/packages/web-app-files/src/views/spaces/Projects.vue b/packages/web-app-files/src/views/spaces/Projects.vue
index 2faf7d8f727..b2d412fca4b 100644
--- a/packages/web-app-files/src/views/spaces/Projects.vue
+++ b/packages/web-app-files/src/views/spaces/Projects.vue
@@ -188,14 +188,13 @@ import {
   SpaceResource
 } from '@ownclouders/web-client/src/helpers'
 import FilesViewWrapper from '../../components/FilesViewWrapper.vue'
-import ResourceTiles from '../../components/FilesList/ResourceTiles.vue'
-import { ResourceTable } from '@ownclouders/web-pkg'
+import { ResourceTable, ResourceTiles } from '@ownclouders/web-pkg'
 import { eventBus } from '@ownclouders/web-pkg'
 import { SideBarEventTopics, useSideBar } from '@ownclouders/web-pkg'
 import { WebDAV } from '@ownclouders/web-client/src/webdav'
 import { useScrollTo } from '@ownclouders/web-pkg'
 import { useSelectedResources } from '@ownclouders/web-pkg'
-import { sortFields as availableSortFields } from '../../helpers/ui/resourceTiles'
+import { sortFields as availableSortFields } from '@ownclouders/web-pkg'
 import { defaultFuseOptions, formatFileSize, ResourceIcon } from '@ownclouders/web-pkg'
 import { useGettext } from 'vue3-gettext'
 import {
diff --git a/packages/web-pkg/src/components/FilesList/ResourceTable.vue b/packages/web-pkg/src/components/FilesList/ResourceTable.vue
index 3962a1728f5..5a47ec53dfc 100644
--- a/packages/web-pkg/src/components/FilesList/ResourceTable.vue
+++ b/packages/web-pkg/src/components/FilesList/ResourceTable.vue
@@ -257,7 +257,7 @@ import ContextMenuQuickAction from '../ContextActions/ContextMenuQuickAction.vue
 
 import { useResourceRouteResolver } from '../../composables/filesList/useResourceRouteResolver'
 import { ClipboardActions } from '../../helpers/clipboardActions'
-import { determineSortFields } from '../../helpers/ui/resourceTable'
+import { determineResourceTableSortFields } from '../../helpers/ui/resourceTable'
 import { useFileActionsRename } from '../../composables/actions'
 import { createLocationCommon } from '../../router'
 import get from 'lodash-es/get'
@@ -581,7 +581,7 @@ export default defineComponent({
         })
       }
 
-      const sortFields = determineSortFields(firstResource)
+      const sortFields = determineResourceTableSortFields(firstResource)
       fields.push(
         ...[
           {
diff --git a/packages/web-app-files/src/components/FilesList/ResourceTiles.vue b/packages/web-pkg/src/components/FilesList/ResourceTiles.vue
similarity index 97%
rename from packages/web-app-files/src/components/FilesList/ResourceTiles.vue
rename to packages/web-pkg/src/components/FilesList/ResourceTiles.vue
index 27423614478..294e87ae1ac 100644
--- a/packages/web-app-files/src/components/FilesList/ResourceTiles.vue
+++ b/packages/web-pkg/src/components/FilesList/ResourceTiles.vue
@@ -128,23 +128,21 @@ import { Resource, SpaceResource } from '@ownclouders/web-client'
 // Constants should match what is being used in OcTable/ResourceTable
 // Alignment regarding naming would be an API-breaking change and can
 // Be done at a later point in time?
+import { ContextMenuQuickAction } from '../ContextActions'
+import { createLocationSpaces } from '../../router'
+import { createFileRouteOptions, displayPositionedDropdown } from '../../helpers'
+import { eventBus } from '../../services'
+import { ImageDimension } from '../../constants'
+import { ResourceTile, ResourceGhostElement } from './index'
 import {
-  ContextMenuQuickAction,
-  createFileRouteOptions,
-  createLocationSpaces,
-  displayPositionedDropdown,
-  eventBus,
-  ImageDimension,
+  FolderViewModeConstants,
   SortDir,
   SortField,
   useMessages,
   useResourceRouteResolver,
   useTileSize,
-  FolderViewModeConstants,
-  ResourceGhostElement,
-  useResourcesStore,
-  ResourceTile
-} from '@ownclouders/web-pkg'
+  useResourcesStore
+} from '../../composables'
 
 export default defineComponent({
   name: 'ResourceTiles',
diff --git a/packages/web-pkg/src/components/FilesList/index.ts b/packages/web-pkg/src/components/FilesList/index.ts
index 2cf910c4a8e..166229ced75 100644
--- a/packages/web-pkg/src/components/FilesList/index.ts
+++ b/packages/web-pkg/src/components/FilesList/index.ts
@@ -4,6 +4,7 @@ export { default as ResourceTable } from './ResourceTable.vue'
 export { default as ResourceListItem } from './ResourceListItem.vue'
 export { default as ResourceIcon } from './ResourceIcon.vue'
 export { default as ResourceTile } from './ResourceTile.vue'
+export { default as ResourceTiles } from './ResourceTiles.vue'
 export { default as ResourceLink } from './ResourceLink.vue'
 export { default as ResourceName } from './ResourceName.vue'
 export { default as ResourceSize } from './ResourceSize.vue'
diff --git a/packages/web-pkg/src/helpers/ui/index.ts b/packages/web-pkg/src/helpers/ui/index.ts
index f852ecdd499..9dd34de416a 100644
--- a/packages/web-pkg/src/helpers/ui/index.ts
+++ b/packages/web-pkg/src/helpers/ui/index.ts
@@ -1 +1,2 @@
 export * from './resourceTable'
+export * from './resourceTiles'
diff --git a/packages/web-pkg/src/helpers/ui/resourceTable.ts b/packages/web-pkg/src/helpers/ui/resourceTable.ts
index 81a24fea610..197a3796c34 100644
--- a/packages/web-pkg/src/helpers/ui/resourceTable.ts
+++ b/packages/web-pkg/src/helpers/ui/resourceTable.ts
@@ -1,6 +1,6 @@
 import { SortDir, SortField } from '../../composables/sort'
 
-export const determineSortFields = (firstResource): SortField[] => {
+export const determineResourceTableSortFields = (firstResource): SortField[] => {
   if (!firstResource) {
     return []
   }
diff --git a/packages/web-app-files/src/helpers/ui/resourceTiles.ts b/packages/web-pkg/src/helpers/ui/resourceTiles.ts
similarity index 90%
rename from packages/web-app-files/src/helpers/ui/resourceTiles.ts
rename to packages/web-pkg/src/helpers/ui/resourceTiles.ts
index 7862cecb801..90596b90834 100644
--- a/packages/web-app-files/src/helpers/ui/resourceTiles.ts
+++ b/packages/web-pkg/src/helpers/ui/resourceTiles.ts
@@ -1,4 +1,4 @@
-import { SortDir, SortField } from '@ownclouders/web-pkg'
+import { SortDir, SortField } from '../../composables/sort'
 
 // just a dummy function to trick gettext tools
 function $gettext(msg) {
@@ -65,7 +65,7 @@ export const sortFields: SortField[] = [
   }
 ]
 
-export const determineSortFields = (firstResource): SortField[] => {
+export const determineResourceTilesSortFields = (firstResource): SortField[] => {
   if (!firstResource) {
     return []
   }
diff --git a/packages/web-app-files/tests/unit/components/FilesList/ResourceTiles.spec.ts b/packages/web-pkg/tests/unit/components/FilesList/ResourceTiles.spec.ts
similarity index 94%
rename from packages/web-app-files/tests/unit/components/FilesList/ResourceTiles.spec.ts
rename to packages/web-pkg/tests/unit/components/FilesList/ResourceTiles.spec.ts
index f489652f24f..551211a2cfa 100644
--- a/packages/web-app-files/tests/unit/components/FilesList/ResourceTiles.spec.ts
+++ b/packages/web-pkg/tests/unit/components/FilesList/ResourceTiles.spec.ts
@@ -1,10 +1,11 @@
 import { defaultPlugins, mount } from 'web-test-helpers'
-import ResourceTiles from 'web-app-files/src/components/FilesList/ResourceTiles.vue'
-import { sortFields } from 'web-app-files/src/helpers/ui/resourceTiles'
+import ResourceTiles from '../../../../src/components/FilesList/ResourceTiles.vue'
+import { sortFields } from '../../../../src/helpers/ui/resourceTiles'
 import { Resource } from '@ownclouders/web-client'
 import { mock } from 'jest-mock-extended'
-jest.mock('@ownclouders/web-pkg', () => ({
-  ...jest.requireActual('@ownclouders/web-pkg'),
+
+jest.mock('../../../../src/composables/viewMode', () => ({
+  ...jest.requireActual('../../../../src/composables/viewMode'),
   useTileSize: jest.fn().mockReturnValue({
     tileSizePixels: 100
   })
diff --git a/packages/web-app-files/tests/unit/components/FilesList/__snapshots__/ResourceTiles.spec.ts.snap b/packages/web-pkg/tests/unit/components/FilesList/__snapshots__/ResourceTiles.spec.ts.snap
similarity index 100%
rename from packages/web-app-files/tests/unit/components/FilesList/__snapshots__/ResourceTiles.spec.ts.snap
rename to packages/web-pkg/tests/unit/components/FilesList/__snapshots__/ResourceTiles.spec.ts.snap
diff --git a/packages/web-pkg/tests/unit/composables/sort/useSort.spec.ts b/packages/web-pkg/tests/unit/composables/sort/useSort.spec.ts
index e50e7a629a3..25bb47e5161 100644
--- a/packages/web-pkg/tests/unit/composables/sort/useSort.spec.ts
+++ b/packages/web-pkg/tests/unit/composables/sort/useSort.spec.ts
@@ -1,5 +1,5 @@
 import { ref, unref } from 'vue'
-import { SortDir, SortOptions, useSort } from '../../../../src/composables/sort'
+import { SortDir, SortOptions, useSort } from '../../../../src/composables'
 import { Resource } from '@ownclouders/web-client/src/helpers/resource'
 import { getComposableWrapper } from 'web-test-helpers'