Fix users list to only show server users

src/app/features/room/rooms-side-panel/rooms-side-panel.component.html

@@ -261,11 +261,11 @@
       }
 
       <!-- Other Online Users -->
-      @if (onlineUsersFiltered().length > 0) {
+      @if (onlineRoomUsers().length > 0) {
         <div class="mb-4">
-          <h4 class="text-xs uppercase tracking-wide text-muted-foreground font-medium mb-2 px-1">Online - {{ onlineUsersFiltered().length }}</h4>
+          <h4 class="text-xs uppercase tracking-wide text-muted-foreground font-medium mb-2 px-1">Online - {{ onlineRoomUsers().length }}</h4>
           <div class="space-y-1">
-            @for (user of onlineUsersFiltered(); track user.id) {
+            @for (user of onlineRoomUsers(); track user.id) {
               <div
                 class="flex items-center gap-2 px-2 py-1.5 rounded hover:bg-secondary/40 group/user"
                 (contextmenu)="openUserContextMenu($event, user)"
@@ -354,7 +354,7 @@
       }
 
       <!-- No other users message -->
-      @if (onlineUsersFiltered().length === 0 && offlineRoomMembers().length === 0) {
+      @if (onlineRoomUsers().length === 0 && offlineRoomMembers().length === 0) {
         <div class="text-center py-4 text-muted-foreground">
           <p class="text-sm">No other users in this server</p>
         </div>

src/app/features/room/rooms-side-panel/rooms-side-panel.component.ts

@@ -104,15 +104,30 @@ export class RoomsSidePanelComponent {
   textChannels = this.store.selectSignal(selectTextChannels);
   voiceChannels = this.store.selectSignal(selectVoiceChannels);
   roomMembers = computed(() => this.currentRoom()?.members ?? []);
-  offlineRoomMembers = computed(() => {
-    const current = this.currentUser();
-    const onlineIds = new Set(this.onlineUsers().map((user) => user.oderId || user.id));
+  roomMemberIdentifiers = computed(() => {
+    const identifiers = new Set<string>();
 
-    if (current) {
-      onlineIds.add(current.oderId || current.id);
+    for (const member of this.roomMembers()) {
+      this.addIdentifiers(identifiers, member);
     }
 
-    return this.roomMembers().filter((member) => !onlineIds.has(this.roomMemberKey(member)));
+    return identifiers;
+  });
+  onlineRoomUsers = computed(() => {
+    const memberIdentifiers = this.roomMemberIdentifiers();
+
+    return this.onlineUsers().filter((user) => !this.isCurrentUserIdentity(user) && this.matchesIdentifiers(memberIdentifiers, user));
+  });
+  offlineRoomMembers = computed(() => {
+    const onlineIdentifiers = new Set<string>();
+
+    for (const user of this.onlineRoomUsers()) {
+      this.addIdentifiers(onlineIdentifiers, user);
+    }
+
+    this.addIdentifiers(onlineIdentifiers, this.currentUser());
+
+    return this.roomMembers().filter((member) => !this.matchesIdentifiers(onlineIdentifiers, member));
   });
   knownUserCount = computed(() => {
     const memberIds = new Set(
@@ -151,18 +166,36 @@ export class RoomsSidePanelComponent {
   volumeMenuPeerId = signal('');
   volumeMenuDisplayName = signal('');
 
-  onlineUsersFiltered() {
-    const current = this.currentUser();
-    const currentId = current?.id;
-    const currentOderId = current?.oderId;
-
-    return this.onlineUsers().filter((user) => user.id !== currentId && user.oderId !== currentOderId);
-  }
-
   private roomMemberKey(member: RoomMember): string {
     return member.oderId || member.id;
   }
 
+  private addIdentifiers(identifiers: Set<string>, entity: { id?: string; oderId?: string } | null | undefined): void {
+    if (!entity)
+      return;
+
+    if (entity.id) {
+      identifiers.add(entity.id);
+    }
+
+    if (entity.oderId) {
+      identifiers.add(entity.oderId);
+    }
+  }
+
+  private matchesIdentifiers(identifiers: Set<string>, entity: { id?: string; oderId?: string }): boolean {
+    return !!((entity.id && identifiers.has(entity.id)) || (entity.oderId && identifiers.has(entity.oderId)));
+  }
+
+  private isCurrentUserIdentity(entity: { id?: string; oderId?: string }): boolean {
+    const current = this.currentUser();
+
+    return !!current && (
+      (typeof entity.id === 'string' && entity.id === current.id)
+      || (typeof entity.oderId === 'string' && entity.oderId === current.oderId)
+    );
+  }
+
   canManageChannels(): boolean {
     const room = this.currentRoom();
     const user = this.currentUser();