app: Upgrade socket.io

package.json

@@ -97,8 +97,6 @@
     "@types/react-router-dom": "^5.1.5",
     "@types/react-select": "^3.0.19",
     "@types/semver": "^7.3.3",
-    "@types/socket.io": "^2.1.11",
-    "@types/socket.io-client": "^1.4.33",
     "@types/terser-webpack-plugin": "^5.0.2",
     "@types/webdriverio": "^5.0.0",
     "@types/webpack-env": "^1.13.3",
@@ -147,11 +145,11 @@
     "semver": "^7.3.2",
     "serializr": "^2.0.3",
     "short-uuid": "^4.1.0",
-    "socket.io": "^2.3.0",
-    "socket.io-client": "^2.3.0",
+    "socket.io": "^3.0.5",
+    "socket.io-client": "^3.0.5",
     "source-map-loader": "^2.0.0",
     "terser-webpack-plugin": "^5.0.3",
-    "ts-node": "^9.0.0",
+    "ts-node": "^9.1.1",
     "typescript": "^4.0.2",
     "webpack": "^5.11.1",
     "webpack-merge": "^5.7.3"

src/main/overlayServer.ts

@@ -2,7 +2,7 @@ import connect from 'connect';
 import isDev from 'electron-is-dev';
 import httpProxy from 'http-proxy';
 import httpStatic from 'node-static';
-import socketio from 'socket.io';
+import {Server} from 'socket.io';
 
 import fs from 'fs';
 import http from 'http';
@@ -18,7 +18,7 @@ export async function startOverlayServer() {
   const httpServer = http.createServer(app);
 
   // Setup socketio server
-  const wss = socketio(httpServer, {serveClient: false});
+  const wss = new Server(httpServer, {serveClient: false});
   registerMainWebsocket(wss);
 
   const proxy = httpProxy.createProxy();

src/overlay/app.tsx

@@ -3,7 +3,7 @@ import 'src/shared/sentry/web';
 
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-import socketIOClient from 'socket.io-client';
+import {io} from 'socket.io-client';
 
 import Router from 'overlay/Router';
 import {registerClientWebsocket} from 'src/shared/store/ipc';
@@ -15,4 +15,4 @@ document.body.appendChild(mainElement);
 // Render components
 ReactDOM.render(<Router />, mainElement);
 
-registerClientWebsocket(socketIOClient());
+registerClientWebsocket(io());

src/shared/store/ipc.ts

@@ -15,6 +15,7 @@ import {
 import {deepObserve} from 'mobx-utils';
 import {deserialize, serialize, update} from 'serializr';
 import {Server} from 'socket.io';
+import {Socket} from 'socket.io-client';
 
 import store, {
   AppConfig,
@@ -353,7 +354,7 @@ export const registerMainWebsocket = (wss: Server) => {
 /**
  * Register this client to recieve websocket broadcasts to update the store
  */
-export const registerClientWebsocket = (ws: SocketIOClient.Socket) => {
+export const registerClientWebsocket = (ws: Socket) => {
   ws.on('store-update', (change: SerializedChange) => applyStoreChange(change));
   ws.on('store-init', (data: any) => set(store, deserialize(AppStore, data)));
 };