fix: api streaming issues

src/app/components/toolbar/toolbar.component.html

@@ -9,7 +9,7 @@
   <!-- Center links — only when logged in -->
   @if (currentUser) {
   <div class="nc-links">
-    <button type="button" class="nc-link">
+    <button type="button" class="nc-link" (click)="goToTournaments()">
       <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7"
         stroke-linecap="round" stroke-linejoin="round">
         <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" />

src/app/models/tournament.models.ts

@@ -51,13 +51,20 @@ export interface TournamentList {
   finished: Tournament[];
 }
 
+export interface TournamentMatch {
+  gameId: string;
+  whiteId: string;
+  winner?: 'white' | 'black' | 'draw' | null;
+  status?: GameStatus;
+}
+
 export interface TournamentPairing {
-  id: string;
-  round: number;
+  id?: string;
+  round?: number;
   white: TournamentBotRef | null;
   black: TournamentBotRef;
-  gameId: string | null;
-  winner: 'white' | 'black' | 'draw' | null;
+  matches: TournamentMatch[];
+  winner?: 'white' | 'black' | 'draw' | null;
 }
 
 export interface RoundPairings {

src/app/pages/tournaments/tournaments.component.html

@@ -158,9 +158,10 @@
                       <div class="state-msg small"><span class="pulse"></span>Loading…</div>
                     } @else if (pairings && pairings.pairings.length > 0) {
                       <div class="pairings-list">
-                        @for (p of pairings.pairings; track p.id) {
-                          <div class="pairing-row" [class.is-watchable]="!!p.gameId"
-                            (click)="p.gameId && watchGame(p.gameId)">
+                        @for (p of pairings.pairings; track pairingKey(p)) {
+                          @let gid = firstGameId(p);
+                          <div class="pairing-row" [class.is-watchable]="!!gid"
+                            (click)="gid && watchGame(gid)">
                             <span class="pairing-white">{{ p.white?.name ?? 'Bye' }}</span>
                             <span class="pairing-vs">vs</span>
                             <span class="pairing-black">{{ p.black.name }}</span>
@@ -168,7 +169,7 @@
                               <span class="pairing-result" [class]="'result-' + p.winner">
                                 {{ p.winner === 'draw' ? '½–½' : p.winner === 'white' ? '1–0' : '0–1' }}
                               </span>
-                            } @else if (p.gameId) {
+                            } @else if (gid) {
                               <span class="pairing-ongoing">
                                 <svg width="9" height="9" viewBox="0 0 24 24" fill="currentColor">
                                   <circle cx="12" cy="12" r="10"/>

src/app/pages/tournaments/tournaments.component.ts

@@ -10,7 +10,7 @@ import { BotService } from '../../services/bot.service';
 import { OfficialBotService } from '../../services/official-bot.service';
 import { TournamentServerService, ExternalTournamentServer } from '../../services/tournament-server.service';
 import { Bot } from '../../models/bot.models';
-import { Tournament, TournamentResult, RoundPairings } from '../../models/tournament.models';
+import { Tournament, TournamentResult, RoundPairings, TournamentPairing } from '../../models/tournament.models';
 import { CurrentUser } from '../../models/auth.models';
 import { environment } from '../../../environments/environment';
 
@@ -167,6 +167,16 @@ export class TournamentsComponent implements OnInit {
     });
   }
 
+  firstGameId(p: TournamentPairing): string | null {
+    return p.matches?.[0]?.gameId ?? null;
+  }
+
+  pairingKey(p: TournamentPairing): string {
+    const w = p.white?.id ?? 'bye';
+    const b = p.black?.id ?? 'bye';
+    return `${w}-${b}-${this.firstGameId(p) ?? ''}`;
+  }
+
   watchGame(gameId: string): void {
     const tid = this.selectedTournament?.id;
     if (!tid) return;