From 5657dddca9d4dafcf449fc6eafb7bd9d68bd65c9 Mon Sep 17 00:00:00 2001
From: Anthony Garand <garand@garand.me>
Date: Thu, 2 Dec 2021 14:19:40 -0500
Subject: [PATCH 1/5] feat(LiveReload): add WebSocket reconnect

---
 packages/remix-react/components.tsx | 48 ++++++++++++++++++++---------
 1 file changed, 33 insertions(+), 15 deletions(-)

diff --git a/packages/remix-react/components.tsx b/packages/remix-react/components.tsx
index 22c5f030408..ce9cf802107 100644
--- a/packages/remix-react/components.tsx
+++ b/packages/remix-react/components.tsx
@@ -1271,21 +1271,39 @@ export function LiveReload({ port = 8002 }: { port?: number }) {
     <script
       dangerouslySetInnerHTML={{
         __html: `
-          let ws = new WebSocket("ws://localhost:${port}/socket");
-          ws.onmessage = message => {
-            let event = JSON.parse(message.data);
-            if (event.type === "LOG") {
-              console.log(event.message);
-            }
-            if (event.type === "RELOAD") {
-              console.log("💿 Reloading window ...");
-              window.location.reload();
-            }
-          };
-          ws.onerror = error => {
-            console.log("Remix dev asset server web socket error:");
-            console.error(error);
-          };
+          function remixLiveReloadConnect(config) {
+            let ws = new WebSocket("ws://localhost:${port}/socket");
+            ws.onmessage = (message) => {
+              let event = JSON.parse(message.data);
+              if (event.type === "LOG") {
+                console.log(event.message);
+              }
+              if (event.type === "RELOAD") {
+                console.log("💿 Reloading window ...");
+                window.location.reload();
+              }
+            };
+            ws.onopen = () => {
+              if (config && typeof config.onOpen === "function") {
+                config.onOpen();
+              }
+            };
+            ws.onclose = (error) => {
+              console.log("Remix dev asset server web socket closed. Reconnecting...");
+              setTimeout(
+                () =>
+                  remixLiveReloadConnect({
+                    onOpen: () => window.location.reload(),
+                  }),
+                1000
+              );
+            };
+            ws.onerror = (error) => {
+              console.log("Remix dev asset server web socket error:");
+              console.error(error);
+            };
+          }
+          remixLiveReloadConnect();
       `
       }}
     />

From 89380d8ce38be8e5ddb4ab75442867b2c6249084 Mon Sep 17 00:00:00 2001
From: Anthony Garand <garand@garand.me>
Date: Thu, 2 Dec 2021 14:29:17 -0500
Subject: [PATCH 2/5] chore: add garand to contributors

---
 contributors.yml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/contributors.yml b/contributors.yml
index c08d1641ec6..f8f9213136d 100644
--- a/contributors.yml
+++ b/contributors.yml
@@ -42,3 +42,4 @@
 - ascorbic
 - IAmLuisJ
 - weavdale
+- garand
\ No newline at end of file

From b46c03fa5b58ee63215386ade9b392526d9fe6bf Mon Sep 17 00:00:00 2001
From: Anthony Garand <garand@garand.me>
Date: Thu, 2 Jun 2022 21:31:03 -0400
Subject: [PATCH 3/5] feat(LiveReload): add WebSocket reconnect

---
 packages/remix-react/components.tsx | 22 +++++++++++++++++++---
 1 file changed, 19 insertions(+), 3 deletions(-)

diff --git a/packages/remix-react/components.tsx b/packages/remix-react/components.tsx
index 721e5a49ae3..54d51b58217 100644
--- a/packages/remix-react/components.tsx
+++ b/packages/remix-react/components.tsx
@@ -1442,7 +1442,7 @@ export const LiveReload =
             suppressHydrationWarning
             dangerouslySetInnerHTML={{
               __html: js`
-                (() => {
+                function remixLiveReloadConnect(config) {
                   let protocol = location.protocol === "https:" ? "wss:" : "ws:";
                   let host = location.hostname;
                   let socketPath = protocol + "//" + host + ":" + ${String(
@@ -1460,13 +1460,29 @@ export const LiveReload =
                       window.location.reload();
                     }
                   };
+                  ws.onopen = () => {
+                    if (config && typeof config.onOpen === "function") {
+                      config.onOpen();
+                    }
+                  };
+                  ws.onclose = (error) => {
+                    console.log("Remix dev asset server web socket closed. Reconnecting...");
+                    setTimeout(
+                      () =>
+                        remixLiveReloadConnect({
+                          onOpen: () => window.location.reload(),
+                        }),
+                      1000
+                    );
+                  };
                   ws.onerror = (error) => {
                     console.log("Remix dev asset server web socket error:");
                     console.error(error);
                   };
-                })();
+                }
+                remixLiveReloadConnect();
               `,
             }}
           />
         );
-      };
+      };
\ No newline at end of file

From ecb723aaaeb8355a0d03cadbf90782c2d910850a Mon Sep 17 00:00:00 2001
From: Anthony Garand <garand@garand.me>
Date: Thu, 2 Jun 2022 21:31:36 -0400
Subject: [PATCH 4/5] chore: add garand to contributors

---
 contributors.yml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/contributors.yml b/contributors.yml
index 280d0143a7f..0198b4618f3 100644
--- a/contributors.yml
+++ b/contributors.yml
@@ -358,3 +358,4 @@
 - zachdtaylor
 - zainfathoni
 - zhe
+- garand

From 2e5ff216c4285b97924eb2c326e02627b8d65aff Mon Sep 17 00:00:00 2001
From: Logan McAnsh <logan@mcan.sh>
Date: Mon, 11 Jul 2022 10:27:21 -0400
Subject: [PATCH 5/5] Create fast-yaks-whisper.md

---
 .changeset/fast-yaks-whisper.md | 6 ++++++
 1 file changed, 6 insertions(+)
 create mode 100644 .changeset/fast-yaks-whisper.md

diff --git a/.changeset/fast-yaks-whisper.md b/.changeset/fast-yaks-whisper.md
new file mode 100644
index 00000000000..c8a53be01df
--- /dev/null
+++ b/.changeset/fast-yaks-whisper.md
@@ -0,0 +1,6 @@
+---
+"remix": patch
+"@remix-run/react": patch
+---
+
+feat(remix-react): add WebSocket reconnect to `LiveReload`