User Cards: Reduxify.

This commit is contained in:
lain 2020-06-30 14:35:11 +02:00
parent c4d7331fd6
commit 2d9ab01575
3 changed files with 38 additions and 21 deletions

View file

@ -16,7 +16,7 @@ const UserAvatar = {
}, },
computed: { computed: {
imgSrc () { imgSrc () {
return this.showPlaceholder ? '/images/avi.png' : this.user.profile_image_url_original return this.showPlaceholder ? '/images/avi.png' : this.user.redux.avatar
} }
}, },
methods: { methods: {

View file

@ -37,22 +37,22 @@
<div class="top-line"> <div class="top-line">
<!-- eslint-disable vue/no-v-html --> <!-- eslint-disable vue/no-v-html -->
<div <div
v-if="user.name_html" v-if="user.redux.display_name_html"
:title="user.name" :title="user.redux.display_name"
class="user-name" class="user-name"
v-html="user.name_html" v-html="user.redux.display_name_html"
/> />
<!-- eslint-enable vue/no-v-html --> <!-- eslint-enable vue/no-v-html -->
<div <div
v-else v-else
:title="user.name" :title="user.redux.display_name"
class="user-name" class="user-name"
> >
{{ user.name }} {{ user.redux.display_name }}
</div> </div>
<a <a
v-if="isOtherUser && !user.is_local" v-if="isOtherUser && !user.redux.is_local"
:href="user.statusnet_profile_url" :href="user.redux.url"
target="_blank" target="_blank"
> >
<i class="icon-link-ext usersettings" /> <i class="icon-link-ext usersettings" />
@ -68,7 +68,7 @@
class="user-screen-name" class="user-screen-name"
:to="userProfileLink(user)" :to="userProfileLink(user)"
> >
@{{ user.screen_name }} @{{ user.redux.acct }}
</router-link> </router-link>
<template v-if="!hideBio"> <template v-if="!hideBio">
<span <span
@ -78,13 +78,13 @@
{{ visibleRole }} {{ visibleRole }}
</span> </span>
<span <span
v-if="user.bot" v-if="user.redux.bot"
class="alert user-role" class="alert user-role"
> >
bot bot
</span> </span>
</template> </template>
<span v-if="user.locked"><i class="icon icon-lock" /></span> <span v-if="user.redux.locked"><i class="icon icon-lock" /></span>
<span <span
v-if="!mergedConfig.hideUserStats && !hideBio" v-if="!mergedConfig.hideUserStats && !hideBio"
class="dailyAvg" class="dailyAvg"
@ -106,14 +106,14 @@
<!-- id's need to be unique, otherwise vue confuses which user-card checkbox belongs to --> <!-- id's need to be unique, otherwise vue confuses which user-card checkbox belongs to -->
<input <input
v-if="userHighlightType !== 'disabled'" v-if="userHighlightType !== 'disabled'"
:id="'userHighlightColorTx'+user.id" :id="'userHighlightColorTx'+user.redux.id"
v-model="userHighlightColor" v-model="userHighlightColor"
class="userHighlightText" class="userHighlightText"
type="text" type="text"
> >
<input <input
v-if="userHighlightType !== 'disabled'" v-if="userHighlightType !== 'disabled'"
:id="'userHighlightColor'+user.id" :id="'userHighlightColor'+user.redux.id"
v-model="userHighlightColor" v-model="userHighlightColor"
class="userHighlightCl" class="userHighlightCl"
type="color" type="color"
@ -123,7 +123,7 @@
class="userHighlightSel select" class="userHighlightSel select"
> >
<select <select
:id="'userHighlightSel'+user.id" :id="'userHighlightSel'+user.redux.id"
v-model="userHighlightType" v-model="userHighlightType"
class="userHighlightSel" class="userHighlightSel"
> >
@ -191,7 +191,7 @@
/> />
</div> </div>
<div <div
v-if="!loggedIn && user.is_local" v-if="!loggedIn && user.redux.is_local"
class="user-interactions" class="user-interactions"
> >
<RemoteFollow :user="user" /> <RemoteFollow :user="user" />
@ -211,36 +211,36 @@
@click.prevent="setProfileView('statuses')" @click.prevent="setProfileView('statuses')"
> >
<h5>{{ $t('user_card.statuses') }}</h5> <h5>{{ $t('user_card.statuses') }}</h5>
<span>{{ user.statuses_count }} <br></span> <span>{{ user.redux.statuses_count }} <br></span>
</div> </div>
<div <div
class="user-count" class="user-count"
@click.prevent="setProfileView('friends')" @click.prevent="setProfileView('friends')"
> >
<h5>{{ $t('user_card.followees') }}</h5> <h5>{{ $t('user_card.followees') }}</h5>
<span>{{ hideFollowsCount ? $t('user_card.hidden') : user.friends_count }}</span> <span>{{ hideFollowsCount ? $t('user_card.hidden') : user.redux.following_count }}</span>
</div> </div>
<div <div
class="user-count" class="user-count"
@click.prevent="setProfileView('followers')" @click.prevent="setProfileView('followers')"
> >
<h5>{{ $t('user_card.followers') }}</h5> <h5>{{ $t('user_card.followers') }}</h5>
<span>{{ hideFollowersCount ? $t('user_card.hidden') : user.followers_count }}</span> <span>{{ hideFollowersCount ? $t('user_card.hidden') : user.redux.followers_count }}</span>
</div> </div>
</div> </div>
<!-- eslint-disable vue/no-v-html --> <!-- eslint-disable vue/no-v-html -->
<p <p
v-if="!hideBio && user.description_html" v-if="!hideBio && user.redux.note_html"
class="user-card-bio" class="user-card-bio"
@click.prevent="linkClicked" @click.prevent="linkClicked"
v-html="user.description_html" v-html="user.redux.note_html"
/> />
<!-- eslint-enable vue/no-v-html --> <!-- eslint-enable vue/no-v-html -->
<p <p
v-else-if="!hideBio" v-else-if="!hideBio"
class="user-card-bio" class="user-card-bio"
> >
{{ user.description }} {{ user.redux.note }}
</p> </p>
</div> </div>
</div> </div>

View file

@ -189,6 +189,23 @@ export const parseUser = (data) => {
output.notification_settings = output.notification_settings || {} output.notification_settings = output.notification_settings || {}
output.redux = data output.redux = data
output.redux.display_name_html = addEmojis(escape(data.display_name), data.emojis)
output.redux.note_html = addEmojis(data.note, data.emojis)
output.redux.fields_html = data.fields.map(field => {
return {
name: addEmojis(field.name, data.emojis),
value: addEmojis(field.value, data.emojis)
}
})
output.redux.fields_text = data.fields.map(field => {
return {
name: unescape(field.name.replace(/<[^>]*>/g, '')),
value: unescape(field.value.replace(/<[^>]*>/g, ''))
}
})
output.redux.is_local = !data.acct.includes('@')
return output return output
} }