Merge branch 'navigation-update' into shigusegubu-vue3

* navigation-update:
  lint
  fix being unable to edit timeline pins on mobile
  aria
  fix mobile side drawer causing issues
  Update dependency opn to v5

src/components/nav_panel/nav_panel.vue

@@ -25,6 +25,7 @@
         <li v-if="currentUser || !privateMode">
           <button
             class="button-unstyled menu-item"
+            :aria-expanded="showTimelines ? 'true' : 'false'"
             @click="toggleTimelines"
           >
             <FAIcon
@@ -46,7 +47,7 @@
               <NavigationEntry
                 v-for="item in timelinesItems"
                 :key="item.name"
-                :show-pin="editMode"
+                :show-pin="editMode || forceEditMode"
                 :item="item"
               />
             </ul>
@@ -55,6 +56,7 @@
         <li v-if="currentUser">
           <button
             class="button-unstyled menu-item"
+            :aria-expanded="showLists ? 'true' : 'false'"
             @click="toggleLists"
           >
             <FAIcon

src/components/navigation/navigation.js

@@ -1,3 +1,12 @@
+export const USERNAME_ROUTES = new Set([
+  'bookmarks',
+  'dms',
+  'interactions',
+  'notifications',
+  'chat',
+  'chats'
+])
+
 export const TIMELINES = {
   home: {
     route: 'friends',

src/components/navigation/navigation_entry.js

@@ -1,18 +1,10 @@
 import { mapState } from 'vuex'
+import { USERNAME_ROUTES } from 'src/components/navigation/navigation.js'
 import { library } from '@fortawesome/fontawesome-svg-core'
 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: {

src/components/navigation/navigation_pins.js

@@ -1,5 +1,5 @@
 import { mapState } from 'vuex'
-import { TIMELINES, ROOT_ITEMS } from 'src/components/navigation/navigation.js'
+import { TIMELINES, ROOT_ITEMS, USERNAME_ROUTES } from 'src/components/navigation/navigation.js'
 import { getListEntries, filterNavigation } from 'src/components/navigation/filter.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
@@ -27,15 +27,6 @@ library.add(
   faList
 )
 
-const USERNAME_ROUTES = new Set([
-  'bookmarks',
-  'dms',
-  'interactions',
-  'notifications',
-  'chat',
-  'chats'
-])
-
 const NavPanel = {
   props: ['limit'],
   methods: {

src/components/side_drawer/side_drawer.js

@@ -2,6 +2,7 @@ import { mapState, mapGetters } from 'vuex'
 import UserCard from '../user_card/user_card.vue'
 import { unseenNotificationsFromStore } from '../../services/notification_utils/notification_utils'
 import GestureService from '../../services/gesture_service/gesture_service'
+import { USERNAME_ROUTES } from 'src/components/navigation/navigation.js'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faSignInAlt,
@@ -82,10 +83,16 @@ const SideDrawer = {
       return this.$store.state.instance.federating
     },
     timelinesRoute () {
+      let name
       if (this.$store.state.interface.lastTimeline) {
-        return this.$store.state.interface.lastTimeline
+        name = this.$store.state.interface.lastTimeline
+      }
+      name = this.currentUser ? 'friends' : 'public-timeline'
+      if (USERNAME_ROUTES.has(name)) {
+        return { name, params: { username: this.currentUser.screen_name } }
+      } else {
+        return { name }
       }
-      return this.currentUser ? 'friends' : 'public-timeline'
     },
     ...mapState({
       pleromaChatMessagesAvailable: state => state.instance.pleromaChatMessagesAvailable

src/components/side_drawer/side_drawer.vue

@@ -47,7 +47,7 @@
           v-if="currentUser || !privateMode"
           @click="toggleDrawer"
         >
-          <router-link :to="{ name: timelinesRoute }">
+          <router-link :to="timelinesRoute">
             <FAIcon
               fixed-width
               class="fa-scale-110 fa-old-padding"