From 013844c017824aba3568ea924b77b75ccb707978 Mon Sep 17 00:00:00 2001
From: Colin <colin@airplane.dev>
Date: Sun, 27 Nov 2022 02:40:05 -0500
Subject: [PATCH] Fix "apply() is only allowed in ready status (state: idle)"
 HMR errors (#43242)

This is a follow-up to https://github.com/vercel/next.js/pull/43145 that
fixes [this
issue](https://github.com/vercel/next.js/pull/43145#issuecomment-1323782302):

```
warn  - Fast Refresh had to perform a full reload. Read more: https://nextjs.org/docs/basic-features/fast-refresh#how-it-works
Error: apply() is only allowed in ready status (state: idle)
    at https://app.airplane.so:5000/_next/static/chunks/webpack.js?ts=1669127927262:615:21
```

## Bug

- [X] Related issues linked using `fixes #number` - n/a
- [X] Integration tests added - n/a
- [X] Errors have a helpful link attached, see `contributing.md` - n/a
---
 .../react-dev-overlay/hot-reloader-client.tsx          | 10 +++++++---
 .../next/client/dev/error-overlay/hot-dev-client.js    |  8 ++++++--
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/packages/next/client/components/react-dev-overlay/hot-reloader-client.tsx b/packages/next/client/components/react-dev-overlay/hot-reloader-client.tsx
index 0a5cbb9c6a78..4b77621c09c5 100644
--- a/packages/next/client/components/react-dev-overlay/hot-reloader-client.tsx
+++ b/packages/next/client/components/react-dev-overlay/hot-reloader-client.tsx
@@ -144,7 +144,7 @@ function tryApplyUpdates(
       return
     }
 
-    const hasUpdates = Boolean(updatedModules?.length)
+    const hasUpdates = Boolean(updatedModules.length)
     if (typeof onHotUpdateSuccess === 'function') {
       // Maybe we want to do something.
       onHotUpdateSuccess(hasUpdates)
@@ -176,8 +176,12 @@ function tryApplyUpdates(
   module.hot
     .check(/* autoApply */ false)
     .then((updatedModules: any[] | null) => {
-      const hasUpdates = Boolean(updatedModules?.length)
+      if (!updatedModules) {
+        return null
+      }
+
       if (typeof onBeforeUpdate === 'function') {
+        const hasUpdates = Boolean(updatedModules.length)
         onBeforeUpdate(hasUpdates)
       }
       // https://webpack.js.org/api/hot-module-replacement/#apply
@@ -185,7 +189,7 @@ function tryApplyUpdates(
       return module.hot.apply()
     })
     .then(
-      (updatedModules: any) => {
+      (updatedModules: any[] | null) => {
         handleApplyUpdates(null, updatedModules)
       },
       (err: any) => {
diff --git a/packages/next/client/dev/error-overlay/hot-dev-client.js b/packages/next/client/dev/error-overlay/hot-dev-client.js
index fa613a6ee03d..63d0256ac3a6 100644
--- a/packages/next/client/dev/error-overlay/hot-dev-client.js
+++ b/packages/next/client/dev/error-overlay/hot-dev-client.js
@@ -337,7 +337,7 @@ function tryApplyUpdates(onBeforeHotUpdate, onHotUpdateSuccess) {
       return
     }
 
-    const hasUpdates = Boolean(updatedModules?.length)
+    const hasUpdates = Boolean(updatedModules.length)
     if (typeof onHotUpdateSuccess === 'function') {
       // Maybe we want to do something.
       onHotUpdateSuccess(hasUpdates)
@@ -367,8 +367,12 @@ function tryApplyUpdates(onBeforeHotUpdate, onHotUpdateSuccess) {
   module.hot
     .check(/* autoApply */ false)
     .then((updatedModules) => {
+      if (!updatedModules) {
+        return null
+      }
+
       if (typeof onBeforeHotUpdate === 'function') {
-        const hasUpdates = Boolean(updatedModules?.length)
+        const hasUpdates = Boolean(updatedModules.length)
         onBeforeHotUpdate(hasUpdates)
       }
       return module.hot.apply()