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

Fix remaining follow request notif problems

Closes #823

See merge request pleroma/pleroma-fe!1096
This commit is contained in:
Shpuld Shpludson 2020-05-02 11:19:05 +00:00
commit 5f90b6a384
6 changed files with 72 additions and 11 deletions

View file

@ -1,4 +1,5 @@
import BasicUserCard from '../basic_user_card/basic_user_card.vue' import BasicUserCard from '../basic_user_card/basic_user_card.vue'
import { notificationsFromStore } from '../../services/notification_utils/notification_utils.js'
const FollowRequestCard = { const FollowRequestCard = {
props: ['user'], props: ['user'],
@ -6,13 +7,32 @@ const FollowRequestCard = {
BasicUserCard BasicUserCard
}, },
methods: { 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 () { approveUser () {
this.$store.state.api.backendInteractor.approveUser({ id: this.user.id }) this.$store.state.api.backendInteractor.approveUser({ id: this.user.id })
this.$store.dispatch('removeFollowRequest', this.user) 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 () { denyUser () {
const notifId = this.findFollowRequestNotificationId()
this.$store.state.api.backendInteractor.denyUser({ id: this.user.id }) this.$store.state.api.backendInteractor.denyUser({ id: this.user.id })
.then(() => {
this.$store.dispatch('dismissNotificationLocal', { id: notifId })
this.$store.dispatch('removeFollowRequest', this.user) this.$store.dispatch('removeFollowRequest', this.user)
})
} }
} }
} }

View file

@ -37,6 +37,7 @@ const Notification = {
approveUser () { approveUser () {
this.$store.state.api.backendInteractor.approveUser({ id: this.user.id }) this.$store.state.api.backendInteractor.approveUser({ id: this.user.id })
this.$store.dispatch('removeFollowRequest', this.user) this.$store.dispatch('removeFollowRequest', this.user)
this.$store.dispatch('markSingleNotificationAsSeen', { id: this.notification.id })
this.$store.dispatch('updateNotification', { this.$store.dispatch('updateNotification', {
id: this.notification.id, id: this.notification.id,
updater: notification => { updater: notification => {
@ -46,8 +47,10 @@ const Notification = {
}, },
denyUser () { denyUser () {
this.$store.state.api.backendInteractor.denyUser({ id: this.user.id }) this.$store.state.api.backendInteractor.denyUser({ id: this.user.id })
.then(() => {
this.$store.dispatch('dismissNotificationLocal', { id: this.notification.id })
this.$store.dispatch('removeFollowRequest', this.user) this.$store.dispatch('removeFollowRequest', this.user)
this.$store.dispatch('dismissNotification', { id: this.notification.id }) })
} }
}, },
computed: { computed: {

View file

@ -137,13 +137,13 @@
style="white-space: nowrap;" style="white-space: nowrap;"
> >
<i <i
class="icon-ok button-icon add-reaction-button" class="icon-ok button-icon follow-request-accept"
:title="$t('tool_tip.accept_follow_request')" :title="$t('tool_tip.accept_follow_request')"
@click="approveUser()" @click="approveUser()"
/> />
<i <i
class="icon-cancel button-icon add-reaction-button" class="icon-cancel button-icon follow-request-reject"
:title="$t('tool_tip.accept_follow_request')" :title="$t('tool_tip.reject_follow_request')"
@click="denyUser()" @click="denyUser()"
/> />
</div> </div>

View file

@ -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 { .follow-text, .move-text {
padding: 0.5em 0; padding: 0.5em 0;
overflow-wrap: break-word; overflow-wrap: break-word;

View file

@ -525,6 +525,10 @@ export const mutations = {
notification.seen = true notification.seen = true
}) })
}, },
markSingleNotificationAsSeen (state, { id }) {
const notification = find(state.notifications.data, n => n.id === id)
if (notification) notification.seen = true
},
dismissNotification (state, { id }) { dismissNotification (state, { id }) {
state.notifications.data = state.notifications.data.filter(n => n.id !== id) state.notifications.data = state.notifications.data.filter(n => n.id !== id)
}, },
@ -691,9 +695,20 @@ const statuses = {
credentials: rootState.users.currentUser.credentials 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 }) { dismissNotification ({ rootState, commit }, { id }) {
commit('dismissNotification', { id })
rootState.api.backendInteractor.dismissNotification({ id }) rootState.api.backendInteractor.dismissNotification({ id })
.then(() => commit('dismissNotification', { id }))
}, },
updateNotification ({ rootState, commit }, { id, updater }) { updateNotification ({ rootState, commit }, { id, updater }) {
commit('updateNotification', { id, updater }) commit('updateNotification', { id, updater })

View file

@ -4,7 +4,6 @@ import 'whatwg-fetch'
import { RegistrationError, StatusCodeError } from '../errors/errors' import { RegistrationError, StatusCodeError } from '../errors/errors'
/* eslint-env browser */ /* eslint-env browser */
const QVITTER_USER_NOTIFICATIONS_READ_URL = '/api/qvitter/statuses/notifications/read.json'
const BLOCKS_IMPORT_URL = '/api/pleroma/blocks_import' const BLOCKS_IMPORT_URL = '/api/pleroma/blocks_import'
const FOLLOW_IMPORT_URL = '/api/pleroma/follow_import' const FOLLOW_IMPORT_URL = '/api/pleroma/follow_import'
const DELETE_ACCOUNT_URL = '/api/pleroma/delete_account' 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 ADMIN_USERS_URL = '/api/pleroma/admin/users'
const SUGGESTIONS_URL = '/api/v1/suggestions' const SUGGESTIONS_URL = '/api/v1/suggestions'
const NOTIFICATION_SETTINGS_URL = '/api/pleroma/notification_settings' 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_SETTINGS_URL = '/api/pleroma/accounts/mfa'
const MFA_BACKUP_CODES_URL = '/api/pleroma/accounts/mfa/backup_codes' const MFA_BACKUP_CODES_URL = '/api/pleroma/accounts/mfa/backup_codes'
@ -841,12 +841,16 @@ const suggestions = ({ credentials }) => {
}).then((data) => data.json()) }).then((data) => data.json())
} }
const markNotificationsAsSeen = ({ id, credentials }) => { const markNotificationsAsSeen = ({ id, credentials, single = false }) => {
const body = new FormData() 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, body,
headers: authHeaders(credentials), headers: authHeaders(credentials),
method: 'POST' method: 'POST'