ci: bump version to v0.4.4

fix(tournaments): load both user bots and official bots in join dialog
openJoinDialog now fetches user bots and official bots in parallel via forkJoin. Each section shows its own empty state independently. Official bot difficulty buttons are hidden when no official bots are registered. User bots empty state links to /bots to create one. Disables all join buttons while any join is in progress. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-06-21 14:06:48 +00:00 · 2026-06-21 15:40:24 +02:00 · 2026-06-21 09:06:47 +00:00 · 2026-06-21 11:00:29 +02:00 · 2026-06-17 09:19:46 +00:00 · 2026-06-17 10:50:16 +02:00
20 changed files with 786 additions and 493 deletions
@@ -56,3 +56,33 @@
 ### Bug Fixes

 * route play-vs-bot to /vs-bot endpoint ([a620735](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/commit/a62073511f2ac912ceb0f6b4730bef37545dd8ea))
+## [0.0.0](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/compare/0.2.8...0.0.0) (2026-06-10)
+
+### Features
+
+* bots ([#9](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/issues/9)) ([48959da](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/commit/48959daae36e709ea7782ca04fdde699854f8e66))
+## [0.0.0](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/compare/0.3.0...0.0.0) (2026-06-17)
+
+### Features
+
+* NCWF-5/6/7/8/9 chess analysis page and engine integration ([#11](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/issues/11)) ([f9420e5](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/commit/f9420e5848d8724bcb0e9cf08f08b871c91cf4ba))
+## [0.0.0](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/compare/0.4.0...0.0.0) (2026-06-17)
+
+### Bug Fixes
+
+* **auth:** attach Bearer token to /api/bots requests ([#12](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/issues/12)) ([a54957a](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/commit/a54957aa74ef15bf2dd439d386e221ac134c5c5c))
+## [0.0.0](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/compare/0.4.1...0.0.0) (2026-06-17)
+
+### Bug Fixes
+
+* NCS-122 send WS token via first-message auth instead of query param ([#13](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/issues/13)) ([1d2c217](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/commit/1d2c217da8982d361e2eb7de26f6447171a1dd43))
+## [0.0.0](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/compare/0.4.2...0.0.0) (2026-06-21)
+
+### Bug Fixes
+
+* **analysis:** fix API field mismatch and enable full game analysis ([ce1fb0d](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/commit/ce1fb0d60b695093495ee0ad824c511dd2db7fbb))
+## [0.0.0](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/compare/0.4.3...0.0.0) (2026-06-21)
+
+### Bug Fixes
+
+* **tournaments:** load both user bots and official bots in join dialog ([5b5fd6f](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/commit/5b5fd6f027b4aedb951a802725fcd929d514c359))
@@ -17,5 +17,5 @@ export const routes: Routes = [
  { path: 'bots', component: BotsComponent },
  { path: 'analysis', component: AnalysisComponent },
  { path: 'game/:gameId', component: GameComponent },
-  { path: '**', redirectTo: '' },
+  { path: '**', redirectTo: '' }
 ];
@@ -7,7 +7,7 @@ describe('App', () => {
  beforeEach(async () => {
    await TestBed.configureTestingModule({
      imports: [App],
-      providers: [provideRouter([]), provideHttpClient()],
+      providers: [provideRouter([]), provideHttpClient()]
    }).compileComponents();
  });

@@ -1,4 +1,5 @@
 <nav class="nc-nav">
+
  <!-- Logo -->
  <div class="nc-logo" (click)="goToHome()" role="button" tabindex="0">
    <div class="nc-logo-mark">♞</div>
@@ -7,315 +8,202 @@

  <!-- Center links — only when logged in -->
  @if (currentUser) {
-    <div class="nc-links">
-      <button type="button" class="nc-link">
-        <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" />
-          <circle cx="12" cy="12" r="3" />
-        </svg>
-        Watch
-      </button>
-      <button type="button" class="nc-link" (click)="goToTournaments()">Tournaments</button>
-      <button type="button" class="nc-link" (click)="goToBots()">Bots</button>
-      <button type="button" class="nc-link" (click)="goToAnalysis()">Analysis</button>
-    </div>
+  <div class="nc-links">
+    <button type="button" class="nc-link">
+      <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" />
+        <circle cx="12" cy="12" r="3" />
+      </svg>
+      Watch
+    </button>
+    <button type="button" class="nc-link" (click)="goToTournaments()">Tournaments</button>
+    <button type="button" class="nc-link" (click)="goToBots()">Bots</button>
+    <button type="button" class="nc-link" (click)="goToAnalysis()">Analysis</button>
+  </div>
  }

  <!-- Right cluster -->
  <div class="nc-right">
+
    @if (currentUser; as user) {
-      <!-- Notifications bell -->
-      <div class="nc-dropdown-wrap" data-dropdown="notif">
-        <button
-          type="button"
-          class="nc-bell"
-          [class.is-open]="notifOpen"
-          (click)="toggleNotif($event)"
-          aria-label="Notifications"
-        >
-          <svg
-            width="18"
-            height="18"
-            viewBox="0 0 24 24"
-            fill="none"
-            stroke="currentColor"
-            stroke-width="1.6"
-            stroke-linecap="round"
-            stroke-linejoin="round"
-          >
-            <path d="M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9" />
-            <path d="M10.3 21a1.94 1.94 0 0 0 3.4 0" />
-          </svg>
-          @if (incomingChallenges.length > 0) {
-            <span class="nc-badge">{{ incomingChallenges.length }}</span>
-          }
-        </button>

-        @if (notifOpen) {
-          <div class="nc-popover nc-notif" (click)="$event.stopPropagation()">
-            <div class="nc-notif-header">
-              <span class="nc-notif-header-title">Challenges</span>
-            </div>
-
-            <div class="nc-notif-list">
-              @if (incomingChallenges.length === 0) {
-                <div class="nc-notif-empty">No pending challenges</div>
-              }
-              @for (challenge of incomingChallenges; track challenge.id) {
-                <div class="nc-notif-row is-unread">
-                  <div class="nc-notif-icon">
-                    <svg
-                      width="14"
-                      height="14"
-                      viewBox="0 0 24 24"
-                      fill="none"
-                      stroke="currentColor"
-                      stroke-width="1.6"
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                    >
-                      <line x1="14.5" y1="17.5" x2="3" y2="6" />
-                      <path d="M13 19l6 -6" />
-                      <path d="M16 16l4 4" />
-                      <path d="M19 21l2 -2" />
-                      <path d="M15 5l4 4" />
-                      <path d="M21 3l-3 1l-4 4" />
-                    </svg>
-                  </div>
-                  <div class="nc-notif-body">
-                    <div class="nc-notif-text">
-                      <b>{{ challenge.challenger.name }}</b> challenged you to a
-                      {{ getTimeControlDisplay(challenge) }} game.
-                    </div>
-                    <div class="nc-notif-meta">
-                      {{ challenge.challenger.rating }} ·
-                      {{ challenge.timeControl.type ?? 'Custom' }} ·
-                      {{ getExpirationInfo(challenge) }}
-                    </div>
-                    <div class="nc-notif-actions">
-                      <button
-                        type="button"
-                        class="nc-btn-accept"
-                        [disabled]="acceptingId === challenge.id || !!decliningId"
-                        (click)="acceptChallenge($event, challenge)"
-                      >
-                        <svg
-                          width="11"
-                          height="11"
-                          viewBox="0 0 24 24"
-                          fill="none"
-                          stroke="currentColor"
-                          stroke-width="2.4"
-                          stroke-linecap="round"
-                          stroke-linejoin="round"
-                        >
-                          <polyline points="20 6 9 17 4 12" />
-                        </svg>
-                        {{ acceptingId === challenge.id ? '...' : 'Accept' }}
-                      </button>
-                      <button
-                        type="button"
-                        class="nc-btn-decline"
-                        [disabled]="!!acceptingId || decliningId === challenge.id"
-                        (click)="declineChallenge($event, challenge)"
-                      >
-                        <svg
-                          width="10"
-                          height="10"
-                          viewBox="0 0 24 24"
-                          fill="none"
-                          stroke="currentColor"
-                          stroke-width="2.4"
-                          stroke-linecap="round"
-                          stroke-linejoin="round"
-                        >
-                          <line x1="18" y1="6" x2="6" y2="18" />
-                          <line x1="6" y1="6" x2="18" y2="18" />
-                        </svg>
-                        {{ decliningId === challenge.id ? '...' : 'Decline' }}
-                      </button>
-                    </div>
-                  </div>
-                </div>
-              }
-            </div>
-
-            <div class="nc-notif-footer">
-              <button type="button" class="nc-view-all" (click)="goToChallenges()">
-                View all challenges
-              </button>
-            </div>
-          </div>
-        }
-      </div>
-
-      <!-- Games quick-access -->
-      <button type="button" class="nc-games-btn" (click)="goToGames()">
-        <svg
-          width="13"
-          height="13"
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="currentColor"
-          stroke-width="1.7"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-        >
-          <path d="M14.5 17.5L3 6" />
-          <path d="M13 19l6-6" />
-          <path d="M16 16l4 4" />
-          <path d="M19 21l2-2" />
-          <path d="M15 5l4 4" />
-          <path d="M21 3l-3 1-4 4" />
+    <!-- Notifications bell -->
+    <div class="nc-dropdown-wrap" data-dropdown="notif">
+      <button type="button" class="nc-bell" [class.is-open]="notifOpen" (click)="toggleNotif($event)"
+        aria-label="Notifications">
+        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6"
+          stroke-linecap="round" stroke-linejoin="round">
+          <path d="M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9" />
+          <path d="M10.3 21a1.94 1.94 0 0 0 3.4 0" />
        </svg>
-        Games
+        @if (incomingChallenges.length > 0) {
+        <span class="nc-badge">{{ incomingChallenges.length }}</span>
+        }
      </button>

-      <!-- Profile -->
-      <div class="nc-dropdown-wrap" data-dropdown="profile">
-        <button
-          type="button"
-          class="nc-profile"
-          [class.is-open]="profileOpen"
-          (click)="toggleProfile($event)"
-        >
-          <div class="nc-avatar nc-avatar-sm">{{ getInitial() }}</div>
-          <span class="nc-profile-name">{{ user.username }}</span>
-          <svg
-            class="nc-chevron"
-            width="12"
-            height="12"
-            viewBox="0 0 24 24"
-            fill="none"
-            stroke="currentColor"
-            stroke-width="2"
-            stroke-linecap="round"
-            stroke-linejoin="round"
-          >
-            <polyline points="6 9 12 15 18 9" />
-          </svg>
-        </button>
+      @if (notifOpen) {
+      <div class="nc-popover nc-notif" (click)="$event.stopPropagation()">
+        <div class="nc-notif-header">
+          <span class="nc-notif-header-title">Challenges</span>
+        </div>

-        @if (profileOpen) {
-          <div class="nc-popover nc-menu" (click)="$event.stopPropagation()">
-            <div class="nc-menu-header">
-              <div class="nc-avatar nc-avatar-md">{{ getInitial() }}</div>
-              <div>
-                <div class="nc-menu-user-name">{{ user.username }}</div>
-                <div class="nc-menu-user-sub">{{ user.rating }} · &#64;{{ user.username }}</div>
+        <div class="nc-notif-list">
+          @if (incomingChallenges.length === 0) {
+          <div class="nc-notif-empty">No pending challenges</div>
+          }
+          @for (challenge of incomingChallenges; track challenge.id) {
+          <div class="nc-notif-row is-unread">
+            <div class="nc-notif-icon">
+              <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6"
+                stroke-linecap="round" stroke-linejoin="round">
+                <line x1="14.5" y1="17.5" x2="3" y2="6" />
+                <path d="M13 19l6 -6" /><path d="M16 16l4 4" />
+                <path d="M19 21l2 -2" /><path d="M15 5l4 4" />
+                <path d="M21 3l-3 1l-4 4" />
+              </svg>
+            </div>
+            <div class="nc-notif-body">
+              <div class="nc-notif-text">
+                <b>{{ challenge.challenger.name }}</b> challenged you to a
+                {{ getTimeControlDisplay(challenge) }} game.
+              </div>
+              <div class="nc-notif-meta">
+                {{ challenge.challenger.rating }} · {{ challenge.timeControl.type ?? 'Custom' }} · {{ getExpirationInfo(challenge) }}
+              </div>
+              <div class="nc-notif-actions">
+                <button type="button" class="nc-btn-accept"
+                  [disabled]="acceptingId === challenge.id || !!decliningId"
+                  (click)="acceptChallenge($event, challenge)">
+                  <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4"
+                    stroke-linecap="round" stroke-linejoin="round">
+                    <polyline points="20 6 9 17 4 12" />
+                  </svg>
+                  {{ acceptingId === challenge.id ? '...' : 'Accept' }}
+                </button>
+                <button type="button" class="nc-btn-decline"
+                  [disabled]="!!acceptingId || decliningId === challenge.id"
+                  (click)="declineChallenge($event, challenge)">
+                  <svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4"
+                    stroke-linecap="round" stroke-linejoin="round">
+                    <line x1="18" y1="6" x2="6" y2="18" /><line x1="6" y1="6" x2="18" y2="18" />
+                  </svg>
+                  {{ decliningId === challenge.id ? '...' : 'Decline' }}
+                </button>
              </div>
            </div>
-
-            <div class="nc-menu-group">
-              <button type="button" class="nc-menu-item" (click)="goToProfile()">
-                <span class="nc-menu-icon">
-                  <svg
-                    width="14"
-                    height="14"
-                    viewBox="0 0 24 24"
-                    fill="none"
-                    stroke="currentColor"
-                    stroke-width="1.8"
-                    stroke-linecap="round"
-                    stroke-linejoin="round"
-                  >
-                    <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2" />
-                    <circle cx="12" cy="7" r="4" />
-                  </svg>
-                </span>
-                <span class="nc-menu-label">My profile</span>
-              </button>
-
-              <button type="button" class="nc-menu-item" (click)="goToChallenges()">
-                <span class="nc-menu-icon">
-                  <svg
-                    width="14"
-                    height="14"
-                    viewBox="0 0 24 24"
-                    fill="none"
-                    stroke="currentColor"
-                    stroke-width="1.6"
-                    stroke-linecap="round"
-                    stroke-linejoin="round"
-                  >
-                    <line x1="14.5" y1="17.5" x2="3" y2="6" />
-                    <path d="M13 19l6 -6" />
-                    <path d="M16 16l4 4" />
-                    <path d="M19 21l2 -2" />
-                    <path d="M15 5l4 4" />
-                    <path d="M21 3l-3 1l-4 4" />
-                  </svg>
-                </span>
-                <span class="nc-menu-label">Challenges</span>
-              </button>
-
-              <button type="button" class="nc-menu-item" (click)="toggleTheme($event)">
-                <span class="nc-menu-icon">
-                  <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="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z" />
-                  </svg>
-                </span>
-                <span class="nc-menu-label">{{ isDarkMode ? 'Light mode' : 'Dark mode' }}</span>
-                <span class="nc-toggle" [class.is-on]="isDarkMode"></span>
-              </button>
-            </div>
-
-            <div class="nc-menu-group">
-              <button type="button" class="nc-menu-item danger" (click)="logout()">
-                <span class="nc-menu-icon">
-                  <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="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" />
-                    <polyline points="16 17 21 12 16 7" />
-                    <line x1="21" y1="12" x2="9" y2="12" />
-                  </svg>
-                </span>
-                <span class="nc-menu-label">Log out</span>
-              </button>
-            </div>
          </div>
-        }
+          }
+        </div>
+
+        <div class="nc-notif-footer">
+          <button type="button" class="nc-view-all" (click)="goToChallenges()">View all challenges</button>
+        </div>
      </div>
-    } @else {
-      <!-- Logged-out auth buttons -->
-      <button type="button" class="nc-auth-btn" (click)="openLoginDialog()">Login</button>
-      <button type="button" class="nc-auth-btn nc-auth-btn--primary" (click)="openRegisterDialog()">
-        Register
+      }
+    </div>
+
+    <!-- Games quick-access -->
+    <button type="button" class="nc-games-btn" (click)="goToGames()">
+      <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7"
+        stroke-linecap="round" stroke-linejoin="round">
+        <path d="M14.5 17.5L3 6"/>
+        <path d="M13 19l6-6"/><path d="M16 16l4 4"/>
+        <path d="M19 21l2-2"/><path d="M15 5l4 4"/>
+        <path d="M21 3l-3 1-4 4"/>
+      </svg>
+      Games
+    </button>
+
+    <!-- Profile -->
+    <div class="nc-dropdown-wrap" data-dropdown="profile">
+      <button type="button" class="nc-profile" [class.is-open]="profileOpen" (click)="toggleProfile($event)">
+        <div class="nc-avatar nc-avatar-sm">{{ getInitial() }}</div>
+        <span class="nc-profile-name">{{ user.username }}</span>
+        <svg class="nc-chevron" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+          stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+          <polyline points="6 9 12 15 18 9" />
+        </svg>
      </button>
+
+      @if (profileOpen) {
+      <div class="nc-popover nc-menu" (click)="$event.stopPropagation()">
+        <div class="nc-menu-header">
+          <div class="nc-avatar nc-avatar-md">{{ getInitial() }}</div>
+          <div>
+            <div class="nc-menu-user-name">{{ user.username }}</div>
+            <div class="nc-menu-user-sub">{{ user.rating }} · &#64;{{ user.username }}</div>
+          </div>
+        </div>
+
+        <div class="nc-menu-group">
+          <button type="button" class="nc-menu-item" (click)="goToProfile()">
+            <span class="nc-menu-icon">
+              <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"
+                stroke-linecap="round" stroke-linejoin="round">
+                <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2" />
+                <circle cx="12" cy="7" r="4" />
+              </svg>
+            </span>
+            <span class="nc-menu-label">My profile</span>
+          </button>
+
+          <button type="button" class="nc-menu-item" (click)="goToChallenges()">
+            <span class="nc-menu-icon">
+              <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6"
+                stroke-linecap="round" stroke-linejoin="round">
+                <line x1="14.5" y1="17.5" x2="3" y2="6" />
+                <path d="M13 19l6 -6" /><path d="M16 16l4 4" />
+                <path d="M19 21l2 -2" /><path d="M15 5l4 4" />
+                <path d="M21 3l-3 1l-4 4" />
+              </svg>
+            </span>
+            <span class="nc-menu-label">Challenges</span>
+          </button>
+
+          <button type="button" class="nc-menu-item" (click)="toggleTheme($event)">
+            <span class="nc-menu-icon">
+              <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="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z" />
+              </svg>
+            </span>
+            <span class="nc-menu-label">{{ isDarkMode ? 'Light mode' : 'Dark mode' }}</span>
+            <span class="nc-toggle" [class.is-on]="isDarkMode"></span>
+          </button>
+        </div>
+
+        <div class="nc-menu-group">
+          <button type="button" class="nc-menu-item danger" (click)="logout()">
+            <span class="nc-menu-icon">
+              <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="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" />
+                <polyline points="16 17 21 12 16 7" />
+                <line x1="21" y1="12" x2="9" y2="12" />
+              </svg>
+            </span>
+            <span class="nc-menu-label">Log out</span>
+          </button>
+        </div>
+      </div>
+      }
+    </div>
+
+    } @else {
+
+    <!-- Logged-out auth buttons -->
+    <button type="button" class="nc-auth-btn" (click)="openLoginDialog()">Login</button>
+    <button type="button" class="nc-auth-btn nc-auth-btn--primary" (click)="openRegisterDialog()">Register</button>
+
    }
  </div>
 </nav>

@if (showLoginDialog) {
-  <app-login-dialog (onClose)="closeLoginDialog()" (onSuccess)="onLoginSuccess()" />
+<app-login-dialog (onClose)="closeLoginDialog()" (onSuccess)="onLoginSuccess()" />
 }

@if (showRegisterDialog) {
-  <app-register-dialog (onClose)="closeRegisterDialog()" (onSuccess)="onRegisterSuccess()" />
+<app-register-dialog (onClose)="closeRegisterDialog()" (onSuccess)="onRegisterSuccess()" />
 }
@@ -18,7 +18,7 @@ import { Challenge } from '../../models/challenge.models';
  standalone: true,
  imports: [CommonModule, LoginDialogComponent, RegisterDialogComponent],
  templateUrl: './toolbar.component.html',
-  styleUrl: './toolbar.component.css',
+  styleUrl: './toolbar.component.css'
 })
 export class ToolbarComponent implements OnInit {
  private readonly destroyRef = inject(DestroyRef);
@@ -46,36 +46,35 @@ export class ToolbarComponent implements OnInit {
  ngOnInit(): void {
    this.destroyRef.onDestroy(() => this.stopPolling());

-    this.authService.currentUser$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((user) => {
-      this.currentUser = user;
-      if (user) {
-        this.challengeWs.connect();
-        this.startPolling();
-      } else {
-        this.challengeWs.disconnect();
-        this.stopPolling();
-        this.navigatedChallengeIds.clear();
-        this.challengeEventService.clear();
-      }
-    });
+    this.authService.currentUser$
+      .pipe(takeUntilDestroyed(this.destroyRef))
+      .subscribe(user => {
+        this.currentUser = user;
+        if (user) {
+          this.challengeWs.connect();
+          this.startPolling();
+        } else {
+          this.challengeWs.disconnect();
+          this.stopPolling();
+          this.navigatedChallengeIds.clear();
+          this.challengeEventService.clear();
+        }
+      });

    this.authDialogService.dialogState$
      .pipe(takeUntilDestroyed(this.destroyRef))
-      .subscribe((state) => {
+      .subscribe(state => {
        this.showLoginDialog = state === 'login';
        this.showRegisterDialog = state === 'register';
      });

-    this.themeService.darkMode$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((isDark) => {
-      this.isDarkMode = isDark;
-    });
-
-    this.challengeEventService
-      .getIncomingChallenges$()
+    this.themeService.darkMode$
      .pipe(takeUntilDestroyed(this.destroyRef))
-      .subscribe((challenges) => {
-        this.incomingChallenges = challenges;
-      });
+      .subscribe(isDark => { this.isDarkMode = isDark; });
+
+    this.challengeEventService.getIncomingChallenges$()
+      .pipe(takeUntilDestroyed(this.destroyRef))
+      .subscribe(challenges => { this.incomingChallenges = challenges; });
  }

  private startPolling(): void {
@@ -92,7 +91,7 @@ export class ToolbarComponent implements OnInit {

  private fetchChallenges(): void {
    this.challengeService.listChallenges().subscribe({
-      next: (response) => {
+      next: response => {
        const incoming = response.in ?? response.incoming ?? [];
        this.challengeEventService.setIncomingChallenges(incoming);

@@ -105,7 +104,7 @@ export class ToolbarComponent implements OnInit {
            }
          }
        }
-      },
+      }
    });
  }

@@ -234,14 +233,12 @@ export class ToolbarComponent implements OnInit {
    if (this.acceptingId || this.decliningId) return;
    this.acceptingId = challenge.id;
    this.challengeService.acceptChallenge(challenge.id).subscribe({
-      next: (accepted) => {
+      next: accepted => {
        this.acceptingId = null;
        this.challengeEventService.onChallengeAccepted(accepted);
        if (accepted.gameId) void this.router.navigate(['/game', accepted.gameId]);
      },
-      error: () => {
-        this.acceptingId = null;
-      },
+      error: () => { this.acceptingId = null; }
    });
  }

@@ -254,9 +251,7 @@ export class ToolbarComponent implements OnInit {
        this.decliningId = null;
        this.challengeEventService.removeChallenge(challenge.id);
      },
-      error: () => {
-        this.decliningId = null;
-      },
+      error: () => { this.decliningId = null; }
    });
  }
 }
@@ -3,11 +3,21 @@ export interface AnalysisRequest {
  depth: number;
 }

+export interface RawAnalysisResponse {
+  fen: string;
+  evaluation: number;
+  depth: number;
+  bestMove: string;
+  mate: number | null;
+  continuationMoves: string[];
+}
+
 export interface AnalysisResponse {
  eval: number;
  winChance: number;
  depth: number;
  bestMove: string;
+  mate: number | null;
  continuations: string[];
 }

@@ -246,7 +246,7 @@
      <!-- Side column -->
      <aside class="side">
        <!-- Single position analysis result -->
-        @if (positionAnalysis && !hasAnnotations) {
+        @if (positionAnalysis) {
          <details class="side-card" open>
            <summary class="side-card-summary">
              <span class="side-card-title">Position Analysis</span>
@@ -2,7 +2,7 @@ import { Component, DestroyRef, inject, OnInit } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { ActivatedRoute, RouterLink } from '@angular/router';
 import { FormsModule } from '@angular/forms';
-import { switchMap, of } from 'rxjs';
+import { switchMap, of, forkJoin } from 'rxjs';

 import { ChessBoardComponent } from '../../components/chess-board/chess-board.component';
 import { EvalTimelineComponent } from '../../components/eval-timeline/eval-timeline.component';
@@ -146,6 +146,7 @@ export class AnalysisComponent implements OnInit {
      return;
    }
    this.analysing = true;
+    this.positionAnalysis = null;
    this.errorMessage = '';
    const sans =
      this.annotatedMoves.length > 0
@@ -207,12 +208,7 @@ export class AnalysisComponent implements OnInit {
  private applyGame(game: GameFull): void {
    this.game = game;
    this.currentFen = game.state.fen;
-    // Build a flat FEN history from scratch using moves array
-    // The server gives us the final FEN. We reconstruct history by
-    // storing the final FEN; full per-ply history requires per-move API calls
-    // which is out of scope here — we store what we have and allow analysis to proceed.
    this.fenHistory = [game.state.fen];
-    // Seed annotated moves with san strings, no quality yet
    this.annotatedMoves = game.state.moves.map((san) => ({
      san,
      fen: game.state.fen,
@@ -223,6 +219,16 @@ export class AnalysisComponent implements OnInit {
      winChanceBefore: null,
      winChanceAfter: null,
    }));
+    this.gameApi
+      .getFenHistory(game.gameId)
+      .pipe(takeUntilDestroyed(this.destroyRef))
+      .subscribe({
+        next: (fens) => {
+          if (fens.length >= 2) {
+            this.fenHistory = fens;
+          }
+        },
+      });
  }

  private analyseSinglePosition(fen: string): void {
@@ -64,6 +64,18 @@
 }
 .page-title { font-size: 22px; font-weight: 700; margin: 0; letter-spacing: -0.02em; }

+.page-actions { display: flex; align-items: center; gap: 8px; }
+
+.btn-servers {
+  display: inline-flex; align-items: center; gap: 6px;
+  padding: 7px 14px; border-radius: 8px;
+  border: 1px solid var(--nc-border-strong);
+  background: transparent; color: var(--nc-text-muted);
+  font-size: 13px; font-weight: 600; cursor: pointer;
+  transition: color 0.15s, border-color 0.15s;
+}
+.btn-servers:hover { color: var(--nc-text); border-color: var(--nc-text-muted); }
+
 .btn-new {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 14px; border-radius: 8px; border: none;
@@ -327,3 +339,74 @@
  color: var(--nc-success); letter-spacing: 0.06em; text-transform: uppercase;
 }
 .pairing-ongoing svg { animation: pulse 1.4s ease-in-out infinite; }
+
+/* Official bot join section */
+.join-divider {
+  display: flex; align-items: center; gap: 10px;
+  margin: 20px 0 14px;
+}
+.join-divider::before, .join-divider::after {
+  content: ''; flex: 1; height: 1px; background: var(--nc-border);
+}
+.join-divider-label {
+  font-size: 10px; font-weight: 600; text-transform: uppercase;
+  letter-spacing: 0.08em; color: var(--nc-text-dim); white-space: nowrap;
+}
+
+.official-bot-grid {
+  display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px;
+  margin-bottom: 4px;
+}
+
+.official-bot-btn {
+  display: flex; align-items: center; justify-content: center; gap: 6px;
+  padding: 9px 4px; border-radius: 8px; border: 1px solid var(--nc-border);
+  background: var(--nc-surface); font-size: 12px; font-weight: 700;
+  cursor: pointer; transition: border-color 0.15s, background 0.15s, color 0.15s;
+  color: var(--nc-text-muted); text-transform: capitalize;
+}
+.official-bot-btn:disabled { opacity: 0.45; cursor: not-allowed; }
+.official-btn-easy:hover:not(:disabled)   { border-color: var(--nc-success); color: var(--nc-success); background: rgba(94,229,161,0.07); }
+.official-btn-medium:hover:not(:disabled) { border-color: var(--nc-warn); color: var(--nc-warn); background: rgba(255,209,102,0.07); }
+.official-btn-hard:hover:not(:disabled)   { border-color: var(--nc-neon); color: var(--nc-neon); background: rgba(255,69,200,0.07); }
+.official-btn-expert:hover:not(:disabled) { border-color: var(--nc-danger); color: var(--nc-danger); background: rgba(255,122,122,0.07); }
+
+/* Servers dialog */
+.servers-dialog { max-width: 480px; }
+
+.servers-list {
+  display: flex; flex-direction: column; gap: 6px;
+  margin-bottom: 20px;
+}
+.server-row {
+  display: flex; align-items: center; gap: 10px;
+  padding: 10px 12px; border-radius: 8px;
+  border: 1px solid var(--nc-border); background: var(--nc-surface);
+}
+.server-info { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
+.server-label { font-size: 13px; font-weight: 600; color: var(--nc-text); }
+.server-url {
+  font-size: 11px; color: var(--nc-text-dim);
+  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
+  font-family: monospace;
+}
+.server-remove-btn {
+  background: none; border: none; cursor: pointer;
+  color: var(--nc-text-dim); padding: 4px; border-radius: 6px;
+  display: flex; align-items: center; justify-content: center;
+  flex-shrink: 0; transition: color 0.15s, background 0.15s;
+  font-size: 13px;
+}
+.server-remove-btn:hover:not(:disabled) { color: var(--nc-danger); background: rgba(255,122,122,0.1); }
+.server-remove-btn:disabled { opacity: 0.4; cursor: not-allowed; }
+
+.server-add-form {
+  border-top: 1px solid var(--nc-border);
+  padding-top: 16px;
+  display: flex; flex-direction: column; gap: 0;
+}
+.server-add-heading {
+  font-size: 11px; font-weight: 700; text-transform: uppercase;
+  letter-spacing: 0.08em; color: var(--nc-text-muted);
+  margin: 0 0 14px;
+}
@@ -16,15 +16,25 @@
    <header class="page-header">
      <div class="page-title-row">
        <h1 class="page-title">Tournaments</h1>
-        @if (currentUser) {
-          <button type="button" class="btn-new" (click)="openCreateDialog()">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-              stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round">
-              <line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/>
-            </svg>
-            New tournament
-          </button>
-        }
+        <div class="page-actions">
+          @if (currentUser) {
+            <button type="button" class="btn-servers" (click)="openServersDialog()">
+              <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+                stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round">
+                <rect x="2" y="2" width="20" height="8" rx="2"/><rect x="2" y="14" width="20" height="8" rx="2"/>
+                <line x1="6" y1="6" x2="6.01" y2="6"/><line x1="6" y1="18" x2="6.01" y2="18"/>
+              </svg>
+              Servers
+            </button>
+            <button type="button" class="btn-new" (click)="openCreateDialog()">
+              <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+                stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round">
+                <line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/>
+              </svg>
+              New tournament
+            </button>
+          }
+        </div>
      </div>
      <div class="tabs" role="tablist">
        <button type="button" class="tab-btn" [class.active]="tab === 'started'" (click)="setTab('started')">
@@ -192,32 +202,127 @@
      <span class="dialog-brand">Join with a bot</span>
      <button type="button" class="dialog-close" (click)="closeJoinDialog()">×</button>
    </div>
-    <p class="join-hint">Select one of your bots to enter this tournament. Its token will be rotated to authenticate the join.</p>
-
    @if (botsLoading) {
      <div class="dialog-loading"><span class="pulse"></span>Loading bots…</div>
-    } @else if (userBots.length === 0) {
-      <p class="join-empty">You have no bots yet. Go to <strong>Bots</strong> in the nav to create one first.</p>
    } @else {
-      <div class="bot-pick-list">
-        @for (bot of userBots; track bot.id) {
-          <button type="button" class="bot-pick-row"
-            [disabled]="!!joiningBotId"
-            (click)="joinWithBot(bot)">
-            <span class="bot-pick-avatar">{{ bot.name.charAt(0).toUpperCase() }}</span>
-            <span class="bot-pick-name">{{ bot.name }}</span>
-            <span class="bot-pick-rating">{{ bot.rating }}</span>
-            @if (joiningBotId === bot.id) {
-              <span class="bot-pick-spinner">…</span>
-            }
-          </button>
+      @if (userBots.length === 0) {
+        <p class="join-empty">You have no bots. <a routerLink="/bots">Create one</a> to join with your own bot.</p>
+      } @else {
+        <div class="bot-pick-list">
+          @for (bot of userBots; track bot.id) {
+            <button type="button" class="bot-pick-row"
+              [disabled]="!!joiningBotId || !!joiningOfficialDifficulty"
+              (click)="joinWithBot(bot)">
+              <span class="bot-pick-avatar">{{ bot.name.charAt(0).toUpperCase() }}</span>
+              <span class="bot-pick-name">{{ bot.name }}</span>
+              <span class="bot-pick-rating">{{ bot.rating }}</span>
+              @if (joiningBotId === bot.id) {
+                <span class="bot-pick-spinner">…</span>
+              }
+            </button>
+          }
+        </div>
+      }
+
+      @if (joinError) {
+        <div class="dialog-error">{{ joinError }}</div>
+      }
+
+      <div class="join-divider">
+        <span class="join-divider-label">or join with an official bot</span>
+      </div>
+
+      @if (officialBots.length === 0) {
+        <p class="join-empty">No official bots are available. The official-bots engine service must be running to register them.</p>
+      } @else {
+        <div class="official-bot-grid">
+          @for (d of officialDifficulties; track d) {
+            <button type="button" class="official-bot-btn"
+              [class]="'official-btn-' + d"
+              [disabled]="!!joiningOfficialDifficulty || !!joiningBotId"
+              (click)="joinWithOfficialBot(d)">
+              @if (joiningOfficialDifficulty === d) {
+                <span class="pulse"></span>
+              }
+              {{ d | titlecase }}
+            </button>
+          }
+        </div>
+      }
+
+      @if (officialJoinError) {
+        <div class="dialog-error">{{ officialJoinError }}</div>
+      }
+    }
+  </div>
+</div>
+}
+
+@if (showServersDialog) {
+<div class="dialog-overlay" (click)="closeServersDialog()">
+  <div class="dialog-card servers-dialog" (click)="$event.stopPropagation()">
+    <div class="dialog-head">
+      <span class="dialog-brand">Tournament servers</span>
+      <button type="button" class="dialog-close" (click)="closeServersDialog()">×</button>
+    </div>
+
+    <p class="join-hint">External tournament servers aggregated into this view. Tournaments from all servers appear in the list.</p>
+
+    @if (serversLoading) {
+      <div class="dialog-loading"><span class="pulse"></span>Loading servers…</div>
+    } @else if (servers.length === 0) {
+      <p class="join-empty">No external servers registered yet.</p>
+    } @else {
+      <div class="servers-list">
+        @for (s of servers; track s.id) {
+          <div class="server-row">
+            <div class="server-info">
+              <span class="server-label">{{ s.label }}</span>
+              <span class="server-url">{{ s.url }}</span>
+            </div>
+            <button type="button" class="server-remove-btn"
+              [disabled]="removingServerId === s.id"
+              (click)="removeServer(s.id)"
+              title="Remove server">
+              @if (removingServerId === s.id) { … } @else {
+                <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+                  stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round">
+                  <polyline points="3 6 5 6 21 6"/><path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"/>
+                  <path d="M10 11v6"/><path d="M14 11v6"/>
+                  <path d="M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2"/>
+                </svg>
+              }
+            </button>
+          </div>
        }
      </div>
    }

-    @if (joinError) {
-      <div class="dialog-error">{{ joinError }}</div>
-    }
+    <div class="server-add-form">
+      <h4 class="server-add-heading">Add server</h4>
+      <div class="dialog-field">
+        <label class="dialog-label">Label</label>
+        <input type="text" class="dialog-input" [(ngModel)]="newServerLabel"
+          placeholder="e.g. Local Dev Server" />
+      </div>
+      <div class="dialog-field">
+        <label class="dialog-label">URL</label>
+        <input type="url" class="dialog-input" [(ngModel)]="newServerUrl"
+          placeholder="http://host:8089" />
+      </div>
+      @if (addServerError) {
+        <div class="dialog-error">{{ addServerError }}</div>
+      }
+      <div class="dialog-actions">
+        <button type="button" class="btn-ghost" (click)="closeServersDialog()">Close</button>
+        <button type="button" class="btn-primary"
+          [disabled]="addingServer || !newServerLabel.trim() || !newServerUrl.trim()"
+          (click)="addServer()">
+          {{ addingServer ? 'Adding…' : 'Add' }}
+        </button>
+      </div>
+    </div>
+
  </div>
 </div>
 }
@@ -1,11 +1,14 @@
 import { Component, DestroyRef, OnInit, inject } from '@angular/core';
-import { CommonModule } from '@angular/common';
+import { CommonModule, TitleCasePipe } from '@angular/common';
 import { Router, RouterLink } from '@angular/router';
-import { FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
+import { FormBuilder, FormGroup, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { forkJoin } from 'rxjs';
 import { TournamentService } from '../../services/tournament.service';
 import { AuthService } from '../../services/auth.service';
 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 { CurrentUser } from '../../models/auth.models';
@@ -15,7 +18,7 @@ type StatusTab = 'started' | 'created' | 'finished';
@Component({
  selector: 'app-tournaments',
  standalone: true,
-  imports: [CommonModule, RouterLink, ReactiveFormsModule],
+  imports: [CommonModule, RouterLink, FormsModule, ReactiveFormsModule, TitleCasePipe],
  templateUrl: './tournaments.component.html',
  styleUrl: './tournaments.component.css'
 })
@@ -25,6 +28,8 @@ export class TournamentsComponent implements OnInit {
  private readonly authService = inject(AuthService);
  private readonly fb = inject(FormBuilder);
  private readonly botService = inject(BotService);
+  private readonly officialBotService = inject(OfficialBotService);
+  private readonly tournamentServerService = inject(TournamentServerService);
  private readonly router = inject(Router);

  loading = true;
@@ -54,10 +59,24 @@ export class TournamentsComponent implements OnInit {

  joinDialogTournamentId: string | null = null;
  userBots: Bot[] = [];
+  officialBots: Bot[] = [];
  botsLoading = false;
  joiningBotId: string | null = null;
  joinError: string | null = null;

+  readonly officialDifficulties = ['easy', 'medium', 'hard', 'expert'] as const;
+  joiningOfficialDifficulty: string | null = null;
+  officialJoinError: string | null = null;
+
+  showServersDialog = false;
+  servers: ExternalTournamentServer[] = [];
+  serversLoading = false;
+  newServerLabel = '';
+  newServerUrl = '';
+  addingServer = false;
+  addServerError: string | null = null;
+  removingServerId: string | null = null;
+
  ngOnInit(): void {
    this.authService.currentUser$
      .pipe(takeUntilDestroyed(this.destroyRef))
@@ -158,52 +177,128 @@ export class TournamentsComponent implements OnInit {
    this.joinDialogTournamentId = tournamentId;
    this.joinError = null;
    this.botsLoading = true;
-    this.botService.list()
+    forkJoin({ user: this.botService.list(), official: this.botService.listOfficial() })
      .pipe(takeUntilDestroyed(this.destroyRef))
      .subscribe({
-        next: bots => { this.userBots = bots; this.botsLoading = false; },
+        next: ({ user, official }) => {
+          this.userBots = user;
+          this.officialBots = official;
+          this.botsLoading = false;
+        },
        error: () => { this.botsLoading = false; }
      });
  }

  closeJoinDialog(): void {
    this.joinDialogTournamentId = null;
+    this.userBots = [];
+    this.officialBots = [];
    this.joiningBotId = null;
    this.joinError = null;
+    this.joiningOfficialDifficulty = null;
+    this.officialJoinError = null;
+  }
+
+  joinWithOfficialBot(difficulty: string): void {
+    if (!this.joinDialogTournamentId || this.joiningOfficialDifficulty || this.joiningBotId) return;
+    this.joiningOfficialDifficulty = difficulty;
+    this.officialJoinError = null;
+    const tid = this.joinDialogTournamentId;
+    this.officialBotService.joinTournament(tid, difficulty).subscribe({
+      next: () => {
+        this.joiningOfficialDifficulty = null;
+        this.closeJoinDialog();
+        this.tournamentService.get(tid)
+          .pipe(takeUntilDestroyed(this.destroyRef))
+          .subscribe(updated => {
+            this.created = this.created.map(x => x.id === tid ? updated : x);
+            this.started = this.started.map(x => x.id === tid ? updated : x);
+            if (this.selectedTournament?.id === tid) this.selectedTournament = updated;
+          });
+      },
+      error: err => {
+        this.joiningOfficialDifficulty = null;
+        this.officialJoinError = err.error?.error ?? 'Failed to join with official bot.';
+      }
+    });
  }

  joinWithBot(bot: Bot): void {
    if (!this.joinDialogTournamentId || this.joiningBotId) return;
    this.joiningBotId = bot.id;
    this.joinError = null;
-    this.botService.rotateToken(bot.id).subscribe({
-      next: token => {
-        this.tournamentService.joinWithBotToken(this.joinDialogTournamentId!, token).subscribe({
-          next: () => {
-            this.joiningBotId = null;
-            const tid = this.joinDialogTournamentId!;
-            this.closeJoinDialog();
-            this.tournamentService.get(tid)
-              .pipe(takeUntilDestroyed(this.destroyRef))
-              .subscribe(updated => {
-                this.created = this.created.map(x => x.id === tid ? updated : x);
-                this.started = this.started.map(x => x.id === tid ? updated : x);
-                if (this.selectedTournament?.id === tid) this.selectedTournament = updated;
-              });
-          },
-          error: err => {
-            this.joiningBotId = null;
-            this.joinError = err.error?.message ?? err.error?.error ?? 'Failed to join tournament.';
-          }
-        });
-      },
-      error: () => {
+    this.tournamentService.join(this.joinDialogTournamentId, bot.id, bot.name).subscribe({
+      next: () => {
        this.joiningBotId = null;
-        this.joinError = 'Failed to get bot token.';
+        const tid = this.joinDialogTournamentId!;
+        this.closeJoinDialog();
+        this.tournamentService.get(tid)
+          .pipe(takeUntilDestroyed(this.destroyRef))
+          .subscribe(updated => {
+            this.created = this.created.map(x => x.id === tid ? updated : x);
+            this.started = this.started.map(x => x.id === tid ? updated : x);
+            if (this.selectedTournament?.id === tid) this.selectedTournament = updated;
+          });
+      },
+      error: err => {
+        this.joiningBotId = null;
+        this.joinError = err.error?.message ?? err.error?.error ?? 'Failed to join tournament.';
      }
    });
  }

+  openServersDialog(): void {
+    this.newServerLabel = '';
+    this.newServerUrl = '';
+    this.addServerError = null;
+    this.showServersDialog = true;
+    this.serversLoading = true;
+    this.tournamentServerService.list()
+      .pipe(takeUntilDestroyed(this.destroyRef))
+      .subscribe({
+        next: res => { this.servers = res.servers; this.serversLoading = false; },
+        error: () => { this.serversLoading = false; }
+      });
+  }
+
+  closeServersDialog(): void {
+    this.showServersDialog = false;
+  }
+
+  addServer(): void {
+    const label = this.newServerLabel.trim();
+    const url = this.newServerUrl.trim();
+    if (!label || !url || this.addingServer) return;
+    this.addingServer = true;
+    this.addServerError = null;
+    this.tournamentServerService.register(label, url).subscribe({
+      next: server => {
+        this.addingServer = false;
+        this.servers = [...this.servers, server];
+        this.newServerLabel = '';
+        this.newServerUrl = '';
+        this.loadTournaments();
+      },
+      error: err => {
+        this.addingServer = false;
+        this.addServerError = err.error?.error ?? 'Failed to add server.';
+      }
+    });
+  }
+
+  removeServer(id: string): void {
+    if (this.removingServerId) return;
+    this.removingServerId = id;
+    this.tournamentServerService.remove(id).subscribe({
+      next: () => {
+        this.removingServerId = null;
+        this.servers = this.servers.filter(s => s.id !== id);
+        this.loadTournaments();
+      },
+      error: () => { this.removingServerId = null; }
+    });
+  }
+
  private loadTournaments(): void {
    this.tournamentService.list()
      .pipe(takeUntilDestroyed(this.destroyRef))
@@ -9,7 +9,8 @@ export const authInterceptor: HttpInterceptorFn = (req, next) => {
    req.url.includes('/api/account/official-bots') ||
    req.url.includes('/api/board/game') ||
    req.url.includes('/api/challenge') ||
-    req.url.includes('/api/tournament');
+    req.url.includes('/api/tournament') ||
+    req.url.includes('/api/bots');

  if (token && isProtectedEndpoint && !req.headers.has('Authorization')) {
    req = req.clone({
@@ -7,11 +7,16 @@ import { Bot, BotWithToken } from '../models/bot.models';
 export class BotService {
  private readonly http = inject(HttpClient);
  private readonly base = '/api/account/bots';
+  private readonly officialBase = '/api/account/official-bots';

  list(): Observable<Bot[]> {
    return this.http.get<Bot[]>(this.base);
  }

+  listOfficial(): Observable<Bot[]> {
+    return this.http.get<Bot[]>(this.officialBase);
+  }
+
  create(name: string): Observable<BotWithToken> {
    return this.http.post<BotWithToken>(this.base, { name });
  }
@@ -6,110 +6,115 @@ import { ChallengeService } from './challenge.service';

@Injectable({ providedIn: 'root' })
 export class ChallengeWebSocketService {
-    private readonly challengeEventService = inject(ChallengeEventService);
-    private readonly challengeService = inject(ChallengeService);
-    private readonly router = inject(Router);
+  private readonly challengeEventService = inject(ChallengeEventService);
+  private readonly challengeService = inject(ChallengeService);
+  private readonly router = inject(Router);

-    private ws: WebSocket | null = null;
-    private reconnectAttempts = 0;
-    private readonly maxReconnectAttempts = 5;
-    private readonly reconnectDelay = 3000;
-    private intentionalClose = false;
+  private ws: WebSocket | null = null;
+  private reconnectAttempts = 0;
+  private readonly maxReconnectAttempts = 5;
+  private readonly reconnectDelay = 3000;
+  private intentionalClose = false;

-    connect(): void {
-        if (this.ws) return;
+  connect(): void {
+    if (this.ws) return;

-        const token = localStorage.getItem('token');
-        if (!token) return;
+    const token = localStorage.getItem('token');
+    if (!token) return;

-        const url = `${environment.userWsBaseUrl}/api/user/ws?token=${encodeURIComponent(token)}`;
+    const url = `${environment.userWsBaseUrl}/api/user/ws`;

-        try {
-            this.intentionalClose = false;
-            this.ws = new WebSocket(url);
+    try {
+      this.intentionalClose = false;
+      this.ws = new WebSocket(url);

-            this.ws.onopen = () => {
-                this.reconnectAttempts = 0;
-            };
-
-            this.ws.onmessage = (event) => {
-                this.handleMessage(event.data as string);
-            };
-
-            this.ws.onerror = () => {
-                // onclose fires right after, handles reconnect
-            };
-
-            this.ws.onclose = () => {
-                this.ws = null;
-                if (!this.intentionalClose) {
-                    this.attemptReconnect();
-                }
-            };
-        } catch {
-            this.attemptReconnect();
-        }
-    }
-
-    disconnect(): void {
-        this.intentionalClose = true;
+      this.ws.onopen = () => {
        this.reconnectAttempts = 0;
-        if (this.ws) {
-            this.ws.close();
-            this.ws = null;
+        this.ws?.send(JSON.stringify({ type: 'auth', token }));
+      };
+
+      this.ws.onmessage = (event) => {
+        this.handleMessage(event.data as string);
+      };
+
+      this.ws.onerror = () => {
+        // onclose fires right after, handles reconnect
+      };
+
+      this.ws.onclose = () => {
+        this.ws = null;
+        if (!this.intentionalClose) {
+          this.attemptReconnect();
        }
+      };
+    } catch {
+      this.attemptReconnect();
+    }
+  }
+
+  disconnect(): void {
+    this.intentionalClose = true;
+    this.reconnectAttempts = 0;
+    if (this.ws) {
+      this.ws.close();
+      this.ws = null;
+    }
+  }
+
+  private handleMessage(data: string): void {
+    let message: Record<string, unknown>;
+    try {
+      message = JSON.parse(data) as Record<string, unknown>;
+    } catch {
+      return;
    }

-    private handleMessage(data: string): void {
-        let message: Record<string, unknown>;
-        try {
-            message = JSON.parse(data) as Record<string, unknown>;
-        } catch {
-            return;
+    switch (message['type']) {
+      case 'CONNECTED':
+        break;
+
+      case 'challengeCreated': {
+        const challengeId = message['challengeId'] as string | undefined;
+        if (challengeId) {
+          this.challengeService.getChallenge(challengeId).subscribe({
+            next: (challenge) => this.challengeEventService.onChallengeReceived(challenge),
+            error: () => {
+              /* challenge may have already expired */
+            },
+          });
        }
+        break;
+      }

-        switch (message['type']) {
-            case 'CONNECTED':
-                break;
-
-            case 'challengeCreated': {
-                const challengeId = message['challengeId'] as string | undefined;
-                if (challengeId) {
-                    this.challengeService.getChallenge(challengeId).subscribe({
-                        next: challenge => this.challengeEventService.onChallengeReceived(challenge),
-                        error: () => { /* challenge may have already expired */ }
-                    });
-                }
-                break;
-            }
-
-            case 'challengeAccepted': {
-                const challengeId = message['challengeId'] as string | undefined;
-                const gameId = message['gameId'] as string | undefined;
-                if (challengeId) {
-                    this.challengeEventService.removeChallenge(challengeId);
-                }
-                if (gameId) {
-                    void this.router.navigate(['/game', gameId]);
-                }
-                break;
-            }
-
-            case 'challengeDeclined':
-            case 'challengeExpired':
-            case 'challengeCancelled': {
-                const challengeId = message['challengeId'] as string | undefined;
-                if (challengeId) {
-                    this.challengeEventService.removeChallenge(challengeId);
-                }
-                break;
-            }
+      case 'challengeAccepted': {
+        const challengeId = message['challengeId'] as string | undefined;
+        const gameId = message['gameId'] as string | undefined;
+        if (challengeId) {
+          this.challengeEventService.removeChallenge(challengeId);
        }
-    }
+        if (gameId) {
+          void this.router.navigate(['/game', gameId]);
+        }
+        break;
+      }

-    private attemptReconnect(): void {
-        if (this.intentionalClose || this.reconnectAttempts >= this.maxReconnectAttempts) return;
-        this.reconnectAttempts++;
-        setTimeout(() => { this.connect(); }, this.reconnectDelay);
+      case 'challengeDeclined':
+      case 'challengeExpired':
+      case 'challengeCancelled': {
+        const challengeId = message['challengeId'] as string | undefined;
+        if (challengeId) {
+          this.challengeEventService.removeChallenge(challengeId);
+        }
+        break;
+      }
    }
+  }
+
+  private attemptReconnect(): void {
+    if (this.intentionalClose || this.reconnectAttempts >= this.maxReconnectAttempts) return;
+    this.reconnectAttempts++;
+    setTimeout(() => {
+      this.connect();
+    }, this.reconnectDelay);
+  }
 }
@@ -1,6 +1,7 @@
 import { Injectable, inject } from '@angular/core';
 import { HttpClient, HttpParams } from '@angular/common/http';
 import { Observable } from 'rxjs';
+import { map } from 'rxjs/operators';
 import { environment } from '../../environments/environment';
 import {
  GameFull,
@@ -9,7 +10,7 @@ import {
  LegalMovesResponse,
  PlayerInfo,
 } from '../models/game.models';
-import { AnalysisRequest, AnalysisResponse } from '../models/analysis.models';
+import { AnalysisRequest, AnalysisResponse, RawAnalysisResponse } from '../models/analysis.models';
 import { StreamHandlerService } from './stream-handler.service';

@Injectable({ providedIn: 'root' })
@@ -78,8 +79,28 @@ export class GameApiService {
    return this.http.post<void>(`${this.apiBase}${this.apiPath}/${gameId}/draw/offer`, {});
  }

+  getFenHistory(gameId: string): Observable<string[]> {
+    return this.http
+      .get<{ fens: string[] }>(`${this.apiBase}${this.apiPath}/${gameId}/fen-history`)
+      .pipe(map((r) => r.fens));
+  }
+
  analyzePosition(request: AnalysisRequest): Observable<AnalysisResponse> {
-    return this.http.post<AnalysisResponse>(`${this.apiBase}/api/analysis/position`, request);
+    return this.http
+      .post<RawAnalysisResponse>(`${this.apiBase}/api/analysis/position`, request)
+      .pipe(map((raw) => this.mapAnalysisResponse(raw)));
+  }
+
+  private mapAnalysisResponse(raw: RawAnalysisResponse): AnalysisResponse {
+    const evalPawns = raw.evaluation / 100;
+    return {
+      eval: evalPawns,
+      winChance: 1 / (1 + Math.exp(-0.374 * evalPawns)),
+      depth: raw.depth,
+      bestMove: raw.bestMove,
+      mate: raw.mate,
+      continuations: raw.continuationMoves ?? [],
+    };
  }

  private resolveWsBase(): string {
@@ -92,11 +113,8 @@ export class GameApiService {
  }

  streamGame(gameId: string): Observable<GameStreamEvent> {
-    const token = localStorage.getItem('token');
-    let wsUrl = `${this.resolveWsBase()}${this.apiPath}/${gameId}/ws`;
-    if (token) {
-      wsUrl += `?token=${encodeURIComponent(token)}`;
-    }
-    return this.streamHandler.createGameStream(wsUrl, gameId);
+    const wsUrl = `${this.resolveWsBase()}${this.apiPath}/${gameId}/ws`;
+    const token = localStorage.getItem('token') ?? '';
+    return this.streamHandler.createGameStream(wsUrl, gameId, token);
  }
 }
@@ -0,0 +1,22 @@
+import { Injectable, inject } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import { Observable } from 'rxjs';
+
+export interface JoinTournamentResponse {
+  botId: string;
+  difficulty: string;
+  status: string;
+}
+
+@Injectable({ providedIn: 'root' })
+export class OfficialBotService {
+  private readonly http = inject(HttpClient);
+  private readonly base = '/api/bots/official';
+
+  joinTournament(tournamentId: string, difficulty: string): Observable<JoinTournamentResponse> {
+    return this.http.post<JoinTournamentResponse>(`${this.base}/join-tournament`, {
+      tournamentId,
+      difficulty,
+    });
+  }
+}
@@ -6,7 +6,7 @@ const WS_CONNECT_TIMEOUT_MS = 3000;

@Injectable({ providedIn: 'root' })
 export class StreamHandlerService {
-  createGameStream(wsUrl: string, gameId: string): Observable<GameStreamEvent> {
+  createGameStream(wsUrl: string, gameId: string, token: string): Observable<GameStreamEvent> {
    return new Observable<GameStreamEvent>((observer) => {
      const ws = new WebSocket(wsUrl);
      let connected = false;
@@ -14,7 +14,7 @@ export class StreamHandlerService {
      const emitErrorEvent = (message: string): void => {
        const errorEvent: ErrorEvent = {
          type: 'error',
-          error: { code: 'STREAM_ERROR', message }
+          error: { code: 'STREAM_ERROR', message },
        };
        observer.next(errorEvent);
      };
@@ -36,6 +36,7 @@ export class StreamHandlerService {
        connected = true;
        clearTimeout(connectionTimeoutId);
        console.log(`[StreamHandler] WebSocket connected for ${gameId}`);
+        ws.send(JSON.stringify({ type: 'auth', token }));
      };

      ws.onmessage = (message) => {
@@ -0,0 +1,31 @@
+import { Injectable, inject } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import { Observable } from 'rxjs';
+
+export interface ExternalTournamentServer {
+  id: string;
+  label: string;
+  url: string;
+}
+
+export interface ExternalTournamentServerList {
+  servers: ExternalTournamentServer[];
+}
+
+@Injectable({ providedIn: 'root' })
+export class TournamentServerService {
+  private readonly http = inject(HttpClient);
+  private readonly base = '/api/tournament/servers';
+
+  list(): Observable<ExternalTournamentServerList> {
+    return this.http.get<ExternalTournamentServerList>(this.base);
+  }
+
+  register(label: string, url: string): Observable<ExternalTournamentServer> {
+    return this.http.post<ExternalTournamentServer>(this.base, { label, url });
+  }
+
+  remove(id: string): Observable<void> {
+    return this.http.delete<void>(`${this.base}/${id}`);
+  }
+}
@@ -40,10 +40,8 @@ export class TournamentService {
    return this.http.post<Tournament>(`${this.base}/${id}/start`, null);
  }

-  joinWithBotToken(id: string, botToken: string): Observable<void> {
-    return this.http.post<void>(`${this.base}/${id}/join`, null, {
-      headers: new HttpHeaders({ Authorization: `Bearer ${botToken}` })
-    });
+  join(id: string, botId: string, botName: string): Observable<void> {
+    return this.http.post<void>(`${this.base}/${id}/join`, { botId, botName });
  }

  roundPairings(id: string, round: number): Observable<RoundPairings> {
@@ -1,3 +1,3 @@
 MAJOR=0
-MINOR=2
-PATCH=8
+MINOR=4
+PATCH=4
Author	SHA1	Message	Date
TeamCity	e374d5e791	ci: bump version to v0.4.4	2026-06-21 14:06:48 +00:00
Janis Eccarius	5b5fd6f027	fix(tournaments): load both user bots and official bots in join dialog openJoinDialog now fetches user bots and official bots in parallel via forkJoin. Each section shows its own empty state independently. Official bot difficulty buttons are hidden when no official bots are registered. User bots empty state links to /bots to create one. Disables all join buttons while any join is in progress. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>	2026-06-21 15:40:24 +02:00
TeamCity	ea8048e064	ci: bump version to v0.4.3	2026-06-21 09:06:47 +00:00
Janis Eccarius	ce1fb0d60b	fix(analysis): fix API field mismatch and enable full game analysis Map raw backend response (evaluation/continuationMoves) to frontend model (eval/winChance/continuations). Add getFenHistory() call after loading a game or PGN so runAnalysis() gets per-ply FEN history and triggers analyzeGame() instead of falling back to single-position analysis. Remove !hasAnnotations guard so positionAnalysis card shows even when a game is loaded. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>	2026-06-21 11:00:29 +02:00
TeamCity	74f82bc0ba	ci: bump version to v0.4.2	2026-06-17 09:19:46 +00:00
lq64	1d2c217da8	fix: NCS-122 send WS token via first-message auth instead of query param (#13 ) Remove token from WebSocket URL query parameters in ChallengeWebSocketService and GameApiService. Instead, send {"type":"auth","token":"..."} as the first text frame after the connection opens, matching the new backend auth protocol. --------- Co-authored-by: LQ63 <lkhermann@web.de> Reviewed-on: #13	2026-06-17 10:50:16 +02:00
TeamCity	3d1b330396	ci: bump version to v0.4.1	2026-06-17 07:20:31 +00:00
Janis	a54957aa74	fix(auth): attach Bearer token to /api/bots requests (#12 ) OfficialBotService posts to /api/bots/official/join-tournament, but the auth interceptor's protected-endpoint whitelist omitted /api/bots, so no Authorization header was sent and the request hit the official- bots service anonymously -> 401. Add /api/bots to the whitelist. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Reviewed-on: #12	2026-06-17 09:08:55 +02:00
TeamCity	c9bf6d21fc	ci: bump version to v0.4.0	2026-06-17 06:22:59 +00:00
Janis	f9420e5848	feat: NCWF-5/6/7/8/9 chess analysis page and engine integration (#11 ) Co-authored-by: Janis Eccarius <eccariusjanis@gmail.com> Reviewed-on: #11	2026-06-17 08:17:55 +02:00
TeamCity	a3e51bade5	ci: bump version to v0.3.0	2026-06-10 20:41:14 +00:00
lq64	48959daae3	feat: bots (#9 ) Co-authored-by: Lala, Shahd <Shahd.Lala@sybit.de> Reviewed-on: #9 Co-authored-by: Leon Hermann <lq@blackhole.local> Co-committed-by: Leon Hermann <lq@blackhole.local>	2026-06-10 22:38:06 +02:00