differences-detailed.log

diff --git a/./src/app/app-routing.module.ts b/../gsrs-client/src/app/app-routing.module.ts
index bb39753..626b802 100644
--- a/./src/app/app-routing.module.ts
+++ b/../gsrs-client/src/app/app-routing.module.ts
@@ -6,10 +6,6 @@ import { HomeComponent } from './home/home.component';
 import { BrowseSubstanceComponent } from './browse-substance/browse-substance.component';
 
 const childRoutes: Routes = [
-  {
-    path: '',
-    component: HomeComponent
-  },
   {
     path: 'home',
     component: HomeComponent
diff --git a/./src/app/app.module.ts b/../gsrs-client/src/app/app.module.ts
index ce7c479..a8af86a 100644
--- a/./src/app/app.module.ts
+++ b/../gsrs-client/src/app/app.module.ts
@@ -1,6 +1,7 @@
 import { BrowserModule } from '@angular/platform-browser';
-import { NgModule, APP_INITIALIZER } from '@angular/core';
-import { HttpClientModule } from '@angular/common/http';
+import { NgModule } from '@angular/core';
+import { ReactiveFormsModule, FormsModule } from '@angular/forms';
+import { HttpClientModule, HttpClientJsonpModule } from '@angular/common/http';
 
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
@@ -8,15 +9,17 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 
 import { MatToolbarModule } from '@angular/material/toolbar';
 import { MatSidenavModule } from '@angular/material/sidenav';
-import {MatCardModule} from '@angular/material/card';
+import { MatCardModule } from '@angular/material/card';
+import { MatAutocompleteModule } from '@angular/material/autocomplete';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatInputModule } from '@angular/material/input';
+import { MatButtonModule } from '@angular/material/button';
+import { MatIconModule } from '@angular/material/icon';
 
 import { PageNotFoundComponent } from './page-not-found/page-not-found.component';
 import { CoreComponent } from './core/core.component';
 import { HomeComponent } from './home/home.component';
 import { BrowseSubstanceComponent } from './browse-substance/browse-substance.component';
-import { TestComponent } from './testing-directory/test/test.component';
-import { configServiceFactory } from './config/config.factory';
-import { ConfigService } from './config/config.service'; 
 
 @NgModule({
   declarations: [
@@ -24,8 +27,7 @@ import { ConfigService } from './config/config.service';
     PageNotFoundComponent,
     CoreComponent,
     HomeComponent,
-    BrowseSubstanceComponent,
-    TestComponent
+    BrowseSubstanceComponent
   ],
   imports: [
     BrowserModule.withServerTransition({ appId: 'gsrs' }),
@@ -34,17 +36,17 @@ import { ConfigService } from './config/config.service';
     MatToolbarModule,
     MatSidenavModule,
     MatCardModule,
-    HttpClientModule
-  ],
-  providers: [
-    ConfigService,
-        {
-            provide: APP_INITIALIZER,
-            useFactory: configServiceFactory,
-            deps: [ConfigService],
-            multi: true
-        }
+    MatAutocompleteModule,
+    ReactiveFormsModule,
+    FormsModule,
+    MatFormFieldModule,
+    MatInputModule,
+    MatButtonModule,
+    MatIconModule,
+    HttpClientModule,
+    HttpClientJsonpModule
   ],
+  providers: [],
   bootstrap: [AppComponent]
 })
 export class AppModule { }
diff --git a/./src/app/config/config.factory.ts b/./src/app/config/config.factory.ts
deleted file mode 100644
index 934a707..0000000
--- a/./src/app/config/config.factory.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import { ConfigService } from './config.service';
-
-export function configServiceFactory(startupService: ConfigService): Function {
-    return () => startupService.load();
-}
\ No newline at end of file
diff --git a/./src/app/config/config.service.spec.ts b/./src/app/config/config.service.spec.ts
deleted file mode 100644
index a20d4ba..0000000
--- a/./src/app/config/config.service.spec.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { TestBed, inject } from '@angular/core/testing';
-
-import { ConfigService } from './config.service';
-
-describe('ConfigService', () => {
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      providers: [ConfigService]
-    });
-  });
-
-  it('should be created', inject([ConfigService], (service: ConfigService) => {
-    expect(service).toBeTruthy();
-  }));
-});
diff --git a/./src/app/config/config.service.ts b/./src/app/config/config.service.ts
deleted file mode 100644
index 7d61e5c..0000000
--- a/./src/app/config/config.service.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-import { Injectable } from '@angular/core';
-import { HttpClient } from '@angular/common/http';
-import { map } from 'rxjs/operators';
-
-@Injectable()
-export class ConfigService {
-
-  private _configData: any;
-
-    constructor(private http: HttpClient) { }
-
-    // This is the method you want to call at bootstrap
-    // Important: It should return a Promise
-    load(): Promise<any> {
-
-        this._configData = null;
-
-        return this.http
-            .get('/assets/data/config.json')
-            .toPromise()
-            .then((data: any) => this._configData = data)
-            .catch((err: any) => Promise.resolve());
-    }
-
-    get configData(): any {
-        return this._configData;
-    }
-}
diff --git a/./src/app/core/core.component.html b/../gsrs-client/src/app/core/core.component.html
index f89dd91..97803d9 100644
--- a/./src/app/core/core.component.html
+++ b/../gsrs-client/src/app/core/core.component.html
@@ -12,5 +12,20 @@
     </span>
   </span>
   <span class="middle-fill"></span>
+  <span>
+    <form>
+      <mat-form-field [floatLabel]="'never'" class="search-form-field space-right-small">
+        <input type="text" placeholder="Search" aria-label="Search substances" matInput [formControl]="searchControl" [matAutocomplete]="auto">
+        <mat-autocomplete #auto="matAutocomplete">
+          <mat-option *ngFor="let option of autoCompleteOptions" [value]="option.key">
+            {{option.key}}
+          </mat-option>
+        </mat-autocomplete>
+      </mat-form-field>
+      <button mat-icon-button>
+          <mat-icon>search</mat-icon>
+      </button>
+    </form>
+  </span>
 </mat-toolbar>
-<router-outlet></router-outlet>
+<router-outlet></router-outlet>
\ No newline at end of file
diff --git a/./src/app/core/core.component.scss b/../gsrs-client/src/app/core/core.component.scss
index f34f38b..527ee4b 100644
--- a/./src/app/core/core.component.scss
+++ b/../gsrs-client/src/app/core/core.component.scss
@@ -33,4 +33,8 @@
             }
         }
     }
+}
+
+.search-form-field {
+    width: 300px;
 }
\ No newline at end of file
diff --git a/./src/app/core/core.component.ts b/../gsrs-client/src/app/core/core.component.ts
index f931adc..034394a 100644
--- a/./src/app/core/core.component.ts
+++ b/../gsrs-client/src/app/core/core.component.ts
@@ -1,4 +1,7 @@
 import { Component, OnInit } from '@angular/core';
+import { FormControl } from '@angular/forms';
+import { UtilsService } from '../utils/utils.service';
+import { debounceTime, distinctUntilChanged, switchMap } from 'rxjs/operators';
 
 @Component({
   selector: 'app-core',
@@ -6,10 +9,31 @@ import { Component, OnInit } from '@angular/core';
   styleUrls: ['./core.component.scss']
 })
 export class CoreComponent implements OnInit {
+  searchControl = new FormControl();
+  autoCompleteOptions: Array<any>;
 
-  constructor() { }
+  constructor(
+    private utilsService: UtilsService
+  ) {
+    this.autoCompleteOptions = [];
+  }
 
   ngOnInit() {
+    this.searchControl.valueChanges.pipe(
+      debounceTime(500),
+      distinctUntilChanged(),
+      switchMap(searchValue =>
+        this.utilsService.getStructureSearchSuggestions(searchValue)
+      )
+    ).subscribe((response: any) => {
+      this.autoCompleteOptions = response.Name;
+    }, error => {
+      console.log(error);
+    });
+  }
+
+  updateAutoCompleteOptions(searchValue: string)  {
+
   }
 
 }
diff --git a/./src/app/home/home.component.ts b/../gsrs-client/src/app/home/home.component.ts
index 65a447d..f56c8c1 100644
--- a/./src/app/home/home.component.ts
+++ b/../gsrs-client/src/app/home/home.component.ts
@@ -1,6 +1,4 @@
 import { Component, OnInit } from '@angular/core';
-import { environment} from '../../environments/environment';
-import { ConfigService } from '../config/config.service';
 
 @Component({
   selector: 'app-home',
@@ -9,15 +7,9 @@ import { ConfigService } from '../config/config.service';
 })
 export class HomeComponent implements OnInit {
 
-  constructor(
-    private configService: ConfigService
-  ) { }
+  constructor() { }
 
   ngOnInit() {
-    if (environment.version == 'gsrs'){
-      console.log(environment);
-    }
-
-    console.log(this.configService.configData);
   }
+
 }
diff --git a/./src/app/testing-directory/test/test.component.html b/./src/app/testing-directory/test/test.component.html
deleted file mode 100644
index 2395704..0000000
--- a/./src/app/testing-directory/test/test.component.html
+++ /dev/null
@@ -1,3 +0,0 @@
-<p>
-  test works!
-</p>
diff --git a/./src/app/testing-directory/test/test.component.scss b/./src/app/testing-directory/test/test.component.scss
deleted file mode 100644
index 8eba5a2..0000000
--- a/./src/app/testing-directory/test/test.component.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-.mat-side-nav {
-    background-color: white;
-}
\ No newline at end of file
diff --git a/./src/app/testing-directory/test/test.component.spec.ts b/./src/app/testing-directory/test/test.component.spec.ts
deleted file mode 100644
index ef4e38c..0000000
--- a/./src/app/testing-directory/test/test.component.spec.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { TestComponent } from './test.component';
-
-describe('TestComponent', () => {
-  let component: TestComponent;
-  let fixture: ComponentFixture<TestComponent>;
-
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [ TestComponent ]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(TestComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
diff --git a/./src/app/testing-directory/test/test.component.ts b/./src/app/testing-directory/test/test.component.ts
deleted file mode 100644
index 7293823..0000000
--- a/./src/app/testing-directory/test/test.component.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-test',
-  templateUrl: './test.component.html',
-  styleUrls: ['./test.component.scss']
-})
-export class TestComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit() {
-  }
-
-}
\ No newline at end of file
diff --git a/./src/assets/data/config.json b/./src/assets/data/config.json
deleted file mode 100644
index cde32bf..0000000
--- a/./src/assets/data/config.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-    "test": "this is a test of the config file"
-}
\ No newline at end of file
diff --git a/./src/environments/_base-environment.ts b/./src/environments/_base-environment.ts
deleted file mode 100644
index 170a5bd..0000000
--- a/./src/environments/_base-environment.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-export const baseEnvironment = {
-    production: false,
-    version: '',
-    apiBase: ''
-}
diff --git a/./src/environments/environment.abase.dev.ts b/../gsrs-client/src/environments/environment.abase.dev.ts
index 2f3d094..464f4f3 100644
--- a/./src/environments/environment.abase.dev.ts
+++ b/../gsrs-client/src/environments/environment.abase.dev.ts
@@ -1,5 +1,4 @@
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
-environment.version = 'abase';
-environment.apiBase = 'https://localhost:9000/ginas/app/api/v1';
+export const environment = {
+    production: false,
+    version: 'abase'
+  };
diff --git a/./src/environments/environment.abase.local.ts b/../gsrs-client/src/environments/environment.abase.local.ts
index 2ce3c76..4eb765c 100644
--- a/./src/environments/environment.abase.local.ts
+++ b/../gsrs-client/src/environments/environment.abase.local.ts
@@ -1,5 +1,4 @@
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
-environment.version = 'abase';
-environment.apiBase = 'https://localhost:9000/ginas/app/api/v1';
\ No newline at end of file
+export const environment = {
+    production: false,
+    version: 'abase'
+  };
\ No newline at end of file
diff --git a/./src/environments/environment.abase.pre-prod.ts b/../gsrs-client/src/environments/environment.abase.pre-prod.ts
index 2ce3c76..8ac0b7e 100644
--- a/./src/environments/environment.abase.pre-prod.ts
+++ b/../gsrs-client/src/environments/environment.abase.pre-prod.ts
@@ -1,5 +1,4 @@
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
-environment.version = 'abase';
-environment.apiBase = 'https://localhost:9000/ginas/app/api/v1';
\ No newline at end of file
+export const environment = {
+  production: false,
+  version: 'abase'
+};
diff --git a/./src/environments/environment.abase.prod.ts b/../gsrs-client/src/environments/environment.abase.prod.ts
index 7a94c4e..5990c97 100644
--- a/./src/environments/environment.abase.prod.ts
+++ b/../gsrs-client/src/environments/environment.abase.prod.ts
@@ -1,6 +1,4 @@
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
-environment.production = true;
-environment.version = 'abase';
-environment.apiBase = 'https://localhost:9000/ginas/app/api/v1';
+export const environment = {
+  production: true,
+  version: 'abase'
+};
diff --git a/./src/environments/environment.fda.dev.ts b/../gsrs-client/src/environments/environment.fda.dev.ts
index a023a43..d523e76 100644
--- a/./src/environments/environment.fda.dev.ts
+++ b/../gsrs-client/src/environments/environment.fda.dev.ts
@@ -1,5 +1,4 @@
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
-environment.version = 'fda';
-environment.apiBase = 'https://localhost:9000/ginas/app/api/v1';
\ No newline at end of file
+export const environment = {
+    production: false,
+    version: 'fda'
+  };
\ No newline at end of file
diff --git a/./src/environments/environment.fda.local.ts b/../gsrs-client/src/environments/environment.fda.local.ts
index a023a43..d523e76 100644
--- a/./src/environments/environment.fda.local.ts
+++ b/../gsrs-client/src/environments/environment.fda.local.ts
@@ -1,5 +1,4 @@
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
-environment.version = 'fda';
-environment.apiBase = 'https://localhost:9000/ginas/app/api/v1';
\ No newline at end of file
+export const environment = {
+    production: false,
+    version: 'fda'
+  };
\ No newline at end of file
diff --git a/./src/environments/environment.fda.pre-prod.ts b/../gsrs-client/src/environments/environment.fda.pre-prod.ts
index a023a43..410c009 100644
--- a/./src/environments/environment.fda.pre-prod.ts
+++ b/../gsrs-client/src/environments/environment.fda.pre-prod.ts
@@ -1,5 +1,4 @@
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
-environment.version = 'fda';
-environment.apiBase = 'https://localhost:9000/ginas/app/api/v1';
\ No newline at end of file
+export const environment = {
+  production: false,
+  version: 'fda'
+};
diff --git a/./src/environments/environment.fda.prod.ts b/../gsrs-client/src/environments/environment.fda.prod.ts
index 3434a3c..fe36f57 100644
--- a/./src/environments/environment.fda.prod.ts
+++ b/../gsrs-client/src/environments/environment.fda.prod.ts
@@ -1,6 +1,4 @@
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
-environment.production = true;
-environment.version = 'fda';
-environment.apiBase = 'https://localhost:9000/ginas/app/api/v1';
\ No newline at end of file
+export const environment = {
+  production: true,
+  version: 'fda'
+};
diff --git a/./src/environments/environment.gsrs.dev.ts b/../gsrs-client/src/environments/environment.gsrs.dev.ts
index 113442a..328319c 100644
--- a/./src/environments/environment.gsrs.dev.ts
+++ b/../gsrs-client/src/environments/environment.gsrs.dev.ts
@@ -1,5 +1,4 @@
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
-environment.version = 'gsrs';
-environment.apiBase = 'https://tripod.nih.gov/ginas/app/api/v1';
+export const environment = {
+    production: false,
+    version: 'gsrs'
+  };
\ No newline at end of file
diff --git a/./src/environments/environment.gsrs.local.ts b/../gsrs-client/src/environments/environment.gsrs.local.ts
index 3f61411..328319c 100644
--- a/./src/environments/environment.gsrs.local.ts
+++ b/../gsrs-client/src/environments/environment.gsrs.local.ts
@@ -1,5 +1,4 @@
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
-environment.version = 'gsrs';
-environment.apiBase = 'https://localhost:9000/ginas/app/api/v1';
\ No newline at end of file
+export const environment = {
+    production: false,
+    version: 'gsrs'
+  };
\ No newline at end of file
diff --git a/./src/environments/environment.gsrs.pre-prod.ts b/../gsrs-client/src/environments/environment.gsrs.pre-prod.ts
index 3f61411..0e254a5 100644
--- a/./src/environments/environment.gsrs.pre-prod.ts
+++ b/../gsrs-client/src/environments/environment.gsrs.pre-prod.ts
@@ -1,5 +1,4 @@
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
-environment.version = 'gsrs';
-environment.apiBase = 'https://localhost:9000/ginas/app/api/v1';
\ No newline at end of file
+export const environment = {
+  production: false,
+  version: 'gsrs'
+};
diff --git a/./src/environments/environment.gsrs.prod.ts b/../gsrs-client/src/environments/environment.gsrs.prod.ts
index 6b4615f..7b0bae3 100644
--- a/./src/environments/environment.gsrs.prod.ts
+++ b/../gsrs-client/src/environments/environment.gsrs.prod.ts
@@ -1,6 +1,4 @@
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
-environment.production = true;
-environment.version = 'gsrs';
-environment.apiBase = 'https://localhost:9000/ginas/app/api/v1';
+export const environment = {
+  production: true,
+  version: 'gsrs'
+};
diff --git a/./src/environments/environment.inxight.dev.ts b/../gsrs-client/src/environments/environment.inxight.dev.ts
index bf7d0a3..d4e7c78 100644
--- a/./src/environments/environment.inxight.dev.ts
+++ b/../gsrs-client/src/environments/environment.inxight.dev.ts
@@ -1,5 +1,4 @@
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
-environment.version = 'inxight';
-environment.apiBase = 'https://localhost:9000/ginas/app/api/v1';
\ No newline at end of file
+export const environment = {
+    production: false,
+    version: 'inxight'
+  };
\ No newline at end of file
diff --git a/./src/environments/environment.inxight.local.ts b/../gsrs-client/src/environments/environment.inxight.local.ts
index bf7d0a3..d4e7c78 100644
--- a/./src/environments/environment.inxight.local.ts
+++ b/../gsrs-client/src/environments/environment.inxight.local.ts
@@ -1,5 +1,4 @@
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
-environment.version = 'inxight';
-environment.apiBase = 'https://localhost:9000/ginas/app/api/v1';
\ No newline at end of file
+export const environment = {
+    production: false,
+    version: 'inxight'
+  };
\ No newline at end of file
diff --git a/./src/environments/environment.inxight.pre-prod.ts b/../gsrs-client/src/environments/environment.inxight.pre-prod.ts
index 7dd04fe..36f01cd 100644
--- a/./src/environments/environment.inxight.pre-prod.ts
+++ b/../gsrs-client/src/environments/environment.inxight.pre-prod.ts
@@ -1,5 +1,4 @@
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
-environment.version = 'inxight';
-environment.apiBase = 'https://localhost:9000/ginas/app/api/v1';
+export const environment = {
+  production: false,
+  version: 'inxight'
+};
diff --git a/./src/environments/environment.inxight.prod.ts b/../gsrs-client/src/environments/environment.inxight.prod.ts
index a342bba..564c8da 100644
--- a/./src/environments/environment.inxight.prod.ts
+++ b/../gsrs-client/src/environments/environment.inxight.prod.ts
@@ -1,6 +1,4 @@
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
-environment.production = true;
-environment.version = 'inxight';
-environment.apiBase = 'https://localhost:9000/ginas/app/api/v1';
+export const environment = {
+  production: true,
+  version: 'inxight'
+};
diff --git a/./src/environments/environment.ts b/../gsrs-client/src/environments/environment.ts
index c74d5ab..600fdaf 100644
--- a/./src/environments/environment.ts
+++ b/../gsrs-client/src/environments/environment.ts
@@ -2,9 +2,9 @@
 // `ng build ---prod` replaces `environment.ts` with `environment.prod.ts`.
 // The list of file replacements can be found in `angular.json`.
 
-import { baseEnvironment } from './_base-environment';
-
-export const environment = baseEnvironment;
+export const environment = {
+  production: false
+};
 
 /*
  * In development mode, for easier debugging, you can ignore zone related error
diff --git a/../gsrs-client/src/styles/_utils.scss b/../gsrs-client/src/styles/_utils.scss
new file mode 100644
index 0000000..eb639f9
--- /dev/null
+++ b/../gsrs-client/src/styles/_utils.scss
@@ -0,0 +1,3 @@
+.space-right-small {
+    margin-right: 5px;
+}
\ No newline at end of file
diff --git a/./src/styles/main.scss b/../gsrs-client/src/styles/main.scss
index e4f7d6d..56c9dc9 100644
--- a/./src/styles/main.scss
+++ b/../gsrs-client/src/styles/main.scss
@@ -1,2 +1,3 @@
 @import 'material-design-theme';
-@import 'base';
\ No newline at end of file
+@import 'base';
+@import 'utils';
\ No newline at end of file