From 6777c241f2d04b709e778543fe4afd9f79d3b514 Mon Sep 17 00:00:00 2001
From: Danilo Woznica <danilowoz@gmail.com>
Date: Fri, 23 Feb 2024 19:51:14 +0000
Subject: [PATCH] fix(timeout): clear it when there is a syntax error (#1087)

* fix(timeout): clear it when there is a syntax error

* feat: Fix Playground component name to EslintBasic, add ESLint configuration rules and dev dependencies and update project template
---
 sandpack-react/src/contexts/utils/useClient.ts     | 4 ++++
 sandpack-react/src/presets/Sandpack.stories.tsx    | 4 ++--
 website/docs/src/pages/advanced-usage/bundlers.mdx | 6 +++---
 3 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/sandpack-react/src/contexts/utils/useClient.ts b/sandpack-react/src/contexts/utils/useClient.ts
index 723b8f50f..88f569102 100644
--- a/sandpack-react/src/contexts/utils/useClient.ts
+++ b/sandpack-react/src/contexts/utils/useClient.ts
@@ -349,6 +349,10 @@ export const useClient: UseClient = (
 
       setState((prev) => ({ ...prev, error: null }));
     } else if (msg.type === "action" && msg.action === "show-error") {
+      if (timeoutHook.current) {
+        clearTimeout(timeoutHook.current);
+      }
+
       setState((prev) => ({ ...prev, error: extractErrorDetails(msg) }));
     } else if (
       msg.type === "action" &&
diff --git a/sandpack-react/src/presets/Sandpack.stories.tsx b/sandpack-react/src/presets/Sandpack.stories.tsx
index 49a9cbe87..a7b4dbea5 100644
--- a/sandpack-react/src/presets/Sandpack.stories.tsx
+++ b/sandpack-react/src/presets/Sandpack.stories.tsx
@@ -268,7 +268,7 @@ export const FileResolver = (): JSX.Element => {
         }}
         files={defaultFiles}
         options={{
-          bundlerURL: "https://1ad528b9.sandpack-bundler.pages.dev",
+          bundlerURL: "https://sandpack-bundler.codesandbox.io",
           fileResolver: {
             isFile: async (fileName): Promise<boolean> =>
               new Promise((resolve) => resolve(!!filesA[fileName])),
@@ -285,7 +285,7 @@ export const FileResolver = (): JSX.Element => {
         }}
         files={defaultFiles}
         options={{
-          bundlerURL: "https://1ad528b9.sandpack-bundler.pages.dev",
+          bundlerURL: "https://sandpack-bundler.codesandbox.io",
           fileResolver: {
             isFile: async (fileName): Promise<boolean> =>
               new Promise((resolve) => resolve(!!filesB[fileName])),
diff --git a/website/docs/src/pages/advanced-usage/bundlers.mdx b/website/docs/src/pages/advanced-usage/bundlers.mdx
index 17ff0bed5..95d946b49 100644
--- a/website/docs/src/pages/advanced-usage/bundlers.mdx
+++ b/website/docs/src/pages/advanced-usage/bundlers.mdx
@@ -27,7 +27,7 @@ You just need to set the new bundler URL in your Sandpack instance:
 ```jsx
 <SandpackProvider
   template="react"
-  options={{ bundlerURL: "https://sandpack-bundler.pages.dev" }}
+  options={{ bundlerURL: "https://sandpack-bundler.codesandbox.io" }}
 >
   {/* Children */}
 </SandpackProvider>
@@ -38,7 +38,7 @@ You just need to set the new bundler URL in your Sandpack instance:
 ```jsx
 <Sandpack
   template="react"
-  options={{ bundlerURL: "https://sandpack-bundler.pages.dev" }}
+  options={{ bundlerURL: "https://sandpack-bundler.codesandbox.io" }}
 />
 ```
 
@@ -47,7 +47,7 @@ You just need to set the new bundler URL in your Sandpack instance:
 **Preview**
 <Sandpack
   template="react"
-  options={{ bundlerURL: "https://sandpack-bundler.pages.dev" }}
+  options={{ bundlerURL: "https://sandpack-bundler.codesandbox.io" }}
 />
 
 <Callout>