add instructions for contacting potential links to hidden people

src/views/ProjectViewView.vue

@@ -49,22 +49,14 @@
             <div class="text-sm mb-3">
               <div class="truncate">
                 <fa icon="user" class="fa-fw text-slate-400"></fa>
-                {{
-                  serverUtil.didInfo(issuer, activeDid, allMyDids, allContacts)
-                }}
+                {{ issuerInfoObject?.displayName }}
                 <span v-if="!serverUtil.isEmptyOrHiddenDid(issuer)">
-                  <button
-                    @click="
-                      libsUtil.doCopyTwoSecRedo(
-                        issuer,
-                        () => (showDidCopy = !showDidCopy),
-                      )
-                    "
-                    class="ml-2 mr-2"
-                  >
-                    <fa icon="copy" class="text-slate-400 fa-fw"></fa>
-                  </button>
-                  <span v-show="showDidCopy">Copied DID</span>
+                  <a :href="`/did/${issuer}`" target="_blank" class="text-blue-500">
+                    <fa icon="arrow-up-right-from-square" class="fa-fw" />
+                  </a>
+                </span>
+                <span v-else-if="serverUtil.isHiddenDid(issuer)">
+                  <fa icon="info-circle" class="fa-fw text-blue-500 cursor-pointer" @click="openHiddenDidDialog()" />
                 </span>
               </div>
               <div v-if="startTime">
@@ -76,14 +68,14 @@
                 <a
                   :href="getOpenStreetMapUrl()"
                   target="_blank"
-                  class="underline"
+                  class="underline text-blue-500"
                   >Map View
-                  <fa icon="arrow-up-right-from-square" class="fa-fw" />
+                  <fa icon="arrow-up-right-from-square" class="fa-fw text-blue-500" />
                 </a>
               </div>
               <div v-if="url">
                 <fa icon="globe" class="fa-fw text-slate-400"></fa>
-                <a :href="addScheme(url)" target="_blank" class="underline">
+                <a :href="addScheme(url)" target="_blank" class="underline text-blue-500">
                   {{ domainForWebsite(this.url) }}
                   <fa icon="arrow-up-right-from-square" class="fa-fw" />
                 </a>
@@ -477,6 +469,8 @@
       </div>
     </div>
   </section>
+
+  <HiddenDidDialog ref="hiddenDidDialog" />
 </template>
 
 <script lang="ts">
@@ -508,11 +502,13 @@ import {
 } from "@/libs/endorserServer";
 import * as serverUtil from "@/libs/endorserServer";
 import { retrieveAccountDids } from "@/libs/util";
+import HiddenDidDialog from "@/components/HiddenDidDialog.vue";
 
 @Component({
   components: {
     EntityIcon,
     GiftedDialog,
+    HiddenDidDialog,
     OfferDialog,
     ProjectIcon,
     QuickNav,
@@ -524,6 +520,7 @@ export default class ProjectViewView extends Vue {
 
   activeDid = "";
   agentDid = "";
+  agentDidVisibleToDids: Array<string> = [];
   allMyDids: Array<string> = [];
   allContacts: Array<Contact> = [];
   apiServer = "";
@@ -540,6 +537,8 @@ export default class ProjectViewView extends Vue {
   imageUrl = "";
   isRegistered = false;
   issuer = "";
+  issuerInfoObject: { known: boolean; displayName: string; profileImageUrl?: string } | null = null;
+  issuerVisibleToDids: Array<string> = [];
   latitude = 0;
   longitude = 0;
   name = "";
@@ -547,7 +546,6 @@ export default class ProjectViewView extends Vue {
   offersHitLimit = false;
   projectId = ""; // handle ID
   recentlyCheckedAndUnconfirmableJwts: string[] = [];
-  showDidCopy = false;
   startTime = "";
   truncatedDesc = "";
   truncateLength = 40;
@@ -625,8 +623,16 @@ export default class ProjectViewView extends Vue {
             startDateTime.toLocaleTimeString();
         }
         this.agentDid = resp.data.claim?.agent?.identifier;
+        this.agentDidVisibleToDids = resp.data.claim?.agent?.identifierVisibleToDids || [];
         this.imageUrl = resp.data.claim?.image;
         this.issuer = resp.data.issuer;
+        this.issuerInfoObject = serverUtil.didInfoObject(
+          this.issuer,
+          this.activeDid,
+          this.allMyDids,
+          this.allContacts,
+        );
+        this.issuerVisibleToDids = resp.data.issuerVisibleToDids || [];
         this.name = resp.data.claim?.name || "(no name)";
         this.description = resp.data.claim?.description || "(no description)";
         this.truncatedDesc = this.description.slice(0, this.truncateLength);
@@ -1158,5 +1164,15 @@ export default class ProjectViewView extends Vue {
       );
     }
   }
+
+  openHiddenDidDialog() {
+    (this.$refs.hiddenDidDialog as HiddenDidDialog).open(
+      "creator",
+      this.issuerVisibleToDids,
+      this.allContacts,
+      this.activeDid,
+      this.allMyDids
+    );
+  }
 }
 </script>