Graphql migration

.travis.yml

@@ -6,6 +6,7 @@ sudo: required
 branches:
   only:
     - master
+    - graphql-migration
 install: true
 cache:
   directories:

package.json

@@ -36,9 +36,17 @@
     "@angular/router": "^7.2.16",
     "@octokit/rest": "^16.37.0",
     "ajv": "^6.11.0",
+    "apollo-angular": "^1.9.1",
+    "apollo-angular-link-http": "^1.10.0",
+    "apollo-cache-inmemory": "^1.6.0",
+    "apollo-client": "^2.6.0",
+    "apollo-link": "^1.2.14",
+    "apollo-link-context": "^1.0.20",
     "core-js": "^3.6.4",
     "csv-parse": "^4.4.3",
     "diff-match-patch": "^1.0.4",
+    "graphql": "^14.6.0",
+    "graphql-tag": "^2.10.0",
     "moment": "^2.24.0",
     "ngx-markdown": "^8.2.1",
     "node-fetch": "^2.6.0",

src/app/app.module.ts

@@ -16,6 +16,12 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { UserConfirmationComponent } from './core/guards/user-confirmation/user-confirmation.component';
 import { PhaseTesterResponseModule } from './phase-tester-response/phase-tester-response.module';
 import { SessionFixConfirmationComponent } from './core/services/session-fix-confirmation/session-fix-confirmation.component';
+import {HttpLink, HttpLinkModule} from 'apollo-angular-link-http';
+import {AuthService} from './core/services/auth.service';
+import {setContext} from 'apollo-link-context';
+import {ApolloLink} from 'apollo-link';
+import {InMemoryCache} from 'apollo-cache-inmemory';
+import {Apollo, ApolloModule} from 'apollo-angular';
 
 @NgModule({
   declarations: [
@@ -49,6 +55,8 @@ import { SessionFixConfirmationComponent } from './core/services/session-fix-con
       },
     }),
     AppRoutingModule,
+    ApolloModule,
+    HttpLinkModule,
   ],
   providers: [],
   bootstrap: [AppComponent],
@@ -57,4 +65,21 @@ import { SessionFixConfirmationComponent } from './core/services/session-fix-con
     SessionFixConfirmationComponent
   ]
 })
-export class AppModule { }
+
+export class AppModule {
+  constructor(private apollo: Apollo, private httpLink: HttpLink, private authService: AuthService) {
+    const URI = 'https://api.github.com/graphql';
+    const basic = setContext(() => {
+      return { headers: {Accept: 'charset=utf-8' }};
+    });
+    const auth = setContext(() => {
+      return { headers: { Authorization: `Token ${authService.oauthToken}` } };
+    });
+    const link = ApolloLink.from([basic, auth, this.httpLink.create({ uri: URI })]);
+    const cache = new InMemoryCache();
+    apollo.create({
+      link: link,
+      cache: cache,
+    });
+  }
+}

src/app/auth/auth.component.ts

@@ -70,6 +70,7 @@ export class AuthComponent implements OnInit, OnDestroy {
           return;
         }
         this.githubService.storeOAuthAccessToken(token);
+        this.authService.storeOAuthAccessToken(token);
         this.userService.getAuthenticatedUser().subscribe((user: GithubUser) => {
           auth.setLoginStatusWithGithub(true);
           this.currentUserName = user.login;
@@ -176,7 +177,7 @@ export class AuthComponent implements OnInit, OnDestroy {
       }),
       flatMap(() => {
         return this.githubEventService.setLatestChangeEvent();
-      })
+      }),
     ).subscribe(() => {
       this.handleAuthSuccess();
     }, (error) => {
@@ -198,7 +199,7 @@ export class AuthComponent implements OnInit, OnDestroy {
     this.phaseService.storeSessionData().pipe(
       flatMap((isValidSession: boolean) => {
         if (!isValidSession) {
-          throwError('Invalid Session');
+          return throwError('Invalid Session');
         }
         return this.authService.hasExistingAuthWithGithub();
       }),

src/app/core/services/auth.service.ts

@@ -28,6 +28,7 @@ export class AuthService {
 
   authStateSource = new BehaviorSubject(AuthState.NotAuthenticated);
   currentAuthState = this.authStateSource.asObservable();
+  oauthToken: String;
 
   constructor(private electronService: ElectronService, private router: Router, private ngZone: NgZone,
               private http: HttpClient,  private errorHandlingService: ErrorHandlingService,
@@ -54,6 +55,19 @@ export class AuthService {
     return this.http.get('https://api.github.com/user', { headers: header });
   }
 
+  /**
+   * Will store the OAuth token.
+   */
+  storeOAuthAccessToken(token: string) {
+    this.oauthToken = token;
+  }
+
+  reset(): void {
+    this.oauthToken = undefined;
+    this.changeAuthState(AuthState.NotAuthenticated);
+    this.ngZone.run(() => this.router.navigate(['']));
+  }
+
   logOut(): void {
     this.githubService.reset();
     this.userService.reset();
@@ -68,9 +82,7 @@ export class AuthService {
       .concat(require('../../../../package.json').version)
     );
     this.issueService.setIssueTeamFilter('All Teams');
-
-    this.changeAuthState(AuthState.NotAuthenticated);
-    this.ngZone.run(() => this.router.navigate(['']));
+    this.reset();
   }
 
   isAuthenticated(): boolean {

src/app/core/services/github.service.ts

@@ -13,6 +13,7 @@ import { GithubResponse } from '../models/github/github-response.model';
 import { IssuesEtagManager } from '../models/github/cache-manager/issues-etag-manager.model';
 import { IssueLastModifiedManagerModel } from '../models/github/cache-manager/issue-last-modified-manager.model';
 import { CommentsEtagManager } from '../models/github/cache-manager/comments-etag-manager.model';
+import { Apollo } from 'apollo-angular';
 
 const Octokit = require('@octokit/rest');
 const CATCHER_ORG = 'CATcher-org';
@@ -32,7 +33,10 @@ export class GithubService {
   private issuesLastModifiedManager = new IssueLastModifiedManagerModel();
   private commentsEtagManager = new CommentsEtagManager();
 
-  constructor(private errorHandlingService: ErrorHandlingService) {}
+  constructor(
+    private errorHandlingService: ErrorHandlingService,
+    private apollo: Apollo,
+  ) {}
 
   storeCredentials(user: String, passw: String) {
     octokit = new Octokit({

src/app/core/services/user.service.ts

@@ -1,11 +1,10 @@
 import {Injectable} from '@angular/core';
 import {GithubService} from './github.service';
 import {User, UserRole} from '../models/user.model';
-import {map} from 'rxjs/operators';
+import { filter, map, throwIfEmpty } from 'rxjs/operators';
 import {Team} from '../models/team.model';
-import {Observable, of, throwError} from 'rxjs';
+import {Observable} from 'rxjs';
 import {DataService} from './data.service';
-import {flatMap} from 'rxjs/internal/operators';
 import { GithubUser } from '../models/github-user.model';
 
 @Injectable({
@@ -33,13 +32,8 @@ export class UserService {
         this.currentUser = this.createUser(jsonData, userLoginId.toLowerCase());
         return this.currentUser;
       }),
-      flatMap((user) => {
-        if (user) { // valid user
-          return of(user);
-        } else {
-          return throwError('Unauthorized user.');
-        }
-      })
+      filter(user => user !== null),
+      throwIfEmpty(() => new Error('Unauthorized user.'))
     );
   }
 

tests/services/user.service.spec.ts

@@ -40,7 +40,7 @@ describe('UserService', () => {
           done();
         },
         error => {
-          expect(error).toBe('Unauthorized user.');
+          expect(error).toEqual(new Error('Unauthorized user.'));
           done();
         }
       );

tsconfig.json

@@ -15,12 +15,17 @@
       "es2017",
       "es2016",
       "es2015",
-      "dom"
+      "dom",
+      "esnext.asynciterable"
     ],
     "baseUrl": ".",
     "paths": {
-      "core-js/es7/reflect": ["node_modules/core-js/proposals/reflect-metadata"],
-      "core-js/es6/": ["node_modules/core-js/es/"]
+      "core-js/es7/reflect": [
+        "node_modules/core-js/proposals/reflect-metadata"
+      ],
+      "core-js/es6/": [
+        "node_modules/core-js/es/"
+      ]
     }
   },
   "include": [
@@ -30,4 +35,4 @@
   "exclude": [
     "node_modules"
   ]
-}
+}