Refactor Search Service

- Move the request part to the service
- Switch to @angular/common/http because  @angular/http is deprecated

src/app/components/search/search.component.ts

@@ -18,13 +18,12 @@ export class SearchComponent implements OnInit {
   searchValue = ' ';
   category = 'user';
   user: User;
-  foundUsers: Array<User> = new Array();
+  foundUsers: User[] = [];
-  foundGroups: Array<GroupInfo> = new Array();
+  foundGroups: GroupInfo[] = [];
 
   constructor(
     private searchService: SearchService,
     private requestService: RequestService,
-    private http: Http,
     private router: Router,
     private data: DatasharingService) { }
   ngOnInit() {
@@ -46,19 +45,16 @@ export class SearchComponent implements OnInit {
         this.loading = true;
         this.findUser(searchWord);
       } else if (this.category === 'groupe') {
-        // this.findUserByHandle(searchWord);
         console.log('search group');
       }
     }
   }
 
-  findUser(name: String) {
+  findUser(name: string) {
-    const headers = new Headers();
+    this.searchService.search(name)
-    headers.set('Content-Type', 'application/json');
-    this.http.post(environment.graphQLUrl, this.searchService.buildJsonUser(name))
       .subscribe(response => {
-        this.foundUsers = this.searchService.renderUsers(response.json());
+        this.foundUsers = this.searchService.getUsersForResponse(response);
-        this.foundGroups = this.searchService.renderGroups(response.json());
+        this.foundGroups = this.searchService.getGroupsForResponse(response);
         for (const foundUser of this.foundUsers) {
           foundUser.allowedToSendRequest = this.requestService.isAllowedToSendRequest(foundUser.userID, this.user);
         }

src/app/models/interfaces/IGroup.ts

@@ -0,0 +1,20 @@
+import {IUser} from './IUser';
+
+export interface IGroup {
+
+  id: number;
+
+  name: string;
+
+  creator: IUser;
+
+  admins: IUser[];
+
+  members: IUser[];
+
+  chat: any;
+
+  events: any;
+
+  joined: boolean;
+}

src/app/models/interfaces/ISearchResult.ts

@@ -0,0 +1,12 @@
+import {IUser} from './IUser';
+import {IGroup} from './IGroup';
+
+export interface ISearchResult {
+  users: IUser[];
+
+  groups: IGroup[];
+
+  posts: any[];
+
+  events: any[];
+}

src/app/models/interfaces/IUser.ts

@@ -0,0 +1,36 @@
+import {IGroup} from './IGroup';
+
+export interface IUser {
+
+  id: number;
+
+  name: string;
+
+  handle: string;
+
+  profilePicture?: string;
+
+  level: number;
+
+  points: number;
+
+  numberOfPosts: number;
+
+  postCount: number;
+
+  posts: any[];
+
+  joinedAt: Date;
+
+  friendCount: number;
+
+  friends: IUser[];
+
+  groupCount: number;
+
+  groups: IGroup[];
+
+  eventCount: number;
+
+  events: any[];
+}

src/app/services/base.service.ts

@@ -0,0 +1,16 @@
+import {Injectable} from '@angular/core';
+import {HttpHeaders} from '@angular/common/http';
+
+@Injectable({
+  providedIn: 'root'
+})
+export abstract class BaseService {
+  protected headers: HttpHeaders;
+
+  protected constructor() {
+    this.headers = new HttpHeaders();
+    this.headers.set('Content-Type', 'application/json');
+  }
+
+  abstract buildRequestBody(...params: any): any;
+}

src/app/services/search/search.service.ts

@@ -1,48 +1,23 @@
 import {Injectable} from '@angular/core';
-import {Headers, Http} from '@angular/http';
+import {HttpClient} from '@angular/common/http';
 import {DatasharingService} from '../datasharing.service';
 import {Router} from '@angular/router';
-import {environment} from 'src/environments/environment';
 import {User} from 'src/app/models/user';
 import {GroupInfo} from 'src/app/models/groupinfo';
+import {Observable} from 'rxjs';
+import {ISearchResult} from '../../models/interfaces/ISearchResult';
+import {environment} from '../../../environments/environment';
+import {BaseService} from '../base.service';
+import {tap} from 'rxjs/operators';
 
-@Injectable({
+interface ISearchRequestResult {
-  providedIn: 'root'
+  data: {
-})
+    search: ISearchResult;
-export class SearchService {
+  };
-
-  users:  Array<User>;
-  constructor(private http: Http, private data: DatasharingService, private router: Router) {
-  }
-
-  public renderUsers(pResponse: any): Array<User> {
-    const users = new Array<User>();
-      for (const user of pResponse.data.search.users) {
-        const pUser = new User();
-        pUser.profilePicture = user.profilePicture;
-        pUser.username = user.name;
-        pUser.userID = user.id;
-        pUser.handle = user.handle;
-        pUser.points = user.points;
-        pUser.level = user.level;
-        pUser.friends = user.friends;
-        users.push(pUser);
-      }
-      return users;
-  }
-
-  public renderGroups(pResponse: any): Array<GroupInfo> {
-    const groups = new Array<GroupInfo>();
-      for (const group of pResponse.data.search.groups) {
-        groups.push(new GroupInfo(group.id, group.name));
-      }
-      return groups;
 }
 
-  public buildJsonUser(name_: String): any {
+const graphqlQuery = `query($query: String!, $first: Int, $offset: Int) {
-    const body = {
+  search(query:$query, first: $first, offset: $offset) {
-      query: `query($name: String!) {
-        search(query:$name, first: 100, offset: 0) {
     users{
       profilePicture,
       name,
@@ -61,11 +36,74 @@ export class SearchService {
       members{id name handle}
     }
   }
-      }`
+}`;
-      , variables: {
+
-        name: name_
+@Injectable({
+  providedIn: 'root'
+})
+export class SearchService extends BaseService {
+
+  users:  User[];
+  constructor(private http: HttpClient, private data: DatasharingService, private router: Router) {
+    super();
+  }
+
+  /**
+   * Maps the users in the response to the user class
+   * @param response
+   */
+  public getUsersForResponse(response: ISearchRequestResult): User[] {
+    const users = new Array<User>();
+      for (const foundUser of response.data.search.users) {
+        const user = new User();
+        user.profilePicture = foundUser.profilePicture;
+        user.username = foundUser.name;
+        user.userID = foundUser.id;
+        user.handle = foundUser.handle;
+        user.points = foundUser.points;
+        user.level = foundUser.level;
+        // @ts-ignore
+        user.friends = foundUser.friends;
+        users.push(user);
+      }
+      return users;
+  }
+
+  /**
+   * Maps the groups in the response to the group class
+   * @param response
+   */
+  public getGroupsForResponse(response: ISearchRequestResult): Array<GroupInfo> {
+    const groups = new Array<GroupInfo>();
+      for (const group of response.data.search.groups) {
+        groups.push(new GroupInfo(group.id, group.name));
+      }
+      return groups;
+  }
+
+  /**
+   * Searches for users, groups, events and posts with a specified query.
+   * @param query
+   */
+  public search(query: string): Observable<ISearchRequestResult> {
+    const body = this.buildRequestBody(query);
+    return this.http.post<ISearchRequestResult>(environment.graphQLUrl, body, {headers: this.headers})
+  }
+
+  /**
+   * Builds the body for the request
+   * @param query - the search query
+   * @param first - the limit of elements to fetch
+   * @param offset - offset
+   */
+  private buildRequestBody(query: String, first: number = 20, offset: number = 0): any {
+    return {
+      query: graphqlQuery,
+      variables: {
+        query,
+        first,
+        offset
       }
     };
-    return body;
   }
 }

tslint.json

@@ -70,7 +70,7 @@
     ],
     "no-misused-new": true,
     "no-non-null-assertion": true,
-    "no-redundant-jsdoc": true,
+    "no-redundant-jsdoc": false,
     "no-shadowed-variable": true,
     "no-string-literal": false,
     "no-string-throw": true,