src/components/AdmitPendingMembersDialog.vue

@@ -52,7 +52,21 @@
                         :checked="isMemberSelected(member.did)"
                         @change="toggleMemberSelection(member.did)"
                       />
-                      {{ member.name || SOMEONE_UNNAMED }}
+                      <div class="">
+                        <div class="text-sm font-semibold">
+                          {{ member.name || SOMEONE_UNNAMED }}
+                        </div>
+                        <div
+                          class="flex items-center gap-0.5 text-xs text-slate-500"
+                        >
+                          <span class="font-semibold sm:hidden">DID:</span>
+                          <span
+                            class="w-[35vw] sm:w-auto truncate text-left"
+                            style="direction: rtl"
+                            >{{ member.did }}</span
+                          >
+                        </div>
+                      </div>
                     </label>
 
                     <!-- Contact indicator - only show if they are already a contact -->
@@ -81,7 +95,7 @@
             ]"
             @click="admitAndSetVisibility"
           >
-            Admit Pending + Add Contacts
+            Admit + Add Contacts
           </button>
           <button
             v-if="pendingMembersData && pendingMembersData.length > 0"
@@ -94,7 +108,7 @@
             ]"
             @click="admitOnly"
           >
-            Admit Pending Only
+            Admit Only
           </button>
           <button
             class="block w-full text-center text-md font-bold uppercase bg-slate-600 text-white px-2 py-2 rounded-md"