feat: adjust hide username emojis pref to only hide in timeline (#1631)

This commit is contained in:
Tuur Martens 2023-02-05 14:00:25 +01:00 committed by GitHub
parent 7dfe91bb9d
commit a1b2da3d5e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 28 additions and 20 deletions

View file

@ -1,18 +1,17 @@
<script setup lang="ts">
import type { mastodon } from 'masto'
defineProps<{
const { account, hideEmojis = false } = defineProps<{
account: mastodon.v1.Account
hideEmojis?: boolean
}>()
const userSettings = useUserSettings()
</script>
<template>
<ContentRich
:content="getDisplayName(account, { rich: true })"
:emojis="account.emojis"
:show-emojis="!getPreferences(userSettings, 'hideUsernameEmojis')"
:hide-emojis="hideEmojis"
:markdown="false"
/>
</template>

View file

@ -6,6 +6,8 @@ const { link = true, avatar = true } = defineProps<{
link?: boolean
avatar?: boolean
}>()
const userSettings = useUserSettings()
</script>
<template>
@ -16,7 +18,7 @@ const { link = true, avatar = true } = defineProps<{
min-w-0 flex gap-2 items-center
>
<AccountAvatar v-if="avatar" :account="account" w-5 h-5 />
<AccountDisplayName :account="account" line-clamp-1 ws-pre-wrap break-all />
<AccountDisplayName :account="account" :hide-emojis="getPreferences(userSettings, 'hideUsernameEmojis')" line-clamp-1 ws-pre-wrap break-all />
</NuxtLink>
</AccountHoverWrapper>
</template>

View file

@ -7,12 +7,12 @@ defineOptions({
const {
content,
emojis,
showEmojis = true,
hideEmojis = false,
markdown = true,
} = defineProps<{
content: string
emojis?: mastodon.v1.CustomEmoji[]
showEmojis?: boolean
hideEmojis?: boolean
markdown?: boolean
}>()
@ -23,7 +23,7 @@ export default () => h(
{ class: 'content-rich', dir: 'auto' },
contentToVNode(content, {
emojis: emojisObject.value,
showEmojis,
hideEmojis,
markdown,
}),
)

View file

@ -9,7 +9,7 @@ defineProps<{
<template>
<button
exact-active-class="text-primary"
block w-full group focus:outline-none
block w-full group focus:outline-none text-start
>
<div
w-full flex w-fit px5 py3 md:gap2 gap4 items-center
@ -18,7 +18,8 @@ defineProps<{
>
<div flex-1 flex items-center md:gap2 gap4>
<div
flex items-center justify-center flex-shrink-0
v-if="icon" flex items-center justify-center
flex-shrink-0
:class="$slots.description ? 'w-12 h-12' : ''"
>
<slot name="icon">

View file

@ -5,6 +5,8 @@ const { account, link = true } = defineProps<{
account: mastodon.v1.Account
link?: boolean
}>()
const userSettings = useUserSettings()
</script>
<template>
@ -13,7 +15,7 @@ const { account, link = true } = defineProps<{
flex="~ col" min-w-0 md:flex="~ row gap-2" md:items-center
text-link-rounded
>
<AccountDisplayName :account="account" font-bold line-clamp-1 ws-pre-wrap break-all />
<AccountDisplayName :account="account" :hide-emojis="getPreferences(userSettings, 'hideUsernameEmojis')" font-bold line-clamp-1 ws-pre-wrap break-all />
<AccountHandle :account="account" class="zen-none" />
</NuxtLink>
</template>

View file

@ -8,7 +8,7 @@ import { emojiRegEx, getEmojiAttributes } from '../config/emojis'
export interface ContentParseOptions {
emojis?: Record<string, mastodon.v1.CustomEmoji>
showEmojis?: boolean
hideEmojis?: boolean
mentions?: mastodon.v1.StatusMention[]
markdown?: boolean
replaceUnicodeEmoji?: boolean
@ -82,7 +82,7 @@ export function parseMastodonHTML(
replaceUnicodeEmoji = true,
convertMentionLink = false,
collapseMentionLink = false,
showEmojis = true,
hideEmojis = false,
mentions,
status,
inReplyToStatus,
@ -110,16 +110,16 @@ export function parseMastodonHTML(
...options.astTransforms || [],
]
if (showEmojis) {
if (hideEmojis) {
transforms.push(removeUnicodeEmoji)
transforms.push(removeCustomEmoji(options.emojis ?? {}))
}
else {
if (replaceUnicodeEmoji)
transforms.push(transformUnicodeEmoji)
transforms.push(replaceCustomEmoji(options.emojis ?? {}))
}
else {
transforms.push(removeUnicodeEmoji)
transforms.push(removeCustomEmoji(options.emojis ?? {}))
}
if (markdown)
transforms.push(transformMarkdown)

View file

@ -30,8 +30,8 @@ export function contentToVNode(
const textContents = getTexualAstComponents(tree.children)
// if the username only contains emojis, we should probably show the emojis anyway to avoid a blank name
if (!options?.showEmojis && textContents.length === 0)
tree = parseMastodonHTML(content, { ...options, showEmojis: true })
if (options?.hideEmojis && textContents.length === 0)
tree = parseMastodonHTML(content, { ...options, hideEmojis: false })
return h(Fragment, (tree.children as Node[] || []).map(n => treeToVNode(n)))
}

View file

@ -412,6 +412,7 @@
"hide_reply_count": "Hide reply count",
"hide_translation": "Hide translation",
"hide_username_emojis": "Hide username emojis",
"hide_username_emojis_description": "Hides emojis from usernames in timelines. Emojis will still be visible in their profiles.",
"label": "Preferences",
"title": "Experimental Features",
"user_picker": "User Picker",

View file

@ -78,6 +78,9 @@ const userSettings = useUserSettings()
@click="togglePreferences('hideUsernameEmojis')"
>
{{ $t("settings.preferences.hide_username_emojis") }}
<template #description>
{{ $t('settings.preferences.hide_username_emojis_description') }}
</template>
</SettingsToggleItem>
<h2 px6 py4 mt2 font-bold text-xl flex="~ gap-1" items-center>
<div i-ri-flask-line />