Enable reply/rt/fav for mention notifications by using a barebones status in place of plain notification content.
This commit is contained in:
parent
e621be1428
commit
5ad4d043e7
|
@ -1,3 +1,5 @@
|
|||
import Status from '../status/status.vue'
|
||||
|
||||
import { sortBy, take, filter } from 'lodash'
|
||||
|
||||
const Notifications = {
|
||||
|
@ -23,6 +25,9 @@ const Notifications = {
|
|||
return this.unseenNotifications.length
|
||||
}
|
||||
},
|
||||
components: {
|
||||
Status
|
||||
},
|
||||
watch: {
|
||||
unseenCount (count) {
|
||||
if (count > 0) {
|
||||
|
|
|
@ -45,11 +45,11 @@
|
|||
word-wrap: break-word;
|
||||
line-height:18px;
|
||||
|
||||
.icon-retweet {
|
||||
.icon-retweet.lit {
|
||||
color: $green;
|
||||
}
|
||||
|
||||
.icon-reply {
|
||||
.icon-reply.lit {
|
||||
color: $blue;
|
||||
}
|
||||
|
||||
|
|
|
@ -11,30 +11,30 @@
|
|||
<a :href="notification.action.user.statusnet_profile_url">
|
||||
<img class='avatar' :src="notification.action.user.profile_image_url_original">
|
||||
</a>
|
||||
<div class='text'>
|
||||
<div class='text' style="width: 100%;">
|
||||
<div v-if="notification.type === 'favorite'">
|
||||
<h1>
|
||||
{{ notification.action.user.name }}
|
||||
<i class="fa icon-star"></i>
|
||||
<small><router-link :to="{ name: 'conversation', params: { id: notification.status.id } }"><timeago :since="notification.action.created_at" :auto-update="240"></timeago></router-link></small>
|
||||
</h1>
|
||||
<p>{{ notification.status.text }}</p>
|
||||
<div v-html="notification.status.statusnet_html"></div>
|
||||
</div>
|
||||
<div v-if="notification.type === 'repeat'">
|
||||
<h1>
|
||||
{{ notification.action.user.name }}
|
||||
<i class="fa icon-retweet"></i>
|
||||
<i class="fa icon-retweet lit"></i>
|
||||
<small><router-link :to="{ name: 'conversation', params: { id: notification.status.id } }"><timeago :since="notification.action.created_at" :auto-update="240"></timeago></router-link></small>
|
||||
</h1>
|
||||
<p>{{ notification.status.text }}</p>
|
||||
<div v-html="notification.status.statusnet_html"></div>
|
||||
</div>
|
||||
<div v-if="notification.type === 'mention'">
|
||||
<h1>
|
||||
{{ notification.action.user.name }}
|
||||
<i class="fa icon-reply"></i>
|
||||
<i class="fa icon-reply lit"></i>
|
||||
<small><router-link :to="{ name: 'conversation', params: { id: notification.status.id } }"><timeago :since="notification.action.created_at" :auto-update="240"></timeago></router-link></small>
|
||||
</h1>
|
||||
<p>{{ notification.status.text }}</p>
|
||||
<status :compact="true" :statusoid="notification.status"></status>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -12,7 +12,8 @@ const Status = {
|
|||
'expandable',
|
||||
'inConversation',
|
||||
'focused',
|
||||
'highlight'
|
||||
'highlight',
|
||||
'compact'
|
||||
],
|
||||
data: () => ({
|
||||
replying: false,
|
||||
|
|
|
@ -1,5 +1,20 @@
|
|||
<template>
|
||||
<div class="status-el base00-background base03-border" v-if="!status.deleted" v-bind:class="[{ 'base01-background': isFocused }, { 'status-conversation': inConversation }]" >
|
||||
<div class="status-el base00-background" v-if="compact">
|
||||
<div @click.prevent="linkClicked" class="status-content" v-html="status.statusnet_html"></div>
|
||||
<div v-if="loggedIn">
|
||||
<div class='status-actions'>
|
||||
<div>
|
||||
<a href="#" v-on:click.prevent="toggleReplying">
|
||||
<i class="fa icon-reply" :class="{'icon-reply-active': replying}"></i>
|
||||
</a>
|
||||
</div>
|
||||
<retweet-button :status=status></retweet-button>
|
||||
<favorite-button :status=status></favorite-button>
|
||||
</div>
|
||||
</div>
|
||||
<post-status-form class="reply-body" :reply-to="status.id" :attentions="status.attentions" :repliedUser="status.user" v-on:posted="toggleReplying" v-if="replying"/>
|
||||
</div>
|
||||
<div class="status-el base00-background base03-border" v-else-if="!status.deleted" v-bind:class="[{ 'base01-background': isFocused }, { 'status-conversation': inConversation }]" >
|
||||
<template v-if="muted">
|
||||
<div class="media status container muted">
|
||||
<small><router-link :to="{ name: 'user-profile', params: { id: status.user.id } }">{{status.user.screen_name}}</router-link></small>
|
||||
|
|
Loading…
Reference in New Issue