Add Commentary Book intros to the chapter nav

app/components/chapter-nav.hbs

@@ -1,5 +1,6 @@
 <Scrollmenu @visible={{@visible}}>
   <span class="label">Chapters:</span>
+  <LinkTo @route="commentary-intro" @model={{@book.name}}>Intro</LinkTo>
   {{#each @book.chapters as |chapter|}}
     <Chapter @book={{@book}} @chapter={{chapter}} @active={{this.isChapterActive}} @showVerses={{this.showVerses}} />
   {{/each}}

app/router.js

@@ -16,4 +16,5 @@ Router.map(function() {
   this.route('site-purpose');
   this.route('contact-us');
   this.route('morph-legend');
+  this.route('commentary-intro', { path: '/commentary/:book_id' });
 });

app/routes/commentary-intro.js

@@ -0,0 +1,13 @@
+import Route from '@ember/routing/route';
+import fetch from 'fetch';
+import { htmlSafe } from '@ember/template';
+
+export default class CommentaryIntroRoute extends Route {
+  async model(params) {
+    const response = await fetch('http://gwt.api/api/v1/commentary/' + params.book_id + '/chapter/intro');
+    const body = await response.text().then(function(text){
+      return new htmlSafe(text);
+    });
+    return { body };
+  }
+}

app/templates/commentary-intro.hbs

@@ -0,0 +1,7 @@
+{{page-title "Book Introduction"}}
+
+<div class="container pt-4">
+  {{{@model.body}}}
+</div>
+
+{{outlet}}

tests/unit/routes/commentary-intro-test.js

@@ -0,0 +1,11 @@
+import { module, test } from 'qunit';
+import { setupTest } from 'ember-qunit';
+
+module('Unit | Route | commentary-intro', function(hooks) {
+  setupTest(hooks);
+
+  test('it exists', function(assert) {
+    let route = this.owner.lookup('route:commentary-intro');
+    assert.ok(route);
+  });
+});