feat: enrich presence with roles

ui/src/ui/types.ts

@@ -246,6 +246,7 @@ export type ConfigSchemaResponse = {
 };
 
 export type PresenceEntry = {
+  deviceId?: string | null;
   instanceId?: string | null;
   host?: string | null;
   ip?: string | null;
@@ -256,6 +257,8 @@ export type PresenceEntry = {
   mode?: string | null;
   lastInputSeconds?: number | null;
   reason?: string | null;
+  roles?: string[] | null;
+  scopes?: string[] | null;
   text?: string | null;
   ts?: number | null;
 };

ui/src/ui/views/instances.ts

@@ -48,6 +48,14 @@ function renderEntry(entry: PresenceEntry) {
       ? `${entry.lastInputSeconds}s ago`
       : "n/a";
   const mode = entry.mode ?? "unknown";
+  const roles = Array.isArray(entry.roles) ? entry.roles.filter(Boolean) : [];
+  const scopes = Array.isArray(entry.scopes) ? entry.scopes.filter(Boolean) : [];
+  const scopesLabel =
+    scopes.length > 0
+      ? scopes.length > 3
+        ? `${scopes.length} scopes`
+        : `scopes: ${scopes.join(", ")}`
+      : null;
   return html`
     <div class="list-item">
       <div class="list-main">
@@ -55,6 +63,8 @@ function renderEntry(entry: PresenceEntry) {
         <div class="list-sub">${formatPresenceSummary(entry)}</div>
         <div class="chip-row">
           <span class="chip">${mode}</span>
+          ${roles.map((role) => html`<span class="chip">${role}</span>`)}
+          ${scopesLabel ? html`<span class="chip">${scopesLabel}</span>` : nothing}
           ${entry.platform ? html`<span class="chip">${entry.platform}</span>` : nothing}
           ${entry.deviceFamily
             ? html`<span class="chip">${entry.deviceFamily}</span>`