From 525272630786851341db37659fdf2886ddcd6dd0 Mon Sep 17 00:00:00 2001
From: Aakansha Doshi <aakansha1216@gmail.com>
Date: Wed, 27 May 2020 00:21:03 +0530
Subject: [PATCH] dynamically import socket.io-client when needed (#1631)

---
 src/components/App.tsx | 9 +++++++--
 src/index.tsx          | 2 +-
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/components/App.tsx b/src/components/App.tsx
index bfc3e81e..c375a770 100644
--- a/src/components/App.tsx
+++ b/src/components/App.tsx
@@ -1,6 +1,5 @@
 import React from "react";
 
-import socketIOClient from "socket.io-client";
 import rough from "roughjs/bin/rough";
 import { RoughCanvas } from "roughjs/bin/canvas";
 import { simplify, Point } from "points-on-curve";
@@ -804,7 +803,9 @@ class App extends React.Component<any, AppState> {
     this.portal.close();
   };
 
-  private initializeSocketClient = (opts: { showLoadingState: boolean }) => {
+  private initializeSocketClient = async (opts: {
+    showLoadingState: boolean;
+  }) => {
     if (this.portal.socket) {
       return;
     }
@@ -925,6 +926,10 @@ class App extends React.Component<any, AppState> {
         }
       };
 
+      const { default: socketIOClient }: any = await import(
+        /* webpackChunkName: "socketIoClient" */ "socket.io-client"
+      );
+
       this.portal.open(
         socketIOClient(SOCKET_SERVER),
         roomMatch[1],
diff --git a/src/index.tsx b/src/index.tsx
index 265580ff..e15575b1 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -18,7 +18,7 @@ if (
   /\b(iPad|iPhone|iPod)\b/.test(navigator.userAgent) &&
   !matchMedia("(display-mode: standalone)").matches
 ) {
-  import("pwacompat");
+  import(/* webpackChunkName: "pwacompat" */ "pwacompat");
 }
 
 const SentryEnvHostnameMap: { [key: string]: string } = {