Merge pull request #8 from fLotte-meets-HWR-DB/apollointerceptor

implemented appollo error interceptor

package-lock.json

@@ -789,24 +789,48 @@
       }
     },
     "@apollo/client": {
-      "version": "3.2.5",
-      "resolved": "https://registry.npmjs.org/@apollo/client/-/client-3.2.5.tgz",
-      "integrity": "sha512-zpruxnFMz6K94gs2pqc3sidzFDbQpKT5D6P/J/I9s8ekHZ5eczgnRp6pqXC86Bh7+44j/btpmOT0kwiboyqTnA==",
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/@apollo/client/-/client-3.3.3.tgz",
+      "integrity": "sha512-zs148iUbBgmeQFOc+Jc4/Cb3LK7urQuCQGHifviMp0ihxzbJ8rtj0hCVuQhWaZxZRcL5oZBCfIuL1O5xuvszmQ==",
       "requires": {
         "@graphql-typed-document-node/core": "^3.0.0",
         "@types/zen-observable": "^0.8.0",
         "@wry/context": "^0.5.2",
-        "@wry/equality": "^0.2.0",
+        "@wry/equality": "^0.3.0",
         "fast-json-stable-stringify": "^2.0.0",
         "graphql-tag": "^2.11.0",
         "hoist-non-react-statics": "^3.3.2",
-        "optimism": "^0.13.0",
+        "optimism": "^0.13.1",
         "prop-types": "^15.7.2",
         "symbol-observable": "^2.0.0",
-        "ts-invariant": "^0.4.4",
+        "ts-invariant": "^0.5.1",
         "tslib": "^1.10.0",
         "zen-observable": "^0.8.14"
       },
+      "dependencies": {
+        "ts-invariant": {
+          "version": "0.5.1",
+          "resolved": "https://registry.npmjs.org/ts-invariant/-/ts-invariant-0.5.1.tgz",
+          "integrity": "sha512-k3UpDNrBZpqJFnAAkAHNmSHtNuCxcU6xLiziPgalHRKZHme6T6jnKC8CcXDmk1zbHLQM8pc+rNC1Q6FvXMAl+g==",
+          "requires": {
+            "tslib": "^1.9.3"
+          }
+        },
+        "tslib": {
+          "version": "1.14.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+        }
+      }
+    },
+    "@apollo/link-error": {
+      "version": "2.0.0-beta.3",
+      "resolved": "https://registry.npmjs.org/@apollo/link-error/-/link-error-2.0.0-beta.3.tgz",
+      "integrity": "sha512-blNBBi9+4SEfb4Bhn8cYqGFhb0C7MjqLiRwNdUqwGefl1w+G8Ze8pCLHAyPxXLcslirtht9LY0i6ZOpCzSXHCg==",
+      "requires": {
+        "@apollo/client": "^3.0.0-beta.23",
+        "tslib": "^1.9.3"
+      },
       "dependencies": {
         "tslib": {
           "version": "1.14.1",
@@ -4838,9 +4862,9 @@
       }
     },
     "@wry/equality": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/@wry/equality/-/equality-0.2.0.tgz",
-      "integrity": "sha512-Y4d+WH6hs+KZJUC8YKLYGarjGekBrhslDbf/R20oV+AakHPINSitHfDRQz3EGcEWc1luXYNUvMhawWtZVWNGvQ==",
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/@wry/equality/-/equality-0.3.0.tgz",
+      "integrity": "sha512-DRDAu/e3oWBj826OWNV/GCmSdHD248mASXImgNoLE/3SDvpgb+k6G/+TAmdpIB35ju264+kB22Rx92eXg52DnA==",
       "requires": {
         "tslib": "^1.9.3"
       },
@@ -5049,6 +5073,83 @@
         }
       }
     },
+    "apollo-angular-link-http": {
+      "version": "1.11.0",
+      "resolved": "https://registry.npmjs.org/apollo-angular-link-http/-/apollo-angular-link-http-1.11.0.tgz",
+      "integrity": "sha512-/mFytwvHhmWOX3emi8ljpuas8HpwSVOfbKniOeDFSE44g9HsPKkq2bGTucUTUo0Un3cCBEVKei2jTIDVsZPqFA==",
+      "requires": {
+        "apollo-angular-link-http-common": "~1.10.0",
+        "extract-files": "6.0.0",
+        "tslib": "^2.0.0"
+      },
+      "dependencies": {
+        "extract-files": {
+          "version": "6.0.0",
+          "resolved": "https://registry.npmjs.org/extract-files/-/extract-files-6.0.0.tgz",
+          "integrity": "sha512-v9UVTPkERZR1NjEOIPvmbzLFdh8YZFEGjRdSJraop6HJe9PQ8HU9iv6eRMuF06CXXXO/R5OBmnWMixZHuZ8CsA=="
+        }
+      }
+    },
+    "apollo-angular-link-http-common": {
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/apollo-angular-link-http-common/-/apollo-angular-link-http-common-1.10.0.tgz",
+      "integrity": "sha512-Oue8b/naWZvG/oQ+3ZAqaBVreBIwqy16yOk5CpoE7+Gjhett9KGVu/OZcpH89/ifwXyWzHpKnCUnB1fxgbnR7Q==",
+      "requires": {
+        "tslib": "^2.0.0"
+      }
+    },
+    "apollo-link": {
+      "version": "1.2.14",
+      "resolved": "https://registry.npmjs.org/apollo-link/-/apollo-link-1.2.14.tgz",
+      "integrity": "sha512-p67CMEFP7kOG1JZ0ZkYZwRDa369w5PIjtMjvrQd/HnIV8FRsHRqLqK+oAZQnFa1DDdZtOtHTi+aMIW6EatC2jg==",
+      "requires": {
+        "apollo-utilities": "^1.3.0",
+        "ts-invariant": "^0.4.0",
+        "tslib": "^1.9.3",
+        "zen-observable-ts": "^0.8.21"
+      },
+      "dependencies": {
+        "tslib": {
+          "version": "1.14.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+        }
+      }
+    },
+    "apollo-link-http": {
+      "version": "1.5.17",
+      "resolved": "https://registry.npmjs.org/apollo-link-http/-/apollo-link-http-1.5.17.tgz",
+      "integrity": "sha512-uWcqAotbwDEU/9+Dm9e1/clO7hTB2kQ/94JYcGouBVLjoKmTeJTUPQKcJGpPwUjZcSqgYicbFqQSoJIW0yrFvg==",
+      "requires": {
+        "apollo-link": "^1.2.14",
+        "apollo-link-http-common": "^0.2.16",
+        "tslib": "^1.9.3"
+      },
+      "dependencies": {
+        "tslib": {
+          "version": "1.14.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+        }
+      }
+    },
+    "apollo-link-http-common": {
+      "version": "0.2.16",
+      "resolved": "https://registry.npmjs.org/apollo-link-http-common/-/apollo-link-http-common-0.2.16.tgz",
+      "integrity": "sha512-2tIhOIrnaF4UbQHf7kjeQA/EmSorB7+HyJIIrUjJOKBgnXwuexi8aMecRlqTIDWcyVXCeqLhUnztMa6bOH/jTg==",
+      "requires": {
+        "apollo-link": "^1.2.14",
+        "ts-invariant": "^0.4.0",
+        "tslib": "^1.9.3"
+      },
+      "dependencies": {
+        "tslib": {
+          "version": "1.14.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+        }
+      }
+    },
     "apollo-utilities": {
       "version": "1.3.4",
       "resolved": "https://registry.npmjs.org/apollo-utilities/-/apollo-utilities-1.3.4.tgz",
@@ -12339,9 +12440,9 @@
       }
     },
     "optimism": {
-      "version": "0.13.0",
-      "resolved": "https://registry.npmjs.org/optimism/-/optimism-0.13.0.tgz",
-      "integrity": "sha512-6JAh3dH+YUE4QUdsgUw8nUQyrNeBKfAEKOHMlLkQ168KhIYFIxzPsHakWrRXDnTO+x61RJrS3/2uEt6W0xlocA==",
+      "version": "0.13.1",
+      "resolved": "https://registry.npmjs.org/optimism/-/optimism-0.13.1.tgz",
+      "integrity": "sha512-16RRVYZe8ODcUqpabpY7Gb91vCAbdhn8FHjlUb2Hqnjjow1j8Z1dlppds+yAsLbreNTVylLC+tNX6DuC2vt3Kw==",
       "requires": {
         "@wry/context": "^0.5.2"
       }
@@ -18619,6 +18720,22 @@
       "resolved": "https://registry.npmjs.org/zen-observable/-/zen-observable-0.8.15.tgz",
       "integrity": "sha512-PQ2PC7R9rslx84ndNBZB/Dkv8V8fZEpk83RLgXtYd0fwUgEjseMn1Dgajh2x6S8QbZAFa9p2qVCEuYZNgve0dQ=="
     },
+    "zen-observable-ts": {
+      "version": "0.8.21",
+      "resolved": "https://registry.npmjs.org/zen-observable-ts/-/zen-observable-ts-0.8.21.tgz",
+      "integrity": "sha512-Yj3yXweRc8LdRMrCC8nIc4kkjWecPAUVh0TI0OUrWXx6aX790vLcDlWca6I4vsyCGH3LpWxq0dJRcMOFoVqmeg==",
+      "requires": {
+        "tslib": "^1.9.3",
+        "zen-observable": "^0.8.0"
+      },
+      "dependencies": {
+        "tslib": {
+          "version": "1.14.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+        }
+      }
+    },
     "zone.js": {
       "version": "0.10.3",
       "resolved": "https://registry.npmjs.org/zone.js/-/zone.js-0.10.3.tgz",

package.json

@@ -25,8 +25,11 @@
     "@angular/platform-browser": "~10.0.14",
     "@angular/platform-browser-dynamic": "~10.0.14",
     "@angular/router": "~10.0.14",
-    "@apollo/client": "^3.2.5",
+    "@apollo/client": "^3.3.3",
+    "@apollo/link-error": "^2.0.0-beta.3",
     "apollo-angular": "^2.1.0",
+    "apollo-angular-link-http": "^1.11.0",
+    "apollo-link-http": "^1.5.17",
     "graphql": "^15.4.0",
     "graphql-anywhere": "^4.2.7",
     "rxjs": "~6.5.5",

src/app/app.module.ts

@@ -67,6 +67,7 @@ import { AutocompleteSelectComponent } from './components/autocomplete-select/au
 import { LendingStationComponent } from './pages/dataPages/lending-station/lending-station.component';
 import { ProfileComponent } from './pages/profile/profile.component';
 import { ErrorSnackbarComponent, SnackbarDialog } from './helper/snackbar-ref.component';
+import { HttpLinkModule } from 'apollo-angular-link-http';
 
 
 
@@ -103,6 +104,7 @@ import { ErrorSnackbarComponent, SnackbarDialog } from './helper/snackbar-ref.co
   imports: [
     BrowserModule,
     HttpClientModule,
+    HttpLinkModule,
     AppRoutingModule,
     BrowserAnimationsModule,
     FormsModule,

src/app/graphql.module.ts

@@ -2,17 +2,22 @@ import { NgModule } from '@angular/core';
 import { APOLLO_OPTIONS } from 'apollo-angular';
 import {
   ApolloClientOptions,
-  ApolloLink,
-  concat,
   InMemoryCache,
 } from '@apollo/client/core';
-import { HttpLink } from 'apollo-angular/http';
 import { environment } from '../environments/environment';
 import { DefaultOptions } from '@apollo/client/core/ApolloClient';
 
+import { onError } from '@apollo/link-error';
+
+import {Apollo, gql} from 'apollo-angular';
+import {HttpLink} from 'apollo-angular/http';
+import { SnackBarService } from './services/snackbar.service';
+
 
 const uri = environment.apiUrl + '/graphql'; // <-- add the URL of the GraphQL server here
 
+
+
 const defaultOptions: DefaultOptions = {
   watchQuery: {
     fetchPolicy: 'no-cache',
@@ -24,9 +29,29 @@ const defaultOptions: DefaultOptions = {
   },
 }
 
-export function createApollo(httpLink: HttpLink): ApolloClientOptions<any> {
+
+
+export function createApollo(httpLink: HttpLink, snackBar: SnackBarService): ApolloClientOptions<any> {
+
+  const errorLink = onError(({ graphQLErrors, networkError }) => {
+    if (graphQLErrors)
+      graphQLErrors.map(({ message, locations, path }) => {
+        snackBar.openSnackBar(JSON.stringify(message), "Ok", true);
+        /*console.log(
+          `[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`,
+        )*/
+      },
+      
+      );
+      if (networkError) {
+        //console.log(`[Network error]: ${networkError}`);
+        // THE FOLLOWING CODE IS UNTESTED
+        snackBar.openSnackBar("Ein NetzwerkFehler ist aufgetreten", "Ok", true, [{"message": networkError}] );
+      } 
+    });
+
   return {
-    link: httpLink.create({ uri }),
+    link: errorLink.concat(httpLink.create({ uri })),
     cache: new InMemoryCache({}),
     defaultOptions: defaultOptions,
   };
@@ -37,8 +62,10 @@ export function createApollo(httpLink: HttpLink): ApolloClientOptions<any> {
     {
       provide: APOLLO_OPTIONS,
       useFactory: createApollo,
-      deps: [HttpLink],
-    },
+      deps: [HttpLink, SnackBarService],
+    }
   ],
 })
-export class GraphQLModule {}
+export class GraphQLModule {
+
+}

src/app/helper/token.interceptor.ts

@@ -7,7 +7,10 @@ import { SnackBarService } from '../services/snackbar.service';
 import { Router, RouterStateSnapshot } from '@angular/router';
 import { JsonPipe } from '@angular/common';
 
-@Injectable()
+@Injectable({
+  providedIn: 'root',
+}
+)
 export class TokenInterceptor implements HttpInterceptor {
 
   private isRefreshing = false;
@@ -16,7 +19,7 @@ export class TokenInterceptor implements HttpInterceptor {
   constructor(private authService: AuthService, private snackBar : SnackBarService, private router: Router) { }
 
   intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
-
+    //console.log("i intercepted something");
     if (this.authService.getRequestToken()) {
       request = this.addToken(request, this.authService.getRequestToken());
     }