Help with my angular components having knowledge of disconnects.

[Hugofbf21]

getNewHouses(name: String): Observable<Partial<House>[] | void> {
    return this.apollo.subscribe<{ onNewHouses: RemoteHouse[] }>({
      query: newHousesSubscription,
      fetchPolicy: "no-cache",
      variables: {
        name: name,
      }
    }).pipe(map((result) => {
      console.log("onNewHouses", result);
      if (result.data) {
        return result.data.onNewHouses.map(House.partialFromRemote);
      }
    }), catchError(this.errorHandler.catchGraphQLErrors));
  }

And this on my GraphQLWsLink:

on: {
          connected: (socket) => {
            console.log('Connected to websocket');
            this.maxRetries = 20;
            this.retryLock = false;
            activeSocket = socket as WebSocket;
          },
          ping: (received) => {
            if (!received)
              // sent
              timedOut = window.setTimeout(() => {
                if (activeSocket.readyState === WebSocket.OPEN) {
                  console.log('Closing websocket due to timeout');
                  activeSocket.close(4408, 'Request Timeout');
                }
              }, 5000); // wait 5 seconds for the pong and then close the connection
          },
          pong: (received) => {
            if (received) clearTimeout(timedOut);// pong is received, clear connection close timeout
          },

How can I inform my user that the websocket is timed out? I would like to use the subscribe on the service and maintain my architecture. I would like to know if I can for example send a message into my subscribers like "closed" or an error while the retries of the websocket are going. So I can display a message to my users. Any help would be appreciated!

In the meanwhile I made a service that's like this:

import { Injectable } from '@angular/core';
import {BehaviorSubject} from "rxjs";

@Injectable({
 providedIn: 'root'
})
export class WebsocketStateManager {

 public websocketStateSubject = new BehaviorSubject<boolean>(true);
 constructor() { }

 /**
  * Updates the websocket state to the provided boolean, true for connected, false for disconnected
  * @param state boolean value to update the websocket state
  */
 updateWebsocketState(state: boolean) {
   this.websocketStateSubject.next(state);
 }

}

And I would call it inside the setTimeout, the thing is this is only working because I only have 1 Websocket connection if I had two this service would act like a singleton. I would like to send something like an error to the Observable and then if get that error I would show the user a message, then if with the retries the websocket starts working again I would hide it.