Merge branch 'feat/group-name-per-owner'

1 files changed, 11 insertions, 8 deletions

diff --git a/packages/meshbay-hub/src/meshbay_hub/static/app.js b/packages/meshbay-hub/src/meshbay_hub/static/app.js
index 9164a4d..18f34fc 100644
--- a/packages/meshbay-hub/src/meshbay_hub/static/app.js
+++ b/packages/meshbay-hub/src/meshbay_hub/static/app.js
@@ -16,6 +16,7 @@ import {
   refreshAccessToken,
 } from './hub-client.js';
 import { GroupPage } from './group-page.js';
+import { GroupName } from './group-name.js';
 import { APPS } from './apps.js';
 
 // ── Constants ────────────────────────────────────────────────────────────────
@@ -352,7 +353,9 @@ function Sidebar({ groups, presence, indexProgressPct, route, menuOpen, role, ha
                 <span class="presence presence-${state}"
                       title="${label}"
                       aria-label="${label}"></span>
-                <span class="sidebar-item-name">${g.name}</span>
+                <span class="sidebar-item-name">
+                  <${GroupName} name=${g.name} owner=${g.owner_username} />
+                </span>
               </a>
             `;
           })
@@ -699,13 +702,11 @@ function ExplorePage({ token, myGroupIds, allowPublicGroups = true }) {
               ${groups.map(g => html`
                 <div key=${g.id} class="group-card">
                   <a href="#/group/${g.id}" style="text-decoration:none;color:inherit">
-                    <h3>${g.name}</h3>
+                    <h3><${GroupName} name=${g.name}
+                      owner=${g.source && g.source !== 'local' ? g.source : g.owner_username} /></h3>
                     ${g.description && html`<p class="group-card-desc">${g.description}</p>`}
                   </a>
                   <span class="badge">${g.join_policy}</span>
-                  ${g.source && g.source !== 'local' && html`
-                    ${' '}<span class="badge">${g.source}</span>
-                  `}
                   ${' '}
                   ${isMember(g.id)
                     ? html`<span class="badge">${t('explore.member')}</span>`
@@ -1331,7 +1332,7 @@ function SearchPage() {
         if (e.name.toLowerCase().includes(term) ||
             (e.path && e.path.toLowerCase().includes(term))) {
           hits.push({ ...e, groupId: idx.groupId, groupName: idx.groupName,
-                      syncedAt: idx.cachedAt });
+                      groupOwner: idx.groupOwner, syncedAt: idx.cachedAt });
         }
       }
     }
@@ -1376,7 +1377,9 @@ function SearchPage() {
                 </td>
                 <td class="file-size">${formatSize(r.size)}</td>
                 <td>
-                  <a href="#/group/${r.groupId}" class="badge">${r.groupName || r.groupId.slice(0, 8)}</a>
+                  <a href="#/group/${r.groupId}" class="badge">${r.groupName
+                    ? html`<${GroupName} name=${r.groupName} owner=${r.groupOwner} inline=${true} />`
+                    : r.groupId.slice(0, 8)}</a>
                   ${r.syncedAt && html`
                     <div class="search-synced">
                       ${t('search.synced', { ago: formatAgo(r.syncedAt) })}
@@ -2175,7 +2178,7 @@ function AdminPage({ token, role }) {
             ${groups.length === 0 && html`<tr><td colspan="6" class="admin-empty">${t('admin.no_groups')}</td></tr>`}
             ${groups.map(g => html`
               <tr key=${g.id}>
-                <td>${g.name}</td>
+                <td><${GroupName} name=${g.name} owner=${g.owner_username} /></td>
                 <td><span class="badge">${g.visibility}</span></td>
                 <td>${g.member_count}</td>
                 <td><span class="badge ${g.status === 'active' ? 'badge-ok' : g.status === 'suspended' ? 'badge-err' : ''}">${g.status}</span></td>