146 lines
4.0 KiB
JavaScript
146 lines
4.0 KiB
JavaScript
/* eslint-disable camelcase */
|
|
import React from 'react'
|
|
import ReactDOM from 'react-dom'
|
|
import { ApolloClient } from 'apollo-client'
|
|
import { ApolloProvider } from 'react-apollo'
|
|
import gql from 'graphql-tag'
|
|
import { getMainDefinition } from 'apollo-utilities'
|
|
import { ApolloLink, split, concat, Observable } from 'apollo-link'
|
|
import { createHttpLink } from 'apollo-link-http'
|
|
import { WebSocketLink } from 'apollo-link-ws'
|
|
import { InMemoryCache } from 'apollo-cache-inmemory'
|
|
import * as firebase from 'firebase/app'
|
|
import 'firebase/messaging'
|
|
import 'assets/vendor/nucleo/css/nucleo.css'
|
|
import 'assets/vendor/@fortawesome/fontawesome-free/css/all.min.css'
|
|
import 'assets/scss/argon-dashboard-react.scss'
|
|
import { getOrders, uploadToken } from '../src/apollo/server'
|
|
|
|
import { ws_server_url, server_url } from './config/config'
|
|
import App from './app'
|
|
const GET_ORDERS = gql`
|
|
${getOrders}
|
|
`
|
|
const UPLOAD_TOKEN = gql`
|
|
${uploadToken}
|
|
`
|
|
|
|
const firebaseConfig = {
|
|
apiKey: 'AIzaSyDCnSTWqbN7NWg9oVDzWz5dvhw2dX-RTb0',
|
|
authDomain: 'foodapp-77e88.firebaseapp.com',
|
|
databaseURL: 'https://foodapp-77e88.firebaseio.com',
|
|
projectId: 'foodapp-77e88',
|
|
storageBucket: 'foodapp-77e88.appspot.com',
|
|
messagingSenderId: '678143951107',
|
|
appId: '1:678143951107:web:498eca9a1eca6c0b'
|
|
}
|
|
|
|
const cache = new InMemoryCache()
|
|
const httpLink = createHttpLink({
|
|
uri: `${server_url}graphql`
|
|
})
|
|
const wsLink = new WebSocketLink({
|
|
uri: `${ws_server_url}graphql`,
|
|
options: {
|
|
reconnect: true
|
|
}
|
|
})
|
|
|
|
const request = async operation => {
|
|
const data = localStorage.getItem('user-enatega')
|
|
let token = null
|
|
if (data) {
|
|
token = JSON.parse(data).token
|
|
}
|
|
operation.setContext({
|
|
headers: {
|
|
authorization: token ? `Bearer ${token}` : ''
|
|
}
|
|
})
|
|
}
|
|
|
|
const requestLink = new ApolloLink(
|
|
(operation, forward) =>
|
|
new Observable(observer => {
|
|
console.log(observer)
|
|
let handle
|
|
Promise.resolve(operation)
|
|
.then(oper => request(oper))
|
|
.then(() => {
|
|
handle = forward(operation).subscribe({
|
|
next: observer.next.bind(observer),
|
|
error: observer.error.bind(observer),
|
|
complete: observer.complete.bind(observer)
|
|
})
|
|
})
|
|
.catch(observer.error.bind(observer))
|
|
|
|
return () => {
|
|
if (handle) handle.unsubscribe()
|
|
}
|
|
})
|
|
)
|
|
|
|
const terminatingLink = split(
|
|
({ query }) => {
|
|
const { kind, operation } = getMainDefinition(query)
|
|
return kind === 'OperationDefinition' && operation === 'subscription'
|
|
},
|
|
wsLink
|
|
// httpLink,
|
|
)
|
|
|
|
const client = new ApolloClient({
|
|
link: concat(ApolloLink.from([terminatingLink, requestLink]), httpLink),
|
|
cache
|
|
})
|
|
|
|
// // Initialize Firebase
|
|
firebase.initializeApp(firebaseConfig)
|
|
const messaging = firebase.messaging()
|
|
messaging.usePublicVapidKey(
|
|
'BBFzJyX1yDzhRcnK07MEBYKqI5muEFTwnxPwg94IdPTAbFi1KstIQVeyuvWAo3-5LH_oBsfivWns53iMXEuS6Lg'
|
|
)
|
|
messaging
|
|
.requestPermission()
|
|
.then(function() {
|
|
messaging
|
|
.getToken()
|
|
.then(function(currentToken) {
|
|
if (currentToken) {
|
|
client
|
|
.mutate({
|
|
mutation: UPLOAD_TOKEN,
|
|
variables: { pushToken: currentToken }
|
|
})
|
|
.then(() => {})
|
|
.catch(() => {})
|
|
} else {
|
|
}
|
|
})
|
|
.catch(function() {})
|
|
})
|
|
.catch(function() {})
|
|
|
|
messaging.onMessage(function(payload) {
|
|
var notificationTitle = 'New Order on Enatega'
|
|
var notificationOptions = {
|
|
body: payload.data.orderid,
|
|
icon: 'https://www.enatega.com/assets/images/logo.png'
|
|
}
|
|
const nt = new Notification(notificationTitle, notificationOptions)
|
|
nt.onclick = function(event) {
|
|
event.preventDefault() // prevent the browser from focusing the Notification's tab
|
|
window.open('https://enatega.com/dashboard')
|
|
nt.close()
|
|
}
|
|
// console.log('Message received. ', payload);
|
|
client.query({ query: GET_ORDERS, fetchPolicy: 'network-only' })
|
|
})
|
|
ReactDOM.render(
|
|
<ApolloProvider client={client}>
|
|
<App />
|
|
</ApolloProvider>,
|
|
document.getElementById('root')
|
|
)
|