fix: add issuer for external shares

changelog/unreleased/bugfix-ocm-share-recipient-issuer

@@ -0,0 +1,6 @@
+Bugfix: OCM share recipient issuer
+
+We've fixed a bug where the issuer for OCM shares was missing in the invite input field.
+
+https://github.com/owncloud/web/pull/12002
+https://github.com/owncloud/web/issues/11972

packages/web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/AutocompleteItem.vue

@@ -34,6 +34,11 @@
         class="files-collaborators-autocomplete-additionalInfo"
         v-text="`${additionalInfo}`"
       />
+      <div
+        v-if="externalIssuer"
+        class="files-collaborators-autocomplete-externalIssuer"
+        v-text="`${externalIssuer}`"
+      />
     </div>
   </div>
 </template>
@@ -56,7 +61,14 @@ export default {
       return props.item.mail || props.item.onPremisesSamAccountName
     })
 
-    return { additionalInfo }
+    const externalIssuer = computed(() => {
+      if (props.item.shareType === ShareTypes.remote.value) {
+        return props.item.identities?.[0]?.issuer
+      }
+      return ''
+    })
+
+    return { additionalInfo, externalIssuer }
   },
   computed: {
     shareType() {
@@ -87,7 +99,8 @@ export default {
 </script>
 
 <style lang="scss">
-.files-collaborators-autocomplete-additionalInfo {
+.files-collaborators-autocomplete-additionalInfo,
+.files-collaborators-autocomplete-externalIssuer {
   font-size: var(--oc-font-size-small);
 }
 </style>

packages/web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/RecipientContainer.vue

@@ -20,7 +20,7 @@
 <script lang="ts">
 import { avatarUrl } from '../../../../../helpers/user'
 import { CollaboratorAutoCompleteItem, ShareTypes } from '@ownclouders/web-client'
-import { defineComponent, PropType } from 'vue'
+import { computed, defineComponent, PropType } from 'vue'
 import { Recipient } from '@ownclouders/design-system/helpers'
 import { useCapabilityStore, useConfigStore } from '@ownclouders/web-pkg'
 import { storeToRefs } from 'pinia'
@@ -37,22 +37,35 @@ export default defineComponent({
       default: null
     }
   },
-  setup() {
+  setup(props) {
     const capabilityStore = useCapabilityStore()
     const capabilityRefs = storeToRefs(capabilityStore)
 
     const configStore = useConfigStore()
     const { serverUrl } = storeToRefs(configStore)
 
+    const externalIssuer = computed(() => {
+      if (props.recipient.shareType === ShareTypes.remote.value) {
+        return props.recipient.identities?.[0]?.issuer
+      }
+      return ''
+    })
+
     return {
       serverUrl,
-      userProfilePicture: capabilityRefs.sharingUserProfilePicture
+      userProfilePicture: capabilityRefs.sharingUserProfilePicture,
+      externalIssuer
     }
   },
   data(): { formattedRecipient: Recipient } {
+    let name = this.recipient.displayName
+    if (this.externalIssuer) {
+      name += ` (${this.externalIssuer})`
+    }
+
     return {
       formattedRecipient: {
-        name: this.recipient.displayName,
+        name,
         icon: this.getRecipientIcon(),
         hasAvatar: this.recipient.shareType === ShareTypes.user.value,
         isLoadingAvatar: true

packages/web-client/src/helpers/share/types.ts

@@ -1,4 +1,9 @@
-import { Identity, SharingLinkType, UnifiedRoleDefinition } from '../../graph/generated'
+import {
+  Identity,
+  ObjectIdentity,
+  SharingLinkType,
+  UnifiedRoleDefinition
+} from '../../graph/generated'
 import { Resource } from '../resource'
 
 export enum GraphSharePermission {
@@ -73,4 +78,5 @@ export interface CollaboratorAutoCompleteItem {
   shareType: number
   mail?: string
   onPremisesSamAccountName?: string
+  identities?: ObjectIdentity[]
 }