commit: 9ea370033af450c0d5e4650a7c10f0e1ffec911c
parent 3abd357694c29c84d213d7d2a7a954ab2a591da0
Author: Henry Jameson <me@hjkos.com>
Date: Tue, 8 Jun 2021 12:58:28 +0300
configurable mentions placement
Diffstat:
9 files changed, 75 insertions(+), 53 deletions(-)
diff --git a/src/components/mention_link/mention_link.js b/src/components/mention_link/mention_link.js
@@ -13,11 +13,6 @@ const MentionLink = {
required: true,
type: String
},
- origattrs: {
- required: false,
- type: Object,
- default: {}
- },
firstMention: {
required: false,
type: Boolean,
@@ -56,6 +51,12 @@ const MentionLink = {
highlightClass () {
if (this.highlight) return highlightClass(this.user)
},
+ oldPlace () {
+ return this.mergedConfig.mentionsOldPlace
+ },
+ oldStyle () {
+ return this.mergedConfig.mentionsOldStyle
+ },
style () {
if (this.highlight) {
const {
@@ -72,7 +73,8 @@ const MentionLink = {
{
'-you': this.isYou,
'-highlighted': this.highlight,
- '-firstMention': this.firstMention
+ '-firstMention': this.firstMention,
+ '-oldStyle': this.oldStyle
},
this.highlightType
]
diff --git a/src/components/mention_link/mention_link.scss b/src/components/mention_link/mention_link.scss
@@ -3,6 +3,7 @@
white-space: normal;
display: inline-block;
color: var(--link);
+ margin-right: 0.25em;
& .new,
& .original {
@@ -33,23 +34,25 @@
& .short,
& .full {
&::before {
- color: var(--faint);
content: '@';
}
}
.new {
- &.-firstMention {
- display: none;
+ &.-you {
+ & .shortName,
+ & .full {
+ font-weight: 600;
+ }
}
- &,
- &.-highlighted {
+ &:not(.-oldStyle) {
.short {
line-height: 1.5;
font-size: inherit;
&::before {
+ color: var(--faint);
display: inline-block;
height: 50%;
line-height: 1;
@@ -111,12 +114,9 @@
}
}
- .new {
- &.-you {
- & .shortName,
- & .full {
- font-weight: 600;
- }
+ &:not(.-oldPlace) {
+ .new.-firstMention {
+ display: none;
}
}
diff --git a/src/components/mention_link/mention_link.vue b/src/components/mention_link/mention_link.vue
@@ -1,5 +1,8 @@
<template>
- <span class="MentionLink">
+<span
+ class="MentionLink"
+ :class="{ '-oldPlace': oldPlace }"
+>
<!-- eslint-disable vue/no-v-html -->
<a
v-if="!user"
@@ -15,8 +18,8 @@
:class="classnames"
>
<button
- class="short button-default"
- :class="{ '-sublime': !highlight }"
+ class="short"
+ :class="[{ '-sublime': !highlight }, oldStyle ? 'button-unstyled' : 'button-default']"
@click.prevent="onClick"
>
<!-- eslint-disable vue/no-v-html -->
diff --git a/src/components/rich_content/rich_content.jsx b/src/components/rich_content/rich_content.jsx
@@ -38,7 +38,6 @@ export default Vue.component('RichContent', {
url={attrs.href}
content={flattenDeep(children).join('')}
firstMention={!encounteredText}
- origattrs={attrs}
/>
}
diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue
@@ -37,6 +37,16 @@
</BooleanSetting>
</li>
<li>
+ <BooleanSetting path="mentionsOldPlace">
+ {{ $t('settings.mentions_old_place') }}
+ </BooleanSetting>
+ </li>
+ <li>
+ <BooleanSetting path="mentionsOldStyle">
+ {{ $t('settings.mentions_old_style') }}
+ </BooleanSetting>
+ </li>
+ <li>
<BooleanSetting path="streaming">
{{ $t('settings.streaming') }}
</BooleanSetting>
diff --git a/src/components/status/status.js b/src/components/status/status.js
@@ -105,6 +105,9 @@ const Status = {
muteWords () {
return this.mergedConfig.muteWords
},
+ mentionsOldPlace () {
+ return this.mergedConfig.mentionsOldPlace
+ },
showReasonMutedThread () {
return (
this.status.thread_muted ||
@@ -137,7 +140,7 @@ const Status = {
return this.generateUserProfileLink(this.status.user.id, this.status.user.screen_name)
},
replyProfileLink () {
- return this.$store.getters.findUser(this.status.in_reply_to_screen_name).statusnet_profile_url
+ return this.$store.getters.findUser(this.status.in_reply_to_user_id).statusnet_profile_url
},
retweet () { return !!this.statusoid.retweeted_status },
retweeterUser () { return this.statusoid.user },
@@ -163,7 +166,8 @@ const Status = {
},
mentions () {
return this.statusoid.attentions.filter(attn => {
- return attn.screen_name !== this.replyToName
+ return attn.screen_name !== this.replyToName &&
+ attn.screen_name !== this.statusoid.user.screen_name
})
},
hasMentions () {
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
@@ -221,36 +221,6 @@
</button>
</span>
</div>
-
- <div v-if="hasMentions" class="heading-mentions-row">
- <div
- class="mentions"
- >
- <span
- class="button-unstyled reply-to"
- :aria-label="$t('tool_tip.reply')"
- @click.prevent="gotoOriginal(status.in_reply_to_status_id)"
- >
- <FAIcon
- class="fa-scale-110 fa-old-padding"
- icon="at"
- />
- <span
- class="faint-link reply-to-text"
- >
- {{ $t('status.mentions') }}
- </span>
- </span>
- <MentionLink
- v-for="mention in mentions"
- class="mention-link"
- :key="mention.statusnet_profile_url"
- :content="mention.statusnet_profile_url"
- :url="mention.statusnet_profile_url"
- :first-mention="false"
- />
- </div>
- </div>
<div class="heading-reply-row">
<div
v-if="isReply"
@@ -320,6 +290,36 @@
</StatusPopover>
</div>
</div>
+
+ <div v-if="hasMentions && !mentionsOldPlace" class="heading-mentions-row">
+ <div
+ class="mentions"
+ >
+ <span
+ class="button-unstyled reply-to"
+ :aria-label="$t('tool_tip.reply')"
+ @click.prevent="gotoOriginal(status.in_reply_to_status_id)"
+ >
+ <FAIcon
+ class="fa-scale-110 fa-old-padding"
+ icon="at"
+ />
+ <span
+ class="faint-link reply-to-text"
+ >
+ {{ $t('status.mentions') }}
+ </span>
+ </span>
+ <MentionLink
+ v-for="mention in mentions"
+ class="mention-link"
+ :key="mention.statusnet_profile_url"
+ :content="mention.statusnet_profile_url"
+ :url="mention.statusnet_profile_url"
+ :first-mention="false"
+ />
+ </div>
+ </div>
</div>
<StatusContent
diff --git a/src/i18n/en.json b/src/i18n/en.json
@@ -259,6 +259,8 @@
"security": "Security",
"setting_changed": "Setting is different from default",
"enter_current_password_to_confirm": "Enter your current password to confirm your identity",
+ "mentions_old_style": "Old style mentions",
+ "mentions_old_place": "Leave mentions inside post",
"mfa": {
"otp": "OTP",
"setup_otp": "Setup OTP",
diff --git a/src/modules/config.js b/src/modules/config.js
@@ -54,6 +54,8 @@ export const defaultState = {
interfaceLanguage: browserLocale,
hideScopeNotice: false,
useStreamingApi: false,
+ mentionsOldPlace: false,
+ mentionsOldStyle: false,
sidebarRight: undefined, // instance default
scopeCopy: undefined, // instance default
subjectLineBehavior: undefined, // instance default