bugfix(ocm): exclude the local instance in the inviter select

changelog/unreleased/bugfix-ocm-local-instance-check

@@ -0,0 +1,5 @@
+Bugfix: OCM local instance check
+
+We've fixed the issue where the current instance was not recognized as a local instance in inviter select.
+
+https://github.com/owncloud/web/pull/11560

packages/web-app-ocm/src/views/IncomingInvitations.vue

@@ -2,13 +2,13 @@
   <div id="incoming" class="sciencemesh-app">
     <div>
       <div class="oc-flex oc-flex-middle oc-px-m oc-py-s">
-        <oc-icon name="user-received" />
-        <h2 class="oc-px-s" v-text="$gettext('Accept invitations')" />
-        <oc-contextual-helper class="oc-pl-xs" v-bind="helperContent" />
+        <oc-icon name="user-received"/>
+        <h2 class="oc-px-s" v-text="$gettext('Accept invitations')"/>
+        <oc-contextual-helper class="oc-pl-xs" v-bind="helperContent"/>
       </div>
       <div v-if="!providers.length" class="oc-flex oc-flex-center oc-flex-middle">
-        <oc-icon name="error-warning" fill-type="line" class="oc-mr-s" size="large" />
-        <span v-text="$gettext('The list of institutions is empty. Please contact your admin.')" />
+        <oc-icon name="error-warning" fill-type="line" class="oc-mr-s" size="large"/>
+        <span v-text="$gettext('The list of institutions is empty. Please contact your admin.')"/>
       </div>
       <div v-else class="oc-flex oc-flex-column oc-flex-middle oc-flex-center oc-p-m">
         <div class="oc-width-1-2">
@@ -30,15 +30,15 @@
             <template #option="{ full_name, domain }">
               <div class="oc-text-break">
                 <span class="option">
-                  <strong v-text="full_name" />
+                  <strong v-text="full_name"/>
                 </span>
-                <span class="option" v-text="domain" />
+                <span class="option" v-text="domain"/>
               </div>
             </template>
-            <template #no-options> No institutions found with this name </template>
+            <template #no-options> No institutions found with this name</template>
             <template #selected-option="{ full_name, domain }">
               <div class="options-wrapper oc-text-break">
-                <strong class="oc-mr-s oc-text-break" v-text="full_name" />
+                <strong class="oc-mr-s oc-text-break" v-text="full_name"/>
                 <small
                   v-oc-tooltip="domain"
                   v-text="domain.length > 17 ? domain.slice(0, 20) + '...' : domain"
@@ -54,16 +54,16 @@
           </div>
         </div>
         <oc-button size="small" :disabled="acceptInvitationButtonDisabled" @click="acceptInvite">
-          <oc-icon name="add" />
-          <span v-text="$gettext('Accept invitation')" />
+          <oc-icon name="add"/>
+          <span v-text="$gettext('Accept invitation')"/>
         </oc-button>
       </div>
     </div>
   </div>
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, onMounted, ref, unref } from 'vue'
+import {computed, defineComponent, onMounted, ref, unref} from 'vue'
 import {
   queryItemAsString,
   useClientService,
@@ -72,19 +72,19 @@ import {
   useMessages,
   useConfigStore
 } from '@ownclouders/web-pkg'
-import { useGettext } from 'vue3-gettext'
-import { onBeforeRouteUpdate, RouteLocationNormalized } from 'vue-router'
-import { ProviderSchema, providerListSchema } from '../schemas'
-import { OcTextInput } from '@ownclouders/design-system/src/components'
+import {useGettext} from 'vue3-gettext'
+import {onBeforeRouteUpdate, RouteLocationNormalized} from 'vue-router'
+import {ProviderSchema, providerListSchema} from '../schemas'
+import {OcTextInput} from '@ownclouders/design-system/src/components'
 
 export default defineComponent({
   emits: ['highlightNewConnections'],
-  setup(props, { emit }) {
-    const { showErrorMessage } = useMessages()
+  setup(props, {emit}) {
+    const {showErrorMessage} = useMessages()
     const router = useRouter()
     const clientService = useClientService()
     const configStore = useConfigStore()
-    const { $gettext } = useGettext()
+    const {$gettext} = useGettext()
 
     const token = ref<string>(undefined)
     const provider = ref<ProviderSchema>(undefined)
@@ -122,7 +122,7 @@ export default defineComponent({
         token.value = undefined
         provider.value = undefined
 
-        const { token: currentToken, providerDomain, ...query } = unref(route).query
+        const {token: currentToken, providerDomain, ...query} = unref(route).query
         router.replace({
           name: 'open-cloud-mesh-invitations',
           query
@@ -135,7 +135,7 @@ export default defineComponent({
     }
     const listProviders = async () => {
       try {
-        const { data: allProviders } = await clientService.httpAuthenticated.get(
+        const {data: allProviders} = await clientService.httpAuthenticated.get(
           '/sciencemesh/list-providers',
           {
             schema: providerListSchema
@@ -155,7 +155,23 @@ export default defineComponent({
       }
     }
     const isMyProviderSelectedProvider = (p: ProviderSchema) => {
-      return p.domain === new URL(configStore.serverUrl).hostname
+      // the protocol is not important, we just need the host and port, it's there to make it compatible with URL
+      const toURL = (purl: string) => new URL(purl.split('://').length === 1 ? `https://${purl}` : purl);
+      const {host: configStoreHost, port: configStorePort} = toURL(configStore.serverUrl)
+      const {host: providerSchemaHost, port: providerSchemaPort} = toURL(p.domain)
+      const considerations = [
+        // check if the host is the same
+        configStoreHost === providerSchemaHost,
+        // also check the port, multiple instances can run on the same host but not on the same port...
+        configStorePort === providerSchemaPort,
+      ]
+
+      switch (true) {
+        case !considerations.length:
+          return false
+        default:
+          return considerations.every((c) => c)
+      }
     }
 
     const handleParams = (to: RouteLocationNormalized) => {