fix: prefix external nav links inside mapNavOptions so home tile + footer + sidebar also use env.host (#87 follow-up)

The earlier resolveExternalLinks lived only on NavigationBarComponent,
but thirteen other components (home-api-data, info-footer, sidebar,
home-help, etc.) each independently re-import nav-options.json and
call mapNavOptions without ever prepending the host. So the homepage
"API and Data Access" tile and the info-footer's "Tools" column both
kept rendering `/AnalysisService` and `/ContentService` as relative
paths, which on prod still bounce to the legacy Joomla chrome.

Move the host-prefixing into mapNavOptions itself so all callers get
it for free. Drop the now-redundant resolveExternalLinks helper.

Verified with chromium --headless --dump-dom: external links now
render as https://dev.reactome.org/AnalysisService etc.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: adamjohnwright

projects/website-angular/src/app/navigation-bar/navigation-bar.component.ts

@@ -7,7 +7,6 @@ import { FormsModule } from '@angular/forms';
 import { mapNavOptions } from '../../utils/nav-options-mapper';
 import { NavLink, NavOption } from '../../types/link';
 import { DarkService } from '../../../../pathway-browser/src/app/services/dark.service';
-import { environment } from '../../../../pathway-browser/src/environments/environment';
 
 @Component({
   standalone: true,
@@ -50,31 +49,9 @@ export class NavigationBarComponent implements OnInit, AfterViewInit {
   loadNavOptions() {
     import('../../config/nav-options.json').then((navData) => {
       this.navOptions = mapNavOptions(navData.default);
-      this.resolveExternalLinks(environment.host);
     });
   }
 
-  /**
-   * Prepend baseUrl to external links so they resolve to the correct domain
-   */
-  private resolveExternalLinks(baseUrl: string) {
-    const resolve = (links: Record<string, NavLink> | undefined) => {
-      if (!links) return;
-      for (const link of Object.values(links)) {
-        if (link.external) {
-          link.link = baseUrl + link.link;
-        }
-        resolve(link.dropdownLinks);
-      }
-    };
-    for (const option of Object.values(this.navOptions)) {
-      if (option.external) {
-        option.link = baseUrl + option.link;
-      }
-      resolve(option.dropdownLinks);
-    }
-  }
-
   toggleHamburgerMenu() {
     this.activeHamburgerMenu = !this.activeHamburgerMenu;
   }

projects/website-angular/src/utils/nav-options-mapper.ts

@@ -1,20 +1,28 @@
 import {NavLink, NavOption} from "../types/link";
+import { environment } from "../../../pathway-browser/src/environments/environment";
+
+// Links marked external: true in nav-options.json point at WAR endpoints
+// (/AnalysisService, /ContentService, ...) and need the active host
+// prepended; otherwise they resolve relative to the current page and on
+// hosts where Apache wraps those paths in legacy chrome the user gets
+// bounced out of the new site. See issue #87.
+function resolveLink(link: string, external: boolean): string {
+  return external ? `${environment.host}${link}` : link;
+}
 
-/**
- * Recursively maps JSON dropdown-links to typed NavLink objects
- */
 function mapDropdownLinks(raw: any): Record<string, NavLink> | undefined {
   if (!raw || typeof raw !== 'object') {
     return undefined;
   }
-  
+
   const mapped: Record<string, NavLink> = {};
   Object.entries(raw).forEach(([key, value]: [string, any]) => {
     if (value && typeof value === 'object') {
+      const external = value.external || false;
       mapped[key] = {
         label: value.label || '',
-        link: value.link || '',
-        external: value.external || false,
+        link: resolveLink(value.link || '', external),
+        external,
         dropdownLinks: mapDropdownLinks(value['dropdown-links'])
       };
     }
@@ -23,23 +31,21 @@ function mapDropdownLinks(raw: any): Record<string, NavLink> | undefined {
   return Object.keys(mapped).length > 0 ? mapped : undefined;
 }
 
-/**
- * Maps nav-options JSON (with dropdown-links) to typed NavOption objects (with dropdownLinks)
- */
 export function mapNavOptions(raw: Record<string, any>): Record<string, NavOption> {
   const mapped: Record<string, NavOption> = {};
 
   Object.entries(raw).forEach(([key, value]: [string, any]) => {
     if (value && typeof value === 'object') {
+      const external = value.external || false;
       mapped[key] = {
         label: value.label || '',
-        link: value.link || '',
+        link: resolveLink(value.link || '', external),
         icon: value.icon,
-        external: value.external || false,
+        external,
         dropdownLinks: mapDropdownLinks(value['dropdown-links'])
       };
     }
   });
-  
+
   return mapped;
 }