diff --git a/app/components/scripture-nav-bar.js b/app/components/scripture-nav-bar.js
index 0e6b2da..5c78bdc 100644
--- a/app/components/scripture-nav-bar.js
+++ b/app/components/scripture-nav-bar.js
@@ -6,15 +6,41 @@ import { inject as service } from '@ember/service';
 
 export default class ScriptureNavBarComponent extends Component {
   @service router;
+  @service store;
 
   @tracked chaptersVisible = false;
   @tracked versesVisible = false;
   @tracked currentBook = null;
   @tracked currentChapter = null;
+  @tracked books = [];
 
   constructor(...args) {
     super(...args);
-    this.books = books;
+    console.log(books);
+    this.books = this.availableBooks;
+    // console.log(this.books);
+  }
+
+  // get only the books that we have backend data for
+  get
+  availableBooks()
+  {
+    return this.store.findAll('book').then(function(backendBooks) {
+      let available = [];
+      backendBooks.forEach(
+        value => {
+          let foundValue = books.find(function(book) {
+            return book['name'] == value.id
+          });
+          if(foundValue) {
+            available.push(foundValue);
+          }
+        });
+      return available;
+    }).then(function(response) {
+      console.log(response);
+      return response;
+    });
   }
 
   @action