fix mention links

src/components/mention_link/mention_link.js

@@ -10,6 +10,7 @@ import UnicodeDomainIndicator from '../unicode_domain_indicator/unicode_domain_i
 import UserAvatar from '../user_avatar/user_avatar.vue'
 
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useUserHighlightStore } from 'src/stores/user_highlight.js'
 
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
 
@@ -100,23 +101,23 @@ const MentionLink = {
     userNameFullUi() {
       return this.user && this.user.screen_name_ui
     },
-    highlight() {
-      return this.user && this.mergedConfig.highlight[this.user.screen_name]
+    highlightData() {
+      return this.highlight[this.user?.screen_name]
     },
     highlightType() {
-      return this.highlight && '-' + this.highlight.type
+      return this.highlightData && '-' + this.highlightData.type
     },
     highlightClass() {
-      if (this.highlight) return highlightClass(this.user)
+       return this.highlightData && highlightClass(this.user)
     },
     style() {
-      if (this.highlight) {
+      if (this.highlightData) {
         const {
           backgroundColor,
           backgroundPosition,
           backgroundImage,
           ...rest
-        } = highlightStyle(this.highlight)
+        } = highlightStyle(this.highlightData)
         return rest
       }
     },
@@ -124,7 +125,7 @@ const MentionLink = {
       return [
         {
           '-you': this.isYou && this.shouldBoldenYou,
-          '-highlighted': this.highlight,
+          '-highlighted': !!this.highlightData,
           '-has-selection': this.hasSelection,
         },
         this.highlightType,
@@ -160,6 +161,7 @@ const MentionLink = {
       return this.mergedConfig.mentionLinkFadeDomain
     },
     ...mapPiniaState(useSyncConfigStore, ['mergedConfig']),
+    ...mapPiniaState(useUserHighlightStore, ['highlight']),
     ...mapState({
       currentUser: (state) => state.users.currentUser,
     }),