diff --git a/changelog/unreleased/enhancement-move-list-loader-component b/changelog/unreleased/enhancement-move-list-loader-component
new file mode 100644
index 00000000000..fae9dddab13
--- /dev/null
+++ b/changelog/unreleased/enhancement-move-list-loader-component
@@ -0,0 +1,6 @@
+Enhancement: Move ListLoader component
+
+We've moved the ListLoader component into the web-pkg package and give it a more general name,
+to ease the use in other packages.
+
+https://github.com/owncloud/web/pull/6644
diff --git a/packages/web-app-files/src/components/TrashBin.vue b/packages/web-app-files/src/components/TrashBin.vue
index 1c896b44c07..5edefdd63e7 100644
--- a/packages/web-app-files/src/components/TrashBin.vue
+++ b/packages/web-app-files/src/components/TrashBin.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <list-loader v-if="loadResourcesTask.isRunning" />
+    <app-loading-spinner v-if="loadResourcesTask.isRunning" />
     <template v-else>
       <no-content-message
         v-if="isEmpty"
@@ -53,7 +53,7 @@ import MixinFilesListFilter from '../mixins/filesListFilter'
 import MixinResources from '../mixins/resources'
 import MixinMountSideBar from '../mixins/sidebar/mountSideBar'
 
-import ListLoader from './FilesList/ListLoader.vue'
+import AppLoadingSpinner from 'web-pkg/src/components/AppLoadingSpinner.vue'
 import NoContentMessage from 'web-pkg/src/components/NoContentMessage.vue'
 import ListInfo from './FilesList/ListInfo.vue'
 import Pagination from './FilesList/Pagination.vue'
@@ -64,7 +64,14 @@ import { bus } from 'web-pkg/src/instance'
 export default {
   name: 'TrashBin',
 
-  components: { ResourceTable, ListLoader, NoContentMessage, ListInfo, Pagination, ContextActions },
+  components: {
+    ResourceTable,
+    AppLoadingSpinner,
+    NoContentMessage,
+    ListInfo,
+    Pagination,
+    ContextActions
+  },
 
   mixins: [MixinResources, MixinMountSideBar, MixinFilesListFilter],
   props: {
diff --git a/packages/web-app-files/src/views/Favorites.vue b/packages/web-app-files/src/views/Favorites.vue
index 5230855e319..e96e1dac0cc 100644
--- a/packages/web-app-files/src/views/Favorites.vue
+++ b/packages/web-app-files/src/views/Favorites.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <list-loader v-if="loadResourcesTask.isRunning" />
+    <app-loading-spinner v-if="loadResourcesTask.isRunning" />
     <template v-else>
       <no-content-message v-if="isEmpty" id="files-favorites-empty" class="files-empty" icon="star">
         <template #message>
@@ -57,7 +57,7 @@ import { ImageDimension, ImageType } from '../constants'
 import debounce from 'lodash-es/debounce'
 
 import QuickActions from '../components/FilesList/QuickActions.vue'
-import ListLoader from '../components/FilesList/ListLoader.vue'
+import AppLoadingSpinner from 'web-pkg/src/components/AppLoadingSpinner.vue'
 import NoContentMessage from 'web-pkg/src/components/NoContentMessage.vue'
 import ListInfo from '../components/FilesList/ListInfo.vue'
 import Pagination from '../components/FilesList/Pagination.vue'
@@ -71,7 +71,7 @@ export default {
   components: {
     ResourceTable,
     QuickActions,
-    ListLoader,
+    AppLoadingSpinner,
     Pagination,
     NoContentMessage,
     ListInfo,
diff --git a/packages/web-app-files/src/views/LocationPicker.vue b/packages/web-app-files/src/views/LocationPicker.vue
index 3d0a7d90120..261f10b2926 100644
--- a/packages/web-app-files/src/views/LocationPicker.vue
+++ b/packages/web-app-files/src/views/LocationPicker.vue
@@ -35,7 +35,7 @@
         </oc-grid>
       </div>
       <div id="files-view">
-        <list-loader v-if="loadResourcesTask.isRunning" />
+        <app-loading-spinner v-if="loadResourcesTask.isRunning" />
         <template v-else>
           <no-content-message
             v-if="isEmpty"
@@ -91,7 +91,7 @@ import MixinFilesListFilter from '../mixins/filesListFilter'
 import { useTask } from 'vue-concurrency'
 
 import NoContentMessage from 'web-pkg/src/components/NoContentMessage.vue'
-import ListLoader from '../components/FilesList/ListLoader.vue'
+import AppLoadingSpinner from 'web-pkg/src/components/AppLoadingSpinner.vue'
 import ListInfo from '../components/FilesList/ListInfo.vue'
 import Pagination from '../components/FilesList/Pagination.vue'
 import { DavProperties } from 'web-pkg/src/constants'
@@ -109,7 +109,7 @@ export default {
   components: {
     ResourceTable,
     NoContentMessage,
-    ListLoader,
+    AppLoadingSpinner,
     ListInfo,
     Pagination
   },
diff --git a/packages/web-app-files/src/views/Personal.vue b/packages/web-app-files/src/views/Personal.vue
index aa3268437b8..4a2eb664519 100644
--- a/packages/web-app-files/src/views/Personal.vue
+++ b/packages/web-app-files/src/views/Personal.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <list-loader v-if="loadResourcesTask.isRunning" />
+    <app-loading-spinner v-if="loadResourcesTask.isRunning" />
     <template v-else>
       <not-found-message v-if="folderNotFound" class="files-not-found oc-height-1-1" />
       <no-content-message
@@ -78,7 +78,7 @@ import { bus } from 'web-pkg/src/instance'
 
 import ResourceTable from '../components/FilesList/ResourceTable.vue'
 import QuickActions from '../components/FilesList/QuickActions.vue'
-import ListLoader from '../components/FilesList/ListLoader.vue'
+import AppLoadingSpinner from 'web-pkg/src/components/AppLoadingSpinner.vue'
 import NoContentMessage from 'web-pkg/src/components/NoContentMessage.vue'
 import NotFoundMessage from '../components/FilesList/NotFoundMessage.vue'
 import ListInfo from '../components/FilesList/ListInfo.vue'
@@ -96,7 +96,7 @@ export default {
   components: {
     ResourceTable,
     QuickActions,
-    ListLoader,
+    AppLoadingSpinner,
     NoContentMessage,
     NotFoundMessage,
     ListInfo,
diff --git a/packages/web-app-files/src/views/PublicFiles.vue b/packages/web-app-files/src/views/PublicFiles.vue
index 8cf6b5b0e15..f546959be91 100644
--- a/packages/web-app-files/src/views/PublicFiles.vue
+++ b/packages/web-app-files/src/views/PublicFiles.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <list-loader v-if="loadResourcesTask.isRunning" />
+    <app-loading-spinner v-if="loadResourcesTask.isRunning" />
     <template v-else>
       <not-found-message v-if="folderNotFound" class="files-not-found oc-height-1-1" />
       <no-content-message
@@ -66,7 +66,7 @@ import { ImageDimension, ImageType } from '../constants'
 import debounce from 'lodash-es/debounce'
 import { bus } from 'web-pkg/src/instance'
 
-import ListLoader from '../components/FilesList/ListLoader.vue'
+import AppLoadingSpinner from 'web-pkg/src/components/AppLoadingSpinner.vue'
 import NoContentMessage from 'web-pkg/src/components/NoContentMessage.vue'
 import NotFoundMessage from '../components/FilesList/NotFoundMessage.vue'
 import ListInfo from '../components/FilesList/ListInfo.vue'
@@ -81,7 +81,7 @@ export default {
     ResourceTable,
     ListInfo,
     Pagination,
-    ListLoader,
+    AppLoadingSpinner,
     NoContentMessage,
     NotFoundMessage,
     ContextActions
diff --git a/packages/web-app-files/src/views/shares/SharedViaLink.vue b/packages/web-app-files/src/views/shares/SharedViaLink.vue
index 9e86800eada..621c5a92396 100644
--- a/packages/web-app-files/src/views/shares/SharedViaLink.vue
+++ b/packages/web-app-files/src/views/shares/SharedViaLink.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <list-loader v-if="loadResourcesTask.isRunning" />
+    <app-loading-spinner v-if="loadResourcesTask.isRunning" />
     <template v-else>
       <no-content-message
         v-if="isEmpty"
@@ -58,7 +58,7 @@ import { VisibilityObserver } from 'web-pkg/src/observer'
 import { ImageDimension, ImageType } from '../../constants'
 import debounce from 'lodash-es/debounce'
 
-import ListLoader from '../../components/FilesList/ListLoader.vue'
+import AppLoadingSpinner from 'web-pkg/src/components/AppLoadingSpinner.vue'
 import NoContentMessage from 'web-pkg/src/components/NoContentMessage.vue'
 import ListInfo from '../../components/FilesList/ListInfo.vue'
 import Pagination from '../../components/FilesList/Pagination.vue'
@@ -69,7 +69,14 @@ import { useResourcesViewDefaults } from '../../composables'
 const visibilityObserver = new VisibilityObserver()
 
 export default {
-  components: { ResourceTable, ListLoader, NoContentMessage, ListInfo, Pagination, ContextActions },
+  components: {
+    ResourceTable,
+    AppLoadingSpinner,
+    NoContentMessage,
+    ListInfo,
+    Pagination,
+    ContextActions
+  },
 
   mixins: [FileActions, MixinResources, MixinMountSideBar, MixinFilesListFilter],
 
diff --git a/packages/web-app-files/src/views/shares/SharedWithMe.vue b/packages/web-app-files/src/views/shares/SharedWithMe.vue
index 6d1acac4669..94c670e6ff8 100644
--- a/packages/web-app-files/src/views/shares/SharedWithMe.vue
+++ b/packages/web-app-files/src/views/shares/SharedWithMe.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="oc-flex oc-flex-column">
-    <list-loader v-if="loadResourcesTask.isRunning" />
+    <app-loading-spinner v-if="loadResourcesTask.isRunning" />
     <template v-else>
       <!-- Pending shares -->
       <div v-if="hasPending">
@@ -173,7 +173,7 @@ import { useSort, useResourcesViewDefaults } from '../../composables'
 import { useRouteQuery } from 'web-pkg/src/composables'
 import debounce from 'lodash-es/debounce'
 
-import ListLoader from '../../components/FilesList/ListLoader.vue'
+import AppLoadingSpinner from 'web-pkg/src/components/AppLoadingSpinner.vue'
 import NoContentMessage from 'web-pkg/src/components/NoContentMessage.vue'
 import ListInfo from '../../components/FilesList/ListInfo.vue'
 import ContextActions from '../../components/FilesList/ContextActions.vue'
@@ -186,7 +186,7 @@ const visibilityObserver = new VisibilityObserver()
 export default {
   components: {
     ResourceTable,
-    ListLoader,
+    AppLoadingSpinner,
     NoContentMessage,
     ListInfo,
     ContextActions
diff --git a/packages/web-app-files/src/views/shares/SharedWithOthers.vue b/packages/web-app-files/src/views/shares/SharedWithOthers.vue
index dcce81dd105..da8805313e1 100644
--- a/packages/web-app-files/src/views/shares/SharedWithOthers.vue
+++ b/packages/web-app-files/src/views/shares/SharedWithOthers.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <list-loader v-if="loadResourcesTask.isRunning" />
+    <app-loading-spinner v-if="loadResourcesTask.isRunning" />
     <template v-else>
       <no-content-message
         v-if="isEmpty"
@@ -60,7 +60,7 @@ import { VisibilityObserver } from 'web-pkg/src/observer'
 import { ImageDimension, ImageType } from '../../constants'
 import debounce from 'lodash-es/debounce'
 
-import ListLoader from '../../components/FilesList/ListLoader.vue'
+import AppLoadingSpinner from 'web-pkg/src/components/AppLoadingSpinner.vue'
 import NoContentMessage from 'web-pkg/src/components/NoContentMessage.vue'
 import ListInfo from '../../components/FilesList/ListInfo.vue'
 import Pagination from '../../components/FilesList/Pagination.vue'
@@ -71,7 +71,14 @@ import { useResourcesViewDefaults } from '../../composables'
 const visibilityObserver = new VisibilityObserver()
 
 export default {
-  components: { ResourceTable, ListLoader, NoContentMessage, ListInfo, Pagination, ContextActions },
+  components: {
+    ResourceTable,
+    AppLoadingSpinner,
+    NoContentMessage,
+    ListInfo,
+    Pagination,
+    ContextActions
+  },
 
   mixins: [FileActions, MixinResources, MixinMountSideBar, MixinFilesListFilter],
 
diff --git a/packages/web-app-files/src/views/spaces/Project.vue b/packages/web-app-files/src/views/spaces/Project.vue
index 99736921e4b..a3cddc0fc90 100644
--- a/packages/web-app-files/src/views/spaces/Project.vue
+++ b/packages/web-app-files/src/views/spaces/Project.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="space-overview">
-    <list-loader v-if="loadResourcesTask.isRunning" />
+    <app-loading-spinner v-if="loadResourcesTask.isRunning" />
     <template v-else>
       <not-found-message v-if="!space.id" class="space-not-found oc-height-1-1" />
       <div v-else-if="isSpaceRoot">
@@ -142,7 +142,7 @@
 <script>
 import NoContentMessage from 'web-pkg/src/components/NoContentMessage.vue'
 import NotFoundMessage from '../../components/FilesList/NotFoundMessage.vue'
-import ListLoader from '../../components/FilesList/ListLoader.vue'
+import AppLoadingSpinner from 'web-pkg/src/components/AppLoadingSpinner.vue'
 import { computed, ref } from '@vue/composition-api'
 import { marked } from 'marked'
 import sanitizeHtml from 'sanitize-html'
@@ -181,7 +181,7 @@ const visibilityObserver = new VisibilityObserver()
 export default {
   components: {
     NoContentMessage,
-    ListLoader,
+    AppLoadingSpinner,
     NotFoundMessage,
     ResourceTable,
     ListInfo,
diff --git a/packages/web-app-files/src/views/spaces/Projects.vue b/packages/web-app-files/src/views/spaces/Projects.vue
index a5bcc855e06..5c3b40cb7c5 100644
--- a/packages/web-app-files/src/views/spaces/Projects.vue
+++ b/packages/web-app-files/src/views/spaces/Projects.vue
@@ -21,7 +21,7 @@
       />
       <!-- <a href="#" v-text="$gettext('Learn more about spaces.')" /> -->
     </div>
-    <list-loader v-if="loadResourcesTask.isRunning" />
+    <app-loading-spinner v-if="loadResourcesTask.isRunning" />
     <template v-else>
       <no-content-message
         v-if="!spaces.length"
@@ -163,7 +163,7 @@
 
 <script>
 import NoContentMessage from 'web-pkg/src/components/NoContentMessage.vue'
-import ListLoader from '../../components/FilesList/ListLoader.vue'
+import AppLoadingSpinner from 'web-pkg/src/components/AppLoadingSpinner.vue'
 import { computed } from '@vue/composition-api'
 import { useStore } from 'web-pkg/src/composables'
 import { useTask } from 'vue-concurrency'
@@ -188,7 +188,7 @@ export default {
   components: {
     NoContentMessage,
     QuotaModal,
-    ListLoader
+    AppLoadingSpinner
   },
   mixins: [
     Rename,
diff --git a/packages/web-app-files/tests/unit/components/TrashBin.spec.js b/packages/web-app-files/tests/unit/components/TrashBin.spec.js
index da871bd466f..d749b534d65 100644
--- a/packages/web-app-files/tests/unit/components/TrashBin.spec.js
+++ b/packages/web-app-files/tests/unit/components/TrashBin.spec.js
@@ -3,7 +3,7 @@ import TrashBin from '@files/src/components/TrashBin.vue'
 import { getStore, localVue, createFile } from '@files/tests/unit/components/components.setup.js'
 
 const stubs = {
-  'list-loader': true,
+  'app-loading-spinner': true,
   'no-content-message': true,
   'resource-table': true,
   'context-actions': true,
@@ -12,7 +12,7 @@ const stubs = {
   'router-link': true
 }
 
-const listLoaderStub = 'list-loader-stub'
+const appLoadingSpinnerStub = 'app-loading-spinner-stub'
 const noContentStub = 'no-content-message-stub'
 const filesTableStub = 'resource-table-stub'
 const filesTableSelector = '#files-trashbin-table'
@@ -21,10 +21,10 @@ const listInfoStub = 'list-info-stub'
 const paginationStub = 'pagination-stub'
 
 describe('Trashbin component', () => {
-  it('should show the list loader when the view is still loading', () => {
+  it('should show the app-loading-spinner component when the view is still loading', () => {
     const wrapper = getMountedWrapper({ loading: true })
 
-    expect(wrapper.find(listLoaderStub).exists()).toBeTruthy()
+    expect(wrapper.find(appLoadingSpinnerStub).exists()).toBeTruthy()
     expect(wrapper.find(noContentStub).exists()).toBeFalsy()
     expect(wrapper.find(filesTableStub).exists()).toBeFalsy()
   })
@@ -33,7 +33,7 @@ describe('Trashbin component', () => {
     it('should show the no content message component if the paginated resources is empty', () => {
       const wrapper = getMountedWrapper()
 
-      expect(wrapper.find(listLoaderStub).exists()).toBeFalsy()
+      expect(wrapper.find(appLoadingSpinnerStub).exists()).toBeFalsy()
       expect(wrapper.find(filesTableStub).exists()).toBeFalsy()
       expect(wrapper.find(noContentStub).exists()).toBeTruthy()
     })
diff --git a/packages/web-app-files/tests/unit/views/LocationPicker.spec.js b/packages/web-app-files/tests/unit/views/LocationPicker.spec.js
index ea8512386a5..0c74ec8015b 100644
--- a/packages/web-app-files/tests/unit/views/LocationPicker.spec.js
+++ b/packages/web-app-files/tests/unit/views/LocationPicker.spec.js
@@ -29,7 +29,7 @@ const router = {
   }
 }
 
-const listLoaderStub = 'list-loader-stub'
+const listLoaderStub = 'app-loading-spinner-stub'
 const breadcrumbStub = 'oc-breadcrumb-stub'
 const listInfoStub = 'list-info-stub'
 const filesPaginationStub = 'pagination-stub'
@@ -243,7 +243,7 @@ describe('LocationPicker', () => {
         const wrapper = getShallowWrapper({ loading: true })
         filesView = wrapper.find(selectors.filesView)
       })
-      it('should show list loader', () => {
+      it('should show app-loading-spinner component', () => {
         expect(filesView.find(listLoaderStub).exists()).toBeTruthy()
         expect(filesView.find(listLoaderStub)).toMatchSnapshot()
       })
@@ -257,7 +257,7 @@ describe('LocationPicker', () => {
     describe('when the view is not loading anymore', () => {
       const wrapper = getShallowWrapper()
       const filesView = wrapper.find(selectors.filesView)
-      it('should not show list loader', () => {
+      it('should not show app-loading-spinner component', () => {
         expect(filesView.find(listLoaderStub).exists()).toBeFalsy()
       })
       it('should show no content message if active files length is less than one', () => {
diff --git a/packages/web-app-files/tests/unit/views/PublicFiles.spec.ts b/packages/web-app-files/tests/unit/views/PublicFiles.spec.ts
index 0d45b4bc775..54f1934bb31 100644
--- a/packages/web-app-files/tests/unit/views/PublicFiles.spec.ts
+++ b/packages/web-app-files/tests/unit/views/PublicFiles.spec.ts
@@ -9,7 +9,7 @@ const createFolder = ({ name = '1234', canCreate = false } = {}) => ({
 })
 
 const stubs = {
-  'list-loader': true,
+  'app-loading-spinner': true,
   'not-found-message': true,
   'no-content-message': true,
   'resource-table': true,
@@ -34,7 +34,7 @@ const $router = {
 const resourceList = [createFile({ id: 1234 }), createFile({ id: 1235 }), createFile({ id: 1236 })]
 
 const stubSelectors = {
-  listLoader: 'list-loader-stub',
+  appLoadingSpinner: 'app-loading-spinner-stub',
   notFoundMessage: 'not-found-message-stub',
   noContentMessage: 'no-content-message-stub',
   resourceTable: 'resource-table-stub',
@@ -50,18 +50,18 @@ describe('PublicFiles view', () => {
       await accentuatesTableRowTest(PublicFiles)
     })
   })
-  it('should show the list loader when the view is still loading', () => {
+  it('should show the app-loading-spinner component when the view is still loading', () => {
     const wrapper = getMountedWrapper({ loading: true })
 
-    expect(wrapper.find(stubSelectors.listLoader).exists()).toBeTruthy()
+    expect(wrapper.find(stubSelectors.appLoadingSpinner).exists()).toBeTruthy()
     expect(wrapper.find(stubSelectors.noContentMessage).exists()).toBeFalsy()
     expect(wrapper.find(stubSelectors.resourceTable).exists()).toBeFalsy()
   })
   describe('when the view is not loading anymore', () => {
-    it('should not show the list loader', () => {
+    it('should not show the app-loading-spinner component', () => {
       const wrapper = getMountedWrapper({ loading: false })
 
-      expect(wrapper.find(stubSelectors.listLoader).exists()).toBeFalsy()
+      expect(wrapper.find(stubSelectors.appLoadingSpinner).exists()).toBeFalsy()
     })
 
     describe('not found message component', () => {
diff --git a/packages/web-app-files/tests/unit/views/__snapshots__/LocationPicker.spec.js.snap b/packages/web-app-files/tests/unit/views/__snapshots__/LocationPicker.spec.js.snap
index be660eafb4a..7ef3a672b02 100644
--- a/packages/web-app-files/tests/unit/views/__snapshots__/LocationPicker.spec.js.snap
+++ b/packages/web-app-files/tests/unit/views/__snapshots__/LocationPicker.spec.js.snap
@@ -42,4 +42,4 @@ exports[`LocationPicker files app bar should show location picker selection info
 
 exports[`LocationPicker files view when the view is not loading anymore should show no content message if active files length is less than one 1`] = `<no-content-message-stub icon="folder" id="files-location-picker-empty" class="files-empty"></no-content-message-stub>`;
 
-exports[`LocationPicker files view when the view is still loading should show list loader 1`] = `<list-loader-stub></list-loader-stub>`;
+exports[`LocationPicker files view when the view is still loading should show app-loading-spinner component 1`] = `<app-loading-spinner-stub></app-loading-spinner-stub>`;
diff --git a/packages/web-app-files/tests/unit/views/shares/SharedViaLink.spec.js b/packages/web-app-files/tests/unit/views/shares/SharedViaLink.spec.js
index 794b83007c2..b78638d0a3e 100644
--- a/packages/web-app-files/tests/unit/views/shares/SharedViaLink.spec.js
+++ b/packages/web-app-files/tests/unit/views/shares/SharedViaLink.spec.js
@@ -20,7 +20,7 @@ const stubs = {
   'list-info': true
 }
 
-const listLoaderStub = 'list-loader-stub'
+const listLoaderStub = 'app-loading-spinner-stub'
 const listInfoStub = 'list-info-stub'
 const contextActionsStub = 'context-actions-stub'
 
@@ -40,7 +40,7 @@ describe('SharedViaLink view', () => {
   })
 
   describe('when the view is still loading', () => {
-    it('should show list-loader component', () => {
+    it('should show app-loading-spinner component', () => {
       const wrapper = getShallowWrapper({ loading: true })
       const listLoader = wrapper.find(listLoaderStub)
 
@@ -49,7 +49,7 @@ describe('SharedViaLink view', () => {
   })
 
   describe('when the view is not loading anymore', () => {
-    it('should not show list-loader component', () => {
+    it('should not app-loading-spinner component', () => {
       const wrapper = getShallowWrapper()
       expect(wrapper.find(listLoaderStub).exists()).toBeFalsy()
     })
diff --git a/packages/web-app-files/tests/unit/views/shares/SharedWithOthers.spec.js b/packages/web-app-files/tests/unit/views/shares/SharedWithOthers.spec.js
index 4d47dde8413..ffcb8c38e77 100644
--- a/packages/web-app-files/tests/unit/views/shares/SharedWithOthers.spec.js
+++ b/packages/web-app-files/tests/unit/views/shares/SharedWithOthers.spec.js
@@ -7,7 +7,7 @@ import SharedData from '@/__fixtures__/sharedFiles.js'
 const resourcesList = SharedData.json().ocs.data
 
 const stubs = {
-  'list-loader': true,
+  'app-loading-spinner': true,
   'no-content-message': true,
   'resource-table': true,
   'context-actions': true,
@@ -21,7 +21,7 @@ const stubs = {
   'oc-drop': true
 }
 
-const listLoaderStub = 'list-loader-stub'
+const appLoadingSpinnerStub = 'app-loading-spinner-stub'
 const noContentStub = 'no-content-message-stub'
 const filesTableStub = 'resource-table-stub'
 const filesTableSelector = '#files-shared-with-others-table'
@@ -30,10 +30,10 @@ const listInfoStub = 'list-info-stub'
 const paginationStub = 'pagination-stub'
 
 describe('SharedWithOthers', () => {
-  it('should show the list loader when the wrapper is still loading', () => {
+  it('should show the app-loading-spinner component when the wrapper is still loading', () => {
     const wrapper = getMountedWrapper({ loading: true })
 
-    expect(wrapper.find(listLoaderStub).exists()).toBeTruthy()
+    expect(wrapper.find(appLoadingSpinnerStub).exists()).toBeTruthy()
     expect(wrapper.find(noContentStub).exists()).toBeFalsy()
     expect(wrapper.find(filesTableStub).exists()).toBeFalsy()
   })
@@ -41,7 +41,7 @@ describe('SharedWithOthers', () => {
     it('should show the no content message component if the paginated resources is empty', () => {
       const wrapper = getMountedWrapper()
 
-      expect(wrapper.find(listLoaderStub).exists()).toBeFalsy()
+      expect(wrapper.find(appLoadingSpinnerStub).exists()).toBeFalsy()
       expect(wrapper.find(filesTableStub).exists()).toBeFalsy()
       expect(wrapper.find(noContentStub).exists()).toBeTruthy()
     })
diff --git a/packages/web-app-files/src/components/FilesList/ListLoader.vue b/packages/web-pkg/src/components/AppLoadingSpinner.vue
similarity index 51%
rename from packages/web-app-files/src/components/FilesList/ListLoader.vue
rename to packages/web-pkg/src/components/AppLoadingSpinner.vue
index 356c465f52a..7c89f6c063e 100644
--- a/packages/web-app-files/src/components/FilesList/ListLoader.vue
+++ b/packages/web-pkg/src/components/AppLoadingSpinner.vue
@@ -1,5 +1,11 @@
 <template functional>
   <div class="oc-flex oc-flex-middle oc-flex-center oc-height-1-1">
-    <oc-spinner id="files-list-progress" size="large" :aria-hidden="true" aria-label="" />
+    <oc-spinner id="app-loading-spinner" size="large" :aria-hidden="true" aria-label="" />
   </div>
 </template>
+
+<script>
+export default {
+  name: 'AppLoadingSpinner'
+}
+</script>