Use 'userProfileLink' to generate user-profile link

This commit is contained in:
Maxim Filippov 2018-12-13 19:57:11 +03:00
parent 70c48a076d
commit e4a34cc4d4
14 changed files with 58 additions and 28 deletions
src
test/unit/specs/services/user_profile_link_generator

View file

@ -13,7 +13,7 @@ const chatPanel = {
return this.$store.state.chat.messages
},
userProfileLink (user) {
return generateProfileLink(user, user.name)
return generateProfileLink(user.id, user.screen_name)
}
},
methods: {

View file

@ -13,8 +13,10 @@
<img :src="message.author.avatar" />
</span>
<div class="chat-content">
<router-link class="chat-name" :to="userProfileLink(message.author)">
{{message.author.username}}
<router-link
class="chat-name"
:to="userProfileLink(message.author)">
{{message.author.username}}
</router-link>
<br>
<span class="chat-text">
@ -67,9 +69,6 @@
overflow-x: hidden;
}
.chat-name {
}
.chat-message {
display: flex;
padding: 0.2em 0.5em

View file

@ -2,6 +2,7 @@ import Status from '../status/status.vue'
import StillImage from '../still-image/still-image.vue'
import UserCardContent from '../user_card_content/user_card_content.vue'
import { highlightClass, highlightStyle } from '../../services/user_highlighter/user_highlighter.js'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
const Notification = {
data () {
@ -28,6 +29,9 @@ const Notification = {
const highlight = this.$store.state.config.highlight
const user = this.notification.action.user
return highlightStyle(highlight[user.screen_name])
},
userProfileLink (user) {
return generateProfileLink(user.id, user.screen_name)
}
}
}

View file

@ -28,7 +28,9 @@
<small class="timeago"><router-link v-if="notification.status" :to="{ name: 'conversation', params: { id: notification.status.id } }"><timeago :since="notification.action.created_at" :auto-update="240"></timeago></router-link></small>
</span>
<div class="follow-text" v-if="notification.type === 'follow'">
<router-link :to="{ name: 'user-profile', params: { name: notification.action.user.screen_name } }">@{{notification.action.user.screen_name}}</router-link>
<router-link :to="userProfileLink(notification.action.user)">
@{{notification.action.user.screen_name}}
</router-link>
</div>
<template v-else>
<status v-if="notification.status" class="faint" :compact="true" :statusoid="notification.status" :noHeading="true"></status>

View file

@ -7,6 +7,7 @@ import UserCardContent from '../user_card_content/user_card_content.vue'
import StillImage from '../still-image/still-image.vue'
import { filter, find } from 'lodash'
import { highlightClass, highlightStyle } from '../../services/user_highlighter/user_highlighter.js'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
const Status = {
name: 'Status',
@ -203,6 +204,9 @@ const Status = {
return 'small'
}
return 'normal'
},
userProfileLink (id, name) {
return generateProfileLink(id, name)
}
},
components: {

View file

@ -2,7 +2,11 @@
<div class="status-el" v-if="!hideReply && !deleted" :class="[{ 'status-el_focused': isFocused }, { 'status-conversation': inlineExpanded }]">
<template v-if="muted && !noReplyLinks">
<div class="media status container muted">
<small><router-link :to="{ name: 'user-profile', params: { name: status.user.screen_name } }">{{status.user.screen_name}}</router-link></small>
<small>
<router-link :to="userProfileLink(status.user.id, status.user.screen_name)">
{{status.user.screen_name}}
</router-link>
</small>
<small class="muteWords">{{muteWordHits.join(', ')}}</small>
<a href="#" class="unmute" @click.prevent="toggleMute"><i class="icon-eye-off"></i></a>
</div>
@ -34,10 +38,12 @@
<h4 class="user-name" v-if="status.user.name_html" v-html="status.user.name_html"></h4>
<h4 class="user-name" v-else>{{status.user.name}}</h4>
<span class="links">
<router-link :to="{ name: 'user-profile', params: { name: status.user.screen_name } }">{{status.user.screen_name}}</router-link>
<router-link :to="userProfileLink(status.user.id, status.user.screen_name)">
{{status.user.screen_name}}
</router-link>
<span v-if="status.in_reply_to_screen_name" class="faint reply-info">
<i class="icon-right-open"></i>
<router-link :to="{ name: 'user-profile', params: { id: status.in_reply_to_screen_name } }">
<router-link :to="userProfileLink(status.in_reply_to_user_id, status.in_reply_to_screen_name)">
{{status.in_reply_to_screen_name}}
</router-link>
</span>

View file

@ -1,4 +1,5 @@
import UserCardContent from '../user_card_content/user_card_content.vue'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
const UserCard = {
props: [
@ -26,6 +27,11 @@ const UserCard = {
this.$store.state.api.backendInteractor.denyUser(this.user.id)
this.$store.dispatch('removeFollowRequest', this.user)
}
},
computed: {
userProfileLink (user) {
return generateProfileLink(user.id, user.screen_name)
}
}
}

View file

@ -19,7 +19,8 @@
{{ $t('user_card.follows_you') }}
</span>
</div>
<router-link class='user-screen-name' :to="{ name: 'user-profile', params: { name: user.screen_name } }">
<router-link class='user-screen-name' :to="userProfileLink(user)">
@{{user.screen_name}}
</router-link>
</div>

View file

@ -1,5 +1,6 @@
import StillImage from '../still-image/still-image.vue'
import { hex2rgb } from '../../services/color_convert/color_convert.js'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
export default {
props: [ 'user', 'switcher', 'selected', 'hideBio', 'activatePanel' ],
@ -40,6 +41,9 @@ export default {
const days = Math.ceil((new Date() - new Date(this.user.created_at)) / (60 * 60 * 24 * 1000))
return Math.round(this.user.statuses_count / days)
},
userProfileLink (user) {
return generateProfileLink(user.id, user.screen_name)
},
userHighlightType: {
get () {
const data = this.$store.state.config.highlight[this.user.screen_name]

View file

@ -9,13 +9,13 @@
<i class="icon-link-ext usersettings"></i>
</a>
<div class='container'>
<router-link :to="{ name: 'user-profile', params: { name: user.screen_name } }">
<router-link :to="userProfileLink(user)">
<StillImage class="avatar" :src="user.profile_image_url_original"/>
</router-link>
<div class="name-and-screen-name">
<div :title="user.name" class='user-name' v-if="user.name_html" v-html="user.name_html"></div>
<div :title="user.name" class='user-name' v-else>{{user.name}}</div>
<router-link class='user-screen-name' :to="{ name: 'user-profile', params: { name: user.screen_name } }">
<router-link class='user-screen-name' :to="userProfileLink(user)">
<span>@{{user.screen_name}}</span><span v-if="user.locked"><i class="icon icon-lock"></i></span>
<span v-if="!hideUserStatsLocal" class="dailyAvg">{{dailyAvg}} {{ $t('user_card.per_day') }}</span>
</router-link>

View file

@ -1,4 +1,5 @@
import apiService from '../../services/api/api.service.js'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
function showWhoToFollow (panel, reply) {
var users = reply
@ -91,6 +92,9 @@ const WhoToFollowPanel = {
},
suggestionsEnabled () {
return this.$store.state.instance.suggestionsEnabled
},
userProfileLink (id, name) {
return generateProfileLink(id, name)
}
},
watch: {

View file

@ -8,9 +8,9 @@
</div>
<div class="panel-body who-to-follow">
<p>
<img v-bind:src="img1"/> <router-link :to="{ name: 'user-profile', params: { name: name1 } }">{{ name1 }}</router-link><br>
<img v-bind:src="img2"/> <router-link :to="{ name: 'user-profile', params: { name: name2 } }">{{ name2 }}</router-link><br>
<img v-bind:src="img3"/> <router-link :to="{ name: 'user-profile', params: { name: name3 } }">{{ name3 }}</router-link><br>
<img v-bind:src="img1"/> <router-link :to="userProfileLink(id1, name1)">{{ name1 }}</router-link><br>
<img v-bind:src="img2"/> <router-link :to="userProfileLink(id2, name2)">{{ name2 }}</router-link><br>
<img v-bind:src="img3"/> <router-link :to="userProfileLink(id3, name3)">{{ name3 }}</router-link><br>
<img v-bind:src="$store.state.instance.logo"> <a v-bind:href="moreUrl" target="_blank">{{$t('who_to_follow.more')}}</a>
</p>
</div>

View file

@ -1,10 +1,10 @@
const generateProfileLink = (user, name = '') => {
const baseLinkParams = { name: 'user-profile' }
const { id } = user
return { ...baseLinkParams, params: (isExternal(user) ? { id } : { name }) }
const generateProfileLink = (id, screenName) => {
return {
name: 'user-profile',
params: (isExternal(screenName) ? { id } : { name: screenName })
}
}
const isExternal = ({screen_name}) => (screen_name.indexOf('@') > -1)
const isExternal = screenName => (screenName.indexOf('@') > -1)
export default generateProfileLink

View file

@ -2,14 +2,14 @@ import generateProfileLink from 'src/services/user_profile_link_generator/user_p
describe('generateProfileLink', () => {
it('returns obj for local user', () => {
const user = { screen_name: 'john' }
expect(generateProfileLink(user, 'jack')).to.eql({ name: 'user-profile', params: { name: 'jack' } })
expect(generateProfileLink(1, 'jack')).to.eql({
name: 'user-profile', params: { name: 'jack' }
})
})
it('returns obj for external user', () => {
const user = { screen_name: 'john@domain', id: 1 }
expect(generateProfileLink(user)).to.eql({ name: 'user-profile', params: { id: 1 } })
expect(generateProfileLink(1, 'john@domain')).to.eql({
name: 'user-profile', params: { id: 1 }
})
})
})