2 files changed, 18 insertions, 4 deletions
diff --git a/src/components/status/status.js b/src/components/status/status.js
index 1e2b8794..0273a5be 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -10,7 +10,7 @@ import LinkPreview from '../link-preview/link-preview.vue'
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
 import fileType from 'src/services/file_type/file_type.service'
 import { highlightClass, highlightStyle } from '../../services/user_highlighter/user_highlighter.js'
-import { mentionMatchesUrl } from 'src/services/mention_matcher/mention_matcher.js'
+import { mentionMatchesUrl, extractTagFromUrl } from 'src/services/matcher/matcher.service.js'
 import { filter, find, unescape } from 'lodash'
 
 const Status = {
@@ -282,7 +282,7 @@ const Status = {
       }
       if (target.tagName === 'A') {
         if (target.className.match(/mention/)) {
-          const href = target.getAttribute('href')
+          const href = target.href
           const attn = this.status.attentions.find(attn => mentionMatchesUrl(attn, href))
           if (attn) {
             event.stopPropagation()
@@ -292,6 +292,15 @@ const Status = {
             return
           }
         }
+        if (target.className.match(/hashtag/)) {
+          // Extract tag name from link url
+          const tag = extractTagFromUrl(target.href)
+          if (tag) {
+            const link = this.generateTagLink(tag)
+            this.$router.push(link)
+            return
+          }
+        }
         window.open(target.href, '_blank')
       }
     },
@@ -348,6 +357,9 @@ const Status = {
     generateUserProfileLink (id, name) {
       return generateProfileLink(id, name, this.$store.state.instance.restrictedNicknames)
     },
+    generateTagLink (tag) {
+      return `/tag/${tag}`
+    },
     setMedia () {
       const attachments = this.attachmentSize === 'hide' ? this.status.attachments : this.galleryAttachments
       return () => this.$store.dispatch('setMedia', attachments)
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 5bc7c664..3fc5b486 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -56,7 +56,7 @@
               </div>
               <h4 class="replies" v-if="inConversation && !noReplyLinks">
                 <small v-if="replies.length">Replies:</small>
-                <small class="reply-link" v-for="reply in replies">
+                <small class="reply-link" v-bind:key="reply.id" v-for="reply in replies">
                   <a href="#" @click.prevent="gotoOriginal(reply.id)" @mouseenter="replyEnter(reply.id, $event)" @mouseout="replyLeave()">{{reply.name}}&nbsp;</a>
                 </small>
               </h4>
@@ -438,6 +438,8 @@
 
       .user-name {
         font-weight: bold;
+        overflow: hidden;
+        text-overflow: ellipsis;
 
         img {
           width: 14px;
@@ -552,7 +554,7 @@ a.unmute {
 
 .timeline > {
   .status-el:last-child {
-    border-bottom-radius: 0 0 $fallback--panelRadius $fallback--panelRadius;;
+    border-radius: 0 0 $fallback--panelRadius $fallback--panelRadius;
     border-radius: 0 0 var(--panelRadius, $fallback--panelRadius) var(--panelRadius, $fallback--panelRadius);
     border-bottom: none;
   }