forked from AkkomaGang/akkoma-fe
separate screen_name and screen_name_ui with decoded punycode
This commit is contained in:
parent
59db4582b0
commit
09fe160e8b
14 changed files with 26 additions and 24 deletions
|
@ -10,6 +10,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
|
|||
- Fixed missing highlighted border in expanded conversations again
|
||||
- Fixed some UI jumpiness when opening images particularly in chat view
|
||||
- Fixed chat unread badge looking weird
|
||||
- Fixed punycode names not working properly
|
||||
|
||||
### Changed
|
||||
- Display 'people voted' instead of 'votes' for multi-choice polls
|
||||
|
|
|
@ -42,7 +42,7 @@
|
|||
class="basic-user-card-screen-name"
|
||||
:to="userProfileLink(user)"
|
||||
>
|
||||
@{{ user.screen_name }}
|
||||
@{{ user.screen_name_ui }}
|
||||
</router-link>
|
||||
</div>
|
||||
<slot />
|
||||
|
|
|
@ -73,7 +73,7 @@ const Chat = {
|
|||
},
|
||||
formPlaceholder () {
|
||||
if (this.recipient) {
|
||||
return this.$t('chats.message_user', { nickname: this.recipient.screen_name })
|
||||
return this.$t('chats.message_user', { nickname: this.recipient.screen_name_ui })
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
|
|
|
@ -12,7 +12,7 @@ export default Vue.component('chat-title', {
|
|||
],
|
||||
computed: {
|
||||
title () {
|
||||
return this.user ? this.user.screen_name : ''
|
||||
return this.user ? this.user.screen_name_ui : ''
|
||||
},
|
||||
htmlTitle () {
|
||||
return this.user ? this.user.name_html : ''
|
||||
|
|
|
@ -116,8 +116,8 @@ export const suggestUsers = ({ dispatch, state }) => {
|
|||
|
||||
return diff + nameAlphabetically + screenNameAlphabetically
|
||||
/* eslint-disable camelcase */
|
||||
}).map(({ screen_name, name, profile_image_url_original }) => ({
|
||||
displayText: screen_name,
|
||||
}).map(({ screen_name, screen_name_ui, name, profile_image_url_original }) => ({
|
||||
displayText: screen_name_ui,
|
||||
detailText: name,
|
||||
imageUrl: profile_image_url_original,
|
||||
replacement: '@' + screen_name + ' '
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
>
|
||||
<small>
|
||||
<router-link :to="userProfileLink">
|
||||
{{ notification.from_profile.screen_name }}
|
||||
{{ notification.from_profile.screen_name_ui }}
|
||||
</router-link>
|
||||
</small>
|
||||
<button
|
||||
|
@ -54,14 +54,14 @@
|
|||
<bdi
|
||||
v-if="!!notification.from_profile.name_html"
|
||||
class="username"
|
||||
:title="'@'+notification.from_profile.screen_name"
|
||||
:title="'@'+notification.from_profile.screen_name_ui"
|
||||
v-html="notification.from_profile.name_html"
|
||||
/>
|
||||
<!-- eslint-enable vue/no-v-html -->
|
||||
<span
|
||||
v-else
|
||||
class="username"
|
||||
:title="'@'+notification.from_profile.screen_name"
|
||||
:title="'@'+notification.from_profile.screen_name_ui"
|
||||
>{{ notification.from_profile.name }}</span>
|
||||
<span v-if="notification.type === 'like'">
|
||||
<FAIcon
|
||||
|
@ -152,7 +152,7 @@
|
|||
:to="userProfileLink"
|
||||
class="follow-name"
|
||||
>
|
||||
@{{ notification.from_profile.screen_name }}
|
||||
@{{ notification.from_profile.screen_name_ui }}
|
||||
</router-link>
|
||||
<div
|
||||
v-if="notification.type === 'follow_request'"
|
||||
|
@ -177,7 +177,7 @@
|
|||
class="move-text"
|
||||
>
|
||||
<router-link :to="targetUserProfileLink">
|
||||
@{{ notification.target.screen_name }}
|
||||
@{{ notification.target.screen_name_ui }}
|
||||
</router-link>
|
||||
</div>
|
||||
<template v-else>
|
||||
|
|
|
@ -136,7 +136,7 @@ const Status = {
|
|||
}
|
||||
},
|
||||
retweet () { return !!this.statusoid.retweeted_status },
|
||||
retweeter () { return this.statusoid.user.name || this.statusoid.user.screen_name },
|
||||
retweeter () { return this.statusoid.user.name || this.statusoid.user.screen_name_ui },
|
||||
retweeterHtml () { return this.statusoid.user.name_html },
|
||||
retweeterProfileLink () { return this.generateUserProfileLink(this.statusoid.user.id, this.statusoid.user.screen_name) },
|
||||
status () {
|
||||
|
@ -216,7 +216,7 @@ const Status = {
|
|||
return this.status.in_reply_to_screen_name
|
||||
} else {
|
||||
const user = this.$store.getters.findUser(this.status.in_reply_to_user_id)
|
||||
return user && user.screen_name
|
||||
return user && user.screen_name_ui
|
||||
}
|
||||
},
|
||||
replySubject () {
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
icon="retweet"
|
||||
/>
|
||||
<router-link :to="userProfileLink">
|
||||
{{ status.user.screen_name }}
|
||||
{{ status.user.screen_name_ui }}
|
||||
</router-link>
|
||||
</small>
|
||||
<small
|
||||
|
@ -156,10 +156,10 @@
|
|||
</h4>
|
||||
<router-link
|
||||
class="account-name"
|
||||
:title="status.user.screen_name"
|
||||
:title="status.user.screen_name_ui"
|
||||
:to="userProfileLink"
|
||||
>
|
||||
{{ status.user.screen_name }}
|
||||
{{ status.user.screen_name_ui }}
|
||||
</router-link>
|
||||
<img
|
||||
v-if="!!(status.user && status.user.favicon)"
|
||||
|
|
|
@ -2,8 +2,8 @@
|
|||
<StillImage
|
||||
v-if="user"
|
||||
class="Avatar"
|
||||
:alt="user.screen_name"
|
||||
:title="user.screen_name"
|
||||
:alt="user.screen_name_ui"
|
||||
:title="user.screen_name_ui"
|
||||
:src="imgSrc(user.profile_image_url_original)"
|
||||
:class="{ 'avatar-compact': compact, 'better-shadow': betterShadow }"
|
||||
:image-load-error="imageLoadError"
|
||||
|
|
|
@ -73,10 +73,10 @@
|
|||
<div class="bottom-line">
|
||||
<router-link
|
||||
class="user-screen-name"
|
||||
:title="user.screen_name"
|
||||
:title="user.screen_name_ui"
|
||||
:to="userProfileLink(user)"
|
||||
>
|
||||
@{{ user.screen_name }}
|
||||
@{{ user.screen_name_ui }}
|
||||
</router-link>
|
||||
<template v-if="!hideBio">
|
||||
<span
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
<!-- eslint-disable vue/no-v-html -->
|
||||
<span v-html="user.name_html" />
|
||||
<!-- eslint-enable vue/no-v-html -->
|
||||
<span class="user-list-screen-name">{{ user.screen_name }}</span>
|
||||
<span class="user-list-screen-name">{{ user.screen_name_ui }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
<div class="user-reporting-panel panel">
|
||||
<div class="panel-heading">
|
||||
<div class="title">
|
||||
{{ $t('user_reporting.title', [user.screen_name]) }}
|
||||
{{ $t('user_reporting.title', [user.screen_name_ui]) }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
|
|
|
@ -203,7 +203,8 @@ export const parseUser = (data) => {
|
|||
output.rights = output.rights || {}
|
||||
output.notification_settings = output.notification_settings || {}
|
||||
|
||||
// Convert punycode to unicode
|
||||
// Convert punycode to unicode for UI
|
||||
output.screen_name_ui = output.screen_name
|
||||
if (output.screen_name.includes('@')) {
|
||||
const parts = output.screen_name.split('@')
|
||||
let unicodeDomain = punycode.toUnicode(parts[1])
|
||||
|
@ -211,7 +212,7 @@ export const parseUser = (data) => {
|
|||
// Add some identifier so users can potentially spot spoofing attempts:
|
||||
// lain.com and xn--lin-6cd.com would appear identical otherwise.
|
||||
unicodeDomain = '🌏' + unicodeDomain
|
||||
output.screen_name = [parts[0], unicodeDomain].join('@')
|
||||
output.screen_name_ui = [parts[0], unicodeDomain].join('@')
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -315,7 +315,7 @@ describe('API Entities normalizer', () => {
|
|||
it('converts IDN to unicode and marks it as internatonal', () => {
|
||||
const user = makeMockUserMasto({ acct: 'lain@xn--lin-6cd.com' })
|
||||
|
||||
expect(parseUser(user)).to.have.property('screen_name').that.equal('lain@🌏lаin.com')
|
||||
expect(parseUser(user)).to.have.property('screen_name_ui').that.equal('lain@🌏lаin.com')
|
||||
})
|
||||
})
|
||||
|
||||
|
|
Loading…
Reference in a new issue