diff --git a/projects/nshmp-apps/cypress/integration/dashboard/dashboard.spec.ts b/projects/nshmp-apps/cypress/integration/dashboard/dashboard.spec.ts
index 909100aab14ef2dca994dc104e3fbd2d3452e753..958fad149131a28090fdd8470423522f0da96155 100644
--- a/projects/nshmp-apps/cypress/integration/dashboard/dashboard.spec.ts
+++ b/projects/nshmp-apps/cypress/integration/dashboard/dashboard.spec.ts
@@ -1,4 +1,3 @@
-import {navigation} from '../../../src/shared/utils/navigation.utils';
 import * as utils from '../../utils';
 
 describe('Dashboard', () => {
@@ -8,20 +7,10 @@ describe('Dashboard', () => {
   });
 
   describe('Check nshmp-template', () => {
-    utils.hasNshmpTemplate(navigation());
+    utils.hasNshmpTemplate();
   });
 
   describe('Check dashboard', () => {
-    const nav = navigation().map(navItem => {
-      const list = navItem.navigation.filter(
-        app => app.display !== 'Dashboard',
-      );
-      return {
-        ...navItem,
-        navigation: list,
-      };
-    });
-
-    utils.hasDashboard(nav);
+    utils.hasDashboard();
   });
 });
diff --git a/projects/nshmp-apps/cypress/integration/dev/dashboard/dev-dashboard.spec.ts b/projects/nshmp-apps/cypress/integration/dev/dashboard/dev-dashboard.spec.ts
index 9a86dd68b59404a655f20865e5877d9fa18edf88..983f981bc1fab84d2c814d8ffe588a4ae14730a6 100644
--- a/projects/nshmp-apps/cypress/integration/dev/dashboard/dev-dashboard.spec.ts
+++ b/projects/nshmp-apps/cypress/integration/dev/dashboard/dev-dashboard.spec.ts
@@ -1,4 +1,3 @@
-import {devNavigation} from '../../../../src/shared/utils/navigation.utils';
 import * as utils from '../../../utils';
 
 describe('Development Dashboard', () => {
@@ -8,20 +7,10 @@ describe('Development Dashboard', () => {
   });
 
   describe('Check nshmp-template', () => {
-    utils.hasNshmpTemplate(devNavigation());
+    utils.hasNshmpTemplate();
   });
 
   describe('Check dev dashboard', () => {
-    const nav = devNavigation().map(navItem => {
-      const list = navItem.navigation.filter(
-        app => app.display !== 'Development Dashboard',
-      );
-      return {
-        ...navItem,
-        navigation: list,
-      };
-    });
-
-    utils.hasDashboard(nav);
+    utils.hasDashboard();
   });
 });
diff --git a/projects/nshmp-apps/cypress/integration/dev/math/exceedance-explorer/exceedance-explorer.spec.ts b/projects/nshmp-apps/cypress/integration/dev/math/exceedance-explorer/exceedance-explorer.spec.ts
index f3f644ecbf872a6b324b372914781867d357d735..1eb300f21d27063a796a233b2107d59c48dbc56e 100644
--- a/projects/nshmp-apps/cypress/integration/dev/math/exceedance-explorer/exceedance-explorer.spec.ts
+++ b/projects/nshmp-apps/cypress/integration/dev/math/exceedance-explorer/exceedance-explorer.spec.ts
@@ -1,4 +1,3 @@
-import {devNavigation} from '../../../../../src/shared/utils/navigation.utils';
 import * as utils from '../../../../utils';
 
 describe('Exceedance Explorer Application', () => {
@@ -8,7 +7,7 @@ describe('Exceedance Explorer Application', () => {
   });
 
   describe('Check nshmp-template', () => {
-    utils.hasNshmpTemplate(devNavigation());
+    utils.hasNshmpTemplate();
   });
 
   describe('Application', () => {
diff --git a/projects/nshmp-apps/cypress/integration/gmm/distance/gmm-distance.spec.ts b/projects/nshmp-apps/cypress/integration/gmm/distance/gmm-distance.spec.ts
index 1c1e8c40c04e4e8b748bf499ff653cfa94017ee5..64c415460fb93fb924406fb695f28388203e3a8e 100644
--- a/projects/nshmp-apps/cypress/integration/gmm/distance/gmm-distance.spec.ts
+++ b/projects/nshmp-apps/cypress/integration/gmm/distance/gmm-distance.spec.ts
@@ -1,4 +1,3 @@
-import {navigation} from '../../../../src/shared/utils/navigation.utils';
 import * as utils from '../../../utils';
 
 const url = 'https://earthquake.usgs.gov/ws/nshmp/data/gmm/distance';
@@ -12,7 +11,7 @@ describe('Ground Motion vs. Distance Application', () => {
   });
 
   describe('Check nshmp-template', () => {
-    utils.hasNshmpTemplate(navigation());
+    utils.hasNshmpTemplate();
   });
 
   describe('Application', () => {
diff --git a/projects/nshmp-apps/cypress/integration/gmm/magnitude/gmm-magnitude.spec.ts b/projects/nshmp-apps/cypress/integration/gmm/magnitude/gmm-magnitude.spec.ts
index 7e15bf3807460a2b0c3bffa4b73911197d54debb..9521265278e569b4e6f9a6424674ad50cdb060b1 100644
--- a/projects/nshmp-apps/cypress/integration/gmm/magnitude/gmm-magnitude.spec.ts
+++ b/projects/nshmp-apps/cypress/integration/gmm/magnitude/gmm-magnitude.spec.ts
@@ -1,4 +1,3 @@
-import {navigation} from '../../../../src/shared/utils/navigation.utils';
 import * as utils from '../../../utils';
 
 const url = 'https://earthquake.usgs.gov/ws/nshmp/data/gmm/magnitude';
@@ -12,7 +11,7 @@ describe('Ground Motion vs. Magnitude', () => {
   });
 
   describe('Check nshmp-template', () => {
-    utils.hasNshmpTemplate(navigation());
+    utils.hasNshmpTemplate();
   });
 
   describe('Application', () => {
diff --git a/projects/nshmp-apps/cypress/integration/gmm/spectra/response-spectra.spec.ts b/projects/nshmp-apps/cypress/integration/gmm/spectra/response-spectra.spec.ts
index 0d369e638b40e3c0ee3ce537d045289638ca4110..af90143f72ef7940da1d027b3e004c8c93ab0af0 100644
--- a/projects/nshmp-apps/cypress/integration/gmm/spectra/response-spectra.spec.ts
+++ b/projects/nshmp-apps/cypress/integration/gmm/spectra/response-spectra.spec.ts
@@ -1,4 +1,3 @@
-import {navigation} from '../../../../src/shared/utils/navigation.utils';
 import * as utils from '../../../utils';
 
 const url = 'https://earthquake.usgs.gov/ws/nshmp/data/gmm/spectra';
@@ -12,7 +11,7 @@ describe('Response Spectra', () => {
   });
 
   describe('Check nshmp-template', () => {
-    utils.hasNshmpTemplate(navigation());
+    utils.hasNshmpTemplate();
   });
 
   describe('Application', () => {
diff --git a/projects/nshmp-apps/cypress/integration/hazard/disagg/disagg.spec.ts b/projects/nshmp-apps/cypress/integration/hazard/disagg/disagg.spec.ts
index ec8be6590f3fb6029400c1508384b9e411c544f2..a2eed44f16c9f7842f8992121957699e6ea90fec 100644
--- a/projects/nshmp-apps/cypress/integration/hazard/disagg/disagg.spec.ts
+++ b/projects/nshmp-apps/cypress/integration/hazard/disagg/disagg.spec.ts
@@ -1,6 +1,5 @@
 import {DisaggTarget} from '@ghsc/nshmp-lib-ng/hazard';
 
-import {navigation} from '../../../../src/shared/utils/navigation.utils';
 import * as utils from '../../../utils';
 
 const url = 'https://earthquake.usgs.gov/ws/nshmp/*/dynamic/disagg';
@@ -14,7 +13,7 @@ describe('Disagg Application', () => {
   });
 
   describe('Check nshmp-template', () => {
-    utils.hasNshmpTemplate(navigation());
+    utils.hasNshmpTemplate();
   });
 
   describe('Application', () => {
diff --git a/projects/nshmp-apps/cypress/integration/hazard/dynamic/dynamic-hazard.spec.ts b/projects/nshmp-apps/cypress/integration/hazard/dynamic/dynamic-hazard.spec.ts
index 003919c29e5fe3c8608d098ebff3270abea0c432..73c83d629eba93478e3c85803073f6542e9cd5c8 100644
--- a/projects/nshmp-apps/cypress/integration/hazard/dynamic/dynamic-hazard.spec.ts
+++ b/projects/nshmp-apps/cypress/integration/hazard/dynamic/dynamic-hazard.spec.ts
@@ -1,4 +1,3 @@
-import {navigation} from '../../../../src/shared/utils/navigation.utils';
 import * as utils from '../../../utils';
 
 const url = 'https://earthquake.usgs.gov/ws/nshmp/*/dynamic/hazard';
@@ -12,7 +11,7 @@ describe('Dynamic Hazard Application', () => {
   });
 
   describe('Check nshmp-template', () => {
-    utils.hasNshmpTemplate(navigation());
+    utils.hasNshmpTemplate();
   });
 
   describe('Application', () => {
diff --git a/projects/nshmp-apps/cypress/integration/hazard/static/static-hazard.spec.ts b/projects/nshmp-apps/cypress/integration/hazard/static/static-hazard.spec.ts
index ef75af05c35eb13fb7b311799f5b7248451b07d8..ae5a32ce8d6b52d70c1b80a19843e84b84ec608e 100644
--- a/projects/nshmp-apps/cypress/integration/hazard/static/static-hazard.spec.ts
+++ b/projects/nshmp-apps/cypress/integration/hazard/static/static-hazard.spec.ts
@@ -1,4 +1,3 @@
-import {navigation} from '../../../../src/shared/utils/navigation.utils';
 import * as utils from '../../../utils';
 
 const url = 'https://**/ws/nshmp/*/static/hazard';
@@ -12,7 +11,7 @@ describe('Static Hazard Application', () => {
   });
 
   describe('Check nshmp-template', () => {
-    utils.hasNshmpTemplate(navigation());
+    utils.hasNshmpTemplate();
   });
 
   describe('Application', () => {
diff --git a/projects/nshmp-apps/cypress/integration/services/services.spec.ts b/projects/nshmp-apps/cypress/integration/services/services.spec.ts
index 13ed0c7a4c69b18512b3d19dd01de34e0ee314ef..82c7b4675b490737674f779ee89c52249520d698 100644
--- a/projects/nshmp-apps/cypress/integration/services/services.spec.ts
+++ b/projects/nshmp-apps/cypress/integration/services/services.spec.ts
@@ -1,4 +1,3 @@
-import {navigation} from '../../../src/shared/utils/navigation.utils';
 import * as utils from '../../utils';
 
 describe('Services Application', () => {
@@ -8,7 +7,7 @@ describe('Services Application', () => {
   });
 
   describe('Check nshmp-template', () => {
-    utils.hasNshmpTemplate(navigation());
+    utils.hasNshmpTemplate();
   });
 
   describe('Application', () => {
diff --git a/projects/nshmp-apps/cypress/integration/source/data/data-mapping.spec.ts b/projects/nshmp-apps/cypress/integration/source/data/data-mapping.spec.ts
index 147f7316da35d6fd1be1a690ec309b1bb6afbf6d..d9c7be65004f729ef7d5dd6caf27ff2ce9bfe3ed 100644
--- a/projects/nshmp-apps/cypress/integration/source/data/data-mapping.spec.ts
+++ b/projects/nshmp-apps/cypress/integration/source/data/data-mapping.spec.ts
@@ -1,4 +1,3 @@
-import {navigation} from '../../../../src/shared/utils/navigation.utils';
 import * as utils from '../../../utils';
 
 const url = '/ws/nshmp/data/fault-sections';
@@ -12,7 +11,7 @@ describe('Model Mapping Application', () => {
   });
 
   describe('Check nshmp-template', () => {
-    utils.hasNshmpTemplate(navigation());
+    utils.hasNshmpTemplate();
   });
 
   describe('Application', () => {
diff --git a/projects/nshmp-apps/cypress/integration/source/mfd/mfd.spec.ts b/projects/nshmp-apps/cypress/integration/source/mfd/mfd.spec.ts
index 20da7c987b5ef69390fad50011297b5deb9fa493..7aa0c42f15de6dbc22bc6cbc5333392523ceab46 100644
--- a/projects/nshmp-apps/cypress/integration/source/mfd/mfd.spec.ts
+++ b/projects/nshmp-apps/cypress/integration/source/mfd/mfd.spec.ts
@@ -1,4 +1,3 @@
-import {navigation} from '../../../../src/shared/utils/navigation.utils';
 import * as utils from '../../../utils';
 
 const url = 'https://earthquake.usgs.gov/ws/nshmp/*/dynamic/trees';
@@ -12,7 +11,7 @@ describe('Magnitude Frequency Distribution Application', () => {
   });
 
   describe('Check nshmp-template', () => {
-    utils.hasNshmpTemplate(navigation());
+    utils.hasNshmpTemplate();
   });
 
   describe('Application', () => {
diff --git a/projects/nshmp-apps/cypress/utils/dashboard.utils.ts b/projects/nshmp-apps/cypress/utils/dashboard.utils.ts
index 3ff138217054ad78c978dbc4c4a9a6b17963d87d..3210c15d87bb5c854d862d897a8a976b6d2eb851 100644
--- a/projects/nshmp-apps/cypress/utils/dashboard.utils.ts
+++ b/projects/nshmp-apps/cypress/utils/dashboard.utils.ts
@@ -1,8 +1,6 @@
 import 'cypress';
 
-import {NavigationList} from '@ghsc/nshmp-template';
-
-export function hasDashboard(navList: NavigationList[]) {
+export function hasDashboard() {
   it('Has nshmp-template main', () => {
     cy.get('nshmp-template-main').should('be.visible');
   });
@@ -29,38 +27,4 @@ export function hasDashboard(navList: NavigationList[]) {
       .should('have.length.above', 0)
       .should('be.visible');
   });
-
-  navList.forEach(nav => {
-    if (nav.subHeader) {
-      it(`Has "${nav.subHeader}" application list header`, () => {
-        cy.get('.dashboard').find('.app-section').contains(nav.subHeader);
-      });
-    }
-
-    nav.navigation.forEach(app => {
-      const routerLink = app.routerLink.startsWith('/')
-        ? app.routerLink.substring(1)
-        : app.routerLink;
-
-      it(`Has "${app.display}" application`, () => {
-        if (app.routerLink.includes('/aws/')) {
-          cy.intercept(
-            'GET',
-            'https://earthquake.usgs.gov/ws/nshmp/hazard-runs/auth',
-            {
-              fixture: 'aws-auth.json',
-            },
-          );
-        }
-
-        cy.get('.dashboard')
-          .find('mat-card')
-          .contains('mat-card-title', app.display)
-          .parent()
-          .click()
-          .url()
-          .should('contain', `${Cypress.config().baseUrl}${routerLink}`);
-      });
-    });
-  });
 }
diff --git a/projects/nshmp-apps/cypress/utils/nshmp-template.utils.ts b/projects/nshmp-apps/cypress/utils/nshmp-template.utils.ts
index 18cd9977aec361cc6bda4df3bd2e142afbd73621..442b2b174f90fcb6ed9f9c5fe0abd7d97898baf3 100644
--- a/projects/nshmp-apps/cypress/utils/nshmp-template.utils.ts
+++ b/projects/nshmp-apps/cypress/utils/nshmp-template.utils.ts
@@ -1,7 +1,5 @@
 import 'cypress';
 
-import {NavigationList} from '@ghsc/nshmp-template';
-
 export interface CheckPlot {
   plotClass: string;
   intercept?: boolean;
@@ -33,7 +31,7 @@ export function hasControlPanel() {
   });
 }
 
-export function hasNshmpTemplate(navList: NavigationList[]) {
+export function hasNshmpTemplate() {
   it('Has nshmp-template', () => {
     cy.get('nshmp-template').should('be.visible');
   });
@@ -70,52 +68,6 @@ export function hasNshmpTemplate(navList: NavigationList[]) {
         .find('button')
         .should('have.length.above', 0);
     });
-
-    navList.forEach(nav => {
-      if (nav.subHeader) {
-        it(`Has "${nav.subHeader}" header`, () => {
-          cy.get('nshmp-template-navigation')
-            .find('button')
-            .click()
-            .get('.mat-menu-panel')
-            .contains(nav.subHeader);
-        });
-      }
-      nav.navigation.forEach(app => {
-        const routerLink = app.routerLink.startsWith('/')
-          ? app.routerLink.substring(1)
-          : app.routerLink;
-
-        it(`Has "${app.display}" listed in navigation menu`, () => {
-          if (app.routerLink.includes('/aws/')) {
-            cy.intercept(
-              'GET',
-              'https://earthquake.usgs.gov/ws/nshmp/hazard-runs/auth',
-              {
-                fixture: 'aws-auth.json',
-              },
-            );
-          }
-
-          cy.get('nshmp-template-navigation').find('button').click();
-
-          cy.get('.mat-menu-panel')
-            .then(menu => {
-              const subMenu = menu.find(`button:contains('${nav.subHeader}')`);
-              if (subMenu.length) {
-                cy.get('.mat-menu-panel')
-                  .find(`button:contains('${nav.subHeader}')`)
-                  .trigger('mouseenter');
-              }
-            })
-            .get('.mat-menu-panel')
-            .contains('button', app.display)
-            .click()
-            .url()
-            .should('contain', `${Cypress.config().baseUrl}${routerLink}`);
-        });
-      });
-    });
   });
 }
 
diff --git a/projects/nshmp-apps/src/app/app.component.ts b/projects/nshmp-apps/src/app/app.component.ts
index 3e40ce7f3ea3456236452e35a44a219524fd3718..73e575ac46355af8215bfa160aa4b1d7b41cffd5 100644
--- a/projects/nshmp-apps/src/app/app.component.ts
+++ b/projects/nshmp-apps/src/app/app.component.ts
@@ -5,8 +5,8 @@ import {NshmpService} from '@ghsc/nshmp-lib-ng/nshmp';
 import {VersionInfo} from '@ghsc/nshmp-utils-ts/libs/nshmp-ws-utils';
 import {Subscription} from 'rxjs';
 
+import {NavigationService} from '../shared/services/navigation.service';
 import {TOOLBOX_NAME} from '../shared/utils/applications.utils';
-import {navigation} from '../shared/utils/navigation.utils';
 
 /**
  * USGS Earthquake Hazard Toolbox application router outlet for all applications.
@@ -20,12 +20,10 @@ import {navigation} from '../shared/utils/navigation.utils';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit, OnDestroy {
-  /** Navigation list for menu */
-  navigationList = navigation();
-
   versionSubscription: Subscription;
 
   constructor(
+    public navService: NavigationService,
     private nshmpService: NshmpService,
     private http: HttpClient,
   ) {}
diff --git a/projects/nshmp-apps/src/app/dashboard/app.component.html b/projects/nshmp-apps/src/app/dashboard/app.component.html
index 359771f0cf78859edf2227f65f72dd9d8846b394..dfb27e7f74f3c21f047d06fd019dfcd7667a9ccc 100644
--- a/projects/nshmp-apps/src/app/dashboard/app.component.html
+++ b/projects/nshmp-apps/src/app/dashboard/app.component.html
@@ -1,6 +1,10 @@
-<nshmp-lib-ng-template #template [navigationList]="navigationList" [title]="">
+<nshmp-lib-ng-template
+  #template
+  [navigationList]="navService.navigationList()"
+  [title]=""
+>
   <!-- Dashboard -->
-  <nshmp-lib-ng-dashboard [sections]="sections">
+  <nshmp-lib-ng-dashboard [sections]="sections()">
     <nshmp-lib-ng-dashboard-title />
     <nshmp-lib-ng-dashboard-description />
   </nshmp-lib-ng-dashboard>
diff --git a/projects/nshmp-apps/src/app/dashboard/app.component.ts b/projects/nshmp-apps/src/app/dashboard/app.component.ts
index f8bbacf9546acec8affedb0e639389f0ff112a97..cb537fc310331b1a63a0eed04969823395dd4b8f 100644
--- a/projects/nshmp-apps/src/app/dashboard/app.component.ts
+++ b/projects/nshmp-apps/src/app/dashboard/app.component.ts
@@ -1,4 +1,4 @@
-import {Component} from '@angular/core';
+import {Component, OnDestroy, OnInit, signal} from '@angular/core';
 import {NshmpLibNgAboutPageComponent} from '@ghsc/nshmp-lib-ng/about';
 import {
   ApplicationSections,
@@ -7,17 +7,11 @@ import {
   NshmpLibNgDashboardTitleComponent,
   NshmpLibNgTemplateComponent,
 } from '@ghsc/nshmp-lib-ng/nshmp';
+import {Subscription} from 'rxjs';
 
-import {apps} from '../../shared/utils/applications.utils';
-import {
-  designMapApps,
-  gmmApps,
-  hazardApps,
-  navigation,
-  ncmApps,
-  serviceApps,
-  sourceModelApps,
-} from '../../shared/utils/navigation.utils';
+import {AuthService} from '../../shared/services/auth.service';
+import {NavigationService} from '../../shared/services/navigation.service';
+import {apps, internalApps} from '../../shared/utils/applications.utils';
 import {AboutComponent} from './components/about/about.component';
 
 /**
@@ -38,33 +32,25 @@ import {AboutComponent} from './components/about/about.component';
   styleUrl: './app.component.scss',
   templateUrl: './app.component.html',
 })
-export class AppComponent {
-  /** Navigation list for menu */
-  navigationList = navigation();
+export class AppComponent implements OnInit, OnDestroy {
+  sections = signal<ApplicationSections[]>([]);
 
-  /** Design map apps  */
-  private designMapApps = designMapApps();
-  /** The GMM applications */
-  private gmmApps = gmmApps();
-  /** Hazard applications */
-  private hazardApps = hazardApps();
-  /** NCM apps  */
-  private ncmApps = ncmApps();
-  /** Source model applications */
-  private sourceModelApps = sourceModelApps();
-  /** Service applications */
-  private serviceApps = serviceApps();
+  private subscription = new Subscription();
 
-  sections: ApplicationSections[] = [
+  private applicationSections: ApplicationSections[] = [
     {
       sections: [
         {
-          applications: this.hazardApps.map(navigation => ({navigation})),
+          applications: this.navService
+            .hazardApps()
+            .map(navigation => ({navigation})),
           routerLink: apps().hazard.dashboard.routerLink,
           title: 'Hazard',
         },
         {
-          applications: this.serviceApps.map(navigation => ({navigation})),
+          applications: this.navService
+            .serviceApps()
+            .map(navigation => ({navigation})),
           title: 'Services',
         },
       ],
@@ -72,22 +58,30 @@ export class AppComponent {
     {
       sections: [
         {
-          applications: this.sourceModelApps.map(navigation => ({navigation})),
+          applications: this.navService
+            .sourceModelApps()
+            .map(navigation => ({navigation})),
           routerLink: apps().source.dashboard.routerLink,
           title: 'Source Model',
         },
         {
-          applications: this.gmmApps.map(navigation => ({navigation})),
+          applications: this.navService
+            .gmmApps()
+            .map(navigation => ({navigation})),
           routerLink: apps().gmm.dashboard.routerLink,
           title: 'Ground Motion Models',
         },
         {
-          applications: this.designMapApps.map(navigation => ({navigation})),
+          applications: this.navService
+            .designMapApps()
+            .map(navigation => ({navigation})),
           routerLink: apps().designMaps.dashboard.routerLink,
           title: 'Design Maps',
         },
         {
-          applications: this.ncmApps.map(navigation => ({navigation})),
+          applications: this.navService
+            .ncmApps()
+            .map(navigation => ({navigation})),
           routerLink: apps().ncm.dashboard.routerLink,
           title: 'National Crustal Model',
         },
@@ -95,5 +89,34 @@ export class AppComponent {
     },
   ];
 
-  constructor() {}
+  constructor(
+    public navService: NavigationService,
+    private authService: AuthService,
+  ) {}
+
+  ngOnDestroy(): void {
+    this.subscription.unsubscribe();
+  }
+
+  ngOnInit(): void {
+    this.sections.set(this.applicationSections);
+    this.checkInternal();
+  }
+
+  private checkInternal(): void {
+    this.subscription = this.authService
+      .isAuthorized(false)
+      .subscribe(isInternal => {
+        if (isInternal) {
+          const sections = this.sections();
+          sections[0]?.sections.push({
+            applications: this.navService
+              .internalMainApps()
+              .map(navigation => ({navigation})),
+            routerLink: internalApps().dashboard.routerLink,
+            title: 'Internal',
+          });
+        }
+      });
+  }
 }
diff --git a/projects/nshmp-apps/src/app/designmaps/dashboard/app.component.html b/projects/nshmp-apps/src/app/designmaps/dashboard/app.component.html
index 1a7c48e6595fae9eeb197f9ad5b9bb85645c9717..b83e792108a1f0278050454b2a074cf9979c3dc2 100644
--- a/projects/nshmp-apps/src/app/designmaps/dashboard/app.component.html
+++ b/projects/nshmp-apps/src/app/designmaps/dashboard/app.component.html
@@ -1,4 +1,8 @@
-<nshmp-lib-ng-template #template [navigationList]="navigationList" [title]="">
+<nshmp-lib-ng-template
+  #template
+  [navigationList]="navService.navigationList()"
+  [title]=""
+>
   <!-- Dashboard -->
   <nshmp-lib-ng-dashboard [sections]="sections">
     <nshmp-lib-ng-dashboard-title>
diff --git a/projects/nshmp-apps/src/app/designmaps/dashboard/app.component.ts b/projects/nshmp-apps/src/app/designmaps/dashboard/app.component.ts
index 0097d40055a30aba54692290255b2a0f95a1794d..378c2654ceccc5171ce36a449e4a034998ad5e7a 100644
--- a/projects/nshmp-apps/src/app/designmaps/dashboard/app.component.ts
+++ b/projects/nshmp-apps/src/app/designmaps/dashboard/app.component.ts
@@ -10,10 +10,7 @@ import {
   NshmpLibNgDashboardTitleComponent,
   NshmpLibNgTemplateComponent,
 } from '@ghsc/nshmp-lib-ng/nshmp';
-import {
-  designMapApps,
-  navigation,
-} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 
 @Component({
   imports: [
@@ -29,18 +26,19 @@ import {
   templateUrl: './app.component.html',
 })
 export class AppComponent {
-  /** Navigation list for menu */
-  navigationList = navigation();
-
   sections: ApplicationSections[] = [
     {
       gridClass: 'grid-col-10',
       sections: [
         {
-          applications: designMapApps().map(navigation => ({navigation})),
+          applications: this.navService
+            .designMapApps()
+            .map(navigation => ({navigation})),
           gridClass: 'grid-col-12 tablet-lg:grid-col-8 grid-offset-1',
         },
       ],
     },
   ];
+
+  constructor(public navService: NavigationService) {}
 }
diff --git a/projects/nshmp-apps/src/app/designmaps/rtgm/app.component.html b/projects/nshmp-apps/src/app/designmaps/rtgm/app.component.html
index 464fe56b0043d779f6b76cc773592bb909e855df..792c00dffb6295091a57bdb337e8a64fa9db3101 100644
--- a/projects/nshmp-apps/src/app/designmaps/rtgm/app.component.html
+++ b/projects/nshmp-apps/src/app/designmaps/rtgm/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.navigationList()"
+  [title]="title"
+>
   <nshmp-template-content-container>
     <nshmp-template-control-panel>
       <app-control-panel />
diff --git a/projects/nshmp-apps/src/app/designmaps/rtgm/app.component.ts b/projects/nshmp-apps/src/app/designmaps/rtgm/app.component.ts
index b306d8a4ac2dd49f12c736f0c95ebbba3de80559..111023c50e47b9d47d3c379f4e5c3dcfd4103869 100644
--- a/projects/nshmp-apps/src/app/designmaps/rtgm/app.component.ts
+++ b/projects/nshmp-apps/src/app/designmaps/rtgm/app.component.ts
@@ -7,8 +7,8 @@ import {
   NshmpTemplateMainContentComponent,
   NshmpTemplateSettingsComponent,
 } from '@ghsc/nshmp-template';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ContentComponent} from './components/content/content.component';
@@ -34,12 +34,13 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Navigation list for menu */
-  navigationList = navigation();
   /** Application title */
   title = apps().designMaps.rtgm.display;
 
-  constructor(private service: AppService) {}
+  constructor(
+    public navService: NavigationService,
+    private service: AppService,
+  ) {}
 
   ngOnInit(): void {
     this.service.init();
diff --git a/projects/nshmp-apps/src/app/dev/dashboard/app.component.html b/projects/nshmp-apps/src/app/dev/dashboard/app.component.html
index 8c2c6ecffb3a307c8c159cb3a3b46a3f163d7420..a333b4c603fa62ae922bc6bc0f18a8e6462a551f 100644
--- a/projects/nshmp-apps/src/app/dev/dashboard/app.component.html
+++ b/projects/nshmp-apps/src/app/dev/dashboard/app.component.html
@@ -1,6 +1,6 @@
 <nshmp-lib-ng-template
   #template
-  [navigationList]="navigationList"
+  [navigationList]="navService.devNavigation()"
   [title]="title"
 >
   <!-- Dashboard -->
diff --git a/projects/nshmp-apps/src/app/dev/dashboard/app.component.ts b/projects/nshmp-apps/src/app/dev/dashboard/app.component.ts
index 0af03eed337ccdb9d0035a48e1dab7557f0cc7db..e2125fc66287ab4d125d03f30db32da2e4cca745 100644
--- a/projects/nshmp-apps/src/app/dev/dashboard/app.component.ts
+++ b/projects/nshmp-apps/src/app/dev/dashboard/app.component.ts
@@ -10,8 +10,7 @@ import {
   NshmpLibNgDashboardTitleComponent,
   NshmpLibNgTemplateComponent,
 } from '@ghsc/nshmp-lib-ng/nshmp';
-
-import * as nav from '../../../shared/utils/navigation.utils';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 
 /**
  * Development dashboard showing links to development applications.
@@ -30,25 +29,21 @@ import * as nav from '../../../shared/utils/navigation.utils';
   templateUrl: './app.component.html',
 })
 export class AppComponent {
-  /** Navigation list for menu */
-  navigationList = nav.devNavigation();
-
   title = 'Development Applications';
 
-  /** Main development applications */
-  private mainApps = nav.devMainApps();
-
   sections: ApplicationSections[] = [
     {
       gridClass: 'grid-col-10',
       sections: [
         {
-          applications: this.mainApps.map(navigation => ({navigation})),
+          applications: this.navService
+            .devMainApps()
+            .map(navigation => ({navigation})),
           gridClass: 'grid-col-12 tablet-lg:grid-col-8 grid-offset-1',
         },
       ],
     },
   ];
 
-  constructor() {}
+  constructor(public navService: NavigationService) {}
 }
diff --git a/projects/nshmp-apps/src/app/dev/gmm/dashboard/app.component.html b/projects/nshmp-apps/src/app/dev/gmm/dashboard/app.component.html
index b1cc26d5884ee690e40b2a13f0bc9885ce7bf06e..4197a32ceff78895ccdd71ab1989c170d4379615 100644
--- a/projects/nshmp-apps/src/app/dev/gmm/dashboard/app.component.html
+++ b/projects/nshmp-apps/src/app/dev/gmm/dashboard/app.component.html
@@ -1,6 +1,6 @@
 <nshmp-lib-ng-template
   #template
-  [navigationList]="navigationList"
+  [navigationList]="navService.devNavigation()"
   [title]="title"
 >
   <!-- Dashboard -->
diff --git a/projects/nshmp-apps/src/app/dev/gmm/dashboard/app.component.ts b/projects/nshmp-apps/src/app/dev/gmm/dashboard/app.component.ts
index 70992f37e51b808fe847d47b265e764145a04154..f7b51d9d006b6001a9fcee0b842231e66318d812 100644
--- a/projects/nshmp-apps/src/app/dev/gmm/dashboard/app.component.ts
+++ b/projects/nshmp-apps/src/app/dev/gmm/dashboard/app.component.ts
@@ -10,10 +10,7 @@ import {
   NshmpLibNgDashboardTitleComponent,
   NshmpLibNgTemplateComponent,
 } from '@ghsc/nshmp-lib-ng/nshmp';
-import {
-  devGmmApps,
-  devNavigation,
-} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 
 @Component({
   imports: [
@@ -29,9 +26,6 @@ import {
   templateUrl: './app.component.html',
 })
 export class AppComponent {
-  /** Navigation list for menu */
-  navigationList = devNavigation();
-
   title = 'GMM Applications';
 
   sections: ApplicationSections[] = [
@@ -39,10 +33,14 @@ export class AppComponent {
       gridClass: 'grid-col-10',
       sections: [
         {
-          applications: devGmmApps().map(navigation => ({navigation})),
+          applications: this.navService
+            .devGmmApps()
+            .map(navigation => ({navigation})),
           gridClass: 'grid-col-12 tablet-lg:grid-col-8 grid-offset-1',
         },
       ],
     },
   ];
+
+  constructor(public navService: NavigationService) {}
 }
diff --git a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/app.component.html b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/app.component.html
index 996e7c48b91f5ffa312d91013ff4dd70132b8a8a..43040ceae81ee645b373bdcdef20463a09f25e80 100644
--- a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/app.component.html
+++ b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.devNavigation()"
+  [title]="title"
+>
   <nshmp-template-content-container>
     <!-- Control panel -->
     <nshmp-template-control-panel>
diff --git a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/app.component.ts b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/app.component.ts
index 199bd29b0890fdb04ffe692abb2de4a759a88618..989c42aa88b03ea10839c890ffb07bda3a370e3c 100644
--- a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/app.component.ts
+++ b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/app.component.ts
@@ -7,8 +7,8 @@ import {
   NshmpTemplateMainContentComponent,
   NshmpTemplateSettingsComponent,
 } from '@ghsc/nshmp-template';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {devApps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {devNavigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ContentComponent} from './components/content/content.component';
@@ -34,12 +34,13 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Navigation list for menu */
-  navigationList = devNavigation();
   /** Application title */
   title = devApps().gmm.hangingWallEffects.display;
 
-  constructor(private service: AppService) {}
+  constructor(
+    public navService: NavigationService,
+    private service: AppService,
+  ) {}
 
   ngOnInit(): void {
     this.service.init();
diff --git a/projects/nshmp-apps/src/app/dev/hazard/dashboard/app.component.html b/projects/nshmp-apps/src/app/dev/hazard/dashboard/app.component.html
index cd1fb0e4826ae4e1aaa5f099da8f7642cc9a3eb0..d607c5379d7eb37045bbc6c3572267b42dd4a386 100644
--- a/projects/nshmp-apps/src/app/dev/hazard/dashboard/app.component.html
+++ b/projects/nshmp-apps/src/app/dev/hazard/dashboard/app.component.html
@@ -1,6 +1,6 @@
 <nshmp-lib-ng-template
   #template
-  [navigationList]="navigationList"
+  [navigationList]="navService.devNavigation()"
   [title]="title"
 >
   <!-- Dashboard -->
diff --git a/projects/nshmp-apps/src/app/dev/hazard/dashboard/app.component.ts b/projects/nshmp-apps/src/app/dev/hazard/dashboard/app.component.ts
index 97870d90b7e7bb9fc8e016fe75af4c1125bc6078..7933ca36996c5da23a3efaeac957f0a52b63b8d2 100644
--- a/projects/nshmp-apps/src/app/dev/hazard/dashboard/app.component.ts
+++ b/projects/nshmp-apps/src/app/dev/hazard/dashboard/app.component.ts
@@ -10,10 +10,7 @@ import {
   NshmpLibNgDashboardTitleComponent,
   NshmpLibNgTemplateComponent,
 } from '@ghsc/nshmp-lib-ng/nshmp';
-import {
-  devHazardApps,
-  devNavigation,
-} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 
 @Component({
   imports: [
@@ -29,9 +26,6 @@ import {
   templateUrl: './app.component.html',
 })
 export class AppComponent {
-  /** Navigation list for menu */
-  navigationList = devNavigation();
-
   title = 'Hazard Applications';
 
   sections: ApplicationSections[] = [
@@ -39,10 +33,14 @@ export class AppComponent {
       gridClass: 'grid-col-10',
       sections: [
         {
-          applications: devHazardApps().map(navigation => ({navigation})),
+          applications: this.navService
+            .devHazardApps()
+            .map(navigation => ({navigation})),
           gridClass: 'grid-col-12 tablet-lg:grid-col-8 grid-offset-1',
         },
       ],
     },
   ];
+
+  constructor(public navService: NavigationService) {}
 }
diff --git a/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/app.component.html b/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/app.component.html
index e86be1762c08239a2f7139d58a004fc4623ac6f7..a3ead50bca9699fbd4057e4be28a50c2e0ac434c 100644
--- a/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/app.component.html
+++ b/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.devNavigation()"
+  [title]="title"
+>
   <nshmp-template-content-container>
     <!-- Control panel -->
     <nshmp-template-control-panel>
diff --git a/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/app.component.ts b/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/app.component.ts
index 22774c738d84bc2cae526435564bb7976ca46082..9dc683deb427e4a03ad24a825104f00a55636bb0 100644
--- a/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/app.component.ts
+++ b/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/app.component.ts
@@ -8,8 +8,8 @@ import {
   NshmpTemplateMainContentComponent,
   NshmpTemplateSettingsComponent,
 } from '@ghsc/nshmp-template';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {devApps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {devNavigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ContentComponent} from './components/content/content.component';
@@ -36,12 +36,13 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Navigation list for menu */
-  navigationList = devNavigation();
   /** Application title */
   title = devApps().hazard.dynamicCompare.display;
 
-  constructor(public service: AppService) {}
+  constructor(
+    public service: AppService,
+    public navService: NavigationService,
+  ) {}
 
   ngOnInit(): void {
     this.service.init();
diff --git a/projects/nshmp-apps/src/app/dev/math/dashboard/app.component.html b/projects/nshmp-apps/src/app/dev/math/dashboard/app.component.html
index 755f5e99ff48d224d4bfd75a7c7f0b0713ba1a02..ce9d0b14e2dc01d946a1d66906615fb120beba43 100644
--- a/projects/nshmp-apps/src/app/dev/math/dashboard/app.component.html
+++ b/projects/nshmp-apps/src/app/dev/math/dashboard/app.component.html
@@ -1,6 +1,6 @@
 <nshmp-lib-ng-template
   #template
-  [navigationList]="navigationList"
+  [navigationList]="navService.devNavigation()"
   [title]="title"
 >
   <!-- Dashboard -->
diff --git a/projects/nshmp-apps/src/app/dev/math/dashboard/app.component.ts b/projects/nshmp-apps/src/app/dev/math/dashboard/app.component.ts
index 64672d4cc96b17e9a07127d9fb3fabf99279634d..1ee581804c7c9fb6e5e77ba371f0b14dd9617754 100644
--- a/projects/nshmp-apps/src/app/dev/math/dashboard/app.component.ts
+++ b/projects/nshmp-apps/src/app/dev/math/dashboard/app.component.ts
@@ -10,10 +10,7 @@ import {
   NshmpLibNgDashboardTitleComponent,
   NshmpLibNgTemplateComponent,
 } from '@ghsc/nshmp-lib-ng/nshmp';
-import {
-  devMathApps,
-  devNavigation,
-} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 
 @Component({
   imports: [
@@ -29,9 +26,6 @@ import {
   templateUrl: './app.component.html',
 })
 export class AppComponent {
-  /** Navigation list for menu */
-  navigationList = devNavigation();
-
   title = 'Math Applications';
 
   sections: ApplicationSections[] = [
@@ -39,10 +33,14 @@ export class AppComponent {
       gridClass: 'grid-col-10',
       sections: [
         {
-          applications: devMathApps().map(navigation => ({navigation})),
+          applications: this.navService
+            .devMathApps()
+            .map(navigation => ({navigation})),
           gridClass: 'grid-col-12 tablet-lg:grid-col-8 grid-offset-1',
         },
       ],
     },
   ];
+
+  constructor(public navService: NavigationService) {}
 }
diff --git a/projects/nshmp-apps/src/app/dev/math/exceedance-explorer/app.component.html b/projects/nshmp-apps/src/app/dev/math/exceedance-explorer/app.component.html
index 3e40d662b9aab1ac6d28633c8813a37ca0b52ad3..e5fc584858d00531182938e99a991c6cc54adc78 100644
--- a/projects/nshmp-apps/src/app/dev/math/exceedance-explorer/app.component.html
+++ b/projects/nshmp-apps/src/app/dev/math/exceedance-explorer/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.devNavigation()"
+  [title]="title"
+>
   <nshmp-template-content-container>
     <nshmp-template-control-panel>
       <app-control-panel />
diff --git a/projects/nshmp-apps/src/app/dev/math/exceedance-explorer/app.component.ts b/projects/nshmp-apps/src/app/dev/math/exceedance-explorer/app.component.ts
index 578861498c75149a6e647c51ac2135b41c83ea0f..1338aa52823ce4a35efa0a1d8169ee5c02029ef4 100644
--- a/projects/nshmp-apps/src/app/dev/math/exceedance-explorer/app.component.ts
+++ b/projects/nshmp-apps/src/app/dev/math/exceedance-explorer/app.component.ts
@@ -7,8 +7,8 @@ import {
   NshmpTemplateMainContentComponent,
   NshmpTemplateSettingsComponent,
 } from '@ghsc/nshmp-template';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {devApps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {devNavigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ControlPanelComponent} from './components/control-panel/control-panel.component';
@@ -38,8 +38,8 @@ import {PlotSettingsPanelComponent} from './components/plot-settings-panel/plot-
   templateUrl: './app.component.html',
 })
 export class AppComponent {
-  /** Navigation list for menu */
-  navigationList = devNavigation();
   /** Application title */
   title = devApps().math.exceedanceExplorer.display;
+
+  constructor(public navService: NavigationService) {}
 }
diff --git a/projects/nshmp-apps/src/app/error-pages/404/404.component.html b/projects/nshmp-apps/src/app/error-pages/404/404.component.html
index 5ab9418f4835ff9faa78dfc35778e835076a5883..b438476bc6d11f3649f9f1f3325ecf07317906fa 100644
--- a/projects/nshmp-apps/src/app/error-pages/404/404.component.html
+++ b/projects/nshmp-apps/src/app/error-pages/404/404.component.html
@@ -1,5 +1,5 @@
 <nshmp-lib-ng-error-page
   title="404 Not Found"
   alertText="The page you requested was not found."
-  [navigationList]="navigationList"
+  [navigationList]="navService.navigationList()"
 />
diff --git a/projects/nshmp-apps/src/app/error-pages/404/404.component.spec.ts b/projects/nshmp-apps/src/app/error-pages/404/404.component.spec.ts
index 8c85b4f25ccf966a5402fb8807d4a38f197d72fb..304e4fb671410e3e71f63daad7e2c6a5a34e460f 100644
--- a/projects/nshmp-apps/src/app/error-pages/404/404.component.spec.ts
+++ b/projects/nshmp-apps/src/app/error-pages/404/404.component.spec.ts
@@ -1,3 +1,4 @@
+import {provideHttpClient} from '@angular/common/http';
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {provideNoopAnimations} from '@angular/platform-browser/animations';
 import {provideRouter} from '@angular/router';
@@ -11,7 +12,11 @@ describe('Error404Component', () => {
   beforeEach(async () => {
     await TestBed.configureTestingModule({
       imports: [Error404Component],
-      providers: [provideRouter([]), provideNoopAnimations()],
+      providers: [
+        provideRouter([]),
+        provideNoopAnimations(),
+        provideHttpClient(),
+      ],
     }).compileComponents();
   });
 
diff --git a/projects/nshmp-apps/src/app/error-pages/404/404.component.ts b/projects/nshmp-apps/src/app/error-pages/404/404.component.ts
index b3403afe3a96e7383f0cc3baf4dec2c3c864d6bf..2892d860e8160bf1084fd2ea237a6cc74970bc10 100644
--- a/projects/nshmp-apps/src/app/error-pages/404/404.component.ts
+++ b/projects/nshmp-apps/src/app/error-pages/404/404.component.ts
@@ -1,6 +1,6 @@
 import {Component} from '@angular/core';
 import {NshmpLibNgErrorPageComponent} from '@ghsc/nshmp-lib-ng/nshmp';
-import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 
 /**
  * Error page for any 404 errors.
@@ -14,7 +14,5 @@ import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils'
   templateUrl: './404.component.html',
 })
 export class Error404Component {
-  navigationList = navigation();
-
-  constructor() {}
+  constructor(public navService: NavigationService) {}
 }
diff --git a/projects/nshmp-apps/src/app/error-pages/410/410.component.html b/projects/nshmp-apps/src/app/error-pages/410/410.component.html
index 3b96436554fa621683a64107033e87a223c91a44..eff3d0d85f6b7e09d3e8029bf61335aec2ea6a77 100644
--- a/projects/nshmp-apps/src/app/error-pages/410/410.component.html
+++ b/projects/nshmp-apps/src/app/error-pages/410/410.component.html
@@ -1,5 +1,5 @@
 <nshmp-lib-ng-error-page
   title="410 Gone"
   alertText="The page you requested no longer exists."
-  [navigationList]="navigationList"
+  [navigationList]="navService.navigationList()"
 />
diff --git a/projects/nshmp-apps/src/app/error-pages/410/410.component.spec.ts b/projects/nshmp-apps/src/app/error-pages/410/410.component.spec.ts
index d765c32ef6c6915c177ed582d9a301fc204a50e2..587f0023e957bc8c71c299e8bf12559a7975c821 100644
--- a/projects/nshmp-apps/src/app/error-pages/410/410.component.spec.ts
+++ b/projects/nshmp-apps/src/app/error-pages/410/410.component.spec.ts
@@ -1,3 +1,4 @@
+import {provideHttpClient} from '@angular/common/http';
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {provideNoopAnimations} from '@angular/platform-browser/animations';
 import {provideRouter} from '@angular/router';
@@ -11,7 +12,11 @@ describe('Error410Component', () => {
   beforeEach(async () => {
     await TestBed.configureTestingModule({
       imports: [Error410Component],
-      providers: [provideRouter([]), provideNoopAnimations()],
+      providers: [
+        provideRouter([]),
+        provideNoopAnimations(),
+        provideHttpClient(),
+      ],
     }).compileComponents();
   });
 
diff --git a/projects/nshmp-apps/src/app/error-pages/410/410.component.ts b/projects/nshmp-apps/src/app/error-pages/410/410.component.ts
index 653e3cc6d98f1cf7d7e8a021ba1e308d4f0df732..5eb0ce9ef74b0ca47d57a6fce722c83543ee6a70 100644
--- a/projects/nshmp-apps/src/app/error-pages/410/410.component.ts
+++ b/projects/nshmp-apps/src/app/error-pages/410/410.component.ts
@@ -1,6 +1,6 @@
 import {Component} from '@angular/core';
 import {NshmpLibNgErrorPageComponent} from '@ghsc/nshmp-lib-ng/nshmp';
-import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 
 /**
  * Error page for any 410 errors.
@@ -14,7 +14,5 @@ import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils'
   templateUrl: './410.component.html',
 })
 export class Error410Component {
-  navigationList = navigation();
-
-  constructor() {}
+  constructor(public navService: NavigationService) {}
 }
diff --git a/projects/nshmp-apps/src/app/error-pages/500/500.component.html b/projects/nshmp-apps/src/app/error-pages/500/500.component.html
index e17fae2a9dee44ad1aae832e5910173eb72adfe6..b1dd7add9adbd169d178d10acb05d46fc769b28d 100644
--- a/projects/nshmp-apps/src/app/error-pages/500/500.component.html
+++ b/projects/nshmp-apps/src/app/error-pages/500/500.component.html
@@ -1,5 +1,5 @@
 <nshmp-lib-ng-error-page
   title="500 Internal Server Error"
   alertText="The page you requested is temporarily unavailable."
-  [navigationList]="navigationList"
+  [navigationList]="navService.navigationList()"
 />
diff --git a/projects/nshmp-apps/src/app/error-pages/500/500.component.spec.ts b/projects/nshmp-apps/src/app/error-pages/500/500.component.spec.ts
index 2512b8b74da5d78654bc32dc79fedefd8708e7f9..11cf4190e13ef2ddd15bccd5e74e70019c26d2a0 100644
--- a/projects/nshmp-apps/src/app/error-pages/500/500.component.spec.ts
+++ b/projects/nshmp-apps/src/app/error-pages/500/500.component.spec.ts
@@ -1,3 +1,4 @@
+import {provideHttpClient} from '@angular/common/http';
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {provideNoopAnimations} from '@angular/platform-browser/animations';
 import {provideRouter} from '@angular/router';
@@ -11,7 +12,11 @@ describe('Error500Component', () => {
   beforeEach(async () => {
     await TestBed.configureTestingModule({
       imports: [Error500Component],
-      providers: [provideRouter([]), provideNoopAnimations()],
+      providers: [
+        provideRouter([]),
+        provideNoopAnimations(),
+        provideHttpClient(),
+      ],
     }).compileComponents();
   });
 
diff --git a/projects/nshmp-apps/src/app/error-pages/500/500.component.ts b/projects/nshmp-apps/src/app/error-pages/500/500.component.ts
index 2bdad2ef0557f058dc81a1c7641b343b53305a2d..2f4398d71dbbfb1128e6b0b06d485ba49f9a54aa 100644
--- a/projects/nshmp-apps/src/app/error-pages/500/500.component.ts
+++ b/projects/nshmp-apps/src/app/error-pages/500/500.component.ts
@@ -1,6 +1,6 @@
 import {Component} from '@angular/core';
 import {NshmpLibNgErrorPageComponent} from '@ghsc/nshmp-lib-ng/nshmp';
-import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 
 /**
  * Error page for any 500 errors.
@@ -14,7 +14,5 @@ import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils'
   templateUrl: './500.component.html',
 })
 export class Error500Component {
-  navigationList = navigation();
-
-  constructor() {}
+  constructor(public navService: NavigationService) {}
 }
diff --git a/projects/nshmp-apps/src/app/gmm/dashboard/app.component.html b/projects/nshmp-apps/src/app/gmm/dashboard/app.component.html
index 8304e735c9efad2e6fda278dfbc55b389ac80cc9..402f91c4afe8f343bdcb2b3d51935e926d9fb346 100644
--- a/projects/nshmp-apps/src/app/gmm/dashboard/app.component.html
+++ b/projects/nshmp-apps/src/app/gmm/dashboard/app.component.html
@@ -1,6 +1,6 @@
 <nshmp-lib-ng-template
   #template
-  [navigationList]="navigationList"
+  [navigationList]="navService.navigationList()"
   [title]="title"
 >
   <!-- Dashboard -->
diff --git a/projects/nshmp-apps/src/app/gmm/dashboard/app.component.ts b/projects/nshmp-apps/src/app/gmm/dashboard/app.component.ts
index d9904965c0b3e2dca90064d76aa2bd3fbee49280..b798e9f401867200bddd422101d73b70993fad81 100644
--- a/projects/nshmp-apps/src/app/gmm/dashboard/app.component.ts
+++ b/projects/nshmp-apps/src/app/gmm/dashboard/app.component.ts
@@ -10,10 +10,7 @@ import {
   NshmpLibNgDashboardTitleComponent,
   NshmpLibNgTemplateComponent,
 } from '@ghsc/nshmp-lib-ng/nshmp';
-import {
-  gmmApps,
-  navigation,
-} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 
 @Component({
   imports: [
@@ -29,9 +26,6 @@ import {
   templateUrl: './app.component.html',
 })
 export class AppComponent {
-  /** Navigation list for menu */
-  navigationList = navigation();
-
   title = 'GMM Applications';
 
   sections: ApplicationSections[] = [
@@ -39,10 +33,14 @@ export class AppComponent {
       gridClass: 'grid-col-10',
       sections: [
         {
-          applications: gmmApps().map(navigation => ({navigation})),
+          applications: this.navService
+            .gmmApps()
+            .map(navigation => ({navigation})),
           gridClass: 'grid-col-12 tablet-lg:grid-col-8 grid-offset-1',
         },
       ],
     },
   ];
+
+  constructor(public navService: NavigationService) {}
 }
diff --git a/projects/nshmp-apps/src/app/gmm/distance/app.component.html b/projects/nshmp-apps/src/app/gmm/distance/app.component.html
index 464fe56b0043d779f6b76cc773592bb909e855df..792c00dffb6295091a57bdb337e8a64fa9db3101 100644
--- a/projects/nshmp-apps/src/app/gmm/distance/app.component.html
+++ b/projects/nshmp-apps/src/app/gmm/distance/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.navigationList()"
+  [title]="title"
+>
   <nshmp-template-content-container>
     <nshmp-template-control-panel>
       <app-control-panel />
diff --git a/projects/nshmp-apps/src/app/gmm/distance/app.component.ts b/projects/nshmp-apps/src/app/gmm/distance/app.component.ts
index 92ff39db7b83e61306b4a9aba84c0a3e48cce1d3..d8cf4e6792f8b606b8f7c94c94fa686534f50779 100644
--- a/projects/nshmp-apps/src/app/gmm/distance/app.component.ts
+++ b/projects/nshmp-apps/src/app/gmm/distance/app.component.ts
@@ -7,8 +7,8 @@ import {
   NshmpTemplateMainContentComponent,
   NshmpTemplateSettingsComponent,
 } from '@ghsc/nshmp-template';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ContentComponent} from './components/content/content.component';
@@ -41,12 +41,13 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Navigation list for menu */
-  navigationList = navigation();
   /** Application title */
   title = apps().gmm.distance.display;
 
-  constructor(public service: AppService) {}
+  constructor(
+    public service: AppService,
+    public navService: NavigationService,
+  ) {}
 
   ngOnInit() {
     this.service.init();
diff --git a/projects/nshmp-apps/src/app/gmm/magnitude/app.component.html b/projects/nshmp-apps/src/app/gmm/magnitude/app.component.html
index 464fe56b0043d779f6b76cc773592bb909e855df..792c00dffb6295091a57bdb337e8a64fa9db3101 100644
--- a/projects/nshmp-apps/src/app/gmm/magnitude/app.component.html
+++ b/projects/nshmp-apps/src/app/gmm/magnitude/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.navigationList()"
+  [title]="title"
+>
   <nshmp-template-content-container>
     <nshmp-template-control-panel>
       <app-control-panel />
diff --git a/projects/nshmp-apps/src/app/gmm/magnitude/app.component.ts b/projects/nshmp-apps/src/app/gmm/magnitude/app.component.ts
index 1d80636ca79111cd32e01f4b04350a7ed4deed28..24916169c5d0b288116fbf45a02e667a295d705d 100644
--- a/projects/nshmp-apps/src/app/gmm/magnitude/app.component.ts
+++ b/projects/nshmp-apps/src/app/gmm/magnitude/app.component.ts
@@ -7,8 +7,8 @@ import {
   NshmpTemplateMainContentComponent,
   NshmpTemplateSettingsComponent,
 } from '@ghsc/nshmp-template';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ContentComponent} from './components/content/content.component';
@@ -41,12 +41,13 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Navigation list for menu */
-  navigationList = navigation();
   /** Application title */
   title = apps().gmm.magnitude.display;
 
-  constructor(public service: AppService) {}
+  constructor(
+    public service: AppService,
+    public navService: NavigationService,
+  ) {}
 
   ngOnInit(): void {
     this.service.init();
diff --git a/projects/nshmp-apps/src/app/gmm/spectra/app.component.html b/projects/nshmp-apps/src/app/gmm/spectra/app.component.html
index 464fe56b0043d779f6b76cc773592bb909e855df..792c00dffb6295091a57bdb337e8a64fa9db3101 100644
--- a/projects/nshmp-apps/src/app/gmm/spectra/app.component.html
+++ b/projects/nshmp-apps/src/app/gmm/spectra/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.navigationList()"
+  [title]="title"
+>
   <nshmp-template-content-container>
     <nshmp-template-control-panel>
       <app-control-panel />
diff --git a/projects/nshmp-apps/src/app/gmm/spectra/app.component.ts b/projects/nshmp-apps/src/app/gmm/spectra/app.component.ts
index ed3a8c451eb59a684cedfa2fb96870b14cc110fa..d9ef907d27453c5ce2a98be133315bdb98ea69d9 100644
--- a/projects/nshmp-apps/src/app/gmm/spectra/app.component.ts
+++ b/projects/nshmp-apps/src/app/gmm/spectra/app.component.ts
@@ -7,8 +7,8 @@ import {
   NshmpTemplateMainContentComponent,
   NshmpTemplateSettingsComponent,
 } from '@ghsc/nshmp-template';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ContentComponent} from './components/content/content.component';
@@ -41,12 +41,13 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Navigation list for menu */
-  navigationList = navigation();
   /** Application title */
   title = apps().gmm.spectra.display;
 
-  constructor(public service: AppService) {}
+  constructor(
+    public service: AppService,
+    public navService: NavigationService,
+  ) {}
 
   ngOnInit(): void {
     this.service.init();
diff --git a/projects/nshmp-apps/src/app/hazard/dashboard/app.component.html b/projects/nshmp-apps/src/app/hazard/dashboard/app.component.html
index baf20fa7d7e1851fa7544e30408c2cfea6af35d9..ac886b81bc56dce817a0eb16996356f0d0e2262c 100644
--- a/projects/nshmp-apps/src/app/hazard/dashboard/app.component.html
+++ b/projects/nshmp-apps/src/app/hazard/dashboard/app.component.html
@@ -1,6 +1,6 @@
 <nshmp-lib-ng-template
   #template
-  [navigationList]="navigationList"
+  [navigationList]="navService.navigationList()"
   [title]="title"
 >
   <!-- Dashboard -->
diff --git a/projects/nshmp-apps/src/app/hazard/dashboard/app.component.ts b/projects/nshmp-apps/src/app/hazard/dashboard/app.component.ts
index 03b0d8eb1d6c077f72c2cdf833b2db73d14438a1..f9999d8a32c952c2e33d361cd93a112d4cf0d8e6 100644
--- a/projects/nshmp-apps/src/app/hazard/dashboard/app.component.ts
+++ b/projects/nshmp-apps/src/app/hazard/dashboard/app.component.ts
@@ -10,10 +10,7 @@ import {
   NshmpLibNgDashboardTitleComponent,
   NshmpLibNgTemplateComponent,
 } from '@ghsc/nshmp-lib-ng/nshmp';
-import {
-  hazardApps,
-  navigation,
-} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 
 @Component({
   imports: [
@@ -29,9 +26,6 @@ import {
   templateUrl: './app.component.html',
 })
 export class AppComponent {
-  /** Navigation list for menu */
-  navigationList = navigation();
-
   title = 'Hazard Applications';
 
   sections: ApplicationSections[] = [
@@ -39,10 +33,14 @@ export class AppComponent {
       gridClass: 'grid-col-10',
       sections: [
         {
-          applications: hazardApps().map(navigation => ({navigation})),
+          applications: this.navService
+            .hazardApps()
+            .map(navigation => ({navigation})),
           gridClass: 'grid-col-12 tablet-lg:grid-col-8 grid-offset-1',
         },
       ],
     },
   ];
+
+  constructor(public navService: NavigationService) {}
 }
diff --git a/projects/nshmp-apps/src/app/hazard/disagg/app.component.html b/projects/nshmp-apps/src/app/hazard/disagg/app.component.html
index 031a569dcc8235d244db025ec139ed32e7ec914d..058bb0ae7eb65cd9f1033a5e164321d6865df63f 100644
--- a/projects/nshmp-apps/src/app/hazard/disagg/app.component.html
+++ b/projects/nshmp-apps/src/app/hazard/disagg/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.navigationList()"
+  [title]="title"
+>
   <nshmp-template-content-container [showSettingsPanel]="false">
     <nshmp-template-control-panel>
       <app-control-panel />
diff --git a/projects/nshmp-apps/src/app/hazard/disagg/app.component.ts b/projects/nshmp-apps/src/app/hazard/disagg/app.component.ts
index 8b970cb29fafb196c6b0a2c935432769cd5b2dd9..a4f0f59640e4df8a1b70820cc052d8df1cea6923 100644
--- a/projects/nshmp-apps/src/app/hazard/disagg/app.component.ts
+++ b/projects/nshmp-apps/src/app/hazard/disagg/app.component.ts
@@ -7,8 +7,8 @@ import {
   NshmpTemplateControlPanelComponent,
   NshmpTemplateMainContentComponent,
 } from '@ghsc/nshmp-template';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ContentComponent} from './components/content/content.component';
@@ -35,12 +35,13 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Navigation list for menu */
-  navigationList = navigation();
   /** Application title */
   title = apps().hazard.disagg.display;
 
-  constructor(public service: AppService) {}
+  constructor(
+    public service: AppService,
+    public navService: NavigationService,
+  ) {}
 
   ngOnInit(): void {
     this.service.init();
diff --git a/projects/nshmp-apps/src/app/hazard/dynamic/app.component.html b/projects/nshmp-apps/src/app/hazard/dynamic/app.component.html
index b7c70d9bdd1656521be13d513dcf150766718885..e78a5ee9dfc383c5acbebff78d0ccb0d4357a072 100644
--- a/projects/nshmp-apps/src/app/hazard/dynamic/app.component.html
+++ b/projects/nshmp-apps/src/app/hazard/dynamic/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.navigationList()"
+  [title]="title"
+>
   <nshmp-template-content-container>
     <nshmp-template-control-panel>
       <app-control-panel />
diff --git a/projects/nshmp-apps/src/app/hazard/dynamic/app.component.ts b/projects/nshmp-apps/src/app/hazard/dynamic/app.component.ts
index b1ea4cd94a8be405acdf6edccd9f69898fc3d22c..7b9c6e747b9addc118be5d5c9ba046683f8d0b60 100644
--- a/projects/nshmp-apps/src/app/hazard/dynamic/app.component.ts
+++ b/projects/nshmp-apps/src/app/hazard/dynamic/app.component.ts
@@ -8,8 +8,8 @@ import {
   NshmpTemplateMainContentComponent,
   NshmpTemplateSettingsComponent,
 } from '@ghsc/nshmp-template';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ContentComponent} from './components/content/content.component';
@@ -39,12 +39,13 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Navigation list for menu */
-  navigationList = navigation();
   /** Application title */
   title = apps().hazard.dynamic.display;
 
-  constructor(public service: AppService) {}
+  constructor(
+    public service: AppService,
+    public navService: NavigationService,
+  ) {}
 
   ngOnInit(): void {
     this.service.init();
diff --git a/projects/nshmp-apps/src/app/hazard/static/app.component.html b/projects/nshmp-apps/src/app/hazard/static/app.component.html
index 464fe56b0043d779f6b76cc773592bb909e855df..792c00dffb6295091a57bdb337e8a64fa9db3101 100644
--- a/projects/nshmp-apps/src/app/hazard/static/app.component.html
+++ b/projects/nshmp-apps/src/app/hazard/static/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.navigationList()"
+  [title]="title"
+>
   <nshmp-template-content-container>
     <nshmp-template-control-panel>
       <app-control-panel />
diff --git a/projects/nshmp-apps/src/app/hazard/static/app.component.ts b/projects/nshmp-apps/src/app/hazard/static/app.component.ts
index 903650eabe7f2cd25ffd0b2ae6be5371d55dc163..de2f424e91165e503a5ed8729ffb0363fe7a32d2 100644
--- a/projects/nshmp-apps/src/app/hazard/static/app.component.ts
+++ b/projects/nshmp-apps/src/app/hazard/static/app.component.ts
@@ -7,8 +7,8 @@ import {
   NshmpTemplateMainContentComponent,
   NshmpTemplateSettingsComponent,
 } from '@ghsc/nshmp-template';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ContentComponent} from './components/content/content.component';
@@ -37,12 +37,13 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Navigation list for menu */
-  navigationList = navigation();
   /** Application title */
   title = apps().hazard.static.display;
 
-  constructor(private service: AppService) {}
+  constructor(
+    private service: AppService,
+    public navService: NavigationService,
+  ) {}
 
   ngOnInit() {
     this.service.init();
diff --git a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/app.component.html b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/app.component.html
index e3c04045a61d0743d3e5b05fca4d3af95d27ebd6..c4dd32052797f41f3d07a27d60a809a0e71a8d2f 100644
--- a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/app.component.html
+++ b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.internalNavigation()"
+  [title]="title"
+>
   <nshmp-template-content-container [showSettingsPanel]="false">
     <nshmp-template-control-panel>
       <app-control-panel />
diff --git a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/app.component.ts b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/app.component.ts
index 3c9c639c23497902b6209fc75665385c970fef01..636500f8c5fcbd3f59e29c0ffd80a491f2a527dd 100644
--- a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/app.component.ts
+++ b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/app.component.ts
@@ -6,8 +6,8 @@ import {
   NshmpTemplateControlPanelComponent,
   NshmpTemplateMainContentComponent,
 } from '@ghsc/nshmp-template';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {internalApps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {internalNavigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ContentComponent} from './components/content/content.component';
@@ -38,12 +38,13 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Navigation list for menu */
-  navigationList = internalNavigation();
   /** Application title */
   title = internalApps().aws.checkHazJobs.display;
 
-  constructor(private service: AppService) {}
+  constructor(
+    private service: AppService,
+    public navService: NavigationService,
+  ) {}
 
   ngOnInit() {
     this.service.init();
diff --git a/projects/nshmp-apps/src/app/internal/aws/dashboard/app.component.html b/projects/nshmp-apps/src/app/internal/aws/dashboard/app.component.html
index d8f47ed31380dce4a26be2450f95b20328625dd0..06099039d5cf65f9715b8fd972dbe2e697e82eb7 100644
--- a/projects/nshmp-apps/src/app/internal/aws/dashboard/app.component.html
+++ b/projects/nshmp-apps/src/app/internal/aws/dashboard/app.component.html
@@ -1,4 +1,8 @@
-<nshmp-lib-ng-template #template [navigationList]="navigationList" [title]="">
+<nshmp-lib-ng-template
+  #template
+  [navigationList]="navService.internalNavigation()"
+  [title]=""
+>
   <!-- Dashboard -->
   <nshmp-lib-ng-dashboard [sections]="sections">
     <nshmp-lib-ng-dashboard-title>
diff --git a/projects/nshmp-apps/src/app/internal/aws/dashboard/app.component.ts b/projects/nshmp-apps/src/app/internal/aws/dashboard/app.component.ts
index c1faedc1f42dead76eb634b38d2a4f7b66cfe0a8..1c45918b52fc4e04059771af96265715fe3a27fe 100644
--- a/projects/nshmp-apps/src/app/internal/aws/dashboard/app.component.ts
+++ b/projects/nshmp-apps/src/app/internal/aws/dashboard/app.component.ts
@@ -10,10 +10,7 @@ import {
   NshmpLibNgDashboardTitleComponent,
   NshmpLibNgTemplateComponent,
 } from '@ghsc/nshmp-lib-ng/nshmp';
-import {
-  internalAwsApps,
-  internalNavigation,
-} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 
 @Component({
   imports: [
@@ -29,18 +26,19 @@ import {
   templateUrl: './app.component.html',
 })
 export class AppComponent {
-  /** Navigation list for menu */
-  navigationList = internalNavigation();
-
   sections: ApplicationSections[] = [
     {
       gridClass: 'grid-col-10',
       sections: [
         {
-          applications: internalAwsApps().map(navigation => ({navigation})),
+          applications: this.navService
+            .internalAwsApps()
+            .map(navigation => ({navigation})),
           gridClass: 'grid-col-12 tablet-lg:grid-col-8 grid-offset-1',
         },
       ],
     },
   ];
+
+  constructor(public navService: NavigationService) {}
 }
diff --git a/projects/nshmp-apps/src/app/internal/aws/haz-job-history/app.component.html b/projects/nshmp-apps/src/app/internal/aws/haz-job-history/app.component.html
index e3c04045a61d0743d3e5b05fca4d3af95d27ebd6..c4dd32052797f41f3d07a27d60a809a0e71a8d2f 100644
--- a/projects/nshmp-apps/src/app/internal/aws/haz-job-history/app.component.html
+++ b/projects/nshmp-apps/src/app/internal/aws/haz-job-history/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.internalNavigation()"
+  [title]="title"
+>
   <nshmp-template-content-container [showSettingsPanel]="false">
     <nshmp-template-control-panel>
       <app-control-panel />
diff --git a/projects/nshmp-apps/src/app/internal/aws/haz-job-history/app.component.ts b/projects/nshmp-apps/src/app/internal/aws/haz-job-history/app.component.ts
index c40822124fd026bf96868bc665a7acd24ce7fa87..da1a55da957d057a27ee2291a55fc6c9657c6aae 100644
--- a/projects/nshmp-apps/src/app/internal/aws/haz-job-history/app.component.ts
+++ b/projects/nshmp-apps/src/app/internal/aws/haz-job-history/app.component.ts
@@ -6,8 +6,8 @@ import {
   NshmpTemplateControlPanelComponent,
   NshmpTemplateMainContentComponent,
 } from '@ghsc/nshmp-template';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {internalApps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {internalNavigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ContentComponent} from './components/content/content.component';
@@ -36,12 +36,13 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Navigation list for menu */
-  navigationList = internalNavigation();
   /** Application title */
   title = internalApps().aws.hazJobHistory.display;
 
-  constructor(private service: AppService) {}
+  constructor(
+    private service: AppService,
+    public navService: NavigationService,
+  ) {}
 
   ngOnInit(): void {
     this.service.init();
diff --git a/projects/nshmp-apps/src/app/internal/aws/submit-haz-jobs/app.component.html b/projects/nshmp-apps/src/app/internal/aws/submit-haz-jobs/app.component.html
index 5a47eabf755c6ef634ae93de43eeb6d68fab3d6f..75c651b8cf6011bc9e29f02db3b37f2acbe8bf0f 100644
--- a/projects/nshmp-apps/src/app/internal/aws/submit-haz-jobs/app.component.html
+++ b/projects/nshmp-apps/src/app/internal/aws/submit-haz-jobs/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.internalNavigation()"
+  [title]="title"
+>
   <div class="app-content height-full">
     <app-content />
   </div>
diff --git a/projects/nshmp-apps/src/app/internal/aws/submit-haz-jobs/app.component.ts b/projects/nshmp-apps/src/app/internal/aws/submit-haz-jobs/app.component.ts
index c2149b8b0830db9f0d112f873c637a10a5b983e1..1224e8dd3b8871a13b7e870efa7535c32641e58a 100644
--- a/projects/nshmp-apps/src/app/internal/aws/submit-haz-jobs/app.component.ts
+++ b/projects/nshmp-apps/src/app/internal/aws/submit-haz-jobs/app.component.ts
@@ -1,8 +1,8 @@
 import {Component, OnInit} from '@angular/core';
 import {NshmpLibNgAboutPageComponent} from '@ghsc/nshmp-lib-ng/about';
 import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {internalApps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {internalNavigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ContentComponent} from './components/content/content.component';
@@ -27,12 +27,13 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Navigation list for menu */
-  navigationList = internalNavigation();
   /** Application title */
   title = internalApps().aws.submitHazJobs.display;
 
-  constructor(private service: AppService) {}
+  constructor(
+    private service: AppService,
+    public navService: NavigationService,
+  ) {}
 
   ngOnInit(): void {
     this.service.getNshmTag();
diff --git a/projects/nshmp-apps/src/app/internal/aws/terminate-haz-jobs/app.component.html b/projects/nshmp-apps/src/app/internal/aws/terminate-haz-jobs/app.component.html
index 55a846566dc84295714ad50be4f6e7a6f8c9a4a9..751979d57d28a39a4dbcf6585c97c8906e73befe 100644
--- a/projects/nshmp-apps/src/app/internal/aws/terminate-haz-jobs/app.component.html
+++ b/projects/nshmp-apps/src/app/internal/aws/terminate-haz-jobs/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.internalNavigation()"
+  [title]="title"
+>
   <div class="app-content">
     <app-content />
   </div>
diff --git a/projects/nshmp-apps/src/app/internal/aws/terminate-haz-jobs/app.component.ts b/projects/nshmp-apps/src/app/internal/aws/terminate-haz-jobs/app.component.ts
index c0d540ae65ae277e7dc3eaa83382386c4cbe75b4..340d11cb77f80444882e46dd4f201dd55e8153c4 100644
--- a/projects/nshmp-apps/src/app/internal/aws/terminate-haz-jobs/app.component.ts
+++ b/projects/nshmp-apps/src/app/internal/aws/terminate-haz-jobs/app.component.ts
@@ -1,8 +1,8 @@
 import {Component, OnInit} from '@angular/core';
 import {NshmpLibNgAboutPageComponent} from '@ghsc/nshmp-lib-ng/about';
 import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {internalApps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {internalNavigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ContentComponent} from './components/content/content.component';
@@ -27,12 +27,13 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Navigation list for menu */
-  navigationList = internalNavigation();
   /** Application title */
   title = internalApps().aws.terminateHazJobs.display;
 
-  constructor(private service: AppService) {}
+  constructor(
+    private service: AppService,
+    public navService: NavigationService,
+  ) {}
 
   ngOnInit(): void {
     this.service.init();
diff --git a/projects/nshmp-apps/src/app/internal/dashboard/app.component.html b/projects/nshmp-apps/src/app/internal/dashboard/app.component.html
index d4913aec9b7c6b09797294e403ac861688972075..75a1f4171e1d99be1b2e77a7000d4c3755af9406 100644
--- a/projects/nshmp-apps/src/app/internal/dashboard/app.component.html
+++ b/projects/nshmp-apps/src/app/internal/dashboard/app.component.html
@@ -1,6 +1,6 @@
 <nshmp-lib-ng-template
   #template
-  [navigationList]="navigationList"
+  [navigationList]="navService.internalNavigation()"
   [title]="title"
 >
   <!-- Dashboard -->
diff --git a/projects/nshmp-apps/src/app/internal/dashboard/app.component.ts b/projects/nshmp-apps/src/app/internal/dashboard/app.component.ts
index 2158f3deb50f2da73d27cba61081559e31371d31..19ed6247375013830dac272cc891c5a6ef5b8177 100644
--- a/projects/nshmp-apps/src/app/internal/dashboard/app.component.ts
+++ b/projects/nshmp-apps/src/app/internal/dashboard/app.component.ts
@@ -10,10 +10,10 @@ import {
   NshmpLibNgDashboardTitleComponent,
   NshmpLibNgTemplateComponent,
 } from '@ghsc/nshmp-lib-ng/nshmp';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {Subscription} from 'rxjs';
 
-import * as nav from '../../../shared/utils/navigation.utils';
-import {AuthService} from '../shared/services/auth.service';
+import {AuthService} from '../../../shared/services/auth.service';
 
 /**
  * Development dashboard showing links to development applications.
@@ -32,19 +32,16 @@ import {AuthService} from '../shared/services/auth.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit, OnDestroy {
-  /** Navigation list for menu */
-  navigationList = nav.internalNavigation();
-
   title = 'Internal Applications';
 
-  /** AWS applications */
-  private awsApps = nav.internalAwsApps();
-
   sections: ApplicationSections[] = [];
 
   private sub: Subscription;
 
-  constructor(private authService: AuthService) {}
+  constructor(
+    public navService: NavigationService,
+    private authService: AuthService,
+  ) {}
 
   ngOnInit(): void {
     this.sub = this.authService.isAuthorized().subscribe(() => {
@@ -52,7 +49,9 @@ export class AppComponent implements OnInit, OnDestroy {
         {
           sections: [
             {
-              applications: this.awsApps.map(navigation => ({navigation})),
+              applications: this.navService
+                .internalAwsApps()
+                .map(navigation => ({navigation})),
             },
           ],
         },
diff --git a/projects/nshmp-apps/src/app/internal/internal.routes.ts b/projects/nshmp-apps/src/app/internal/internal.routes.ts
index 899ea06cf0fc507fafd73d8e3e42a30beee0d525..ebc76efb3149892460d1895a09ffdb06d514c71a 100644
--- a/projects/nshmp-apps/src/app/internal/internal.routes.ts
+++ b/projects/nshmp-apps/src/app/internal/internal.routes.ts
@@ -1,7 +1,7 @@
 import {Routes} from '@angular/router';
 
+import {networkGuard} from '../../shared/guards/network.guard';
 import {devAwsRoutes} from './aws/aws.routes';
-import {networkGuard} from './shared/guards/network.guard';
 
 /**
  * Internal application routes.
diff --git a/projects/nshmp-apps/src/app/ncm/dashboard/app.component.html b/projects/nshmp-apps/src/app/ncm/dashboard/app.component.html
index 4e34e88b86eb7095b3b97fc1105734698ebbd187..d4bfaae7668805461a5dfb2adef75b3d9a190e0f 100644
--- a/projects/nshmp-apps/src/app/ncm/dashboard/app.component.html
+++ b/projects/nshmp-apps/src/app/ncm/dashboard/app.component.html
@@ -1,6 +1,6 @@
 <nshmp-lib-ng-template
   #template
-  [navigationList]="navigationList"
+  [navigationList]="navService.navigationList()"
   [title]="title"
 >
   <!-- Dashboard -->
diff --git a/projects/nshmp-apps/src/app/ncm/dashboard/app.component.ts b/projects/nshmp-apps/src/app/ncm/dashboard/app.component.ts
index 8faa370cb5bab484e9f8bdff8318547c0b83dc74..19a36749d22b6e1851119244d8b20d24c058b6fe 100644
--- a/projects/nshmp-apps/src/app/ncm/dashboard/app.component.ts
+++ b/projects/nshmp-apps/src/app/ncm/dashboard/app.component.ts
@@ -10,10 +10,7 @@ import {
   NshmpLibNgDashboardTitleComponent,
   NshmpLibNgTemplateComponent,
 } from '@ghsc/nshmp-lib-ng/nshmp';
-import {
-  navigation,
-  ncmApps,
-} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 
 @Component({
   imports: [
@@ -29,9 +26,6 @@ import {
   templateUrl: './app.component.html',
 })
 export class AppComponent {
-  /** Navigation list for menu */
-  navigationList = navigation();
-
   title = 'NCM Applications';
 
   sections: ApplicationSections[] = [
@@ -39,10 +33,14 @@ export class AppComponent {
       gridClass: 'grid-col-10',
       sections: [
         {
-          applications: ncmApps().map(navigation => ({navigation})),
+          applications: this.navService
+            .ncmApps()
+            .map(navigation => ({navigation})),
           gridClass: 'grid-col-12 tablet-lg:grid-col-8 grid-offset-1',
         },
       ],
     },
   ];
+
+  constructor(public navService: NavigationService) {}
 }
diff --git a/projects/nshmp-apps/src/app/ncm/geophysical-profiles/app.component.html b/projects/nshmp-apps/src/app/ncm/geophysical-profiles/app.component.html
index 3f2a7bef6075f20daf89a70e6fd188a2bffde42f..02e1d8c0b4c1d68b2031206c18266cb183ac4e2b 100644
--- a/projects/nshmp-apps/src/app/ncm/geophysical-profiles/app.component.html
+++ b/projects/nshmp-apps/src/app/ncm/geophysical-profiles/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.navigationList()"
+  [title]="title"
+>
   <nshmp-template-content-container>
     <nshmp-template-control-panel>
       <app-control-panel />
diff --git a/projects/nshmp-apps/src/app/ncm/geophysical-profiles/app.component.ts b/projects/nshmp-apps/src/app/ncm/geophysical-profiles/app.component.ts
index c1327eec073f7986e907c92e2c080bc948d183b1..cff11e6005fea1bb5002b273d5f6d045bd5377e6 100644
--- a/projects/nshmp-apps/src/app/ncm/geophysical-profiles/app.component.ts
+++ b/projects/nshmp-apps/src/app/ncm/geophysical-profiles/app.component.ts
@@ -7,8 +7,8 @@ import {
   NshmpTemplateMainContentComponent,
   NshmpTemplateSettingsComponent,
 } from '@ghsc/nshmp-template';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ContentComponent} from './components/content/content.component';
@@ -34,13 +34,13 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Navigation list for menu */
-  navigationList = navigation();
-
   /** Application title */
   title = apps().ncm.geophysicalProfiles.display;
 
-  constructor(private service: AppService) {}
+  constructor(
+    private service: AppService,
+    public navService: NavigationService,
+  ) {}
 
   ngOnInit(): void {
     this.service.init();
diff --git a/projects/nshmp-apps/src/app/source/dashboard/app.component.html b/projects/nshmp-apps/src/app/source/dashboard/app.component.html
index be11ff361a9ab2f34561830996cf0a2602c8f29f..4246673997aa28bec9f0132f0046c36eab6ac6c2 100644
--- a/projects/nshmp-apps/src/app/source/dashboard/app.component.html
+++ b/projects/nshmp-apps/src/app/source/dashboard/app.component.html
@@ -1,6 +1,6 @@
 <nshmp-lib-ng-template
   #template
-  [navigationList]="navigationList"
+  [navigationList]="navService.navigationList()"
   [title]="title"
 >
   <!-- Dashboard -->
diff --git a/projects/nshmp-apps/src/app/source/dashboard/app.component.ts b/projects/nshmp-apps/src/app/source/dashboard/app.component.ts
index 8c9fda7c6f932a3e3424428df07e510ceea6b7b2..aa77e86d06a5a7864cecff6833acf23fcca31818 100644
--- a/projects/nshmp-apps/src/app/source/dashboard/app.component.ts
+++ b/projects/nshmp-apps/src/app/source/dashboard/app.component.ts
@@ -10,10 +10,7 @@ import {
   NshmpLibNgDashboardTitleComponent,
   NshmpLibNgTemplateComponent,
 } from '@ghsc/nshmp-lib-ng/nshmp';
-import {
-  navigation,
-  sourceModelApps,
-} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 
 @Component({
   imports: [
@@ -29,9 +26,6 @@ import {
   templateUrl: './app.component.html',
 })
 export class AppComponent {
-  /** Navigation list for menu */
-  navigationList = navigation();
-
   title = 'Source Model Applications';
 
   sections: ApplicationSections[] = [
@@ -39,10 +33,14 @@ export class AppComponent {
       gridClass: 'grid-col-10',
       sections: [
         {
-          applications: sourceModelApps().map(navigation => ({navigation})),
+          applications: this.navService
+            .sourceModelApps()
+            .map(navigation => ({navigation})),
           gridClass: 'grid-col-12 tablet-lg:grid-col-8 grid-offset-1',
         },
       ],
     },
   ];
+
+  constructor(public navService: NavigationService) {}
 }
diff --git a/projects/nshmp-apps/src/app/source/mfd/app.component.html b/projects/nshmp-apps/src/app/source/mfd/app.component.html
index b7c70d9bdd1656521be13d513dcf150766718885..e78a5ee9dfc383c5acbebff78d0ccb0d4357a072 100644
--- a/projects/nshmp-apps/src/app/source/mfd/app.component.html
+++ b/projects/nshmp-apps/src/app/source/mfd/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.navigationList()"
+  [title]="title"
+>
   <nshmp-template-content-container>
     <nshmp-template-control-panel>
       <app-control-panel />
diff --git a/projects/nshmp-apps/src/app/source/mfd/app.component.ts b/projects/nshmp-apps/src/app/source/mfd/app.component.ts
index 509376c6dcab573ffda677a60244ea08e774bf86..1743891d7075f86394f9f6d71df2ea20ffcf73bb 100644
--- a/projects/nshmp-apps/src/app/source/mfd/app.component.ts
+++ b/projects/nshmp-apps/src/app/source/mfd/app.component.ts
@@ -9,8 +9,8 @@ import {
   NshmpTemplateService,
   NshmpTemplateSettingsComponent,
 } from '@ghsc/nshmp-template';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ContentComponent} from './components/content/content.component';
@@ -43,14 +43,13 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Navigation list for menu */
-  navigationList = navigation();
   /** Application title */
   title = apps().source.mfd.display;
 
   constructor(
     public nshmpTemplateService: NshmpTemplateService,
     public service: AppService,
+    public navService: NavigationService,
   ) {}
 
   ngOnInit(): void {
diff --git a/projects/nshmp-apps/src/app/source/model-maps/app.component.html b/projects/nshmp-apps/src/app/source/model-maps/app.component.html
index 85fc7ab01a23544fb1e0a84c56625d222f96a4c1..a133f12e59a2e89fc223ab706d051df1d3037d22 100644
--- a/projects/nshmp-apps/src/app/source/model-maps/app.component.html
+++ b/projects/nshmp-apps/src/app/source/model-maps/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.navigationList()"
+  [title]="title"
+>
   <nshmp-template-content-container>
     <nshmp-template-control-panel>
       <app-control-panel />
diff --git a/projects/nshmp-apps/src/app/source/model-maps/app.component.ts b/projects/nshmp-apps/src/app/source/model-maps/app.component.ts
index 8e75d6ec50b6c63c2eec7d67a96b9827351464c4..fdf1122c021da7486f94721e0b966ff03acdd108 100644
--- a/projects/nshmp-apps/src/app/source/model-maps/app.component.ts
+++ b/projects/nshmp-apps/src/app/source/model-maps/app.component.ts
@@ -9,9 +9,8 @@ import {
   NshmpTemplateMainContentComponent,
   NshmpTemplateSettingsComponent,
 } from '@ghsc/nshmp-template';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
-import {Subscription} from 'rxjs';
 
 import {AboutComponent} from './components/about/about.component';
 import {ControlPanelComponent} from './components/control-panel/control-panel.component';
@@ -48,15 +47,12 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Subscirption on controls change */
-  controlsSubscription: Subscription;
-  /** Navigation list for meny */
-  navigationList = navigation();
   /** Application title */
   title = apps().source.data.display;
 
   constructor(
     public service: AppService,
+    public navService: NavigationService,
     private headerService: HeaderService,
   ) {
     effect(() => {
diff --git a/projects/nshmp-apps/src/app/source/model-maps/services/app.service.ts b/projects/nshmp-apps/src/app/source/model-maps/services/app.service.ts
index 002eac124c9c2485417b6b97606923b88cc90fc9..296083248ed884cc752ae4f846611e122dbbf89e 100644
--- a/projects/nshmp-apps/src/app/source/model-maps/services/app.service.ts
+++ b/projects/nshmp-apps/src/app/source/model-maps/services/app.service.ts
@@ -40,7 +40,7 @@ import * as L from 'leaflet';
 import {environment} from 'projects/nshmp-apps/src/environments/environment';
 import {AppServiceModel} from 'projects/nshmp-apps/src/shared/models/app-service.model';
 import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {catchError, forkJoin, map, mergeMap, Observable} from 'rxjs';
+import {catchError, forkJoin, map, mergeMap, Observable, of} from 'rxjs';
 
 import {ControlForm, LatestEarthquakeTime} from '../models/control-form.model';
 import {EarthquakeFeatureProperties} from '../models/earthquake-props.model';
@@ -576,7 +576,7 @@ export class AppService implements AppServiceModel<AppState, ControlForm> {
           this.initialFormSet();
           spinnerRef.close();
           console.error(error);
-          return [];
+          return of();
         }),
       )
       .subscribe(() => {
diff --git a/projects/nshmp-apps/src/app/source/rates/app.component.html b/projects/nshmp-apps/src/app/source/rates/app.component.html
index b7c70d9bdd1656521be13d513dcf150766718885..e78a5ee9dfc383c5acbebff78d0ccb0d4357a072 100644
--- a/projects/nshmp-apps/src/app/source/rates/app.component.html
+++ b/projects/nshmp-apps/src/app/source/rates/app.component.html
@@ -1,4 +1,7 @@
-<nshmp-lib-ng-template [navigationList]="navigationList" [title]="title">
+<nshmp-lib-ng-template
+  [navigationList]="navService.navigationList()"
+  [title]="title"
+>
   <nshmp-template-content-container>
     <nshmp-template-control-panel>
       <app-control-panel />
diff --git a/projects/nshmp-apps/src/app/source/rates/app.component.ts b/projects/nshmp-apps/src/app/source/rates/app.component.ts
index 7cfe965356c7942233d5dd1558950456b7064047..2279f01627b9fdffbe0d3ffe5de2cbf43e53f3da 100644
--- a/projects/nshmp-apps/src/app/source/rates/app.component.ts
+++ b/projects/nshmp-apps/src/app/source/rates/app.component.ts
@@ -8,8 +8,8 @@ import {
   NshmpTemplateMainContentComponent,
   NshmpTemplateSettingsComponent,
 } from '@ghsc/nshmp-template';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 
 import {AboutComponent} from './components/about/about.component';
 import {ContentComponent} from './components/content/content.component';
@@ -36,12 +36,13 @@ import {AppService} from './services/app.service';
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnInit {
-  /** Navigation list for menu */
-  navigationList = navigation();
   /** Application title */
   title = apps().source.rateAndProbability.display;
 
-  constructor(public service: AppService) {}
+  constructor(
+    public service: AppService,
+    public navService: NavigationService,
+  ) {}
 
   ngOnInit(): void {
     this.service.init();
diff --git a/projects/nshmp-apps/src/app/internal/shared/guards/network.guard.ts b/projects/nshmp-apps/src/shared/guards/network.guard.ts
similarity index 100%
rename from projects/nshmp-apps/src/app/internal/shared/guards/network.guard.ts
rename to projects/nshmp-apps/src/shared/guards/network.guard.ts
diff --git a/projects/nshmp-apps/src/app/internal/shared/services/auth.service.ts b/projects/nshmp-apps/src/shared/services/auth.service.ts
similarity index 59%
rename from projects/nshmp-apps/src/app/internal/shared/services/auth.service.ts
rename to projects/nshmp-apps/src/shared/services/auth.service.ts
index 7a39e67e440a27ef765a5e543ce01d954a1a864e..4ad61d7f018f54060471d561da56a0a2a0ccc425 100644
--- a/projects/nshmp-apps/src/app/internal/shared/services/auth.service.ts
+++ b/projects/nshmp-apps/src/shared/services/auth.service.ts
@@ -1,8 +1,13 @@
 import {HttpClient} from '@angular/common/http';
 import {Injectable} from '@angular/core';
-import {NshmpService, SpinnerService} from '@ghsc/nshmp-lib-ng/nshmp';
+import {MatDialogRef} from '@angular/material/dialog';
+import {
+  NshmpLibNgSpinnerComponent,
+  NshmpService,
+  SpinnerService,
+} from '@ghsc/nshmp-lib-ng/nshmp';
 import {environment} from 'projects/nshmp-apps/src/environments/environment';
-import {catchError, map} from 'rxjs';
+import {catchError, map, Observable} from 'rxjs';
 
 interface AuthResponse {
   isAuthorized: boolean;
@@ -24,14 +29,23 @@ export class AuthService {
     private nshmpService: NshmpService,
   ) {}
 
-  isAuthorized() {
-    const ref = this.spinnerService.show('Checking USGS network ...');
+  /**
+   * Check if user is on USGS network for internal applications.
+   *
+   * @param required Whether the user must be on the network
+   */
+  isAuthorized(required = true): Observable<boolean> {
+    let ref: MatDialogRef<NshmpLibNgSpinnerComponent> | undefined = undefined;
+
+    if (required) {
+      ref = this.spinnerService.show('Checking USGS network ...');
+    }
 
     return this.http.get<AuthResponse>(this.url).pipe(
       map(response => {
-        ref.close();
+        ref?.close();
 
-        if (!response.isAuthorized) {
+        if (!response.isAuthorized && required) {
           this.nshmpService.throwError$(
             new Error(
               'Must be on USGS network to access internal applications',
@@ -42,7 +56,7 @@ export class AuthService {
         return response.isAuthorized;
       }),
       catchError((error: Error) => {
-        ref.close();
+        ref?.close();
         return this.nshmpService.throwError$(error);
       }),
     );
diff --git a/projects/nshmp-apps/src/shared/services/navigation.service.ts b/projects/nshmp-apps/src/shared/services/navigation.service.ts
new file mode 100644
index 0000000000000000000000000000000000000000..70328b7920ff98d35c92c1d1590aed663f716472
--- /dev/null
+++ b/projects/nshmp-apps/src/shared/services/navigation.service.ts
@@ -0,0 +1,216 @@
+import {Injectable, Signal, signal} from '@angular/core';
+import {Navigation, NavigationList} from '@ghsc/nshmp-template';
+import {catchError, map, of} from 'rxjs';
+
+import * as ApplicationsUtils from '../utils/applications.utils';
+import {AuthService} from './auth.service';
+
+const APPS = ApplicationsUtils.apps();
+const DEV_APPS = ApplicationsUtils.devApps();
+const INTERNAL_APPS = ApplicationsUtils.internalApps();
+
+@Injectable({
+  providedIn: 'root',
+})
+export class NavigationService {
+  private navListSignal = signal<NavigationList[]>([]);
+  private devNavListSignal = signal<NavigationList[]>(this.devNavigationList());
+  private internalNavListSignal = signal<NavigationList[]>(
+    this.internalNavigationList(),
+  );
+
+  constructor(private authService: AuthService) {
+    this.navigation();
+  }
+
+  /**
+   * Returns the list of design map application.
+   */
+  designMapApps(): Navigation[] {
+    return Object.values(APPS.designMaps) as Navigation[];
+  }
+
+  devGmmApps(): Navigation[] {
+    return Object.values(DEV_APPS.gmm) as Navigation[];
+  }
+
+  devHazardApps(): Navigation[] {
+    return Object.values(DEV_APPS.hazard) as Navigation[];
+  }
+
+  /**
+   * Returns the list development main applications.
+   */
+  devMainApps(): Navigation[] {
+    return [
+      DEV_APPS.math.exceedanceExplorer,
+      DEV_APPS.hazard.dynamicCompare,
+      DEV_APPS.gmm.hangingWallEffects,
+    ];
+  }
+
+  devMathApps(): Navigation[] {
+    return Object.values(DEV_APPS.math) as Navigation[];
+  }
+
+  /**
+   * Returns the drop down navigation menu for development applications.
+   */
+  get devNavigation(): Signal<NavigationList[]> {
+    return this.devNavListSignal.asReadonly();
+  }
+
+  /**
+   * Returns the list of ground motion model applications.
+   */
+  gmmApps(): Navigation[] {
+    return Object.values(APPS.gmm) as Navigation[];
+  }
+
+  /**
+   * Returns list of hazard applications.
+   */
+  hazardApps(): Navigation[] {
+    return Object.values(APPS.hazard) as Navigation[];
+  }
+
+  /**
+   * Returns the list of AWS applications.
+   */
+  internalAwsApps(): Navigation[] {
+    return Object.values(INTERNAL_APPS.aws) as Navigation[];
+  }
+
+  internalMainApps(): Navigation[] {
+    return this.internalAwsApps();
+  }
+
+  get internalNavigation(): Signal<NavigationList[]> {
+    return this.internalNavListSignal.asReadonly();
+  }
+
+  get navigationList(): Signal<NavigationList[]> {
+    return this.navListSignal;
+  }
+
+  /**
+   * Returns the list services apps.
+   */
+  serviceApps(): Navigation[] {
+    return [APPS.services];
+  }
+
+  /**
+   * Returns the list of NCM appliations.
+   */
+  ncmApps(): Navigation[] {
+    return Object.values(APPS.ncm) as Navigation[];
+  }
+
+  /**
+   * Returns the list of source model applicaitons.
+   */
+  sourceModelApps(): Navigation[] {
+    return Object.values(APPS.source) as Navigation[];
+  }
+
+  private devNavigationList(): NavigationList[] {
+    const devNavigation: NavigationList[] = [
+      {
+        navigation: [DEV_APPS.dashboard],
+      },
+      {
+        navigation: this.devHazardApps(),
+        subHeader: 'Hazard',
+      },
+      {
+        navigation: this.devGmmApps(),
+        subHeader: 'Ground Motion Models',
+      },
+      {
+        navigation: this.devMathApps(),
+        subHeader: 'Math',
+      },
+    ];
+
+    return devNavigation;
+  }
+
+  private internalNavigationList(): NavigationList[] {
+    const internalNavigation: NavigationList[] = [
+      {
+        navigation: [INTERNAL_APPS.dashboard],
+      },
+      {
+        navigation: this.internalAwsApps(),
+        subHeader: 'AWS',
+      },
+    ];
+
+    return [...internalNavigation];
+  }
+
+  /**
+   * Get navigation.
+   */
+  private navigation() {
+    const navigation: NavigationList[] = [
+      {
+        navigation: [APPS.dashboard],
+      },
+      {
+        navigation: this.hazardApps(),
+        subHeader: 'Hazard',
+      },
+      {
+        navigation: this.sourceModelApps(),
+        subHeader: 'Source Models',
+      },
+      {
+        navigation: this.gmmApps(),
+        subHeader: 'Ground Motion Models',
+      },
+      {
+        navigation: this.designMapApps(),
+        subHeader: 'Design Map',
+      },
+      {
+        navigation: this.ncmApps(),
+        subHeader: 'National Crustal Model',
+      },
+      {
+        navigation: [DEV_APPS.dashboard, ...this.devMainApps()],
+        subHeader: 'Development',
+      },
+    ];
+
+    this.authService
+      .isAuthorized(false)
+      .pipe(
+        map(isInternal => {
+          if (isInternal) {
+            navigation.push({
+              navigation: this.internalMainApps(),
+              subHeader: 'Internal',
+            });
+          }
+
+          navigation.push({
+            navigation: [APPS.services],
+          });
+
+          return navigation;
+        }),
+        catchError(() => {
+          navigation.push({
+            navigation: [APPS.services],
+          });
+          this.navListSignal.set(navigation);
+          return of();
+        }),
+      )
+      .subscribe(navList => {
+        this.navListSignal.set(navList);
+      });
+  }
+}
diff --git a/projects/nshmp-apps/src/shared/utils/navigation.utils.ts b/projects/nshmp-apps/src/shared/utils/navigation.utils.ts
deleted file mode 100644
index bdc7a1a02c9fefaf7669573977de233d723b711e..0000000000000000000000000000000000000000
--- a/projects/nshmp-apps/src/shared/utils/navigation.utils.ts
+++ /dev/null
@@ -1,162 +0,0 @@
-import {Navigation, NavigationList} from '@ghsc/nshmp-template';
-
-import * as ApplicationsUtils from './applications.utils';
-
-const APPS = ApplicationsUtils.apps();
-const DEV_APPS = ApplicationsUtils.devApps();
-const INTERNAL_APPS = ApplicationsUtils.internalApps();
-
-/**
- * Returns the list of design map application.
- */
-export function designMapApps(): Navigation[] {
-  return Object.values(APPS.designMaps) as Navigation[];
-}
-
-export function devGmmApps(): Navigation[] {
-  return Object.values(DEV_APPS.gmm) as Navigation[];
-}
-
-export function devHazardApps(): Navigation[] {
-  return Object.values(DEV_APPS.hazard) as Navigation[];
-}
-
-/**
- * Returns the list development main applications.
- */
-export function devMainApps(): Navigation[] {
-  return [
-    DEV_APPS.math.exceedanceExplorer,
-    DEV_APPS.hazard.dynamicCompare,
-    DEV_APPS.gmm.hangingWallEffects,
-  ];
-}
-
-export function devMathApps(): Navigation[] {
-  return Object.values(DEV_APPS.math) as Navigation[];
-}
-
-/**
- * Returns the drop down navigation menu for development applications.
- */
-export function devNavigation(): NavigationList[] {
-  const devNavigation: NavigationList[] = [
-    {
-      navigation: [DEV_APPS.dashboard],
-    },
-    {
-      navigation: devHazardApps(),
-      subHeader: 'Hazard',
-    },
-    {
-      navigation: devGmmApps(),
-      subHeader: 'Ground Motion Models',
-    },
-    {
-      navigation: devMathApps(),
-      subHeader: 'Math',
-    },
-  ];
-
-  return [...devNavigation];
-}
-
-/**
- * Returns the list of ground motion model applications.
- */
-export function gmmApps(): Navigation[] {
-  return Object.values(APPS.gmm) as Navigation[];
-}
-
-/**
- * Returns list of hazard applications.
- */
-export function hazardApps(): Navigation[] {
-  return Object.values(APPS.hazard) as Navigation[];
-}
-
-/**
- * Returns the list of AWS applications.
- */
-export function internalAwsApps(): Navigation[] {
-  return Object.values(INTERNAL_APPS.aws) as Navigation[];
-}
-
-export function internalMainApps(): Navigation[] {
-  return internalAwsApps();
-}
-
-export function internalNavigation(): NavigationList[] {
-  const internalNavigation: NavigationList[] = [
-    {
-      navigation: [INTERNAL_APPS.dashboard],
-    },
-    {
-      navigation: internalAwsApps(),
-      subHeader: 'AWS',
-    },
-  ];
-
-  return [...internalNavigation];
-}
-
-/**
- * Returns the list services apps.
- */
-export function serviceApps(): Navigation[] {
-  return [APPS.services];
-}
-
-/**
- * Returns drop down navigation menu of applications.
- */
-export function navigation(): NavigationList[] {
-  const navigation: NavigationList[] = [
-    {
-      navigation: [APPS.dashboard],
-    },
-    {
-      navigation: hazardApps(),
-      subHeader: 'Hazard',
-    },
-    {
-      navigation: sourceModelApps(),
-      subHeader: 'Source Models',
-    },
-    {
-      navigation: gmmApps(),
-      subHeader: 'Ground Motion Models',
-    },
-    {
-      navigation: designMapApps(),
-      subHeader: 'Design Map',
-    },
-    {
-      navigation: ncmApps(),
-      subHeader: 'National Crustal Model',
-    },
-    {
-      navigation: [DEV_APPS.dashboard, ...devMainApps()],
-      subHeader: 'Development',
-    },
-    {
-      navigation: [APPS.services],
-    },
-  ];
-
-  return [...navigation];
-}
-
-/**
- * Returns the list of NCM appliations.
- */
-export function ncmApps(): Navigation[] {
-  return Object.values(APPS.ncm) as Navigation[];
-}
-
-/**
- * Returns the list of source model applicaitons.
- */
-export function sourceModelApps(): Navigation[] {
-  return Object.values(APPS.source) as Navigation[];
-}
diff --git a/projects/nshmp-ws/src/app/services/components/content/content.component.ts b/projects/nshmp-ws/src/app/services/components/content/content.component.ts
index 5881897a1a47a232997972849ec9f7e35bc31d78..ba0e9d528391ca725de279573cb596b1cc3d83da 100644
--- a/projects/nshmp-ws/src/app/services/components/content/content.component.ts
+++ b/projects/nshmp-ws/src/app/services/components/content/content.component.ts
@@ -21,11 +21,8 @@ import {HazardService} from '@ghsc/nshmp-lib-ng/hazard';
 import {NshmpService} from '@ghsc/nshmp-lib-ng/nshmp';
 import {NshmpTemplateService} from '@ghsc/nshmp-template';
 import {environment} from 'projects/nshmp-apps/src/environments/environment';
+import {NavigationService} from 'projects/nshmp-apps/src/shared/services/navigation.service';
 import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils';
-import {
-  gmmApps,
-  ncmApps,
-} from 'projects/nshmp-apps/src/shared/utils/navigation.utils';
 import {map, Observable, of} from 'rxjs';
 
 import {QueryParameters} from '../../models/query-parameters.model';
@@ -160,7 +157,7 @@ export class ContentComponent implements AfterViewInit {
     },
     // Data services
     {
-      applicationsUsedIn: [...gmmApps(), APPS.source.data],
+      applicationsUsedIn: [...this.navService.gmmApps(), APPS.source.data],
       id: ServiceGroupId.NSHMP_WS,
       images: [
         {
@@ -223,7 +220,7 @@ export class ContentComponent implements AfterViewInit {
     },
     // NCM services
     {
-      applicationsUsedIn: [...ncmApps()],
+      applicationsUsedIn: [...this.navService.ncmApps()],
       id: ServiceGroupId.NCM,
       images: [
         {
@@ -275,6 +272,7 @@ export class ContentComponent implements AfterViewInit {
 
   constructor(
     public templateService: NshmpTemplateService,
+    private navService: NavigationService,
     private el: ElementRef<HTMLDivElement>,
     private route: ActivatedRoute,
     private router: Router,