33 lines
1.1 KiB
HTML
33 lines
1.1 KiB
HTML
<span class="account-display-name">{@html massagedAccountName }</span>
|
|
<style>
|
|
.account-display-name {
|
|
pointer-events: none; /* allows focus to work correctly, focus on the parent only */
|
|
}
|
|
</style>
|
|
<script>
|
|
import { emojifyText } from '../../_utils/emojifyText'
|
|
import { store } from '../../_store/store'
|
|
import escapeHtml from 'escape-html'
|
|
import { removeEmoji } from '../../_utils/removeEmoji'
|
|
|
|
export default {
|
|
store: () => store,
|
|
computed: {
|
|
emojis: ({ account }) => (account.emojis || []),
|
|
accountName: ({ account }) => (account.display_name || account.username),
|
|
massagedAccountName: ({ accountName, emojis, $autoplayGifs, $omitEmojiInDisplayNames }) => {
|
|
accountName = escapeHtml(accountName)
|
|
|
|
if ($omitEmojiInDisplayNames) { // display name emoji are annoying to some screenreader users
|
|
let emojiFreeDisplayName = removeEmoji(accountName, emojis)
|
|
if (emojiFreeDisplayName) {
|
|
return emojiFreeDisplayName
|
|
}
|
|
}
|
|
|
|
return emojifyText(accountName, emojis, $autoplayGifs)
|
|
}
|
|
}
|
|
}
|
|
</script>
|