Improve Apollo error handling and log missing repositories gracefully

Previously, uncaught ApolloErrors — especially those triggered by exceeding
the GitHub API rate limit — surfaced as unhandled promise rejections.

This caused confusing, bloated error stacks in the console and toast messages,
detracting from the user experience and masking the root issue.

Let’s unwrap promise rejections at the top level and explicitly detect Apollo errors.
By inspecting graphQLErrors and networkError, we can now display
clear, user-friendly messages when rate limits are hit or data is unavailable.

Additionally, GraphQL responses sometimes lacked repository fields,
often due to upstream errors or permission issues.

The previous implementation assumed response.body.data.repository would exist,
causing runtime crashes or broken logic when it didn’t.

Let’s add guards and structured logging to flag when repositories are missing,
including relevant operationName context to help with debugging.

Author: e1121208

src/app/app.module.ts

@@ -86,17 +86,39 @@ import { SharedModule } from './shared/shared.module';
   bootstrap: [AppComponent]
 })
 export class AppModule {
-  constructor(private apollo: Apollo, private httpLink: HttpLink, private authService: AuthService, private logger: LoggingService) {
+  constructor(
+    private apollo: Apollo,
+    private httpLink: HttpLink,
+    private authService: AuthService,
+    private logger: LoggingService,
+    private errorHandler: ErrorHandlingService
+  ) {
     const URI = 'https://api.github.com/graphql';
     const log = new ApolloLink((operation, forward) => {
-      operation.setContext({ start: performance.now() });
+      const start = performance.now();
+      operation.setContext({ start });
+
       this.logger.info('AppModule: GraphQL request', operation.getContext());
+
       return forward(operation).map((result) => {
-        const time = performance.now() - operation.getContext().start;
-        this.logger.info('AppModule: GraphQL response', operation.getContext(), `in ${Math.round(time)}ms`);
-        const repo = operation.getContext().response.body.data.repository;
+        const time = Math.round(performance.now() - start);
+        const context = operation.getContext();
+
+        this.logger.info('AppModule: GraphQL response', context, `in ${time}ms`);
+
+        const repo = context.response?.body?.data?.repository;
+        if (!repo) {
+          this.logger.warn('AppModule: GraphQL response missing repository', {
+            context: context.name,
+            operation: operation.operationName
+          });
+          return result;
+        }
+
         const item = Object.keys(repo)[0];
-        this.logger.debug('AppModule: GraphQL response body', item, repo[item].edges.length, repo[item].edges);
+        const edges = repo[item]?.edges ?? [];
+        this.logger.debug('AppModule: GraphQL response body', item, edges.length, edges);
+
         return result;
       });
     });

src/app/core/services/error-handling.service.ts

@@ -1,7 +1,9 @@
 import { HttpErrorResponse } from '@angular/common/http';
 import { ErrorHandler, Injectable } from '@angular/core';
 import { MatSnackBar } from '@angular/material/snack-bar';
+import { ApolloError } from '@apollo/client/core';
 import { RequestError } from '@octokit/request-error';
+import { GraphQLError } from 'graphql';
 import { FormErrorComponent } from '../../shared/error-toasters/form-error/form-error.component';
 import { GeneralMessageErrorComponent } from '../../shared/error-toasters/general-message-error/general-message-error.component';
 import { LoggingService } from './logging.service';
@@ -10,14 +12,52 @@ export const ERRORCODE_NOT_FOUND = 404;
 
 const FILTERABLE = ['node_modules'];
 
+interface RejectionErrorWrapper {
+  rejection?: unknown;
+}
+
+function hasRejection(error: unknown): error is RejectionErrorWrapper {
+  return typeof error === 'object' && error !== null && 'rejection' in error;
+}
+
 @Injectable({
   providedIn: 'root'
 })
 export class ErrorHandlingService implements ErrorHandler {
   constructor(private snackBar: MatSnackBar, private logger: LoggingService) {}
 
-  handleError(error: HttpErrorResponse | Error | RequestError, actionCallback?: () => void) {
+  handleError(
+    error: HttpErrorResponse | Error | RequestError | ApolloError | RejectionErrorWrapper,
+    actionCallback?: () => void
+  ): void {
+    if (hasRejection(error)) {
+      error = error.rejection;
+    }
+
+    if (error instanceof ApolloError) {
+      if (error.graphQLErrors?.length) {
+        error.graphQLErrors.forEach((gqlError: GraphQLError) => {
+          const isRateLimit = gqlError.message.toLowerCase().includes('rate limit');
+          const message = isRateLimit
+            ? 'GitHub API rate limit exceeded. Please try again later.'
+            : gqlError.message;
+
+          this.logger.error(`[GraphQL error]: ${gqlError.message}`);
+
+          this.snackBar.openFromComponent(GeneralMessageErrorComponent, {
+            data: { message },
+          });
+        });
+      } else if (error.networkError) {
+        this.handleHttpError(error.networkError as HttpErrorResponse, actionCallback);
+      } else {
+        this.handleGeneralError(error.message);
+      }
+      return;
+    }
+
     this.logger.error(error);
+
     if (error instanceof Error) {
       this.logger.debug('ErrorHandlingService: ', this.cleanStack(error.stack));
     }
@@ -26,7 +66,7 @@ export class ErrorHandlingService implements ErrorHandler {
     } else if (error.constructor.name === 'RequestError') {
       this.handleHttpError(error as RequestError, actionCallback);
     } else {
-      this.handleGeneralError(error.message || JSON.stringify(error));
+      this.handleGeneralError((error as Error).message || JSON.stringify(error));
     }
   }