diff --git a/src/app/components/player-registrations/player-registrations.component.html b/src/app/components/player-registrations/player-registrations.component.html
index 3cf3469..12039b9 100644
--- a/src/app/components/player-registrations/player-registrations.component.html
+++ b/src/app/components/player-registrations/player-registrations.component.html
@@ -14,37 +14,43 @@
                 </mat-checkbox>
               </div>
               <div class="col-md-4">
-                <ng-container *ngIf="eventRegistration.doublesEvent">
-                  <mat-form-field appearance="fill">
-                    <mat-label>Partner</mat-label>
-                    <mat-select [value]="eventRegistration.partner" [disabled]="!tournamentRegistration.editable || !eventRegistration.registered" [(ngModel)]="eventRegistration.partner">
-                      <mat-option>Geen</mat-option>
-                      <mat-option *ngFor="let player of getRelevantPlayers(eventRegistration.type)" [value]="player.id">
-                        {{ player | fullName }}
-                      </mat-option>
-                    </mat-select>
-                  </mat-form-field>
-                </ng-container>
+                @if (eventRegistration.doublesEvent) {
+                  <ng-container>
+                    <mat-form-field appearance="fill">
+                      <mat-label>Partner</mat-label>
+                      <mat-select [value]="eventRegistration.partner" [disabled]="!tournamentRegistration.editable || !eventRegistration.registered" [(ngModel)]="eventRegistration.partner">
+                        <mat-option>Geen</mat-option>
+                        <mat-option *ngFor="let player of getRelevantPlayers(eventRegistration.type)" [value]="player.id">
+                          {{ player | fullName }}
+                        </mat-option>
+                      </mat-select>
+                    </mat-form-field>
+                  </ng-container>
+                }
               </div>
               <div class="col-6"></div>
             </div>
           </ng-container>
         </mat-card-content>
-        <mat-card-actions *ngIf="tournamentRegistration.editable">
-            <button mat-button (click)="saveRegistration(tournamentRegistration, $event)" [disabled]="waitingForBackend">
-              <mat-icon>save</mat-icon>
-              Opslaan
-            </button>
-            <a mat-button routerLink="/players">
-              <mat-icon>cancel</mat-icon>
-              Annuleren
-            </a>
-        </mat-card-actions>
+        @if (tournamentRegistration.editable) {
+          <mat-card-actions>
+              <button mat-button (click)="saveRegistration(tournamentRegistration, $event)" [disabled]="waitingForBackend">
+                <mat-icon>save</mat-icon>
+                Opslaan
+              </button>
+              <a mat-button routerLink="/players">
+                <mat-icon>cancel</mat-icon>
+                Annuleren
+              </a>
+          </mat-card-actions>
+        }
       </mat-card>
-      <button mat-button (click)="this.showAll = true" *ngIf="!this.showAll">
-        <mat-icon>search</mat-icon>
-        Toon oude toernooien
-      </button>
+      @if (!this.showAll) {
+        <button mat-button (click)="this.showAll = true">
+          <mat-icon>search</mat-icon>
+          Toon oude toernooien
+        </button>
+      }
     </mat-card-content>
   </mat-card>
 }
diff --git a/src/app/components/tournament-divide/tournament-divide.component.html b/src/app/components/tournament-divide/tournament-divide.component.html
index a3f2ddd..6f2133a 100644
--- a/src/app/components/tournament-divide/tournament-divide.component.html
+++ b/src/app/components/tournament-divide/tournament-divide.component.html
@@ -1,45 +1,51 @@
-<mat-card appearance="outlined" *ngIf="tournament">
-  <mat-card-header>
-    <h5>Indeling voor {{ tournament.name }}</h5>
-  </mat-card-header>
-  <mat-card-content>
-    <mat-card *ngFor="let event of tournament.events" appearance="outlined" class="m-3">
-      <mat-card-header>
-        <h6>Indeling {{ TournamentEvent.getType(event.type) }}</h6>
-      </mat-card-header>
-      <mat-card-content>
-        <mat-accordion multi="true">
-          <mat-expansion-panel *ngFor="let group of event.groups">
-            <mat-expansion-panel-header>
-              <mat-panel-title>
-                {{ group.name }}&nbsp;<span class="badge text-bg-success">{{ group.teams.length }}</span>
-              </mat-panel-title>
-            </mat-expansion-panel-header>
-            <table class="table {{ event.doublesEvent ? 'w-100' : 'w-50' }}">
-              <thead class="thead-dark">
-              <tr>
-                <th scope="col" class="w-20">Naam</th>
-                <th scope="col" class="w-20">Club</th>
-                <th scope="col" class="w-10">Speelsterkte</th>
-                <th *ngIf="event.doublesEvent" scope="col" class="w-20">Partner</th>
-                <th *ngIf="event.doublesEvent" scope="col" class="w-20">Club</th>
-                <th *ngIf="event.doublesEvent" scope="col" class="w-10">Speelsterkte</th>
-              </tr>
-              </thead>
-              <tbody>
-              <tr *ngFor="let team of group.teams">
-                <td class="align-middle">{{ team.player1 | fullName }}</td>
-                <td class="align-middle">{{ team.player1.club }}</td>
-                <td class="align-middle">{{ getStrength(team.player1.strength.valueOf()) }}</td>
-                <td *ngIf="event.doublesEvent" class="align-middle">{{ team.player2 | fullName }}</td>
-                <td *ngIf="event.doublesEvent" class="align-middle">{{ team.player2.club }}</td>
-                <td *ngIf="event.doublesEvent" class="align-middle">{{ getStrength(team.player2.strength.valueOf()) }}</td>
-              </tr>
-              </tbody>
-            </table>
-          </mat-expansion-panel>
-        </mat-accordion>
-      </mat-card-content>
-    </mat-card>
-  </mat-card-content>
-</mat-card>
+@if (tournament) {
+  <mat-card appearance="outlined">
+    <mat-card-header>
+      <h5>Indeling voor {{ tournament.name }}</h5>
+    </mat-card-header>
+    <mat-card-content>
+      <mat-card *ngFor="let event of tournament.events" appearance="outlined" class="m-3">
+        <mat-card-header>
+          <h6>Indeling {{ TournamentEvent.getType(event.type) }}</h6>
+        </mat-card-header>
+        <mat-card-content>
+          <mat-accordion multi="true">
+            <mat-expansion-panel *ngFor="let group of event.groups">
+              <mat-expansion-panel-header>
+                <mat-panel-title>
+                  {{ group.name }}&nbsp;<span class="badge text-bg-success">{{ group.teams.length }}</span>
+                </mat-panel-title>
+              </mat-expansion-panel-header>
+              <table class="table {{ event.doublesEvent ? 'w-100' : 'w-50' }}">
+                <thead class="thead-dark">
+                <tr>
+                  <th scope="col" class="w-20">Naam</th>
+                  <th scope="col" class="w-20">Club</th>
+                  <th scope="col" class="w-10">Speelsterkte</th>
+                  @if (event.doublesEvent) {
+                    <th scope="col" class="w-20">Partner</th>
+                    <th scope="col" class="w-20">Club</th>
+                    <th scope="col" class="w-10">Speelsterkte</th>
+                  }
+                </tr>
+                </thead>
+                <tbody>
+                <tr *ngFor="let team of group.teams">
+                  <td class="align-middle">{{ team.player1 | fullName }}</td>
+                  <td class="align-middle">{{ team.player1.club }}</td>
+                  <td class="align-middle">{{ getStrength(team.player1.strength.valueOf()) }}</td>
+                  @if (event.doublesEvent) {
+                    <td class="align-middle">{{ team.player2 | fullName }}</td>
+                    <td class="align-middle">{{ team.player2.club }}</td>
+                    <td class="align-middle">{{ getStrength(team.player2.strength.valueOf()) }}</td>
+                  }
+                </tr>
+                </tbody>
+              </table>
+            </mat-expansion-panel>
+          </mat-accordion>
+        </mat-card-content>
+      </mat-card>
+    </mat-card-content>
+  </mat-card>
+}
diff --git a/src/app/components/tournament-draw/tournament-draw.component.html b/src/app/components/tournament-draw/tournament-draw.component.html
index fa68ac1..5c51a82 100644
--- a/src/app/components/tournament-draw/tournament-draw.component.html
+++ b/src/app/components/tournament-draw/tournament-draw.component.html
@@ -1,40 +1,41 @@
-<mat-card appearance="outlined" *ngIf="tournament">
-  <mat-card-header>
-    <h5>Loting voor {{ tournament.name }}</h5>
-  </mat-card-header>
-  <mat-card-content>
-    <mat-card *ngFor="let event of tournament.events" appearance="outlined" class="m-3">
-      <mat-card-header>
-        <h6>Loting {{ TournamentEvent.getType(event.type) }}</h6>
-      </mat-card-header>
-      <mat-card-content>
-        <mat-accordion multi="true">
-          <mat-expansion-panel *ngFor="let group of event.groups">
-            <mat-expansion-panel-header>
-              <mat-panel-title>
-                {{ group.name }}&nbsp;<span class="badge text-bg-success">{{ group.teams.length }}</span>
-              </mat-panel-title>
-            </mat-expansion-panel-header>
-            <table class="table {{ event.doublesEvent ? 'w-100' : 'w-50' }}">
-              <thead class="thead-dark">
-                <tr>
-                  <th scope="col" class="w-25">Team 1</th>
-                  <th scope="col" style="width: 5%">-</th>
-                  <th scope="col" class="w-25">Team 2</th>
-                </tr>
-              </thead>
-              <tbody>
-                <tr *ngFor="let match of group.rounds[0].matches">
-                  <td class="align-middle">{{ match.team1 | teamText }}</td>
-                  <td class="align-middle">-</td>
-                  <td class="align-middle">{{ match.team2 | teamText }}</td>
-                </tr>
-              </tbody>
-            </table>
-          </mat-expansion-panel>
-        </mat-accordion>
-      </mat-card-content>
-    </mat-card>
-  </mat-card-content>
-</mat-card>
-
+@if (tournament) {
+  <mat-card appearance="outlined">
+    <mat-card-header>
+      <h5>Loting voor {{ tournament.name }}</h5>
+    </mat-card-header>
+    <mat-card-content>
+      <mat-card *ngFor="let event of tournament.events" appearance="outlined" class="m-3">
+        <mat-card-header>
+          <h6>Loting {{ TournamentEvent.getType(event.type) }}</h6>
+        </mat-card-header>
+        <mat-card-content>
+          <mat-accordion multi="true">
+            <mat-expansion-panel *ngFor="let group of event.groups">
+              <mat-expansion-panel-header>
+                <mat-panel-title>
+                  {{ group.name }}&nbsp;<span class="badge text-bg-success">{{ group.teams.length }}</span>
+                </mat-panel-title>
+              </mat-expansion-panel-header>
+              <table class="table {{ event.doublesEvent ? 'w-100' : 'w-50' }}">
+                <thead class="thead-dark">
+                  <tr>
+                    <th scope="col" class="w-25">Team 1</th>
+                    <th scope="col" style="width: 5%">-</th>
+                    <th scope="col" class="w-25">Team 2</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr *ngFor="let match of group.rounds[0].matches">
+                    <td class="align-middle">{{ match.team1 | teamText }}</td>
+                    <td class="align-middle">-</td>
+                    <td class="align-middle">{{ match.team2 | teamText }}</td>
+                  </tr>
+                </tbody>
+              </table>
+            </mat-expansion-panel>
+          </mat-accordion>
+        </mat-card-content>
+      </mat-card>
+    </mat-card-content>
+  </mat-card>
+}
diff --git a/src/app/components/tournament-list/tournament-list.component.html b/src/app/components/tournament-list/tournament-list.component.html
index 2a51fab..861d99a 100644
--- a/src/app/components/tournament-list/tournament-list.component.html
+++ b/src/app/components/tournament-list/tournament-list.component.html
@@ -1,9 +1,4 @@
 <mat-card appearance="outlined">
-<!--
-  <mat-card-header>
-    <h5>Toernooien</h5>
-  </mat-card-header>
--->
   <mat-card-content>
     <table class="table table-hover">
       <thead class="thead-dark">
@@ -16,28 +11,68 @@
         </tr>
       </thead>
       <tbody>
-      <tr *ngFor="let tournament of tournaments">
-        <td class="align-middle">{{ tournament.id }}</td>
-        <td class="align-middle"><a [routerLink]="['/tournaments', tournament.id, 'manage']">{{ tournament.name }}</a></td>
-        <td class="align-middle">{{ tournament.date }}</td>
-        <td class="align-middle">{{ Tournament.getStatus(tournament) }}</td>
-        <td class="align-middle">
-          <a mat-button [routerLink]="['/tournaments', tournament.id, 'edit']" *ngIf="Tournament.getStatus(tournament) != 'Afgerond'">
-            <mat-icon>edit</mat-icon>
-            Bewerk
-          </a>
-          <a mat-button [routerLink]="['/tournaments', tournament.id, 'registrations']">
-            <mat-icon>group</mat-icon>
-            Inschrijvingen
-          </a>
-          <a mat-button (click)="clearDraw(tournament)" *ngIf="Tournament.getStatus(tournament) == 'Geloot'">
-            <mat-icon>safety_divider</mat-icon>
-            Loting wissen
-          </a>
-        </td>
-      </tr>
+      @for (tournament of getActiveTournaments(); track tournament) {
+        <tr>
+          <td class="align-middle">{{ tournament.id }}</td>
+          <td class="align-middle"><a [routerLink]="['/tournaments', tournament.id, 'manage']">{{ tournament.name }}</a></td>
+          <td class="align-middle">{{ tournament.date }}</td>
+          <td class="align-middle">{{ Tournament.getStatus(tournament) }}</td>
+          <td class="align-middle">
+            @if (Tournament.getStatus(tournament) != 'Afgerond') {
+              <a mat-button [routerLink]="['/tournaments', tournament.id, 'edit']">
+                <mat-icon>edit</mat-icon>
+                Bewerk
+              </a>
+            }
+            <a mat-button [routerLink]="['/tournaments', tournament.id, 'registrations']">
+              <mat-icon>group</mat-icon>
+              Inschrijvingen
+            </a>
+            @if (Tournament.getStatus(tournament) == 'Geloot') {
+              <a mat-button (click)="clearDraw(tournament)">
+                <mat-icon>safety_divider</mat-icon>
+                Loting wissen
+              </a>
+            }
+          </td>
+        </tr>
+      }
+      @if (showInactive) {
+        @for (tournament of getInactiveTournaments(); track tournament) {
+          <tr>
+            <td class="align-middle">{{ tournament.id }}</td>
+            <td class="align-middle"><a [routerLink]="['/tournaments', tournament.id, 'manage']">{{ tournament.name }}</a></td>
+            <td class="align-middle">{{ tournament.date }}</td>
+            <td class="align-middle">{{ Tournament.getStatus(tournament) }}</td>
+            <td class="align-middle">
+              @if (Tournament.getStatus(tournament) != 'Afgerond') {
+                <a mat-button [routerLink]="['/tournaments', tournament.id, 'edit']">
+                  <mat-icon>edit</mat-icon>
+                  Bewerk
+                </a>
+              }
+              <a mat-button [routerLink]="['/tournaments', tournament.id, 'registrations']">
+                <mat-icon>group</mat-icon>
+                Inschrijvingen
+              </a>
+              @if (Tournament.getStatus(tournament) == 'Geloot') {
+                <a mat-button (click)="clearDraw(tournament)">
+                  <mat-icon>safety_divider</mat-icon>
+                  Loting wissen
+                </a>
+              }
+            </td>
+          </tr>
+        }
+      }
       </tbody>
     </table>
+    @if (!showInactive) {
+      <a mat-button (click)="showInactive = true">
+        <mat-icon>expand</mat-icon>
+        Toon inactief
+      </a>
+    }
     <a mat-button routerLink="/tournaments/add">
       <mat-icon>add</mat-icon>
       Nieuw toernooi
diff --git a/src/app/components/tournament-list/tournament-list.component.ts b/src/app/components/tournament-list/tournament-list.component.ts
index 41f6fba..4c3b3df 100644
--- a/src/app/components/tournament-list/tournament-list.component.ts
+++ b/src/app/components/tournament-list/tournament-list.component.ts
@@ -20,6 +20,7 @@ import {TitleService} from "../../service/title.service";
 export class TournamentListComponent implements OnInit, AfterContentChecked {
 
   tournaments: Tournament[];
+  showInactive: boolean = false;
 
   constructor(
     private tournamentService: TournamentService,
@@ -46,4 +47,14 @@ export class TournamentListComponent implements OnInit, AfterContentChecked {
     })
   }
 
+  getActiveTournaments(): Tournament[] {
+    if (!this.tournaments) return [];
+    return this.tournaments.filter(tournament => tournament.active);
+  }
+
+  getInactiveTournaments(): Tournament[] {
+    if (!this.tournaments) return [];
+    return this.tournaments.filter(tournament => !tournament.active);
+  }
+
 }
diff --git a/src/app/components/tournament-manage/tournament-manage.component.html b/src/app/components/tournament-manage/tournament-manage.component.html
index c667214..7f88b40 100644
--- a/src/app/components/tournament-manage/tournament-manage.component.html
+++ b/src/app/components/tournament-manage/tournament-manage.component.html
@@ -71,9 +71,11 @@
                             <th scope="col" class="w-20">Naam</th>
                             <th scope="col" class="w-20">Club</th>
                             <th scope="col" class="w-10">Speelsterkte</th>
-                            <th *ngIf="event.doublesEvent" scope="col" class="w-20">Partner</th>
-                            <th *ngIf="event.doublesEvent" scope="col" class="w-20">Club</th>
-                            <th *ngIf="event.doublesEvent" scope="col" class="w-10">Speelsterkte</th>
+                            @if (event.doublesEvent) {
+                              <th scope="col" class="w-20">Partner</th>
+                              <th scope="col" class="w-20">Club</th>
+                              <th scope="col" class="w-10">Speelsterkte</th>
+                            }
                           </tr>
                           </thead>
                           <tbody>
@@ -81,9 +83,11 @@
                             <td class="align-middle">{{ team.player1 | fullName }}</td>
                             <td class="align-middle">{{ team.player1.club }}</td>
                             <td class="align-middle">{{ getStrength(team.player1.strength.valueOf()) }}</td>
-                            <td *ngIf="event.doublesEvent" class="align-middle">{{ team.player2 | fullName }}</td>
-                            <td *ngIf="event.doublesEvent" class="align-middle">{{ team.player2?.club }}</td>
-                            <td *ngIf="event.doublesEvent" class="align-middle">{{ getStrength(team.player2?.strength?.valueOf()) }}</td>
+                            @if (event.doublesEvent) {
+                              <td class="align-middle">{{ team.player2 | fullName }}</td>
+                              <td class="align-middle">{{ team.player2?.club }}</td>
+                              <td class="align-middle">{{ getStrength(team.player2?.strength?.valueOf()) }}</td>
+                            }
                           </tr>
                           </tbody>
                         </table>
diff --git a/src/app/components/tournament-registrations/tournament-registrations.component.html b/src/app/components/tournament-registrations/tournament-registrations.component.html
index dc91a69..c6f04d4 100644
--- a/src/app/components/tournament-registrations/tournament-registrations.component.html
+++ b/src/app/components/tournament-registrations/tournament-registrations.component.html
@@ -1,32 +1,38 @@
-<mat-card appearance="outlined" *ngIf="tournament">
-  <mat-card-header>
-    <h5>Inschrijvingen voor {{ tournament.name }}</h5>
-  </mat-card-header>
-  <mat-card-content>
-    <mat-card *ngFor="let event of tournament.events" appearance="outlined" class="m-3">
-      <mat-card-header>
-        <h6>{{ TournamentEvent.getType(event.type) }} ({{ event.registrations.length}} inschrijvingen)</h6>
-      </mat-card-header>
-      <mat-card-content>
-        <table class="table {{ event.doublesEvent ? 'w-100' : 'w-50' }}">
-          <thead class="thead-dark">
-            <tr>
-              <th scope="col" class="w-25">Naam</th>
-              <th scope="col" class="w-25">Club</th>
-              <th *ngIf="event.doublesEvent" scope="col" class="w-25">Partner</th>
-              <th *ngIf="event.doublesEvent" scope="col" class="w-25">Club</th>
-            </tr>
-          </thead>
-          <tbody>
-            <tr *ngFor="let registration of event.registrations">
-              <td class="align-middle">{{ registration.player | fullName }}</td>
-              <td class="align-middle">{{ registration.player.club }}</td>
-              <td *ngIf="event.doublesEvent" class="align-middle">{{ registration.partner | fullName }}</td>
-              <td *ngIf="event.doublesEvent" class="align-middle">{{ registration.partner?.club }}</td>
-            </tr>
-          </tbody>
-        </table>
-      </mat-card-content>
-    </mat-card>
-  </mat-card-content>
-</mat-card>
+@if (tournament) {
+  <mat-card appearance="outlined">
+    <mat-card-header>
+      <h5>Inschrijvingen voor {{ tournament.name }}</h5>
+    </mat-card-header>
+    <mat-card-content>
+      <mat-card *ngFor="let event of tournament.events" appearance="outlined" class="m-3">
+        <mat-card-header>
+          <h6>{{ TournamentEvent.getType(event.type) }} ({{ event.registrations.length}} inschrijvingen)</h6>
+        </mat-card-header>
+        <mat-card-content>
+          <table class="table {{ event.doublesEvent ? 'w-100' : 'w-50' }}">
+            <thead class="thead-dark">
+              <tr>
+                <th scope="col" class="w-25">Naam</th>
+                <th scope="col" class="w-25">Club</th>
+                @if (event.doublesEvent) {
+                  <th scope="col" class="w-25">Partner</th>
+                  <th scope="col" class="w-25">Club</th>
+                }
+              </tr>
+            </thead>
+            <tbody>
+              <tr *ngFor="let registration of event.registrations">
+                <td class="align-middle">{{ registration.player | fullName }}</td>
+                <td class="align-middle">{{ registration.player.club }}</td>
+                @if (event.doublesEvent) {
+                  <td class="align-middle">{{ registration.partner?.club }}</td>
+                  <td class="align-middle">{{ registration.partner | fullName }}</td>
+                }
+              </tr>
+            </tbody>
+          </table>
+        </mat-card-content>
+      </mat-card>
+    </mat-card-content>
+  </mat-card>
+}
diff --git a/src/app/components/tournament-validate/tournament-validate.component.html b/src/app/components/tournament-validate/tournament-validate.component.html
index 717ff42..01cdf54 100644
--- a/src/app/components/tournament-validate/tournament-validate.component.html
+++ b/src/app/components/tournament-validate/tournament-validate.component.html
@@ -36,16 +36,20 @@
             <tr>
               <th scope="col" class="w-25">Naam</th>
               <th scope="col" class="w-25">Club</th>
-              <th *ngIf="event.doublesEvent" scope="col" class="w-25">Partner</th>
-              <th *ngIf="event.doublesEvent" scope="col" class="w-25">Club</th>
+              @if (event.doublesEvent) {
+                <th scope="col" class="w-25">Partner</th>
+                <th scope="col" class="w-25">Club</th>
+              }
             </tr>
             </thead>
             <tbody>
             <tr *ngFor="let registration of event.registrations">
               <td class="align-middle">{{ registration.player | fullName }}</td>
               <td class="align-middle">{{ registration.player.club }}</td>
-              <td *ngIf="event.doublesEvent" class="align-middle">{{ registration.partner | fullName }}</td>
-              <td *ngIf="event.doublesEvent" class="align-middle">{{ registration.partner?.club }}</td>
+              @if (event.doublesEvent) {
+                <td class="align-middle">{{ registration.partner | fullName }}</td>
+                <td class="align-middle">{{ registration.partner?.club }}</td>
+              }
             </tr>
             </tbody>
           </table>
@@ -60,11 +64,6 @@
             <li *ngFor="let validation of getEventValidation(event.id)?.validations">
               <mat-icon class="text-{{ getColorForSeverity(validation.severity) }}">{{ getIconForSeverity(validation.severity) }}</mat-icon>
               <player-link [validationMessage]="validation.message"></player-link>
-<!--
-              <div *ngIf="validation.message">
-                <app-player-link [validationMessage]="'validation.message'"></app-player-link>
-              </div>
--->
             </li>
           </ul>
         </mat-expansion-panel>