Angular Error Handling POC

app.component.ts

import { Component, OnDestroy, OnInit } from '@angular/core';
import { ConsoleLogger } from './utils/consoleLogger';
.
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.scss' ]
})
export class AppComponent implements OnInit, OnDestroy {

  constructor(...) {
    ConsoleLogger.overWriteConsoleLog();
  }
  
  ngOnInit(): void {...}
  
  ngOnDestroy(): void {...}
}

app.module.ts

import { NgModule, ErrorHandler, APP_INITIALIZER } from '@angular/core';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';

import { HttpErrorHandlerInterceptor } from './utils/httpErrorHandler.interceptor';
import { UiErrorHandler } from './utils/uiErrorHandler';

@NgModule({
  declarations: [...],
  imports: [...],
  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: HttpErrorHandlerInterceptor,
      multi: true
    },
    {
      provide: ErrorHandler,
      useClass: UiErrorHandler
    },
    ReadyService
  ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }

consoleLogger.ts

var logPrefix = `[${new Date().toUTCString()}]`;
var log = console.log;

export abstract class ConsoleLogger {

    public static setLogPrefix(prefix: string): void {
        logPrefix = prefix;
    }

    public static overWriteConsoleLog(): void {
        console.log = function(){
            let args = Array.from(arguments);
            args.unshift(`${logPrefix}: `);
            log.apply(console, args);
        }
    }
}

httpErrorHandler.interceptor.ts

import { Injectable } from '@angular/core';
import { HttpInterceptor, HttpEvent, HttpResponse, HttpRequest, HttpHandler, HttpEventType, HttpErrorResponse } from '@angular/common/http';
import { catchError, Observable, of, tap } from 'rxjs';

@Injectable()
export class HttpErrorHandlerInterceptor implements HttpInterceptor {
  intercept(httpRequest: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    return next
    .handle(httpRequest)
    .pipe(
      catchError((errorResponse: HttpErrorResponse) => {
        const errorMessage = errorResponse.error?.Message ?? errorResponse.message;
        console.error(`${httpRequest.method} ${httpRequest.urlWithParams} ${errorMessage}`);
        return of (errorResponse);
      }),
      tap((nextHttpEvent: HttpEvent<any>) => {
        console.dir({
          dateTime: new Date().toUTCString(),
          method: httpRequest.method,
          url: httpRequest.urlWithParams,
          type: HttpEventType[nextHttpEvent.type],
          body: nextHttpEvent instanceof HttpResponse ? nextHttpEvent.body : httpRequest.body
        });
      })
    );
  }
}

uiErrorHandler.ts

import { ErrorHandler, Injectable } from "@angular/core";

@Injectable()
export class UiErrorHandler implements ErrorHandler {
    handleError(error: any) {
        console.error("ehhh", error); 
    }
}