change search query to protein names instead of ID

src/app/components/query-tile/query-tile.component.ts

@@ -16,7 +16,7 @@ export class QueryTileComponent {
     term = term.toLowerCase();
     if (item.type === 'host') {
       const data = item.data as Protein;
-      return data.name.toLowerCase().indexOf(term) > -1 || data.proteinAc.toLowerCase().indexOf(term) > -1 ||
+      return data.name.toLowerCase().indexOf(term) > -1 || data.proteinName.toLowerCase().indexOf(term) > -1 ||
         item.type.toLowerCase().indexOf(term) > -1;
     } else {
       const data = item.data as ViralProtein;

src/app/pages/explorer-page/explorer-page.component.html

@@ -81,8 +81,8 @@
             <div class="card-content">
               <div class="field">
                 <div class="control">
-                  <app-query-tile-component [queryItems]="queryItems"
-                                       (selectItem)="queryAction($event)"></app-query-tile-component>
+                  <app-query-tile-component (selectItem)="queryAction($event)"
+                                            [queryItems]="queryItems"></app-query-tile-component>
                 </div>
               </div>
             </div>
@@ -110,7 +110,7 @@
                 <label class="checkbox">
                   <input type="checkbox" class="checkbox" [ngModel]="bait.checked"
                          (ngModelChange)="bait.checked = $event; filterNodes()">
-                  {{ bait.data.effectName }}
+                  {{ bait.data["effectName"] }}
                 </label>
               </div>
             </div>