Add bot indication to user icon on statuses

This commit is contained in:
Alexander Tumin 2022-03-01 00:35:00 +03:00
parent fe0ed7e8f0
commit 2b7f12613e
10 changed files with 43 additions and 3 deletions

View file

@ -115,6 +115,7 @@ const setSettings = async ({ apiConfig, staticConfig, store }) => {
copyInstanceOption('nsfwCensorImage')
copyInstanceOption('background')
copyInstanceOption('hidePostStats')
copyInstanceOption('hideBotIndication')
copyInstanceOption('hideUserStats')
copyInstanceOption('hideFilteredStatuses')
copyInstanceOption('logo')

View file

@ -47,6 +47,11 @@
{{ $t('settings.hide_post_stats') }}
</BooleanSetting>
</li>
<li>
<BooleanSetting path="hideBotIndication">
{{ $t('settings.hide_bot_indication') }}
</BooleanSetting>
</li>
<ChoiceSetting
id="replyVisibility"
path="replyVisibility"

View file

@ -169,6 +169,9 @@ const Status = {
botStatus () {
return this.status.user.bot
},
botIndicator () {
return this.botStatus && !this.hideBotIndication
},
mentionsLine () {
if (!this.headTailLinks) return []
const writtenSet = new Set(this.headTailLinks.writtenMentions.map(_ => _.url))
@ -301,6 +304,9 @@ const Status = {
muteBotStatuses () {
return this.mergedConfig.muteBotStatuses
},
hideBotIndication () {
return this.mergedConfig.hideBotIndication
},
currentUser () {
return this.$store.state.users.currentUser
},

View file

@ -77,6 +77,7 @@
<UserAvatar
v-if="retweet"
class="left-side repeater-avatar"
:bot="botIndicator"
:better-shadow="betterShadow"
:user="statusoid.user"
/>
@ -124,6 +125,7 @@
@click.stop.prevent.capture.native="toggleUserExpanded"
>
<UserAvatar
:bot="botIndicator"
:compact="compact"
:better-shadow="betterShadow"
:user="status.user"
@ -407,7 +409,10 @@
class="gravestone"
>
<div class="left-side">
<UserAvatar :compact="compact" />
<UserAvatar
:compact="compact"
:bot="botIndicator"
/>
</div>
<div class="right-side">
<div class="deleted-text">

View file

@ -19,6 +19,7 @@
@load="onLoad"
@error="onError"
>
<slot/>
</div>
</template>

View file

@ -1,10 +1,21 @@
import StillImage from '../still-image/still-image.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faRobot
} from '@fortawesome/free-solid-svg-icons'
library.add(
faRobot
)
const UserAvatar = {
props: [
'user',
'betterShadow',
'compact'
'compact',
'bot'
],
data () {
return {

View file

@ -7,7 +7,9 @@
:src="imgSrc(user.profile_image_url_original)"
:class="{ 'avatar-compact': compact, 'better-shadow': betterShadow }"
:image-load-error="imageLoadError"
/>
>
<FAIcon v-if="bot" icon="robot" class="bot-indicator" />
</StillImage>
<div
v-else
class="Avatar -placeholder"
@ -36,6 +38,12 @@
height: 100%;
}
& > .bot-indicator {
position: absolute;
bottom: 0;
right: 0;
}
&.better-shadow {
box-shadow: var(--_avatarShadowInset);
filter: var(--_avatarShadowFilter);

View file

@ -352,6 +352,7 @@
"hide_media_previews": "Hide media previews",
"hide_muted_posts": "Hide posts of muted users",
"mute_bot_posts": "Mute bot posts",
"hide_bot_indication": "Hide bot indication in posts",
"hide_all_muted_posts": "Hide muted posts",
"max_thumbnails": "Maximum amount of thumbnails per post (empty = no limit)",
"hide_isp": "Hide instance-specific panel",

View file

@ -80,6 +80,7 @@ export const defaultState = {
mentionLinkShowYous: undefined, // instance default
mentionLinkBoldenYou: undefined, // instance default
hidePostStats: undefined, // instance default
hideBotIndication: undefined, // instance default
hideUserStats: undefined, // instance default
virtualScrolling: undefined, // instance default
sensitiveByDefault: undefined // instance default

View file

@ -33,6 +33,7 @@ const defaultState = {
hideMutedThreads: true,
hideWordFilteredPosts: false,
hidePostStats: false,
hideBotIndication: false,
hideSitename: false,
hideUserStats: false,
muteBotStatuses: false,