diff --git a/changelog/unreleased/enhancement-move-share-indicators b/changelog/unreleased/enhancement-move-share-indicators
index 8704a491b5c..3c1b4acd8b9 100644
--- a/changelog/unreleased/enhancement-move-share-indicators
+++ b/changelog/unreleased/enhancement-move-share-indicators
@@ -5,4 +5,5 @@ and adjusted the design in ODS.
 
 https://github.com/owncloud/web/issues/5976
 https://github.com/owncloud/web/pull/6552
-https://github.com/owncloud/owncloud-design-system/pull/2014
\ No newline at end of file
+https://github.com/owncloud/owncloud-design-system/pull/2014
+https://github.com/owncloud/web/pull/6583
\ No newline at end of file
diff --git a/packages/web-app-files/src/components/SideBar/Details/FileDetails.vue b/packages/web-app-files/src/components/SideBar/Details/FileDetails.vue
index 8f11e9a4726..0fb37dbffcb 100644
--- a/packages/web-app-files/src/components/SideBar/Details/FileDetails.vue
+++ b/packages/web-app-files/src/components/SideBar/Details/FileDetails.vue
@@ -13,31 +13,12 @@
         <oc-spinner v-if="$asyncComputed.preview.updating" />
       </div>
       <div
-        v-if="showShares"
+        v-if="shareIndicators.length"
         key="file-shares"
         data-testid="sharingInfo"
         class="oc-flex oc-flex-middle oc-my-m"
       >
-        <oc-button
-          v-if="hasPeopleShares"
-          v-oc-tooltip="peopleSharesLabel"
-          appearance="raw"
-          class="oc-mr-xs"
-          :aria-label="peopleSharesLabel"
-          @click="expandPeoplesPanel"
-        >
-          <oc-icon name="group" />
-        </oc-button>
-        <oc-button
-          v-if="hasLinkShares"
-          v-oc-tooltip="linkSharesLabel"
-          appearance="raw"
-          class="oc-mr-xs"
-          :aria-label="linkSharesLabel"
-          @click="expandLinksPanel"
-        >
-          <oc-icon name="link" />
-        </oc-button>
+        <oc-status-indicators :resource="file" :indicators="shareIndicators" />
         <p class="oc-my-rm oc-mx-s" v-text="detailSharingInformation" />
       </div>
       <table class="details-table" :aria-label="detailsTableLabel">
@@ -113,6 +94,7 @@ import upperFirst from 'lodash-es/upperFirst'
 import path from 'path'
 import { createLocationSpaces, isAuthenticatedRoute } from '../../../router'
 import { ShareTypes } from '../../../helpers/share'
+import { getIndicators } from '../../../helpers/statusIndicators'
 
 export default {
   name: 'FileDetails',
@@ -142,7 +124,8 @@ export default {
     sharedByName: '',
     sharedByDisplayName: '',
     sharedTime: 0,
-    sharedItem: null
+    sharedItem: null,
+    shareIndicators: []
   }),
   computed: {
     ...mapGetters('Files', ['versions', 'sharesTree', 'sharesTreeLoading']),
@@ -207,12 +190,6 @@ export default {
       }
       return this.$gettext('This file has been shared.')
     },
-    peopleSharesLabel() {
-      return this.$gettext('Show invited people')
-    },
-    linkSharesLabel() {
-      return this.$gettext('Show links')
-    },
     sharedByLabel() {
       return this.$gettext('Shared by:')
     },
@@ -264,19 +241,6 @@ export default {
         this.sharedItem !== null
       )
     },
-    hasPeopleShares() {
-      return (
-        ShareTypes.containsAnyValue(ShareTypes.authenticated, this.file.shareTypes) ||
-        this.file.indicators?.filter((e) => e.icon === 'group').length > 0 ||
-        this.sharedItem !== null
-      )
-    },
-    hasLinkShares() {
-      return (
-        ShareTypes.containsAnyValue(ShareTypes.unauthenticated, this.file.shareTypes) ||
-        this.file.indicators?.filter((e) => e.icon === 'link').length > 0
-      )
-    },
     ownedByCurrentUser() {
       return (
         this.file.ownerId === this.user.id ||
@@ -287,13 +251,12 @@ export default {
   },
   watch: {
     file() {
-      this.loadData()
-      this.refreshShareDetailsTree()
+      this.loadData().then(this.refreshShareDetailsTree)
     },
     sharesTree() {
       // missing early return
       this.sharedItem = null
-
+      this.shareIndicators = getIndicators(this.file, this.sharesTree)
       const sharePathParentOrCurrent = this.getParentSharePath(this.file.path, this.sharesTree)
       if (sharePathParentOrCurrent === null) {
         return
@@ -340,12 +303,13 @@ export default {
   methods: {
     ...mapActions('Files', ['loadPreview', 'loadVersions', 'loadSharesTree']),
     ...mapActions('Files/sidebar', { setSidebarPanel: 'setActivePanel' }),
-    refreshShareDetailsTree() {
-      this.loadSharesTree({
+    async refreshShareDetailsTree() {
+      await this.loadSharesTree({
         client: this.$client,
         path: this.file.path,
         $gettext: this.$gettext
       })
+      this.shareIndicators = getIndicators(this.file, this.sharesTree)
     },
     getParentSharePath(childPath, shares) {
       let currentPath = childPath
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Details/FileDetails.spec.js b/packages/web-app-files/tests/unit/components/SideBar/Details/FileDetails.spec.js
index fdedae8d568..b5d83efcabf 100644
--- a/packages/web-app-files/tests/unit/components/SideBar/Details/FileDetails.spec.js
+++ b/packages/web-app-files/tests/unit/components/SideBar/Details/FileDetails.spec.js
@@ -16,6 +16,7 @@ localVue.use(GetTextPlugin, {
 const OcTooltip = jest.fn()
 
 const simpleOwnFolder = {
+  id: '1',
   type: 'folder',
   ownerId: 'marie',
   ownerDisplayName: 'Marie',
@@ -24,6 +25,7 @@ const simpleOwnFolder = {
 }
 
 const sharedFolder = {
+  id: '2',
   type: 'folder',
   ownerId: 'einstein',
   ownerDisplayName: 'Einstein',
@@ -33,6 +35,7 @@ const sharedFolder = {
 }
 
 const simpleOwnFile = {
+  id: '3',
   type: 'file',
   ownerId: 'marie',
   ownerDisplayName: 'Marie',
@@ -41,6 +44,7 @@ const simpleOwnFile = {
 }
 
 const sharedFile = {
+  id: '4',
   path: '/Shares/123.png',
   type: 'file',
   ownerId: 'einstein',
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Details/__snapshots__/FileDetails.spec.js.snap b/packages/web-app-files/tests/unit/components/SideBar/Details/__snapshots__/FileDetails.spec.js.snap
index 0ba985c30af..721181f101c 100644
--- a/packages/web-app-files/tests/unit/components/SideBar/Details/__snapshots__/FileDetails.spec.js.snap
+++ b/packages/web-app-files/tests/unit/components/SideBar/Details/__snapshots__/FileDetails.spec.js.snap
@@ -7,10 +7,7 @@ exports[`Details SideBar Panel displays a resource of type file on a private pag
       <oc-spinner-stub></oc-spinner-stub>
     </div>
     <div data-testid="sharingInfo" class="oc-flex oc-flex-middle oc-my-m">
-      <oc-button-stub appearance="raw" aria-label="Show invited people" class="oc-mr-xs">
-        <oc-icon-stub name="group"></oc-icon-stub>
-      </oc-button-stub>
-      <!---->
+      <oc-status-indicators resource="[object Object]" indicators="[object Object]"></oc-status-indicators>
       <p class="oc-my-rm oc-mx-s">This file has been shared.</p>
     </div>
     <table aria-label="Overview of the information about the selected file" class="details-table">
@@ -52,10 +49,7 @@ exports[`Details SideBar Panel displays a resource of type file on a private pag
       <oc-spinner-stub></oc-spinner-stub>
     </div>
     <div data-testid="sharingInfo" class="oc-flex oc-flex-middle oc-my-m">
-      <oc-button-stub appearance="raw" aria-label="Show invited people" class="oc-mr-xs">
-        <oc-icon-stub name="group"></oc-icon-stub>
-      </oc-button-stub>
-      <!---->
+      <oc-status-indicators resource="[object Object]" indicators="[object Object]"></oc-status-indicators>
       <p class="oc-my-rm oc-mx-s">This file has been shared.</p>
     </div>
     <table aria-label="Overview of the information about the selected file" class="details-table">
@@ -131,13 +125,7 @@ exports[`Details SideBar Panel displays a resource of type file on a private pag
     <div data-testid="preview" class="details-preview oc-flex oc-flex-middle oc-flex-center oc-mb" style="background-image: none;">
       <oc-spinner-stub></oc-spinner-stub>
     </div>
-    <div data-testid="sharingInfo" class="oc-flex oc-flex-middle oc-my-m">
-      <oc-button-stub appearance="raw" aria-label="Show invited people" class="oc-mr-xs">
-        <oc-icon-stub name="group"></oc-icon-stub>
-      </oc-button-stub>
-      <!---->
-      <p class="oc-my-rm oc-mx-s">This file has been shared.</p>
-    </div>
+    <!---->
     <table aria-label="Overview of the information about the selected file" class="details-table">
       <tr data-testid="timestamp">
         <th scope="col" class="oc-pr-s">Last modified:</th>
@@ -274,13 +262,7 @@ exports[`Details SideBar Panel displays a resource of type folder on a private p
 <div id="oc-file-details-sidebar">
   <div>
     <!---->
-    <div data-testid="sharingInfo" class="oc-flex oc-flex-middle oc-my-m">
-      <oc-button-stub appearance="raw" aria-label="Show invited people" class="oc-mr-xs">
-        <oc-icon-stub name="group"></oc-icon-stub>
-      </oc-button-stub>
-      <!---->
-      <p class="oc-my-rm oc-mx-s">This folder has been shared.</p>
-    </div>
+    <!---->
     <table aria-label="Overview of the information about the selected file" class="details-table">
       <tr data-testid="timestamp">
         <th scope="col" class="oc-pr-s">Last modified:</th>