feat: adjust hide username emojis pref to only hide in timeline (#1631)
This commit is contained in:
parent
7dfe91bb9d
commit
a1b2da3d5e
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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,
|
||||
}),
|
||||
)
|
||||
|
|
|
@ -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">
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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)
|
||||
|
|
|
@ -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)))
|
||||
}
|
||||
|
|
|
@ -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",
|
||||
|
|
|
@ -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 />
|
||||
|
|
Loading…
Reference in a new issue