Allow for consuming app to define header appName

addon/components/bf-header.js

@@ -1,9 +1,25 @@
+/**
+* @property appName is a computed property that first checks the consuming app config/environment.js
+* for APP.bonfire.title
+* APP:  {
+*  bonfire: {
+*    title: 'Your App Name'
+*  }
+* }
+* If this is not provided then it will fetch from application.namespace.name
+*/
+
 import Ember from 'ember';
 import layout from '../templates/components/bf-header';
 
 export default Ember.Component.extend({
   layout: layout,
   appName: function() {
-    return Ember.String.capitalize(this.get('application.namespace.name'));
+    var configTitle = this.container.lookupFactory('config:environment').APP.bonfire.title;
+    if (Ember.isEmpty(configTitle)) {
+      return Ember.String.capitalize(this.get('application.namespace.name'));
+    } else {
+      return configTitle;
+    }
   }.property('application.namespace.name')
 });

addon/templates/components/bf-header.hbs

@@ -2,7 +2,7 @@
   <nav class="navbar navbar-static-top">
     <div class="container-fluid">
       <div class="navbar-header">
-        {{#link-to "index" class="navbar-brand"}}{{appName}}{{/link-to}}
+        {{#link-to "index" class="navbar-brand"}} {{appName}} {{/link-to}}
         <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse">
           <i class="fa fa-bars"></i>
         </button>