refactor: build router links directly from router config

src/components/SiteNavigation.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import router from "@/router";
 import { RouterLink } from "vue-router";
 import NavToggle from "@/components/NavToggle.vue";
 
@@ -6,17 +7,6 @@ interface Props {
   isActive: boolean;
 }
 
-interface Route {
-  href: string;
-  title: string;
-}
-
-const routerLinks: Array<Route> = [
-  { href: "/", title: "Home" },
-  { href: "/anatomy", title: "Anatomy" },
-  { href: "/career-path", title: "Career Path" },
-];
-
 const props = defineProps<Props>();
 </script>
 
@@ -29,11 +19,11 @@ const props = defineProps<Props>();
     <ul class="navigation__list">
       <li
         class="navigation__item"
-        v-for="(route, idx) in routerLinks"
+        v-for="(route, idx) in router.options.routes"
         :key="idx"
       >
-        <RouterLink :to="route.href" @click="$emit('selected')">
-          {{ route.title }}
+        <RouterLink :to="route.path" @click="$emit('selected')">
+          {{ route.meta?.title }}
         </RouterLink>
       </li>
     </ul>