Merge remote-tracking branch 'origin/develop' into scrolltotop

* origin/develop: (47 commits)
  Update dependency eslint-plugin-vue to v9.4.0
  Update dependency opn to v5
  fix notices being under the navbar, also change offset to use variable
  fix modals not having proper z index
  reduce indexes to be below 9999 so that develop error messages appear above
  Fix react & extra buttons not styled on tab-focus
  Fix popover not popping up
  Fix styling on Safari
  Use :focus-visible instead of :focus for focus markers
  Optimize Reply badge position
  Add badges to status interacting buttons
  Update dependency nightwatch to v2
  Update dependency eslint-plugin-n to v15.2.5
  Update dependency mocha to v10
  Update dependency karma-coverage to v2
  Update dependency sass to v1.54.5
  Update dependency karma-firefox-launcher to v2
  Update dependency vue-template-compiler to v2.7.9
  Pin dependencies
  Refresh yarn.lock
  ...

1 files changed, 10 insertions, 5 deletions

diff --git a/src/components/user_profile/user_profile.js b/src/components/user_profile/user_profile.js
index f779b823..08adaeab 100644
--- a/src/components/user_profile/user_profile.js
+++ b/src/components/user_profile/user_profile.js
@@ -45,7 +45,7 @@ const UserProfile = {
   },
   created () {
     const routeParams = this.$route.params
-    this.load(routeParams.name || routeParams.id)
+    this.load({ name: routeParams.name, id: routeParams.id })
     this.tab = get(this.$route, 'query.tab', defaultTabKey)
   },
   unmounted () {
@@ -106,12 +106,17 @@ const UserProfile = {
       this.userId = null
       this.error = false
 
+      const maybeId = userNameOrId.id
+      const maybeName = userNameOrId.name
+
       // Check if user data is already loaded in store
-      const user = this.$store.getters.findUser(userNameOrId)
+      const user = maybeId ? this.$store.getters.findUser(maybeId) : this.$store.getters.findUserByName(maybeName)
       if (user) {
         loadById(user.id)
       } else {
-        this.$store.dispatch('fetchUser', userNameOrId)
+        (maybeId
+          ? this.$store.dispatch('fetchUser', maybeId)
+          : this.$store.dispatch('fetchUserByName', maybeName))
           .then(({ id }) => loadById(id))
           .catch((reason) => {
             const errorMessage = get(reason, 'error.error')
@@ -150,12 +155,12 @@ const UserProfile = {
   watch: {
     '$route.params.id': function (newVal) {
       if (newVal) {
-        this.switchUser(newVal)
+        this.switchUser({ id: newVal })
       }
     },
     '$route.params.name': function (newVal) {
       if (newVal) {
-        this.switchUser(newVal)
+        this.switchUser({ name: newVal })
       }
     },
     '$route.query': function (newVal) {