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

package.json

@@ -102,7 +102,7 @@
     "mini-css-extract-plugin": "2.6.1",
     "mocha": "10.0.0",
     "nightwatch": "2.3.3",
-    "opn": "4.0.2",
+    "opn": "5.5.0",
     "ora": "0.4.1",
     "postcss": "8.4.16",
     "postcss-loader": "7.0.1",

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"

yarn.lock

@@ -5188,6 +5188,11 @@ is-weakref@^1.0.1:
   dependencies:
     call-bind "^1.0.2"
 
+is-wsl@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/is-wsl/-/is-wsl-1.1.0.tgz#1f16e4aa22b04d1336b66188a66af3c600c3a66d"
+  integrity sha512-gfygJYZ2gLTDlmbWMI0CE2MwnFzSN/2SZfkMlItC4K/JBlsWVDB0bO6XhqcY13YXE7iMcAJnzTCJjPiTeJJ0Mw==
+
 is-wsl@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/is-wsl/-/is-wsl-2.2.0.tgz#74a4c76e77ca9fd3f932f290c17ea326cd157271"
@@ -6556,13 +6561,12 @@ open@^8.4.0:
     is-docker "^2.1.1"
     is-wsl "^2.2.0"
 
-opn@4.0.2:
+opn@5.5.0:
-  version "4.0.2"
+  version "5.5.0"
-  resolved "https://registry.yarnpkg.com/opn/-/opn-4.0.2.tgz#7abc22e644dff63b0a96d5ab7f2790c0f01abc95"
+  resolved "https://registry.yarnpkg.com/opn/-/opn-5.5.0.tgz#fc7164fab56d235904c51c3b27da6758ca3b9bfc"
-  integrity sha1-erwi5kTf9jsKltWrfyeQwPAavJU=
+  integrity sha512-PqHpggC9bLV0VeWcdKhkpxY+3JTzetLSqTCWL/z/tFIbI6G8JCjondXklT1JinczLz2Xib62sSp0T/gKT4KksA==
   dependencies:
-    object-assign "^4.0.1"
+    is-wsl "^1.1.0"
-    pinkie-promise "^2.0.0"
 
 optimist@^0.6.1:
   version "0.6.1"
@@ -6840,16 +6844,6 @@ pify@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/pify/-/pify-4.0.1.tgz#4b2cd25c50d598735c50292224fd8c6df41e3231"
 
-pinkie-promise@^2.0.0:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/pinkie-promise/-/pinkie-promise-2.0.1.tgz#2135d6dfa7a358c069ac9b178776288228450ffa"
-  dependencies:
-    pinkie "^2.0.0"
-
-pinkie@^2.0.0:
-  version "2.0.4"
-  resolved "https://registry.yarnpkg.com/pinkie/-/pinkie-2.0.4.tgz#72556b80cfa0d48a974e80e77248e80ed4f7f870"
-
 pirates@^4.0.5:
   version "4.0.5"
   resolved "https://registry.yarnpkg.com/pirates/-/pirates-4.0.5.tgz#feec352ea5c3268fb23a37c702ab1699f35a5f3b"