xeovalyte/wrbapp
1
0
Fork 0
Code Issues 10 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

added toast notifications

Browse Source
This commit is contained in:
Xeovalyte 2022-11-14 14:41:41 +01:00
parent 56fe3bc549
commit efe2a6ff48
1 changed files with 14 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
frontend/app.vue
View File

@ -26,9 +26,11 @@ import { getAuth, onAuthStateChanged, signInWithEmailAndPassword } from "firebas
import { getMessaging, getToken, onMessage } from "firebase/messaging"; import { getMessaging, getToken, onMessage } from "firebase/messaging";
import { PushNotifications } from '@capacitor/push-notifications'; import { PushNotifications } from '@capacitor/push-notifications';
import { Device } from '@capacitor/device'; import { Device } from '@capacitor/device';
import { useToast } from 'vue-toastification'
const db = getFirestore() const db = getFirestore()
const route = useRoute() const route = useRoute()
const toast = useToast()
const isAuthenticated = ref(false) const isAuthenticated = ref(false)
const user = ref('frikandel') const user = ref('frikandel')
@ -108,13 +110,9 @@ const setupNotifications = () => {
PushNotifications.requestPermissions().then(result => { PushNotifications.requestPermissions().then(result => {
if (result.receive === 'granted') { if (result.receive === 'granted') {
// Register with Apple / Google to receive push via APNS/FCM // Register with Apple / Google to receive push via APNS/FCM
PushNotifications.register().then(() => { PushNotifications.register()
FCM.subscribeTo({ topic: "all" })
.then((r) => alert(`Subscribed to topick all`))
.catch((err) => console.log(err));
});
} else { } else {
// Show some error toast.error('Error tijdens het registrenen van push notificaties')
} }
}); });
@ -122,7 +120,7 @@ const setupNotifications = () => {
PushNotifications.addListener('registration', PushNotifications.addListener('registration',
(token) => { (token) => {
// alert('Push registration success, token: ' + token.value); // alert('Push registration success, token: ' + token.value);
registrationToken.value = token registrationToken.value = token
fetch('https://api.xeovalyte.com/subscribetotopic', { fetch('https://api.xeovalyte.com/subscribetotopic', {
@ -138,6 +136,7 @@ const setupNotifications = () => {
}) })
.catch(err => { .catch(err => {
console.log(err) console.log(err)
toast.error('Error tijdens het registreren van push notificaties')
}); });
} }
); );
@ -145,28 +144,20 @@ const setupNotifications = () => {
// Some issue with our setup and push will not work // Some issue with our setup and push will not work
PushNotifications.addListener('registrationError', PushNotifications.addListener('registrationError',
(error) => { (error) => {
// alert('Error on registration: ' + JSON.stringify(error)); toast.error('Error tijdens het registreren van push notificaties')
console.log(error)
} }
); );
// Show us the notification payload if the app is open on our device // Show us the notification payload if the app is open on our device
PushNotifications.addListener('pushNotificationReceived', PushNotifications.addListener('pushNotificationReceived',
(notification) => { (notification) => {
const { show, onClick } = useWebNotification({
title: notification.title, toast.info(`${notification.title}`, {
body: notification.body, onClick: () => navigateTo('/news')
icon: '/ios/256.png',
dir: 'auto',
lang: 'en',
renotify: true,
tag: 'wrbapp',
}) })
show()
onClick.on((event) => {
navigateTo('/news')
})
} }
); );
@ -214,22 +205,10 @@ const registerSW = () => {
onMessage(messaging.value, (payload) => { onMessage(messaging.value, (payload) => {
console.log('Message received. ', payload); console.log('Message received. ', payload);
const { show, onClick } = useWebNotification({ toast.info(`${payload.notification.title}`, {
title: payload.notification.title, onClick: () => navigateTo('/news')
body: payload.notification.body,
icon: '/ios/256.png',
dir: 'auto',
lang: 'en',
renotify: true,
tag: 'wrbapp',
}) })
onClick.on((event) => {
navigateTo('/news')
})
show()
}); });
} }