From 1fec265e1ea474498fa6c3cc7ce327882231616d Mon Sep 17 00:00:00 2001
From: Armano <armano2@users.noreply.github.com>
Date: Wed, 13 Jul 2022 01:20:41 +0200
Subject: [PATCH] chore(website): add current version of typescript to dropdown
 #5244

---
 packages/website/src/components/OptionsSelector.tsx      | 5 ++---
 .../website/src/components/editor/useSandboxServices.ts  | 9 ++++++++-
 packages/website/src/components/inputs/Dropdown.tsx      | 2 ++
 3 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/packages/website/src/components/OptionsSelector.tsx b/packages/website/src/components/OptionsSelector.tsx
index f57f2600f49c..b9b78edfad09 100644
--- a/packages/website/src/components/OptionsSelector.tsx
+++ b/packages/website/src/components/OptionsSelector.tsx
@@ -90,10 +90,9 @@ function OptionsSelectorContent({
             name="ts"
             className="text--right"
             value={state.ts}
+            disabled={!tsVersions.length}
             onChange={updateTS}
-            options={((tsVersions.length && tsVersions) || [state.ts]).filter(
-              item => parseFloat(item) >= 3.3,
-            )}
+            options={(tsVersions.length && tsVersions) || [state.ts]}
           />
         </label>
         <label className={styles.optionLabel}>
diff --git a/packages/website/src/components/editor/useSandboxServices.ts b/packages/website/src/components/editor/useSandboxServices.ts
index 4eec5f356957..c786e9996045 100644
--- a/packages/website/src/components/editor/useSandboxServices.ts
+++ b/packages/website/src/components/editor/useSandboxServices.ts
@@ -110,7 +110,14 @@ export const useSandboxServices = (
 
         const webLinter = new WebLinter(system, compilerOptions, lintUtils);
 
-        props.onLoaded(webLinter.ruleNames, sandboxInstance.supportedVersions);
+        props.onLoaded(
+          webLinter.ruleNames,
+          Array.from(
+            new Set([...sandboxInstance.supportedVersions, window.ts.version]),
+          )
+            .filter(item => parseFloat(item) >= 3.3)
+            .sort((a, b) => b.localeCompare(a)),
+        );
 
         setServices({
           main,
diff --git a/packages/website/src/components/inputs/Dropdown.tsx b/packages/website/src/components/inputs/Dropdown.tsx
index 929f4bc6bbbc..5c10b2bffc35 100644
--- a/packages/website/src/components/inputs/Dropdown.tsx
+++ b/packages/website/src/components/inputs/Dropdown.tsx
@@ -13,6 +13,7 @@ export interface DropdownProps<T> {
   readonly value: T | undefined;
   readonly name: string;
   readonly className?: string;
+  readonly disabled?: boolean;
 }
 
 function Dropdown<T extends boolean | string | number>(
@@ -27,6 +28,7 @@ function Dropdown<T extends boolean | string | number>(
   return (
     <select
       name={props.name}
+      disabled={props.disabled}
       value={String(props.value)}
       className={clsx(styles.optionSelect, props.className)}
       onChange={(e): void => {