fix links not being active by default

4 files changed, 43 insertions, 2 deletions

diff --git a/src/components/navigation/navigation_entry.js b/src/components/navigation/navigation_entry.js
index e17e9436..a19ee1b4 100644
--- a/src/components/navigation/navigation_entry.js
+++ b/src/components/navigation/navigation_entry.js
@@ -4,6 +4,15 @@ import { faThumbtack } from '@fortawesome/free-solid-svg-icons'
 
 library.add(faThumbtack)
 
+const USERNAME_ROUTES = new Set([
+  'bookmarks',
+  'dms',
+  'interactions',
+  'notifications',
+  'chat',
+  'chats'
+])
+
 const NavigationEntry = {
   props: ['item', 'showPin'],
   methods: {
@@ -20,6 +29,16 @@ const NavigationEntry = {
     }
   },
   computed: {
+    routeTo () {
+      if (this.item.routeObject) {
+        return this.item.routeObject
+      }
+      const route = { name: (this.item.anon || this.currentUser) ? this.item.route : this.item.anonRoute }
+      if (USERNAME_ROUTES.has(route.name)) {
+        route.params = { username: this.currentUser.screen_name }
+      }
+      return route
+    },
     getters () {
       return this.$store.getters
     },
diff --git a/src/components/navigation/navigation_entry.vue b/src/components/navigation/navigation_entry.vue
index 64601be6..c0b405f5 100644
--- a/src/components/navigation/navigation_entry.vue
+++ b/src/components/navigation/navigation_entry.vue
@@ -2,7 +2,7 @@
   <li class="NavigationEntry">
     <router-link
       class="menu-item"
-      :to="item.routeObject || { name: (currentUser || item.anon) ? item.route : item.anonRoute, params: { username: currentUser.screen_name } }"
+      :to="routeTo"
     >
       <FAIcon
         v-if="item.icon"
diff --git a/src/components/navigation/navigation_pins.js b/src/components/navigation/navigation_pins.js
index 9c416d9f..f0295c70 100644
--- a/src/components/navigation/navigation_pins.js
+++ b/src/components/navigation/navigation_pins.js
@@ -26,8 +26,30 @@ library.add(
   faStream,
   faList
 )
+
+const USERNAME_ROUTES = new Set([
+  'bookmarks',
+  'dms',
+  'interactions',
+  'notifications',
+  'chat',
+  'chats'
+])
+
 const NavPanel = {
   props: ['limit'],
+  methods: {
+    getRouteTo (item) {
+      if (item.routeObject) {
+        return item.routeObject
+      }
+      const route = { name: (item.anon || this.currentUser) ? item.route : item.anonRoute }
+      if (USERNAME_ROUTES.has(route.name)) {
+        route.params = { username: this.currentUser.screen_name }
+      }
+      return route
+    }
+  },
   computed: {
     getters () {
       return this.$store.getters
diff --git a/src/components/navigation/navigation_pins.vue b/src/components/navigation/navigation_pins.vue
index 7942f23c..4ae96fbe 100644
--- a/src/components/navigation/navigation_pins.vue
+++ b/src/components/navigation/navigation_pins.vue
@@ -4,7 +4,7 @@
       v-for="item in pinnedList"
       :key="item.name"
       class="pinned-item"
-      :to="item.routeObject || { name: (currentUser || item.anon) ? item.route : item.anonRoute, params: { username: currentUser.screen_name } }"
+      :to="getRouteTo(item)"
     >
       <FAIcon
         v-if="item.icon"