https://www.soyfreelancer.com/js/helpers/messaging.js?v=2.0.0.434

1const PERMISSION_ERROR = 'Un error ha ocurrido a la hora de requerir el permiso para enviar mensajes';
2const SEND_MESSAGE_ERROR = 'Un error ha ocurrido a la hora de enviar el mensaje de prueba';
3const NO_USER_DETECTED = 'Debe de ingresar con sus credenciales para poder activar las notificaciones';
4const ERROR_TITTLE = 'Error';
5
6Vue.component('messaging', {
7  data() {
8    return {
9      userId: null,
10      userClaims: null,
11      isTokenSentToServer: window.localStorage.getItem('sentToServer') === '1',
12    };
13  },
14  mounted() {
15    this.$onAuthStateChanged((userId, userClaims) => {
16      this.userId = userId;
17      this.userClaims = userClaims;
18    });
19    this.$eventBus.$on('unsubscribe', () => {
20      firebase.firestore()
21        .collection('devices')
22        .doc(this.userId)
23        .collection('tokens')
24        .where('agent', '==', window.navigator.userAgent)
25        .limit(1)
26        .get()
27        .then((snapshot) => {
28          if (!snapshot.empty) {
29            snapshot.docs[0].ref.delete();
30          }
31          this.setTokenSentToServer(false);
32        });
33    });
34    if (Notification.permission === 'denied' || Notification.permission === 'default') {
35      this.setTokenSentToServer(false);
36    }
37    firebase.messaging().onTokenRefresh(() => {
38      firebase.messaging().getToken().then((refreshedToken) => {
39        console.log('Token refreshed.');
40        // Indicate that the new Instance ID token has not yet been sent to the
41        // app server.

42        this.setTokenSentToServer(false);
43        this.sendTokenToServer(this.userId, refreshedToken);
44      }).catch((err) => {
45        this.setTokenSentToServer(false);
46        console.log('Unable to retrieve refreshed token ', err);
47      });
48    });
49  },
50  methods: {
51    setTokenSentToServer(sent) {
52      window.localStorage.setItem('sentToServer', sent ? '1' : '0');
53      this.isTokenSentToServer = window.localStorage.getItem('sentToServer') === '1';
54      if (sent === true) {
55        firebase.functions().httpsCallable('callablesV2')({
56          command: 'messaging/message',
57          payload: {
58            type: 'WELCOME',
59            userId: this.userId,
60            name: 'Soyfreelancer.com',
61          },
62        });
63      }
64    },
65    registerWorker() {
66      if ('serviceWorker' in navigator) {
67        navigator.serviceWorker.register('./firebase-messaging-sw.js')
68          .then((registration) => {
69            firebase.messaging().useServiceWorker(registration);
70          }).catch((err) => {
71            console.log('Service worker registration failed, error:', err);
72            this.setTokenSentToServer(false);
73          });
74      }
75    },
76    sendTokenToServer(userId, currentToken) {
77      const tokenref = firebase.firestore()
78        .collection('devices')
79        .doc(userId).collection('tokens');
80      return tokenref.where('agent', '==', window.navigator.userAgent)
81        .limit(1)
82        .get().then((snapshot) => {
83          if (snapshot.empty) {
84            tokenref.add({
85              fcmToken: currentToken,
86              agent: window.navigator.userAgent,
87              posted: firebase.firestore.Timestamp.now(),
88            }).then(() => {
89              this.setTokenSentToServer(true);
90            });
91          } else {
92            snapshot.docs[0].ref.update({
93              fcmToken: currentToken,
94              posted: firebase.firestore.Timestamp.now(),
95            })
96              .then(() => {
97                this.setTokenSentToServer(true);
98              });
99          }
100        });
101    },
102    requestPermission() {
103      if (!this.userId) {
104        this.$notify.info({
105          title: ERROR_TITTLE,
106          text: NO_USER_DETECTED,
107        });
108        return false;
109      }
110      return Notification.requestPermission().then((permission) => {
111        if (permission === 'granted') {
112          firebase.messaging().getToken().then((currentToken) => {
113            if (currentToken) {
114              return this.sendTokenToServer(this.userId, currentToken);
115            }
116            return false;
117          }).catch((e) => {
118            console.log(e);
119            this.setTokenSentToServer(false);
120            this.$notify.info({
121              title: ERROR_TITTLE,
122              text: SEND_MESSAGE_ERROR,
123            });
124          });
125        } else {
126          this.setTokenSentToServer(false);
127          this.$notify.info({
128            title: ERROR_TITTLE,
129            text: PERMISSION_ERROR,
130          });
131        }
132      });
133    },
134  },
135  template: `<div v-if="!this.isTokenSentToServer && userId" class="notifications text-center">
136                <a v-on:click="requestPermission()" class="lnk-noti">
137                    <i class="fal fa-bell faa-animated mr-2"></i>
138                    <span>Activa las notificaciones de escritorio</span>
139                </a>
140               </div>`,
141});