diff --git a/package-lock.json b/package-lock.json index c6bcf83..c50ca67 100644 --- a/package-lock.json +++ b/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", diff --git a/package.json b/package.json index 4e9ebb9..55fdb80 100644 --- a/package.json +++ b/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", diff --git a/src/app/app.module.ts b/src/app/app.module.ts index aefdad4..f08986e 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -38,7 +38,7 @@ import { AppComponent } from './app.component'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { LoginComponent } from './pages/login/login.component'; import { BikesComponent } from './pages/tables/bikes/bikes.component'; -import { GraphQLModule } from './graphql.module'; +import { GraphQLModule2 } from './graphql.module'; import { ParticipantsComponent } from './pages/tables/participants/participants.component'; import { LendingStationsComponent } from './pages/tables/lending-stations/lending-stations.component'; import { TableOverviewComponent } from './pages/table-overview/table-overview.component'; @@ -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, @@ -124,7 +126,7 @@ import { ErrorSnackbarComponent, SnackbarDialog } from './helper/snackbar-ref.co MatProgressBarModule, MatCheckboxModule, MatSnackBarModule, - GraphQLModule, + GraphQLModule2, DragDropModule, MatTooltipModule, MatSelectModule, diff --git a/src/app/graphql.module.ts b/src/app/graphql.module.ts index 9b7ae36..7f30c17 100644 --- a/src/app/graphql.module.ts +++ b/src/app/graphql.module.ts @@ -1,18 +1,30 @@ -import { NgModule } from '@angular/core'; +/*import { NgModule } from '@angular/core'; import { APOLLO_OPTIONS } from 'apollo-angular'; import { ApolloClientOptions, - ApolloLink, - concat, + HttpLink, InMemoryCache, } from '@apollo/client/core'; -import { HttpLink } from 'apollo-angular/http'; +//import { HttpLink } from 'apollo-angular/http'; import { environment } from '../environments/environment'; import { DefaultOptions } from '@apollo/client/core/ApolloClient'; +//import { HttpLink } from 'apollo-link-http'; +import { onError } from '@apollo/link-error'; + const uri = environment.apiUrl + '/graphql'; // <-- add the URL of the GraphQL server here +const errorLink = onError(({ graphQLErrors, networkError }) => { + if (graphQLErrors) + graphQLErrors.map(({ message, locations, path }) => + console.log( + `[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`, + ), + ); + if (networkError) console.log(`[Network error]: ${networkError}`); + }); + const defaultOptions: DefaultOptions = { watchQuery: { fetchPolicy: 'no-cache', @@ -26,7 +38,7 @@ const defaultOptions: DefaultOptions = { export function createApollo(httpLink: HttpLink): ApolloClientOptions { return { - link: httpLink.create({ uri }), + //link: errorLink.concat(new HttpLink({ uri })), cache: new InMemoryCache({}), defaultOptions: defaultOptions, }; @@ -38,7 +50,62 @@ export function createApollo(httpLink: HttpLink): ApolloClientOptions { provide: APOLLO_OPTIONS, useFactory: createApollo, deps: [HttpLink], - }, + } ], }) export class GraphQLModule {} + +*/ +import { Apollo } from 'apollo-angular'; +import { HTTP_INTERCEPTORS } from '@angular/common/http'; +import { TokenInterceptor } from './helper/token.interceptor'; +import { NgModule } from '@angular/core'; + +import { + ApolloClientOptions, + HttpLink, + InMemoryCache, +} from '@apollo/client/core'; + +import { environment } from '../environments/environment'; +import { onError } from '@apollo/link-error'; +//import { HttpLink } from 'apollo-angular-link-http'; + +//import { HttpLink } from 'apollo-link-http'; +//import { onError } from 'apollo-link-error'; + + +@NgModule({ + providers: [ + { provide: HTTP_INTERCEPTORS, useClass: TokenInterceptor, multi: true }, + ] +}) +export class GraphQLModule2 { + constructor( + apollo: Apollo, + ) { + const link = new HttpLink({ + uri: environment.apiUrl + '/graphql', + }); + const errorLink = onError(({ graphQLErrors, networkError }) => { + if (graphQLErrors) + graphQLErrors.map(({ message, locations, path }) => + console.log( + `[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`, + ), + ); + if (networkError) console.log(`[Network error]: ${networkError}`); + }); + + apollo.create({ + link: errorLink.concat(link), + cache: new InMemoryCache() + }); + + } + + + + + +} \ No newline at end of file diff --git a/src/app/helper/token.interceptor.ts b/src/app/helper/token.interceptor.ts index dc10b4f..97d361f 100644 --- a/src/app/helper/token.interceptor.ts +++ b/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, next: HttpHandler): Observable> { - + console.log("i intercepted something"); if (this.authService.getRequestToken()) { request = this.addToken(request, this.authService.getRequestToken()); }