From 54a0d84cb52b98ee5197051c32dcebff4d8ee0b3 Mon Sep 17 00:00:00 2001
From: Leo Vasanko <git@vasanko.com>
Date: Tue, 2 Sep 2025 08:02:52 +0000
Subject: [PATCH] Smarter user info

---
 frontend/src/admin/AdminApp.vue           |  9 +++------
 frontend/src/components/UserBasicInfo.vue | 12 ++++++++++--
 2 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/frontend/src/admin/AdminApp.vue b/frontend/src/admin/AdminApp.vue
index efc6594..0eb9ff0 100644
--- a/frontend/src/admin/AdminApp.vue
+++ b/frontend/src/admin/AdminApp.vue
@@ -483,14 +483,11 @@ async function submitDialog() {
             :created-at="userDetail.created_at"
             :last-seen="userDetail.last_seen"
             :loading="loading"
+            :org-display-name="userDetail.org.display_name"
+            :role-name="userDetail.role"
             :update-endpoint="`/auth/admin/users/${selectedUser.uuid}/display-name`"
             @saved="onUserNameSaved"
-          >
-            <span><strong>Organization:</strong></span>
-            <span>{{ userDetail.org.display_name }}</span>
-            <span><strong>Role:</strong></span>
-            <span>{{ userDetail.role }}</span>
-          </UserBasicInfo>
+          />
           <div v-else-if="userDetail?.error" class="error small">{{ userDetail.error }}</div>
           <template v-if="userDetail && !userDetail.error">
             <h3 class="cred-title">Registered Passkeys</h3>
diff --git a/frontend/src/components/UserBasicInfo.vue b/frontend/src/components/UserBasicInfo.vue
index 59b95da..efd3cea 100644
--- a/frontend/src/components/UserBasicInfo.vue
+++ b/frontend/src/components/UserBasicInfo.vue
@@ -19,7 +19,10 @@
         <button class="mini-btn" @click="cancelEdit" :disabled="busy || loading" title="Cancel">✖</button>
       </span>
     </h3>
-    <slot />
+    <div v-if="orgDisplayName || roleName" class="org-role-sub">
+      <div class="org-line" v-if="orgDisplayName">{{ orgDisplayName }}</div>
+      <div class="role-line" v-if="roleName">{{ roleName }}</div>
+    </div>
     <span><strong>Visits:</strong></span>
     <span>{{ visits || 0 }}</span>
     <span><strong>Registered:</strong></span>
@@ -41,7 +44,9 @@ const props = defineProps({
   lastSeen: { type: [String, Number, Date], default: null },
   updateEndpoint: { type: String, default: null },
   canEdit: { type: Boolean, default: true },
-  loading: { type: Boolean, default: false }
+  loading: { type: Boolean, default: false },
+  orgDisplayName: { type: String, default: '' },
+  roleName: { type: String, default: '' }
 })
 
 const emit = defineEmits(['saved'])
@@ -77,6 +82,9 @@ watch(() => props.name, () => { if (!props.name) editingName.value = false })
 <style scoped>
 .user-info { display: grid; grid-template-columns: auto 1fr; gap: 10px; }
 .user-info h3 { grid-column: span 2; }
+.org-role-sub { grid-column: span 2; display:flex; flex-direction:column; margin: -0.15rem 0 0.25rem; }
+.org-line { font-size: .7rem; font-weight:600; line-height:1.1; }
+.role-line { font-size:.6rem; color:#555; line-height:1.1; }
 .user-info span { text-align: left; }
 .user-name-heading { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; margin: 0 0 0.25rem 0; }
 .user-name-row { display: inline-flex; align-items: center; gap: 0.35rem; max-width: 100%; }