Build a nav-state service to help control visibility of submenus

app/services/nav-state.js

@@ -0,0 +1,56 @@
+import Service from '@ember/service';
+import { tracked } from "@glimmer/tracking";
+import { inject as service } from '@ember/service';
+
+export default class NavStateService extends Service {
+  @service store;
+
+  @tracked book = '';
+  @tracked chapter = '';
+  @tracked verse = '';
+  @tracked chapterNavActive = false;
+  @tracked verseNaveActive = false;
+
+  setBook(book) {
+    this.book = book;
+    this.chapter = '';
+    this.verse = '';
+  }
+
+  setChapter(chapter) {
+    this.chapter = chapter;
+    this.verse = '';
+  }
+
+  setVerse(verse) {
+    this.verse = verse;
+  }
+
+  toggleChapterNav() {
+    this.chapterNavActive = !this.chapterNavActive;
+  }
+
+  toggleVerseNav() {
+    this.verseNaveActive = !this.verseNaveActive;
+  }
+
+  isCurrentBook(book) {
+    return this.book === book;
+  }
+
+  isCurrentChapter(chapter) {
+    return this.chapter === chapter;
+  }
+
+  isCurrentVerse(verse) {
+    return this.verse === verse;
+  }
+
+  isChapterNavActive() {
+    return this.chapterNavActive;
+  }
+
+  isVerseNavActive() {
+    return this.verseNaveActive;
+  }
+}