fix: a couple of issues (#99)

- disconnect hint is always visible on login screen
- app cannot start on iOS due to race condition with WebPushService and
AuthService
- SignalR connection does not reconnect when app is in background for a
long time on iOS

src/client/src/app/app.config.ts

@@ -5,6 +5,7 @@ import {
   isDevMode,
   APP_INITIALIZER,
   inject,
+  Injector,
 } from '@angular/core';
 import { provideAnimations } from '@angular/platform-browser/animations';
 import { provideRouter } from '@angular/router';
@@ -59,13 +60,12 @@ export const appConfig: ApplicationConfig = {
       provide: APP_INITIALIZER,
       multi: true,
       useFactory: () => {
-        // Inject services that need to be initialized
-        inject(WebPushService);
         inject(ThemeService);
-
         const authService = inject(AuthService);
+        const injector = inject(Injector);
         return async () => {
           await authService.init();
+          injector.get(WebPushService);
         };
       },
     },

src/client/src/app/components/app/menu/menu.component.html

@@ -10,7 +10,7 @@
             <span class="font-semibold">{{ translations.title() }}</span>
           }
         </div>
-        @if (!isServerConnected()) {
+        @if (!isServerConnected() && isLoggedIn()) {
           <p-button
             [icon]="'i-[mdi--wifi-off]'"
             [rounded]="true"
@@ -39,7 +39,7 @@
       [routerLink]="'/home'"
     />
     <div class="grow"></div>
-    @if (!isServerConnected()) {
+    @if (!isServerConnected() && isLoggedIn()) {
       <p-button
         [icon]="'i-[mdi--wifi-off]'"
         [rounded]="true"

src/client/src/app/services/realtime-events.service.ts

@@ -8,8 +8,8 @@ import {
   signal,
   untracked,
 } from '@angular/core';
-import { toObservable } from '@angular/core/rxjs-interop';
-import { HubConnection, HubConnectionBuilder } from '@microsoft/signalr';
+import { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';
+import { HubConnection, HubConnectionBuilder, HubConnectionState } from '@microsoft/signalr';
 import { defer, EMPTY, EmptyError, filter, firstValueFrom, map, pairwise, startWith } from 'rxjs';
 
 import { AuthService } from './auth.service';
@@ -27,6 +27,7 @@ import {
   PlayerEventTimeslotRegistrationChanged,
 } from '../models/realtime-events';
 import { SignalrRetryPolicy } from '../signalr-retry-policy';
+import { onDocumentVisibilityChange$ } from '../utils/event.utils';
 import { retryWithPolicy } from '../utils/rxjs.utils';
 
 const USER_CHANGED = 'userChanged';
@@ -72,12 +73,30 @@ export class RealtimeEventsService implements OnDestroy {
       const tokenInfo = this._authService.token();
       untracked(() => this.onLoginChanged(tokenInfo));
     });
+
+    onDocumentVisibilityChange$()
+      .pipe(
+        takeUntilDestroyed(),
+        filter(x => x)
+      )
+      .subscribe(() => this.ensureConnected());
   }
 
   public ngOnDestroy() {
     this.disconnect();
   }
 
+  private async ensureConnected() {
+    await this._authService.ensureTokenNotExpired();
+    if (!this._authService.token()) return;
+    if (!this._hubConnection) {
+      await this.connect();
+    } else if (this._hubConnection.state !== HubConnectionState.Connected) {
+      await this._hubConnection.stop();
+      this.start();
+    }
+  }
+
   private onLoginChanged(token: AuthTokenInfo | null | undefined) {
     if (token) {
       this.connect();
@@ -127,9 +146,17 @@ export class RealtimeEventsService implements OnDestroy {
     connection.onclose(() => this._isConnected.set(false));
 
     this._hubConnection = connection;
+    await this.start();
+  }
+
+  private async start() {
     try {
       await firstValueFrom(
-        defer(() => this._hubConnection?.start() ?? EMPTY).pipe(
+        defer(() =>
+          !this._hubConnection || this._hubConnection.state === HubConnectionState.Connected
+            ? EMPTY
+            : this._hubConnection.start()
+        ).pipe(
           retryWithPolicy(
             new SignalrRetryPolicy((error, nextDelay) =>
               console.warn(
@@ -140,7 +167,9 @@ export class RealtimeEventsService implements OnDestroy {
           )
         )
       );
-      this._isConnected.set(true);
+      if (this._hubConnection?.state === HubConnectionState.Connected) {
+        this._isConnected.set(true);
+      }
     } catch (ex) {
       if (!(ex instanceof EmptyError)) {
         throw ex;