17d2eed06a
* better-still-emoji: fix tests prevent infinite update loops remove obsolete tests removed useless code, review change, fixed bug with tall statuses fixed mentions line again remove old emoji added, everything emoji-bearing uses RichContent now richcontent support in polls, user cards and user profiles support richcontent in polls fix tests, add performance test (skipped, doesn't assert anything), tweak max mentions count made the code responsible for showing unwritten mentions actually work remove new options for style and separate line, now groups all chained mentions on a mentionsline regardless of placement. fixes spacing fix tests
199 lines
6 KiB
Vue
199 lines
6 KiB
Vue
<template>
|
|
<Status
|
|
v-if="notification.type === 'mention'"
|
|
:compact="true"
|
|
:statusoid="notification.status"
|
|
/>
|
|
<div v-else>
|
|
<div
|
|
v-if="needMute && !unmuted"
|
|
class="Notification container -muted"
|
|
>
|
|
<small>
|
|
<router-link :to="userProfileLink">
|
|
{{ notification.from_profile.screen_name_ui }}
|
|
</router-link>
|
|
</small>
|
|
<button
|
|
class="button-unstyled unmute"
|
|
@click.prevent="toggleMute"
|
|
>
|
|
<FAIcon
|
|
class="fa-scale-110 fa-old-padding"
|
|
icon="eye-slash"
|
|
/>
|
|
</button>
|
|
</div>
|
|
<div
|
|
v-else
|
|
class="Notification non-mention"
|
|
:class="[userClass, { highlighted: userStyle }, '-type--' + notification.type]"
|
|
:style="[ userStyle ]"
|
|
>
|
|
<a
|
|
class="avatar-container"
|
|
:href="notification.from_profile.statusnet_profile_url"
|
|
@click.stop.prevent.capture="toggleUserExpanded"
|
|
>
|
|
<UserAvatar
|
|
:compact="true"
|
|
:better-shadow="betterShadow"
|
|
:user="notification.from_profile"
|
|
/>
|
|
</a>
|
|
<div class="notification-right">
|
|
<UserCard
|
|
v-if="userExpanded"
|
|
:user-id="getUser(notification).id"
|
|
:rounded="true"
|
|
:bordered="true"
|
|
/>
|
|
<span class="notification-details">
|
|
<div class="name-and-action">
|
|
<!-- eslint-disable vue/no-v-html -->
|
|
<bdi v-if="!!notification.from_profile.name_html">
|
|
<RichContent
|
|
class="username"
|
|
:title="'@'+notification.from_profile.screen_name_ui"
|
|
:html="notification.from_profile.name_html"
|
|
:emoji="notification.from_profile.emoji"
|
|
/>
|
|
</bdi>
|
|
<!-- eslint-enable vue/no-v-html -->
|
|
<span
|
|
v-else
|
|
class="username"
|
|
:title="'@'+notification.from_profile.screen_name_ui"
|
|
>{{ notification.from_profile.name }}</span>
|
|
<span v-if="notification.type === 'like'">
|
|
<FAIcon
|
|
class="type-icon"
|
|
icon="star"
|
|
/>
|
|
<small>{{ $t('notifications.favorited_you') }}</small>
|
|
</span>
|
|
<span v-if="notification.type === 'repeat'">
|
|
<FAIcon
|
|
class="type-icon"
|
|
icon="retweet"
|
|
:title="$t('tool_tip.repeat')"
|
|
/>
|
|
<small>{{ $t('notifications.repeated_you') }}</small>
|
|
</span>
|
|
<span v-if="notification.type === 'follow'">
|
|
<FAIcon
|
|
class="type-icon"
|
|
icon="user-plus"
|
|
/>
|
|
<small>{{ $t('notifications.followed_you') }}</small>
|
|
</span>
|
|
<span v-if="notification.type === 'follow_request'">
|
|
<FAIcon
|
|
class="type-icon"
|
|
icon="user"
|
|
/>
|
|
<small>{{ $t('notifications.follow_request') }}</small>
|
|
</span>
|
|
<span v-if="notification.type === 'move'">
|
|
<FAIcon
|
|
class="type-icon"
|
|
icon="suitcase-rolling"
|
|
/>
|
|
<small>{{ $t('notifications.migrated_to') }}</small>
|
|
</span>
|
|
<span v-if="notification.type === 'pleroma:emoji_reaction'">
|
|
<small>
|
|
<i18n path="notifications.reacted_with">
|
|
<span class="emoji-reaction-emoji">{{ notification.emoji }}</span>
|
|
</i18n>
|
|
</small>
|
|
</span>
|
|
</div>
|
|
<div
|
|
v-if="isStatusNotification"
|
|
class="timeago"
|
|
>
|
|
<router-link
|
|
v-if="notification.status"
|
|
:to="{ name: 'conversation', params: { id: notification.status.id } }"
|
|
class="faint-link"
|
|
>
|
|
<Timeago
|
|
:time="notification.created_at"
|
|
:auto-update="240"
|
|
/>
|
|
</router-link>
|
|
</div>
|
|
<div
|
|
v-else
|
|
class="timeago"
|
|
>
|
|
<span class="faint">
|
|
<Timeago
|
|
:time="notification.created_at"
|
|
:auto-update="240"
|
|
/>
|
|
</span>
|
|
</div>
|
|
<button
|
|
v-if="needMute"
|
|
class="button-unstyled"
|
|
@click.prevent="toggleMute"
|
|
>
|
|
<FAIcon
|
|
class="fa-scale-110 fa-old-padding"
|
|
icon="eye-slash"
|
|
/>
|
|
</button>
|
|
</span>
|
|
<div
|
|
v-if="notification.type === 'follow' || notification.type === 'follow_request'"
|
|
class="follow-text"
|
|
>
|
|
<router-link
|
|
:to="userProfileLink"
|
|
class="follow-name"
|
|
>
|
|
@{{ notification.from_profile.screen_name_ui }}
|
|
</router-link>
|
|
<div
|
|
v-if="notification.type === 'follow_request'"
|
|
style="white-space: nowrap;"
|
|
>
|
|
<FAIcon
|
|
icon="check"
|
|
class="fa-scale-110 fa-old-padding follow-request-accept"
|
|
:title="$t('tool_tip.accept_follow_request')"
|
|
@click="approveUser()"
|
|
/>
|
|
<FAIcon
|
|
icon="times"
|
|
class="fa-scale-110 fa-old-padding follow-request-reject"
|
|
:title="$t('tool_tip.reject_follow_request')"
|
|
@click="denyUser()"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div
|
|
v-else-if="notification.type === 'move'"
|
|
class="move-text"
|
|
>
|
|
<router-link :to="targetUserProfileLink">
|
|
@{{ notification.target.screen_name_ui }}
|
|
</router-link>
|
|
</div>
|
|
<template v-else>
|
|
<StatusContent
|
|
class="faint"
|
|
:compact="true"
|
|
:status="notification.action"
|
|
/>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script src="./notification.js"></script>
|
|
<style src="./notification.scss" lang="scss"></style>
|