diff --git a/src/app/app.component.html b/src/app/app.component.html
index 80ac792..aafc157 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,5 +1,5 @@
 <div class="mat-typography">
-  <app-navbar *ngIf="isSignedIn" class="mat-elevation-z6" id="globalHeader"></app-navbar>
+  <app-navbar></app-navbar>
   <router-outlet></router-outlet>
   <app-footer></app-footer>
 </div>
diff --git a/src/app/app.component.scss b/src/app/app.component.scss
index e25ee2c..e69de29 100644
--- a/src/app/app.component.scss
+++ b/src/app/app.component.scss
@@ -1,7 +0,0 @@
-#globalHeader {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  z-index: 2;
-}
diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts
index e619fbd..b583860 100644
--- a/src/app/app.component.spec.ts
+++ b/src/app/app.component.spec.ts
@@ -1,61 +1,57 @@
 import {APP_BASE_HREF} from '@angular/common';
 import {HttpClient} from '@angular/common/http';
 import {HttpClientTestingModule} from '@angular/common/http/testing';
-import {Component} from '@angular/core';
 import {async, ComponentFixture, TestBed} from '@angular/core/testing';
-import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
+import {MatIconModule} from '@angular/material/icon';
+import {FakeMatIconRegistry} from '@angular/material/icon/testing';
+import {MatMenuModule} from '@angular/material/menu';
 import {RouterTestingModule} from '@angular/router/testing';
 import {ApiService, MockEnvironment} from 'sartography-workflow-lib';
 import {AppComponent} from './app.component';
-
-
-@Component({
-  selector: 'app-navbar',
-  template: ''
-})
-class MockNavbarComponent {
-}
-
-@Component({
-  selector: 'app-footer',
-  template: ''
-})
-class MockFooterComponent {
-}
+import {FooterComponent} from './footer/footer.component';
+import {NavbarComponent} from './navbar/navbar.component';
 
 describe('AppComponent', () => {
   let component: AppComponent;
   let fixture: ComponentFixture<AppComponent>;
+  const mockEnvironment = new MockEnvironment();
+  const mockTitle = `'Once,' said the Mock Title at last, with a deep sigh, 'I was a real Title.'`;
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
       declarations: [
         AppComponent,
-        MockNavbarComponent,
-        MockFooterComponent
+        FooterComponent,
+        NavbarComponent,
       ],
       imports: [
         HttpClientTestingModule,
-        BrowserAnimationsModule,
+        MatIconModule,
+        MatMenuModule,
         RouterTestingModule,
       ],
       providers: [
         HttpClient,
+        FakeMatIconRegistry,
         ApiService,
-        {provide: 'APP_ENVIRONMENT', useClass: MockEnvironment},
+        {provide: 'APP_ENVIRONMENT', useValue: mockEnvironment},
         {provide: APP_BASE_HREF, useValue: ''},
-      ],
-    })
-      .compileComponents();
+      ]
+    }).compileComponents();
   }));
 
   beforeEach(() => {
+    mockEnvironment.title = mockTitle;
     fixture = TestBed.createComponent(AppComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();
   });
 
-  it('should create', () => {
+  it('should create the app', () => {
     expect(component).toBeTruthy();
   });
+
+  it(`should set the page title to match environment variable`, () => {
+    expect((component as any).titleService.getTitle()).toEqual(mockTitle);
+  });
 });
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index bc36c18..c11509c 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,5 +1,7 @@
 import {Component, Inject} from '@angular/core';
-import {ApiService, AppEnvironment, GoogleAnalyticsService} from 'sartography-workflow-lib';
+import {MatIconRegistry} from '@angular/material/icon';
+import {DomSanitizer, Title} from '@angular/platform-browser';
+import {AppEnvironment, FileType, GoogleAnalyticsService} from 'sartography-workflow-lib';
 
 @Component({
   selector: 'app-root',
@@ -7,17 +9,19 @@ import {ApiService, AppEnvironment, GoogleAnalyticsService} from 'sartography-wo
   styleUrls: ['./app.component.scss']
 })
 export class AppComponent {
-  title = 'CR Connect Configuration';
-
   constructor(
     @Inject('APP_ENVIRONMENT') private environment: AppEnvironment,
-    private apiService: ApiService,
+    private titleService: Title,
+    private matIconRegistry: MatIconRegistry,
+    private domSanitizer: DomSanitizer,
     private googleAnalyticsService: GoogleAnalyticsService,
   ) {
     this.googleAnalyticsService.init(this.environment.googleAnalyticsKey);
-  }
-
-  get isSignedIn() {
-    return this.apiService.isSignedIn();
+    const fileTypes = Object.values(FileType);
+    fileTypes.forEach(t => {
+      const url = this.domSanitizer.bypassSecurityTrustResourceUrl(`assets/icons/file_types/${t}.svg`)
+      this.matIconRegistry.addSvgIconInNamespace('crc', t, url);
+    });
+    this.titleService.setTitle(this.environment.title);
   }
 }