logo

pleroma-fe

My custom branche(s) on git.pleroma.social/pleroma/pleroma-fe
commit: 5f90b6a384583a00769eeca3a6c6e2deec8bdd24
parent: c67e9daf068c5a7eafaa7ce6a6418c8916a4f118
Author: Shpuld Shpludson <shp@cock.li>
Date:   Sat,  2 May 2020 11:19:05 +0000

Merge branch 'fix/follow-request-notification-bugfixes' into 'develop'

Fix remaining follow request notif problems

Closes #823

See merge request pleroma/pleroma-fe!1096

Diffstat:

Msrc/components/follow_request_card/follow_request_card.js22+++++++++++++++++++++-
Msrc/components/notification/notification.js7+++++--
Msrc/components/notification/notification.vue6+++---
Msrc/components/notifications/notifications.scss19+++++++++++++++++++
Msrc/modules/statuses.js17++++++++++++++++-
Msrc/services/api/api.service.js12++++++++----
6 files changed, 72 insertions(+), 11 deletions(-)

diff --git a/src/components/follow_request_card/follow_request_card.js b/src/components/follow_request_card/follow_request_card.js @@ -1,4 +1,5 @@ import BasicUserCard from '../basic_user_card/basic_user_card.vue' +import { notificationsFromStore } from '../../services/notification_utils/notification_utils.js' const FollowRequestCard = { props: ['user'], @@ -6,13 +7,32 @@ const FollowRequestCard = { BasicUserCard }, methods: { + findFollowRequestNotificationId () { + const notif = notificationsFromStore(this.$store).find( + (notif) => notif.from_profile.id === this.user.id && notif.type === 'follow_request' + ) + return notif && notif.id + }, approveUser () { this.$store.state.api.backendInteractor.approveUser({ id: this.user.id }) this.$store.dispatch('removeFollowRequest', this.user) + + const notifId = this.findFollowRequestNotificationId() + this.$store.dispatch('markSingleNotificationAsSeen', { id: notifId }) + this.$store.dispatch('updateNotification', { + id: notifId, + updater: notification => { + notification.type = 'follow' + } + }) }, denyUser () { + const notifId = this.findFollowRequestNotificationId() this.$store.state.api.backendInteractor.denyUser({ id: this.user.id }) - this.$store.dispatch('removeFollowRequest', this.user) + .then(() => { + this.$store.dispatch('dismissNotificationLocal', { id: notifId }) + this.$store.dispatch('removeFollowRequest', this.user) + }) } } } diff --git a/src/components/notification/notification.js b/src/components/notification/notification.js @@ -37,6 +37,7 @@ const Notification = { approveUser () { this.$store.state.api.backendInteractor.approveUser({ id: this.user.id }) this.$store.dispatch('removeFollowRequest', this.user) + this.$store.dispatch('markSingleNotificationAsSeen', { id: this.notification.id }) this.$store.dispatch('updateNotification', { id: this.notification.id, updater: notification => { @@ -46,8 +47,10 @@ const Notification = { }, denyUser () { this.$store.state.api.backendInteractor.denyUser({ id: this.user.id }) - this.$store.dispatch('removeFollowRequest', this.user) - this.$store.dispatch('dismissNotification', { id: this.notification.id }) + .then(() => { + this.$store.dispatch('dismissNotificationLocal', { id: this.notification.id }) + this.$store.dispatch('removeFollowRequest', this.user) + }) } }, computed: { diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue @@ -137,13 +137,13 @@ style="white-space: nowrap;" > <i - class="icon-ok button-icon add-reaction-button" + class="icon-ok button-icon follow-request-accept" :title="$t('tool_tip.accept_follow_request')" @click="approveUser()" /> <i - class="icon-cancel button-icon add-reaction-button" - :title="$t('tool_tip.accept_follow_request')" + class="icon-cancel button-icon follow-request-reject" + :title="$t('tool_tip.reject_follow_request')" @click="denyUser()" /> </div> diff --git a/src/components/notifications/notifications.scss b/src/components/notifications/notifications.scss @@ -79,6 +79,25 @@ } } + .follow-request-accept { + cursor: pointer; + + &:hover { + color: $fallback--text; + color: var(--text, $fallback--text); + } + } + + .follow-request-reject { + cursor: pointer; + + &:hover { + color: $fallback--cRed; + color: var(--cRed, $fallback--cRed); + } + } + + .follow-text, .move-text { padding: 0.5em 0; overflow-wrap: break-word; diff --git a/src/modules/statuses.js b/src/modules/statuses.js @@ -525,6 +525,10 @@ export const mutations = { notification.seen = true }) }, + markSingleNotificationAsSeen (state, { id }) { + const notification = find(state.notifications.data, n => n.id === id) + if (notification) notification.seen = true + }, dismissNotification (state, { id }) { state.notifications.data = state.notifications.data.filter(n => n.id !== id) }, @@ -691,9 +695,20 @@ const statuses = { credentials: rootState.users.currentUser.credentials }) }, + markSingleNotificationAsSeen ({ rootState, commit }, { id }) { + commit('markSingleNotificationAsSeen', { id }) + apiService.markNotificationsAsSeen({ + single: true, + id, + credentials: rootState.users.currentUser.credentials + }) + }, + dismissNotificationLocal ({ rootState, commit }, { id }) { + commit('dismissNotification', { id }) + }, dismissNotification ({ rootState, commit }, { id }) { + commit('dismissNotification', { id }) rootState.api.backendInteractor.dismissNotification({ id }) - .then(() => commit('dismissNotification', { id })) }, updateNotification ({ rootState, commit }, { id, updater }) { commit('updateNotification', { id, updater }) diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js @@ -4,7 +4,6 @@ import 'whatwg-fetch' import { RegistrationError, StatusCodeError } from '../errors/errors' /* eslint-env browser */ -const QVITTER_USER_NOTIFICATIONS_READ_URL = '/api/qvitter/statuses/notifications/read.json' const BLOCKS_IMPORT_URL = '/api/pleroma/blocks_import' const FOLLOW_IMPORT_URL = '/api/pleroma/follow_import' const DELETE_ACCOUNT_URL = '/api/pleroma/delete_account' @@ -17,6 +16,7 @@ const DEACTIVATE_USER_URL = '/api/pleroma/admin/users/deactivate' const ADMIN_USERS_URL = '/api/pleroma/admin/users' const SUGGESTIONS_URL = '/api/v1/suggestions' const NOTIFICATION_SETTINGS_URL = '/api/pleroma/notification_settings' +const NOTIFICATION_READ_URL = '/api/v1/pleroma/notifications/read' const MFA_SETTINGS_URL = '/api/pleroma/accounts/mfa' const MFA_BACKUP_CODES_URL = '/api/pleroma/accounts/mfa/backup_codes' @@ -841,12 +841,16 @@ const suggestions = ({ credentials }) => { }).then((data) => data.json()) } -const markNotificationsAsSeen = ({ id, credentials }) => { +const markNotificationsAsSeen = ({ id, credentials, single = false }) => { const body = new FormData() - body.append('latest_id', id) + if (single) { + body.append('id', id) + } else { + body.append('max_id', id) + } - return fetch(QVITTER_USER_NOTIFICATIONS_READ_URL, { + return fetch(NOTIFICATION_READ_URL, { body, headers: authHeaders(credentials), method: 'POST'