function ConnectionStatus(container) { const { hostname } = window.location const subscriptionClient = new SubscriptionClient(`ws://${hostname}:4000`, { reconnect: true }) subscriptionClient.onConnected(this.onConnected.bind(this)) subscriptionClient.onReconnected(this.onReconnected.bind(this)) subscriptionClient.onDisconnected(this.onDisconnected.bind(this)) const wrapper = document.createElement('div') const warningTitle = document.createElement('p') const warningBody = document.createElement('p') warningTitle.innerHTML = 'Connection Lost' warningBody.innerHTML = "Can't connect to server" wrapper.appendChild(warningTitle) wrapper.appendChild(warningBody) Helpers.applyStyle(wrapper, classes.wrapper) Helpers.applyStyle(warningTitle, classes.title) Helpers.applyStyle(warningBody, classes.body) container.appendChild(wrapper) this.getDOM_wrapper = () => wrapper }
/** * Connect subscription socket */ subConnect() { if (this.subClient) return; this.subClient = new SubscriptionClient( process.env.WS_SERVER + constants.graphqlBase, { reconnect: true, connectionParams: async () => { if (this.refreshingPromise) await this.refreshingPromise; return { token: await this.getAccessToken() }; } } ); this.subClient.maxConnectTimeGenerator.duration = () => this.subClient.maxConnectTimeGenerator.max; this.subClient.onConnected(this.onSubConnected.bind(this)); this.subClient.onReconnected(this.onSubReconnected.bind(this)); this.subClient.onDisconnected(this.onSubDisconnected.bind(this)); this.subClient.onError(this.onSubError.bind(this)); }