diff --git a/package.json b/package.json index fa08593f0..182a541d9 100644 --- a/package.json +++ b/package.json @@ -44,7 +44,7 @@ "url": "0.11.0", "utf8": "3.0.0", "vue": "3.2.45", - "vue-i18n": "9.2.2", + "vue-i18n": "10", "vue-router": "4.1.6", "vue-template-compiler": "2.7.14", "vue-virtual-scroller": "^2.0.0-beta.7", diff --git a/src/components/status/status.js b/src/components/status/status.js index 1a7101622..41275a5be 100644 --- a/src/components/status/status.js +++ b/src/components/status/status.js @@ -260,18 +260,47 @@ const Status = { hasMentionsLine () { return this.mentionsLine.length > 0 }, + muteReasons () { + return [ + this.userIsMuted ? 'user' : null, + status.thread_muted ? 'thread' : null, + (this.muteWordHits.length > 0) ? 'wordfilter' : null, + (this.muteBotStatuses && this.botStatus) ? 'bot' : null, + (this.muteSensitiveStatuses && this.sensitiveStatus) ? 'nsfw' : null + ].filter(_ => _) + }, + muteLocalized () { + if (this.muteReasons.length === 0) return null + const mainReason = () => { + switch (this.muteReasons[0]) { + case 'user': return this.$t('status.muted_user') + case 'thread': return this.$t('status.thread_muted') + case 'wordfilter': + return this.$t( + 'status.muted_words', + { + word: this.muteWordHits[0], + numWordsMore: this.muteWordHits.length - 1 + }, + this.muteWordHits.length + ) + case 'bot': return this.$t('status.bot_muted') + case 'nsfw': return this.$t('status.sensitive_muted') + } + } + console.log(this.muteReasons, mainReason()) + return this.$t( + 'status.multi_reason_mute', + { + main: mainReason(), + numReasonsMore: this.muteReasons.length - 1 + }, + this.muteReasons.length - 1 + ) + }, muted () { if (this.statusoid.user.id === this.currentUser.id) return false - const reasonsToMute = this.userIsMuted || - // Thread is muted - status.thread_muted || - // Wordfiltered - this.muteWordHits.length > 0 || - // bot status - (this.muteBotStatuses && this.botStatus && !this.compact) || - // sensitive status - (this.muteSensitiveStatuses && this.sensitiveStatus && !this.compact) - return !this.unmuted && !this.shouldNotMute && reasonsToMute + return !this.unmuted && !this.shouldNotMute && this.muteReasons.length > 0 }, userIsMuted () { if (this.statusoid.user.id === this.currentUser.id) return false diff --git a/src/components/status/status.scss b/src/components/status/status.scss index 85ad24b31..97f0050df 100644 --- a/src/components/status/status.scss +++ b/src/components/status/status.scss @@ -284,15 +284,10 @@ gap: 1ex; & .status-username, - & .mute-thread, - & .mute-words { + & .mute-reason { word-wrap: normal; word-break: normal; white-space: nowrap; - } - - & .status-username, - & .mute-words { text-overflow: ellipsis; overflow: hidden; } @@ -302,19 +297,7 @@ flex: 0 1 auto; margin-right: 0.2em; font-size: smaller; - } - - .mute-thread { - flex: 0 0 auto; - } - - .mute-words { - flex: 1 0 5em; - margin-left: 0.2em; - - &::before { - content: " "; - } + display: flex; } .unmute { diff --git a/src/components/status/status.vue b/src/components/status/status.vue index f3935c483..be286191c 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -30,36 +30,8 @@ :at="false" /> - - {{ $t('status.sensitive_muted') }} - - - {{ $t('status.bot_muted') }} - - - - {{ $t('status.thread_muted') }} - - - {{ $t('status.thread_muted_and_words') }} - - - - {{ muteWordHits.join(', ') }} + + {{ muteLocalized }}