From 94b1b7cc0fcefb0e470cbd131c1c1462e1246a60 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E1=84=80=E1=85=B5=E1=86=B7=E1=84=89=E1=85=A1=E1=86=BC?=
 =?UTF-8?q?=E1=84=83=E1=85=AE?= <puki4416@gmail.com>
Date: Tue, 10 Jun 2025 22:40:08 +0900
Subject: [PATCH 1/5] fix: website ts version error

---
 packages/website/src/components/Playground.tsx               | 1 +
 packages/website/src/components/editor/useSandboxServices.ts | 4 +++-
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/website/src/components/Playground.tsx b/packages/website/src/components/Playground.tsx
index f3c13bee498b..d6ddcb5efe19 100644
--- a/packages/website/src/components/Playground.tsx
+++ b/packages/website/src/components/Playground.tsx
@@ -152,6 +152,7 @@ function Playground(): React.JSX.Element {
             onMarkersChange={setMarkers}
             onSelect={setPosition}
             selectedRange={selectedRange}
+            setState={setState}
           />
         </Panel>
         <PanelResizeHandle className={styles.PanelResizeHandle} />
diff --git a/packages/website/src/components/editor/useSandboxServices.ts b/packages/website/src/components/editor/useSandboxServices.ts
index d3a6e7fc00e3..9dd9760e1857 100644
--- a/packages/website/src/components/editor/useSandboxServices.ts
+++ b/packages/website/src/components/editor/useSandboxServices.ts
@@ -7,7 +7,7 @@ import semverSatisfies from 'semver/functions/satisfies';
 import type { createTypeScriptSandbox } from '../../vendor/sandbox';
 import type { CreateLinter } from '../linter/createLinter';
 import type { PlaygroundSystem } from '../linter/types';
-import type { RuleDetails } from '../types';
+import type { ConfigModel, RuleDetails } from '../types';
 import type { CommonEditorProps } from './types';
 
 import rootPackageJson from '../../../../../package.json';
@@ -23,6 +23,7 @@ export interface SandboxServicesProps {
     ruleDetails: RuleDetails[],
     tsVersions: readonly string[],
   ) => void;
+  readonly setState: (value: Partial<ConfigModel>) => void;
   readonly ts: string;
 }
 
@@ -139,6 +140,7 @@ export const useSandboxServices = (
         });
       })
       .catch((err: unknown) => {
+        props.setState({ ts: process.env.TS_VERSION });
         if (err instanceof Error) {
           setServices(err);
         } else {

From 75c44e798925bc15ed78a7c22a3b6a16ab31bf99 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E1=84=80=E1=85=B5=E1=86=B7=E1=84=89=E1=85=A1=E1=86=BC?=
 =?UTF-8?q?=E1=84=83=E1=85=AE?= <puki4416@gmail.com>
Date: Tue, 10 Jun 2025 22:49:53 +0900
Subject: [PATCH 2/5] feat: add error validation

---
 .../website/src/components/editor/useSandboxServices.ts   | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/packages/website/src/components/editor/useSandboxServices.ts b/packages/website/src/components/editor/useSandboxServices.ts
index 9dd9760e1857..9ead2325ba05 100644
--- a/packages/website/src/components/editor/useSandboxServices.ts
+++ b/packages/website/src/components/editor/useSandboxServices.ts
@@ -140,8 +140,14 @@ export const useSandboxServices = (
         });
       })
       .catch((err: unknown) => {
-        props.setState({ ts: process.env.TS_VERSION });
+        // props.setState({ ts: process.env.TS_VERSION });
         if (err instanceof Error) {
+          if (
+            err.message ===
+            'Could not get all the dependencies of sandbox set up!'
+          ) {
+            props.setState({ ts: process.env.TS_VERSION });
+          }
           setServices(err);
         } else {
           setServices(new Error(String(err)));

From 95ba0c0379ffcf132b08d48792553679684e2078 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E1=84=80=E1=85=B5=E1=86=B7=E1=84=89=E1=85=A1=E1=86=BC?=
 =?UTF-8?q?=E1=84=83=E1=85=AE?= <puki4416@gmail.com>
Date: Tue, 10 Jun 2025 22:52:31 +0900
Subject: [PATCH 3/5] fix: remove comment

---
 packages/website/src/components/editor/useSandboxServices.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/website/src/components/editor/useSandboxServices.ts b/packages/website/src/components/editor/useSandboxServices.ts
index 9ead2325ba05..138ae7f58973 100644
--- a/packages/website/src/components/editor/useSandboxServices.ts
+++ b/packages/website/src/components/editor/useSandboxServices.ts
@@ -140,7 +140,6 @@ export const useSandboxServices = (
         });
       })
       .catch((err: unknown) => {
-        // props.setState({ ts: process.env.TS_VERSION });
         if (err instanceof Error) {
           if (
             err.message ===

From 10d5b0552ebb45a6162493049a62e7db6ec65fb9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E1=84=80=E1=85=B5=E1=86=B7=E1=84=89=E1=85=A1=E1=86=BC?=
 =?UTF-8?q?=E1=84=83=E1=85=AE?= <puki4416@gmail.com>
Date: Sun, 29 Jun 2025 20:28:48 +0900
Subject: [PATCH 4/5] fix: check typescript supported version before
 loadsandbox

---
 .../src/components/editor/loadSandbox.ts      |   3 +-
 .../components/editor/useSandboxServices.ts   | 232 ++++++++++--------
 2 files changed, 131 insertions(+), 104 deletions(-)

diff --git a/packages/website/src/components/editor/loadSandbox.ts b/packages/website/src/components/editor/loadSandbox.ts
index 1521e7cf5aa3..6fa5e604211e 100644
--- a/packages/website/src/components/editor/loadSandbox.ts
+++ b/packages/website/src/components/editor/loadSandbox.ts
@@ -37,7 +37,8 @@ function loadSandbox(tsVersion: string): Promise<SandboxModel> {
         (main, sandboxFactory, lintUtils) => {
           resolve({ lintUtils, main, sandboxFactory });
         },
-        () => {
+        error => {
+          console.log(error);
           reject(
             new Error('Could not get all the dependencies of sandbox set up!'),
           );
diff --git a/packages/website/src/components/editor/useSandboxServices.ts b/packages/website/src/components/editor/useSandboxServices.ts
index 138ae7f58973..5f52c33358f6 100644
--- a/packages/website/src/components/editor/useSandboxServices.ts
+++ b/packages/website/src/components/editor/useSandboxServices.ts
@@ -35,6 +35,23 @@ export interface SandboxServices {
   webLinter: CreateLinter;
 }
 
+const checkUseSupportedTypescriptVersion = async (tsVersion: string) => {
+  const supportedVersionsResponse = await fetch(
+    'https://typescript.azureedge.net/indexes/releases.json',
+  );
+
+  if (supportedVersionsResponse.ok) {
+    const supportedVersions = (await supportedVersionsResponse.json()) as {
+      versions: string[];
+    };
+    const filteredVersions = supportedVersions.versions.filter(item =>
+      semverSatisfies(item, rootPackageJson.devDependencies.typescript),
+    );
+    return filteredVersions.includes(tsVersion);
+  }
+  return false;
+};
+
 export const useSandboxServices = (
   props: CommonEditorProps & SandboxServicesProps,
 ): Error | SandboxServices | undefined => {
@@ -45,113 +62,122 @@ export const useSandboxServices = (
   useEffect(() => {
     let sandboxInstance: SandboxInstance | undefined;
 
-    sandboxSingleton(props.ts)
-      .then(async ({ lintUtils, main, sandboxFactory }) => {
-        const compilerOptions = createCompilerOptions();
-
-        sandboxInstance = sandboxFactory.createTypeScriptSandbox(
-          {
-            acquireTypes: true,
-            compilerOptions:
-              compilerOptions as Monaco.languages.typescript.CompilerOptions,
-            domID: editorEmbedId,
-            monacoSettings: {
-              autoIndent: 'full',
-              fontSize: 13,
-              formatOnPaste: true,
-              formatOnType: true,
-              hover: { above: false },
-              minimap: { enabled: false },
-              scrollBeyondLastLine: false,
-              smoothScrolling: true,
-              wordWrap: 'off',
-              wrappingIndent: 'same',
-            },
-            text: props.code,
-          },
-          main,
-          window.ts,
-        );
-        sandboxInstance.monaco.editor.setTheme(
-          colorMode === 'dark' ? 'vs-dark' : 'vs-light',
-        );
-
-        sandboxInstance.monaco.languages.registerInlayHintsProvider(
-          sandboxInstance.language,
-          createTwoslashInlayProvider(sandboxInstance),
-        );
-
-        const system = createFileSystem(props, sandboxInstance.tsvfs);
-
-        // Write files in vfs when a model is created in the editor (this is used only for ATA types)
-        sandboxInstance.monaco.editor.onDidCreateModel(model => {
-          if (!model.uri.path.includes('node_modules')) {
-            return;
-          }
-          const path = model.uri.path.replace('/file:///', '/');
-          system.writeFile(path, model.getValue());
-        });
-        // Delete files in vfs when a model is disposed in the editor (this is used only for ATA types)
-        sandboxInstance.monaco.editor.onWillDisposeModel(model => {
-          if (!model.uri.path.includes('node_modules')) {
-            return;
-          }
-          const path = model.uri.path.replace('/file:///', '/');
-          system.deleteFile(path);
-        });
-
-        // Load the lib files from typescript to vfs (eg. es2020.d.ts)
-        const worker = await sandboxInstance.getWorkerProcess();
-        if (worker.getLibFiles) {
-          const libs = await worker.getLibFiles();
-          for (const [key, value] of Object.entries(libs)) {
-            system.writeFile(`/${key}`, value);
-          }
+    checkUseSupportedTypescriptVersion(props.ts)
+      .then(res => {
+        if (!res) {
+          props.setState({ ts: process.env.TS_VERSION });
         }
-
-        window.system = system;
-        window.esquery = lintUtils.esquery;
-        window.visitorKeys = lintUtils.visitorKeys;
-
-        const webLinter = createLinter(
-          system,
-          lintUtils,
-          sandboxInstance.tsvfs,
-        );
-
-        onLoaded(
-          [...webLinter.rules.values()],
-          [
-            ...new Set([
-              window.ts.version,
-              ...sandboxInstance.supportedVersions,
-            ]),
-          ]
-            .filter(item =>
-              semverSatisfies(item, rootPackageJson.devDependencies.typescript),
-            )
-            .sort((a, b) => b.localeCompare(a)),
-        );
-
-        setServices({
-          sandboxInstance,
-          system,
-          webLinter,
-        });
+      })
+      .then(() => {
+        sandboxSingleton(props.ts)
+          .then(async ({ lintUtils, main, sandboxFactory }) => {
+            const compilerOptions = createCompilerOptions();
+
+            sandboxInstance = sandboxFactory.createTypeScriptSandbox(
+              {
+                acquireTypes: true,
+                compilerOptions:
+                  compilerOptions as Monaco.languages.typescript.CompilerOptions,
+                domID: editorEmbedId,
+                monacoSettings: {
+                  autoIndent: 'full',
+                  fontSize: 13,
+                  formatOnPaste: true,
+                  formatOnType: true,
+                  hover: { above: false },
+                  minimap: { enabled: false },
+                  scrollBeyondLastLine: false,
+                  smoothScrolling: true,
+                  wordWrap: 'off',
+                  wrappingIndent: 'same',
+                },
+                text: props.code,
+              },
+              main,
+              window.ts,
+            );
+            sandboxInstance.monaco.editor.setTheme(
+              colorMode === 'dark' ? 'vs-dark' : 'vs-light',
+            );
+
+            sandboxInstance.monaco.languages.registerInlayHintsProvider(
+              sandboxInstance.language,
+              createTwoslashInlayProvider(sandboxInstance),
+            );
+
+            const system = createFileSystem(props, sandboxInstance.tsvfs);
+
+            // Write files in vfs when a model is created in the editor (this is used only for ATA types)
+            sandboxInstance.monaco.editor.onDidCreateModel(model => {
+              if (!model.uri.path.includes('node_modules')) {
+                return;
+              }
+              const path = model.uri.path.replace('/file:///', '/');
+              system.writeFile(path, model.getValue());
+            });
+            // Delete files in vfs when a model is disposed in the editor (this is used only for ATA types)
+            sandboxInstance.monaco.editor.onWillDisposeModel(model => {
+              if (!model.uri.path.includes('node_modules')) {
+                return;
+              }
+              const path = model.uri.path.replace('/file:///', '/');
+              system.deleteFile(path);
+            });
+
+            // Load the lib files from typescript to vfs (eg. es2020.d.ts)
+            const worker = await sandboxInstance.getWorkerProcess();
+            if (worker.getLibFiles) {
+              const libs = await worker.getLibFiles();
+              for (const [key, value] of Object.entries(libs)) {
+                system.writeFile(`/${key}`, value);
+              }
+            }
+
+            window.system = system;
+            window.esquery = lintUtils.esquery;
+            window.visitorKeys = lintUtils.visitorKeys;
+
+            const webLinter = createLinter(
+              system,
+              lintUtils,
+              sandboxInstance.tsvfs,
+            );
+
+            onLoaded(
+              [...webLinter.rules.values()],
+              [
+                ...new Set([
+                  window.ts.version,
+                  ...sandboxInstance.supportedVersions,
+                ]),
+              ]
+                .filter(item =>
+                  semverSatisfies(
+                    item,
+                    rootPackageJson.devDependencies.typescript,
+                  ),
+                )
+                .sort((a, b) => b.localeCompare(a)),
+            );
+
+            setServices({
+              sandboxInstance,
+              system,
+              webLinter,
+            });
+          })
+          .catch((err: unknown) => {
+            if (err instanceof Error) {
+              setServices(err);
+            } else {
+              setServices(new Error(String(err)));
+            }
+          });
       })
       .catch((err: unknown) => {
-        if (err instanceof Error) {
-          if (
-            err.message ===
-            'Could not get all the dependencies of sandbox set up!'
-          ) {
-            props.setState({ ts: process.env.TS_VERSION });
-          }
-          setServices(err);
-        } else {
-          setServices(new Error(String(err)));
-        }
+        console.error(err);
       });
+
     return (): void => {
       if (!sandboxInstance) {
         return;

From 34bedfa0f667b62a8cc0436eedf6ab9a5084bf69 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E1=84=80=E1=85=B5=E1=86=B7=E1=84=89=E1=85=A1=E1=86=BC?=
 =?UTF-8?q?=E1=84=83=E1=85=AE?= <puki4416@gmail.com>
Date: Sun, 29 Jun 2025 20:31:20 +0900
Subject: [PATCH 5/5] fix: loadSandbox

---
 packages/website/src/components/editor/loadSandbox.ts | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/packages/website/src/components/editor/loadSandbox.ts b/packages/website/src/components/editor/loadSandbox.ts
index 6fa5e604211e..1521e7cf5aa3 100644
--- a/packages/website/src/components/editor/loadSandbox.ts
+++ b/packages/website/src/components/editor/loadSandbox.ts
@@ -37,8 +37,7 @@ function loadSandbox(tsVersion: string): Promise<SandboxModel> {
         (main, sandboxFactory, lintUtils) => {
           resolve({ lintUtils, main, sandboxFactory });
         },
-        error => {
-          console.log(error);
+        () => {
           reject(
             new Error('Could not get all the dependencies of sandbox set up!'),
           );

<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head>
<title>pFad - Phonifier reborn</title>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />
</head>
<body>
<h1>Pfad - The Proxy pFad of &#169; 2024 Garber Painting. All rights reserved.</h1>


<!-- Disclaimer -->
<p>Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.</p>
<br>
<p>Alternative Proxies:</p><p><a href="http://clevelandohioweatherforecast.com/php-proxy/index.php?q=https://patch-diff.githubusercontent.com/raw/typescript-eslint/typescript-eslint/pull/11292.patch" target="_blank">Alternative Proxy</a></p><p><a href="http://clevelandohioweatherforecast.com/pFad/index.php?u=https://patch-diff.githubusercontent.com/raw/typescript-eslint/typescript-eslint/pull/11292.patch" target="_blank">pFad Proxy</a></p><p><a href="http://clevelandohioweatherforecast.com/pFad/v3index.php?u=https://patch-diff.githubusercontent.com/raw/typescript-eslint/typescript-eslint/pull/11292.patch" target="_blank">pFad v3 Proxy</a></p><p><a href="http://clevelandohioweatherforecast.com/pFad/v4index.php?u=https://patch-diff.githubusercontent.com/raw/typescript-eslint/typescript-eslint/pull/11292.patch" target="_blank">pFad v4 Proxy</a></p></body>
</html>