diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue index eed598a863..1c07bae99f 100644 --- a/src/components/notification/notification.vue +++ b/src/components/notification/notification.vue @@ -11,7 +11,7 @@
{{ notification.action.user.name }} - + {{$t('notifications.favorited_you')}} diff --git a/src/components/notifications/notifications.js b/src/components/notifications/notifications.js index f8314bfc9d..f07d550e07 100644 --- a/src/components/notifications/notifications.js +++ b/src/components/notifications/notifications.js @@ -1,16 +1,18 @@ import Notification from '../notification/notification.vue' +import notificationsFetcher from '../../services/notifications_fetcher/notifications_fetcher.service.js' import { sortBy, take, filter } from 'lodash' const Notifications = { - data () { - return { - visibleNotificationCount: 20 - } + created () { + const store = this.$store + const credentials = store.state.users.currentUser.credentials + + notificationsFetcher.startFetching({ store, credentials }) }, computed: { notifications () { - return this.$store.state.statuses.notifications + return this.$store.state.statuses.notifications.data }, unseenNotifications () { return filter(this.notifications, ({seen}) => !seen) @@ -19,7 +21,7 @@ const Notifications = { // Don't know why, but sortBy([seen, -action.id]) doesn't work. let sortedNotifications = sortBy(this.notifications, ({action}) => -action.id) sortedNotifications = sortBy(sortedNotifications, 'seen') - return take(sortedNotifications, this.visibleNotificationCount) + return sortedNotifications }, unseenCount () { return this.unseenNotifications.length @@ -40,6 +42,15 @@ const Notifications = { methods: { markAsSeen () { this.$store.commit('markNotificationsAsSeen', this.visibleNotifications) + }, + fetchOlderNotifications () { + const store = this.$store + const credentials = store.state.users.currentUser.credentials + notificationsFetcher.fetchAndUpdate({ + store, + credentials, + older: true + }) } } } diff --git a/src/components/notifications/notifications.vue b/src/components/notifications/notifications.vue index 4fa6e9257c..859730ed8f 100644 --- a/src/components/notifications/notifications.vue +++ b/src/components/notifications/notifications.vue @@ -11,6 +11,12 @@
+ diff --git a/src/main.js b/src/main.js index bacd7f6d65..417730800f 100644 --- a/src/main.js +++ b/src/main.js @@ -53,7 +53,8 @@ const persistedStateOptions = { 'config.streaming', 'config.muteWords', 'config.customTheme', - 'users.lastLoginName' + 'users.lastLoginName', + 'statuses.notifications.maxSavedId' ] } diff --git a/src/modules/statuses.js b/src/modules/statuses.js index 291ab53c3f..a8a0d4fea7 100644 --- a/src/modules/statuses.js +++ b/src/modules/statuses.js @@ -1,4 +1,5 @@ import { includes, remove, slice, sortBy, toInteger, each, find, flatten, maxBy, minBy, merge, last, isArray } from 'lodash' +import { set } from 'vue' import apiService from '../services/api/api.service.js' // import parse from '../services/status_parser/status_parser.js' @@ -22,7 +23,12 @@ export const defaultState = { allStatuses: [], allStatusesObject: {}, maxId: 0, - notifications: [], + notifications: { + maxId: 0, + maxSavedId: 0, + minId: Number.POSITIVE_INFINITY, + data: [] + }, favorites: new Set(), error: false, timelines: { @@ -135,10 +141,6 @@ const addNewStatuses = (state, { statuses, showImmediately = false, timeline, us status = result.item if (result.new) { - if (statusType(status) === 'retweet' && status.retweeted_status.user.id === user.id) { - addNotification({ type: 'repeat', status: status, action: status }) - } - // We are mentioned in a post if (statusType(status) === 'status' && find(status.attentions, { id: user.id })) { const mentions = state.timelines.mentions @@ -150,10 +152,6 @@ const addNewStatuses = (state, { statuses, showImmediately = false, timeline, us sortTimeline(mentions) } - // Don't add notification for self-mention - if (status.user.id !== user.id) { - addNotification({ type: 'mention', status, action: status }) - } } } @@ -176,32 +174,6 @@ const addNewStatuses = (state, { statuses, showImmediately = false, timeline, us return status } - const addNotification = ({type, status, action}) => { - // Only add a new notification if we don't have one for the same action - if (!find(state.notifications, (oldNotification) => oldNotification.action.id === action.id)) { - state.notifications.push({ type, status, action, seen: false }) - - if ('Notification' in window && window.Notification.permission === 'granted') { - const title = action.user.name - const result = {} - result.icon = action.user.profile_image_url - result.body = action.text // there's a problem that it doesn't put a space before links tho - - // Shows first attached non-nsfw image, if any. Should add configuration for this somehow... - if (action.attachments && action.attachments.length > 0 && !action.nsfw && - action.attachments[0].mimetype.startsWith('image/')) { - result.image = action.attachments[0].url - } - - let notification = new window.Notification(title, result) - - // Chrome is known for not closing notifications automatically - // according to MDN, anyway. - setTimeout(notification.close.bind(notification), 5000) - } - } - } - const favoriteStatus = (favorite) => { const status = find(allStatuses, { id: toInteger(favorite.in_reply_to_status_id) }) if (status) { @@ -211,11 +183,6 @@ const addNewStatuses = (state, { statuses, showImmediately = false, timeline, us if (favorite.user.id === user.id) { status.favorited = true } - - // Add a notification if the user's status is favorited - if (status.user.id === user.id) { - addNotification({type: 'favorite', status, action: favorite}) - } } return status } @@ -253,13 +220,6 @@ const addNewStatuses = (state, { statuses, showImmediately = false, timeline, us favoriteStatus(favorite) } }, - 'follow': (status) => { - let re = new RegExp(`started following ${user.name} \\(${user.statusnet_profile_url}\\)`) - let repleroma = new RegExp(`started following ${user.screen_name}$`) - if (status.text.match(re) || status.text.match(repleroma)) { - addNotification({ type: 'follow', status: status, action: status }) - } - }, 'deletion': (deletion) => { const uri = deletion.uri @@ -269,7 +229,7 @@ const addNewStatuses = (state, { statuses, showImmediately = false, timeline, us return } - remove(state.notifications, ({action: {id}}) => id === status.id) + remove(state.notifications.data, ({action: {id}}) => id === status.id) remove(allStatuses, { uri }) if (timeline) { @@ -298,8 +258,54 @@ const addNewStatuses = (state, { statuses, showImmediately = false, timeline, us } } +const addNewNotifications = (state, { notifications, older }) => { + const allStatuses = state.allStatuses + each(notifications, (notification) => { + const action = notification.notice + // Only add a new notification if we don't have one for the same action + if (!find(state.notifications.data, (oldNotification) => oldNotification.action.id === action.id)) { + state.notifications.maxId = Math.max(notification.id, state.notifications.maxId) + state.notifications.minId = Math.min(notification.id, state.notifications.minId) + + console.log(notification) + const fresh = !older && !notification.is_seen && notification.id >= state.notifications.maxSavedId + const status = notification.ntype === 'like' + ? find(allStatuses, { id: action.in_reply_to_status_id }) + : action + state.notifications.data.push({ + type: notification.ntype, + status, + action, + // Always assume older notifications as seen + seen: !fresh + }) + + if ('Notification' in window && window.Notification.permission === 'granted') { + const title = action.user.name + const result = {} + result.icon = action.user.profile_image_url + result.body = action.text // there's a problem that it doesn't put a space before links tho + + // Shows first attached non-nsfw image, if any. Should add configuration for this somehow... + if (action.attachments && action.attachments.length > 0 && !action.nsfw && + action.attachments[0].mimetype.startsWith('image/')) { + result.image = action.attachments[0].url + } + + if (fresh) { + let notification = new window.Notification(title, result) + // Chrome is known for not closing notifications automatically + // according to MDN, anyway. + setTimeout(notification.close.bind(notification), 5000) + } + } + } + }) +} + export const mutations = { addNewStatuses, + addNewNotifications, showNewStatuses (state, { timeline }) { const oldTimeline = (state.timelines[timeline]) @@ -334,6 +340,9 @@ export const mutations = { setError (state, { value }) { state.error = value }, + setNotificationsError (state, { value }) { + state.notificationsError = value + }, setProfileView (state, { v }) { // load followers / friends only when needed state.timelines['user'].viewing = v @@ -345,6 +354,7 @@ export const mutations = { state.timelines['user'].followers = followers }, markNotificationsAsSeen (state, notifications) { + set(state.notifications, 'maxSavedId', state.notifications.maxId) each(notifications, (notification) => { notification.seen = true }) @@ -360,9 +370,15 @@ const statuses = { addNewStatuses ({ rootState, commit }, { statuses, showImmediately = false, timeline = false, noIdUpdate = false }) { commit('addNewStatuses', { statuses, showImmediately, timeline, noIdUpdate, user: rootState.users.currentUser }) }, + addNewNotifications ({ rootState, commit }, { notifications, older }) { + commit('addNewNotifications', { notifications, older }) + }, setError ({ rootState, commit }, { value }) { commit('setError', { value }) }, + setNotificationsError ({ rootState, commit }, { value }) { + commit('setNotificationsError', { value }) + }, addFriends ({ rootState, commit }, { friends }) { commit('addFriends', { friends }) }, diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js index adf598b748..9a09e50385 100644 --- a/src/services/api/api.service.js +++ b/src/services/api/api.service.js @@ -27,6 +27,7 @@ const BANNER_UPDATE_URL = '/api/account/update_profile_banner.json' const PROFILE_UPDATE_URL = '/api/account/update_profile.json' const EXTERNAL_PROFILE_URL = '/api/externalprofile/show.json' const QVITTER_USER_TIMELINE_URL = '/api/qvitter/statuses/user_timeline.json' +const QVITTER_USER_NOTIFICATIONS_URL = '/api/qvitter/statuses/notifications.json' const BLOCKING_URL = '/api/blocks/create.json' const UNBLOCKING_URL = '/api/blocks/destroy.json' const USER_URL = '/api/users/show.json' @@ -301,6 +302,7 @@ const fetchTimeline = ({timeline, credentials, since = false, until = false, use public: PUBLIC_TIMELINE_URL, friends: FRIENDS_TIMELINE_URL, mentions: MENTIONS_URL, + notifications: QVITTER_USER_NOTIFICATIONS_URL, 'publicAndExternal': PUBLIC_AND_EXTERNAL_TIMELINE_URL, user: QVITTER_USER_TIMELINE_URL, tag: TAG_TIMELINE_URL diff --git a/test/unit/specs/modules/statuses.spec.js b/test/unit/specs/modules/statuses.spec.js index f929192b90..49b420b836 100644 --- a/test/unit/specs/modules/statuses.spec.js +++ b/test/unit/specs/modules/statuses.spec.js @@ -296,10 +296,10 @@ describe('The Statuses module', () => { mutations.addNewStatuses(state, { statuses: [retweet], user }) - expect(state.notifications.length).to.eql(1) - expect(state.notifications[0].status).to.eql(retweet) - expect(state.notifications[0].action).to.eql(retweet) - expect(state.notifications[0].type).to.eql('repeat') + expect(state.notifications.data.length).to.eql(1) + expect(state.notifications.data[0].status).to.eql(retweet) + expect(state.notifications.data[0].action).to.eql(retweet) + expect(state.notifications.data[0].type).to.eql('repeat') }) it('adds a notification when you are mentioned', () => { @@ -311,13 +311,13 @@ describe('The Statuses module', () => { mutations.addNewStatuses(state, { statuses: [status], user }) - expect(state.notifications.length).to.eql(0) + expect(state.notifications.data.length).to.eql(0) mutations.addNewStatuses(state, { statuses: [mentionedStatus], user }) - expect(state.notifications.length).to.eql(1) - expect(state.notifications[0].status).to.eql(mentionedStatus) - expect(state.notifications[0].action).to.eql(mentionedStatus) - expect(state.notifications[0].type).to.eql('mention') + expect(state.notifications.data.length).to.eql(1) + expect(state.notifications.data[0].status).to.eql(mentionedStatus) + expect(state.notifications.data[0].action).to.eql(mentionedStatus) + expect(state.notifications.data[0].type).to.eql('mention') }) it('removes a notification when the notice gets removed', () => { @@ -336,18 +336,18 @@ describe('The Statuses module', () => { mutations.addNewStatuses(state, { statuses: [status, otherStatus], user }) - expect(state.notifications.length).to.eql(1) + expect(state.notifications.data.length).to.eql(1) mutations.addNewStatuses(state, { statuses: [mentionedStatus], user }) expect(state.allStatuses.length).to.eql(3) - expect(state.notifications.length).to.eql(2) - expect(state.notifications[1].status).to.eql(mentionedStatus) - expect(state.notifications[1].action).to.eql(mentionedStatus) - expect(state.notifications[1].type).to.eql('mention') + expect(state.notifications.data.length).to.eql(2) + expect(state.notifications.data[1].status).to.eql(mentionedStatus) + expect(state.notifications.data[1].action).to.eql(mentionedStatus) + expect(state.notifications.data[1].type).to.eql('mention') mutations.addNewStatuses(state, { statuses: [deletion], user }) expect(state.allStatuses.length).to.eql(2) - expect(state.notifications.length).to.eql(1) + expect(state.notifications.data.length).to.eql(1) }) it('adds the message to mentions when you are mentioned', () => { @@ -384,7 +384,7 @@ describe('The Statuses module', () => { mutations.addNewStatuses(state, { statuses: [status], showImmediately: true, timeline: 'public', user }) mutations.addNewStatuses(state, { statuses: [favorite], showImmediately: true, timeline: 'public', user }) - expect(state.notifications).to.have.length(1) + expect(state.notifications.data).to.have.length(1) }) it('adds a notification when the user is followed', () => { @@ -402,7 +402,7 @@ describe('The Statuses module', () => { mutations.addNewStatuses(state, { statuses: [follow], showImmediately: true, timeline: 'public', user }) - expect(state.notifications).to.have.length(1) + expect(state.notifications.data).to.have.length(1) }) it('does not add a notification when an other user is followed', () => { @@ -420,7 +420,7 @@ describe('The Statuses module', () => { mutations.addNewStatuses(state, { statuses: [follow], showImmediately: true, timeline: 'public', user }) - expect(state.notifications).to.have.length(0) + expect(state.notifications.data).to.have.length(0) }) }) })