fixed search

src/app/components/search/search.component.html

@@ -1,29 +1,23 @@
 <div id="search">
-    <!--<mat-toolbar><span>Search</span></mat-toolbar>-->
-    <mat-card >      
-        <mat-card-content>
-        <mat-form-field id="input">
-          <textarea matInput #searchWord type="search" 
-          mat-autosize="false" 
-          matAutosizeMaxRows="1" 
+  <mat-toolbar>
+    <mat-form-field id="input"
+    floatLabel="never" >
+      <input matInput #searchWord
       placeholder="search something"
       [ngModel]="searchWord.value"
-          (ngModelChange)="search(searchWord.value)"></textarea>
+      (ngModelChange)="search(searchWord.value)">
       <button mat-button matSuffix mat-icon-button>
         <mat-icon>search </mat-icon>
       </button>
     </mat-form-field>
-        <mat-form-field id="category-chooser">
+    <!--<mat-form-field id="category-chooser">
       <mat-label>category</mat-label>
-          <mat-select value="username" #field (selectionChange)="changeCategory($event.value)">
-            <mat-option value="username">username</mat-option>
-            <mat-option value="handle">handle</mat-option>
-            <mat-option value="groupname" disabled>groupname</mat-option>
-            <mat-option value="grouphandle" disabled>grouphandle</mat-option>
+      <mat-select value="user" #field (selectionChange)="changeCategory($event.value)">
+        <mat-option value="user">user</mat-option>
+        <mat-option value="group" disabled>group</mat-option>
       </mat-select>
-        </mat-form-field>
-      </mat-card-content>
-      </mat-card>
+    </mat-form-field>-->
+  </mat-toolbar>
       <div id="friendlist">
         <!--<div class="frienditem" *ngFor="let friend of friends"
         [class.selected]="friend === selectedFriend" (click)="showFriendProfile(friend)"> 

src/app/components/search/search.component.sass

@@ -4,7 +4,7 @@
     height: 100%
 
 #input
-    min-width: 60%
+    width: 100%
     padding-left: 0.5em
     padding-right: 0.5em
 

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

@@ -12,7 +12,7 @@ import { Router } from '@angular/router';
 })
 export class SearchComponent implements OnInit {
   searchValue = ' ';
-  category = 'username';
+  category = 'user';
   foundUsers: Array<User>;
 
   constructor(private searchService: SearchService, private http: Http, private router: Router) { }
@@ -27,29 +27,23 @@ export class SearchComponent implements OnInit {
   search(searchWord: string) {
     this.foundUsers = Array<User>();
     this.searchValue = searchWord;
-    if (searchWord) {
-      if (this.category === 'username') {
-        this.findUserByName(searchWord);
-      } else if (this.category === 'handle') {
-        this.findUserByHandle(searchWord);
+    if (searchWord) { // if not null or empty
+      if (this.category === 'user') {
+        this.findUser(searchWord);
+      } else if (this.category === 'groupe') {
+        // this.findUserByHandle(searchWord);
+        console.log('search group');
       }
     }
   }
 
-  findUserByName(name: String) {
+  findUser(name: String) {
     const headers = new Headers();
     headers.set('Content-Type', 'application/json');
-    this.http.post(environment.graphQLUrl, this.searchService.buildJsonName(name))
-      .subscribe(response => {
-        this.foundUsers = this.searchService.renderUsers(response.json());
-      });
-  }
-
-  findUserByHandle(name: String) {
-    const headers = new Headers();
-    headers.set('Content-Type', 'application/json');
-    this.http.post(environment.graphQLUrl, this.searchService.buildJsonHandle(name))
+    this.http.post(environment.graphQLUrl, this.searchService.buildJsonUser(name))
       .subscribe(response => {
+        console.log('response received');
+        console.log(response);
         this.foundUsers = this.searchService.renderUsers(response.json());
       });
   }

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

@@ -14,34 +14,9 @@ export class SearchService {
   constructor(private http: Http, private data: DatasharingService, private router: Router) {
   }
 
-  public findUserByName(name: String): Array<User> {
-    const headers = new Headers();
-    headers.set('Content-Type', 'application/json');
-
-    this.http.post(environment.graphQLUrl, this.buildJsonName(name))
-      .subscribe(response => {
-        this.users = this.renderUsers(response.json());
-      });
-    return this.users;
-  }
-
-  public findUserByHandle(handle: string) {
-    const headers = new Headers();
-    headers.set('Content-Type', 'application/json');
-    return this.http.post(environment.graphQLUrl, this.buildJsonHandle(handle))
-      .subscribe(response => {
-          console.log(response.text());
-        }
-      );
-  }
-
   public renderUsers(pResponse: any): Array<User> {
     const users = new Array<User>();
-    if (pResponse.data.findUser === 'null') {
-      console.log('no user found');
-      return null;
-    } else {
-      for (const user of pResponse.data.findUser) {
+      for (const user of pResponse.data.search.users) {
         const pUser = new User();
         pUser.profilePicture = user.profilePicture;
         pUser.username = user.name;
@@ -54,12 +29,12 @@ export class SearchService {
       }
       return users;
   }
-  }
 
-  public buildJsonName(name_: String): any {
+  public buildJsonUser(name_: String): any {
     const body = {
-      query: `query($name: String) {
-        findUser(name: $name, first: 100, offset: 0) {
+      query: `query($name: String!) {
+        search(query:$name, first: 100, offset: 0) {
+          users{
             profilePicture,
             name,
             id,
@@ -70,30 +45,10 @@ export class SearchService {
             id
             }
           }
-      }`
-      , variables: {
-        name: name_
-      }
-    };
-    return body;
-  }
-  public buildJsonHandle(handle_: String): any {
-    const body = {
-      query: `query($handle: String) {
-        findUser(handle: $handle, first: 100, offset: 0) {
-          profilePicture,
-          name,
-          id,
-          handle,
-          points,
-          level,
-          friends {
-           id
-          }
         }
       }`
       , variables: {
-        handle: handle_
+        name: name_
       }
     };
     return body;