typescript-eslint · JoshuaKGoldberg · Aug 23, 2024 · Aug 20, 2024 · Aug 23, 2024
diff --git a/eslint.config.mjs b/eslint.config.mjs
@@ -570,7 +570,11 @@ export default tseslint.config(
   },
   {
     extends: [perfectionistPlugin.configs['recommended-alphabetical']],
-    files: ['packages/utils/src/**/*.ts', 'packages/visitor-keys/src/**/*.ts'],
+    files: [
+      'packages/utils/src/**/*.ts',
+      'packages/visitor-keys/src/**/*.ts',
+      'packages/website*/src/**/*.ts',
+    ],
     rules: {
       'perfectionist/sort-classes': [
         'error',

diff --git a/packages/website/src/components/ast/selectedRange.ts b/packages/website/src/components/ast/selectedRange.ts
@@ -1,4 +1,5 @@
 import type { ParentNodeType } from './types';
+
 import { filterProperties, isESNode, isRecord, isTSNode } from './utils';
 
 function isInRange(offset: number, value: object): boolean {
@@ -70,7 +71,7 @@ function findInObject(
 export function findSelectionPath(
   node: object,
   cursorPosition: number,
-): { path: string[]; node: object | null } {
+): { node: object | null; path: string[] } {
   const nodePath = ['ast'];
   const visited = new Set<unknown>();
   let currentNode: unknown = node;
@@ -86,8 +87,8 @@ export function findSelectionPath(
       currentNode = result.value;
       nodePath.push(...result.key);
     } else {
-      return { path: nodePath, node: currentNode };
+      return { node: currentNode, path: nodePath };
     }
   }
-  return { path: nodePath, node: null };
+  return { node: null, path: nodePath };
 }
diff --git a/packages/website/src/components/ast/tsUtils.ts b/packages/website/src/components/ast/tsUtils.ts
@@ -1,15 +1,15 @@
 interface TsParsedEnums {
-  SyntaxKind: Record<number, string>;
-  NodeFlags: Record<number, string>;
-  TokenFlags: Record<number, string>;
+  LanguageVariant: Record<number, string>;
   ModifierFlags: Record<number, string>;
+  NodeFlags: Record<number, string>;
   ObjectFlags: Record<number, string>;
-  SymbolFlags: Record<number, string>;
-  TypeFlags: Record<number, string>;
   ScriptKind: Record<number, string>;
-  TransformFlags: Record<number, string>;
   ScriptTarget: Record<number, string>;
-  LanguageVariant: Record<number, string>;
+  SymbolFlags: Record<number, string>;
+  SyntaxKind: Record<number, string>;
+  TokenFlags: Record<number, string>;
+  TransformFlags: Record<number, string>;
+  TypeFlags: Record<number, string>;
 }
 
 /**
@@ -39,16 +39,16 @@ let tsEnumCache: TsParsedEnums | undefined;
  */
 function getTsEnum(type: keyof TsParsedEnums): Record<number, string> {
   tsEnumCache ??= {
-    SyntaxKind: extractEnum(window.ts.SyntaxKind),
-    NodeFlags: extractEnum(window.ts.NodeFlags),
-    TokenFlags: extractEnum(window.ts.TokenFlags),
+    LanguageVariant: extractEnum(window.ts.LanguageVariant),
     ModifierFlags: extractEnum(window.ts.ModifierFlags),
+    NodeFlags: extractEnum(window.ts.NodeFlags),
     ObjectFlags: extractEnum(window.ts.ObjectFlags),
-    SymbolFlags: extractEnum(window.ts.SymbolFlags),
-    TypeFlags: extractEnum(window.ts.TypeFlags),
     ScriptKind: extractEnum(window.ts.ScriptKind),
     ScriptTarget: extractEnum(window.ts.ScriptTarget),
-    LanguageVariant: extractEnum(window.ts.LanguageVariant),
+    SymbolFlags: extractEnum(window.ts.SymbolFlags),
+    SyntaxKind: extractEnum(window.ts.SyntaxKind),
+    TokenFlags: extractEnum(window.ts.TokenFlags),
+    TypeFlags: extractEnum(window.ts.TypeFlags),
     // @ts-expect-error: non public API
     // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
     TransformFlags: extractEnum(window.ts.TransformFlags),

diff --git a/packages/website/src/components/ast/utils.ts b/packages/website/src/components/ast/utils.ts
@@ -1,9 +1,10 @@
 import type { TSESTree } from '@typescript-eslint/utils';
 import type * as ts from 'typescript';
 
-import { tsEnumFlagToString, tsEnumToString } from './tsUtils';
 import type { ParentNodeType } from './types';
 
+import { tsEnumFlagToString, tsEnumToString } from './tsUtils';
+
 export function objType(obj: unknown): string {
   const type = Object.prototype.toString.call(obj).slice(8, -1);
   if (type === 'Object' && obj && typeof obj[Symbol.iterator] === 'function') {
@@ -79,26 +80,26 @@ export function getTypeName(
   switch (valueType) {
     case 'esNode':
       return String(value.type);
-    case 'tsNode':
-      return tsEnumToString('SyntaxKind', Number(value.kind));
-    case 'scopeManager':
-      return 'ScopeManager';
     case 'scope':
       return `${ucFirst(String(value.type))}Scope$${String(value.$id)}`;
     case 'scopeDefinition':
       return `Definition#${String(value.type)}$${String(value.$id)}`;
-    case 'scopeVariable':
-      return `Variable#${String(value.name)}$${String(value.$id)}`;
+    case 'scopeManager':
+      return 'ScopeManager';
     case 'scopeReference':
       return `Reference#${String(
         isRecord(value.identifier) ? value.identifier.name : 'unknown',
       )}$${String(value.$id)}`;
-    case 'tsType':
-      return '[Type]';
-    case 'tsSymbol':
-      return `Symbol(${String(value.escapedName)})`;
+    case 'scopeVariable':
+      return `Variable#${String(value.name)}$${String(value.$id)}`;
+    case 'tsNode':
+      return tsEnumToString('SyntaxKind', Number(value.kind));
     case 'tsSignature':
       return '[Signature]';
+    case 'tsSymbol':
+      return `Symbol(${String(value.escapedName)})`;
+    case 'tsType':
+      return '[Type]';
   }
   return undefined;
 }
@@ -114,23 +115,23 @@ export function getTooltipLabel(
         switch (propName) {
           case 'flags':
             return tsEnumFlagToString('NodeFlags', value);
-          case 'numericLiteralFlags':
-            return tsEnumFlagToString('TokenFlags', value);
-          case 'modifierFlagsCache':
-            return tsEnumFlagToString('ModifierFlags', value);
-          case 'scriptKind':
-            return `ScriptKind.${tsEnumToString('ScriptKind', value)}`;
-          case 'transformFlags':
-            return tsEnumFlagToString('TransformFlags', value);
           case 'kind':
             return `SyntaxKind.${tsEnumToString('SyntaxKind', value)}`;
-          case 'languageVersion':
-            return `ScriptTarget.${tsEnumToString('ScriptTarget', value)}`;
           case 'languageVariant':
             return `LanguageVariant.${tsEnumToString(
               'LanguageVariant',
               value,
             )}`;
+          case 'languageVersion':
+            return `ScriptTarget.${tsEnumToString('ScriptTarget', value)}`;
+          case 'modifierFlagsCache':
+            return tsEnumFlagToString('ModifierFlags', value);
+          case 'numericLiteralFlags':
+            return tsEnumFlagToString('TokenFlags', value);
+          case 'scriptKind':
+            return `ScriptKind.${tsEnumToString('ScriptKind', value)}`;
+          case 'transformFlags':
+            return tsEnumFlagToString('TransformFlags', value);
         }
         break;
       }
@@ -170,22 +171,11 @@ export function getRange(
     switch (valueType) {
       case 'esNode':
         return getValidRange(value.range);
-      case 'tsNode':
-        return getValidRange([value.pos, value.end]);
       case 'scope':
         if (isRecord(value.block)) {
           return getValidRange(value.block.range);
         }
         break;
-      case 'scopeVariable':
-        if (
-          Array.isArray(value.identifiers) &&
-          value.identifiers.length > 0 &&
-          isRecord(value.identifiers[0])
-        ) {
-          return getValidRange(value.identifiers[0].range);
-        }
-        break;
       case 'scopeDefinition':
         if (isRecord(value.node)) {
           return getValidRange(value.node.range);
@@ -196,6 +186,17 @@ export function getRange(
           return getValidRange(value.identifier.range);
         }
         break;
+      case 'scopeVariable':
+        if (
+          Array.isArray(value.identifiers) &&
+          value.identifiers.length > 0 &&
+          isRecord(value.identifiers[0])
+        ) {
+          return getValidRange(value.identifiers[0].range);
+        }
+        break;
+      case 'tsNode':
+        return getValidRange([value.pos, value.end]);
     }
   }
   return undefined;

diff --git a/packages/website/src/components/editor/createProvideCodeActions.ts b/packages/website/src/components/editor/createProvideCodeActions.ts
@@ -1,6 +1,7 @@
 import type Monaco from 'monaco-editor';
 
 import type { LintCodeAction } from '../linter/utils';
+
 import { createEditOperation, createURI } from '../linter/utils';
 
 export function createProvideCodeActions(
@@ -26,10 +27,7 @@ export function createProvideCodeActions(
         for (const message of messages) {
           const editOperation = createEditOperation(model, message);
           actions.push({
-            title: message.message + (message.code ? ` (${message.code})` : ''),
             diagnostics: [marker],
-            kind: 'quickfix',
-            isPreferred: message.isPreferred,
             edit: {
               edits: [
                 {
@@ -41,6 +39,9 @@ export function createProvideCodeActions(
                 },
               ],
             },
+            isPreferred: message.isPreferred,
+            kind: 'quickfix',
+            title: message.message + (message.code ? ` (${message.code})` : ''),
           });
         }
       }

diff --git a/packages/website/src/components/editor/createProvideTwoslashInlay.ts b/packages/website/src/components/editor/createProvideTwoslashInlay.ts
@@ -30,10 +30,10 @@ export function createTwoslashInlayProvider(
       const worker = await sandbox.getWorkerProcess();
       if (model.isDisposed() || cancel.isCancellationRequested) {
         return {
-          hints: [],
           dispose(): void {
             /* nop */
           },
+          hints: [],
         };
       }
 
@@ -50,10 +50,10 @@ export function createTwoslashInlayProvider(
       }
 
       return {
-        hints: results,
         dispose(): void {
           /* nop */
         },
+        hints: results,
       };
 
       async function resolveInlayHint(
@@ -85,12 +85,12 @@ export function createTwoslashInlayProvider(
 
         return {
           kind: sandbox.monaco.languages.InlayHintKind.Type,
+          label: text,
+          paddingLeft: true,
           position: new sandbox.monaco.Position(
             endPos.lineNumber,
             endPos.column + 1,
           ),
-          label: text,
-          paddingLeft: true,
         };
       }
     },

diff --git a/packages/website/src/components/editor/loadSandbox.ts b/packages/website/src/components/editor/loadSandbox.ts
@@ -7,9 +7,9 @@ type Monaco = typeof MonacoEditor;
 type Sandbox = typeof SandboxFactory;
 
 export interface SandboxModel {
+  lintUtils: WebLinterModule;
   main: Monaco;
   sandboxFactory: Sandbox;
-  lintUtils: WebLinterModule;
 }
 
 function loadSandbox(tsVersion: string): Promise<SandboxModel> {
@@ -23,9 +23,9 @@ function loadSandbox(tsVersion: string): Promise<SandboxModel> {
       // https://typescript.azureedge.net/indexes/releases.json
       window.require.config({
         paths: {
-          vs: `https://typescript.azureedge.net/cdn/${tsVersion}/monaco/min/vs`,
-          sandbox: 'https://www.typescriptlang.org/js/sandbox',
           linter: '/sandbox',
+          sandbox: 'https://www.typescriptlang.org/js/sandbox',
+          vs: `https://typescript.azureedge.net/cdn/${tsVersion}/monaco/min/vs`,
         },
         // This is something you need for monaco to work
         ignoreDuplicateModules: ['vs/editor/editor.main'],
@@ -35,7 +35,7 @@ function loadSandbox(tsVersion: string): Promise<SandboxModel> {
       window.require<[Monaco, Sandbox, WebLinterModule]>(
         ['vs/editor/editor.main', 'sandbox/index', 'linter/index'],
         (main, sandboxFactory, lintUtils) => {
-          resolve({ main, sandboxFactory, lintUtils });
+          resolve({ lintUtils, main, sandboxFactory });
         },
         () => {
           reject(

diff --git a/packages/website/src/components/editor/types.ts b/packages/website/src/components/editor/types.ts
@@ -3,9 +3,9 @@ import type { ConfigModel, ErrorGroup, SelectedRange, TabType } from '../types';
 
 export interface CommonEditorProps extends ConfigModel {
   readonly activeTab: TabType;
-  readonly selectedRange?: SelectedRange;
+  readonly onASTChange: (value: UpdateModel | undefined) => void;
   readonly onChange: (cfg: Partial<ConfigModel>) => void;
-  readonly onASTChange: (value: undefined | UpdateModel) => void;
   readonly onMarkersChange: (value: ErrorGroup[]) => void;
   readonly onSelect: (position?: number) => void;
+  readonly selectedRange?: SelectedRange;
 }