improve web push notifications

This commit is contained in:
Egor Kislitsyn 2018-12-25 20:43:18 +07:00
parent 0ad837846a
commit c5847349e0
4 changed files with 33 additions and 31 deletions

View file

@ -0,0 +1,22 @@
export default (store) => {
store.subscribe((mutation, state) => {
const vapidPublicKey = state.instance.vapidPublicKey
const webPushNotification = state.config.webPushNotifications
const permission = state.interface.notificationPermission === 'granted'
const user = state.users.currentUser
const isUserMutation = mutation.type === 'setCurrentUser'
const isVapidMutation = mutation.type === 'setInstanceOption' && mutation.payload.name === 'vapidPublicKey'
const isPermMutation = mutation.type === 'setNotificationPermission' && mutation.payload === 'granted'
const isUserConfigMutation = mutation.type === 'setOption' && mutation.payload.name === 'webPushNotifications'
const isVisibilityMutation = mutation.type === 'setOption' && mutation.payload.name === 'notificationVisibility'
if (isUserMutation || isVapidMutation || isPermMutation || isUserConfigMutation || isVisibilityMutation) {
if (user && vapidPublicKey && permission && webPushNotification) {
return store.dispatch('registerPushNotifications')
} else if (isUserConfigMutation && !webPushNotification) {
return store.dispatch('unregisterPushNotifications')
}
}
})
}

View file

@ -15,6 +15,7 @@ import VueTimeago from 'vue-timeago'
import VueI18n from 'vue-i18n' import VueI18n from 'vue-i18n'
import createPersistedState from './lib/persisted_state.js' import createPersistedState from './lib/persisted_state.js'
import pushNotifications from './lib/push_notifications_plugin.js'
import messages from './i18n/messages.js' import messages from './i18n/messages.js'
@ -51,28 +52,6 @@ const persistedStateOptions = {
] ]
} }
const registerPushNotifications = store => {
store.subscribe((mutation, state) => {
const vapidPublicKey = state.instance.vapidPublicKey
const webPushNotification = state.config.webPushNotifications
const permission = state.interface.notificationPermission === 'granted'
const user = state.users.currentUser
const isUserMutation = mutation.type === 'setCurrentUser'
const isVapidMutation = mutation.type === 'setInstanceOption' && mutation.payload.name === 'vapidPublicKey'
const isPermMutation = mutation.type === 'setNotificationPermission' && mutation.payload === 'granted'
const isUserConfigMutation = mutation.type === 'setOption' && mutation.payload.name === 'webPushNotifications'
if (isUserMutation || isVapidMutation || isPermMutation || isUserConfigMutation) {
if (user && vapidPublicKey && permission && webPushNotification) {
return store.dispatch('registerPushNotifications')
} else if (isUserConfigMutation && !webPushNotification) {
return store.dispatch('unregisterPushNotifications')
}
}
})
}
createPersistedState(persistedStateOptions).then((persistedState) => { createPersistedState(persistedStateOptions).then((persistedState) => {
const store = new Vuex.Store({ const store = new Vuex.Store({
modules: { modules: {
@ -85,7 +64,7 @@ createPersistedState(persistedStateOptions).then((persistedState) => {
chat: chatModule, chat: chatModule,
oauth: oauthModule oauth: oauthModule
}, },
plugins: [persistedState, registerPushNotifications], plugins: [persistedState, pushNotifications],
strict: false // Socket modifies itself, let's ignore this for now. strict: false // Socket modifies itself, let's ignore this for now.
// strict: process.env.NODE_ENV !== 'production' // strict: process.env.NODE_ENV !== 'production'
}) })

View file

@ -113,8 +113,9 @@ const users = {
const token = store.state.currentUser.credentials const token = store.state.currentUser.credentials
const vapidPublicKey = store.rootState.instance.vapidPublicKey const vapidPublicKey = store.rootState.instance.vapidPublicKey
const isEnabled = store.rootState.config.webPushNotifications const isEnabled = store.rootState.config.webPushNotifications
const notificationVisibility = store.rootState.config.notificationVisibility
registerPushNotifications(isEnabled, vapidPublicKey, token) registerPushNotifications(isEnabled, vapidPublicKey, token, notificationVisibility)
}, },
unregisterPushNotifications (store) { unregisterPushNotifications (store) {
const token = store.state.currentUser.credentials const token = store.state.currentUser.credentials

View file

@ -51,7 +51,7 @@ function deleteSubscriptionFromBackEnd (token) {
}) })
} }
function sendSubscriptionToBackEnd (subscription, token) { function sendSubscriptionToBackEnd (subscription, token, notificationVisibility) {
return window.fetch('/api/v1/push/subscription/', { return window.fetch('/api/v1/push/subscription/', {
method: 'POST', method: 'POST',
headers: { headers: {
@ -62,10 +62,10 @@ function sendSubscriptionToBackEnd (subscription, token) {
subscription, subscription,
data: { data: {
alerts: { alerts: {
follow: true, follow: notificationVisibility.follows,
favourite: true, favourite: notificationVisibility.likes,
mention: true, mention: notificationVisibility.mentions,
reblog: true reblog: notificationVisibility.repeats
} }
} }
}) })
@ -78,11 +78,11 @@ function sendSubscriptionToBackEnd (subscription, token) {
}) })
} }
export function registerPushNotifications (isEnabled, vapidPublicKey, token) { export function registerPushNotifications (isEnabled, vapidPublicKey, token, notificationVisibility) {
if (isPushSupported()) { if (isPushSupported()) {
getOrCreateServiceWorker() getOrCreateServiceWorker()
.then((registration) => subscribePush(registration, isEnabled, vapidPublicKey)) .then((registration) => subscribePush(registration, isEnabled, vapidPublicKey))
.then((subscription) => sendSubscriptionToBackEnd(subscription, token)) .then((subscription) => sendSubscriptionToBackEnd(subscription, token, notificationVisibility))
.catch((e) => console.warn(`Failed to setup Web Push Notifications: ${e.message}`)) .catch((e) => console.warn(`Failed to setup Web Push Notifications: ${e.message}`))
} }
} }