redirect /remote-users/:username@:hostname -> /users/:id, /remote-users/:hostname/:username -> /users/:id

src/boot/routes.js

@@ -18,6 +18,7 @@ import AuthForm from 'components/auth_form/auth_form.js'
 import ChatPanel from 'components/chat_panel/chat_panel.vue'
 import WhoToFollow from 'components/who_to_follow/who_to_follow.vue'
 import About from 'components/about/about.vue'
+import RemoteUserResolver from 'components/remote_user_resolver/remote_user_resolver.vue'
 
 export default (store) => {
   const validateAuthenticatedRoute = (to, from, next) => {
@@ -42,6 +43,16 @@ export default (store) => {
     { name: 'friends', path: '/main/friends', component: FriendsTimeline, beforeEnter: validateAuthenticatedRoute },
     { name: 'tag-timeline', path: '/tag/:tag', component: TagTimeline },
     { name: 'conversation', path: '/notice/:id', component: ConversationPage, meta: { dontScroll: true } },
+    { name: 'remote-user-profile-acct',
+      path: '/remote-users/(@?):username([^/@]+)@:hostname([^/@]+)',
+      component: RemoteUserResolver,
+      beforeEnter: validateAuthenticatedRoute
+    },
+    { name: 'remote-user-profile',
+      path: '/remote-users/:hostname/:username',
+      component: RemoteUserResolver,
+      beforeEnter: validateAuthenticatedRoute
+    },
     { name: 'external-user-profile', path: '/users/:id', component: UserProfile },
     { name: 'interactions', path: '/users/:username/interactions', component: Interactions, beforeEnter: validateAuthenticatedRoute },
     { name: 'dms', path: '/users/:username/dms', component: DMs, beforeEnter: validateAuthenticatedRoute },

src/components/remote_user_resolver/remote_user_resolver.js

@@ -0,0 +1,31 @@
+const RemoteUserResolver = {
+  data: () => ({
+    error: false
+  }),
+  mounted () {
+    this.redirect()
+  },
+  methods: {
+    redirect () {
+      const acct = this.$route.params.username + '@' + this.$route.params.hostname
+      this.$store.state.api.backendInteractor.fetchUser({ id: acct })
+        .then((externalUser) => {
+          if (externalUser.error) {
+            this.error = true
+          } else {
+            this.$store.commit('addNewUsers', [externalUser])
+            const id = externalUser.id
+            this.$router.replace({
+              name: 'external-user-profile',
+              params: { id }
+            })
+          }
+        })
+        .catch(() => {
+          this.error = true
+        })
+    }
+  }
+}
+
+export default RemoteUserResolver

src/components/remote_user_resolver/remote_user_resolver.vue

@@ -0,0 +1,20 @@
+<template>
+  <div class="panel panel-default">
+    <div class="panel-heading">
+      {{ $t('remote_user_resolver.remote_user_resolver') }}
+    </div>
+    <div class="panel-body">
+      <p>
+        {{ $t('remote_user_resolver.searching_for') }} @{{ $route.params.username }}@{{ $route.params.hostname }}
+      </p>
+      <p v-if="error">
+        {{ $t('remote_user_resolver.error') }}
+      </p>
+    </div>
+  </div>
+</template>
+
+<script src="./remote_user_resolver.js"></script>
+
+<style lang="scss">
+</style>

src/i18n/en.json

@@ -172,6 +172,11 @@
       "password_confirmation_match": "should be the same as password"
     }
   },
+  "remote_user_resolver": {
+    "remote_user_resolver": "Remote user resolver",
+    "searching_for": "Searching for",
+    "error": "Not found."
+  },
   "selectable_list": {
     "select_all": "Select all"
   },