Merge branch 'master' into dap-support

* master:
  chore(ci): add check that extension will build on PRs (#58)
  chore: add linter setup (#57)
  chore: run prettier (#56)

.eslintignore

@@ -0,0 +1,2 @@
+node_modules
+out

.eslintrc.js

@@ -0,0 +1,19 @@
+module.exports = {
+  root: true,
+  parser: '@typescript-eslint/parser',
+  plugins: ['@typescript-eslint', 'prettier'],
+  extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended'],
+  rules: {
+    'comma-spacing': ['error', { before: false, after: true }],
+    'no-unused-vars': 'off',
+    '@typescript-eslint/no-unused-vars': [
+      'warn', // or "error"
+      {
+        argsIgnorePattern: '^_',
+        varsIgnorePattern: '^_',
+        caughtErrorsIgnorePattern: '^_',
+      },
+    ],
+    'prettier/prettier': 'error',
+  },
+};

.github/workflows/build.yml

@@ -0,0 +1,35 @@
+name: Build
+
+on:
+  pull_request:
+  merge_group:
+  push:
+    branches:
+      - master
+
+# This will cancel previous runs when a branch or PR is updated
+concurrency:
+  group: ${{ github.workflow }}-${{ github.head_ref || github.ref || github.run_id }}
+  cancel-in-progress: true
+
+jobs:
+  build:
+    name: build
+    runs-on: ubuntu-latest
+    timeout-minutes: 30
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 18.17.1
+          cache: 'npm'
+          cache-dependency-path: 'package-lock.json'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build extension
+        run: npm run package

.github/workflows/formatting.yml

@@ -0,0 +1,35 @@
+name: Formatting
+
+on:
+  pull_request:
+  merge_group:
+  push:
+    branches:
+      - master
+
+# This will cancel previous runs when a branch or PR is updated
+concurrency:
+  group: ${{ github.workflow }}-${{ github.head_ref || github.ref || github.run_id }}
+  cancel-in-progress: true
+
+jobs:
+  eslint:
+    name: eslint
+    runs-on: ubuntu-latest
+    timeout-minutes: 30
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 18.17.1
+          cache: 'npm'
+          cache-dependency-path: 'package-lock.json'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Run `npm run lint`
+        run: npm run lint

.prettierrc

@@ -0,0 +1,6 @@
+{
+  "parser": "typescript",
+  "printWidth": 120,
+  "singleQuote": true,
+  "trailingComma": "all"
+}

package.json

@@ -188,6 +188,7 @@
     "package": "vsce package",
     "test-compile": "tsc -p ./",
     "format": "prettier --write .",
+    "lint": "NODE_NO_WARNINGS=1 eslint . --ext .ts --ignore-path ./.eslintignore  --max-warnings 0",
     "check-format": "prettier --check .",
     "deploy": "vsce publish"
   },
@@ -199,10 +200,12 @@
     "@types/node": "^12.12.0",
     "@types/vscode": "1.67.0",
     "@types/which": "^3.0.0",
-    "@typescript-eslint/parser": "^5.59.9",
+    "@typescript-eslint/eslint-plugin": "^6.7.3",
+    "@typescript-eslint/parser": "^6.7.3",
     "esbuild": "^0.17.19",
-    "eslint": "^8.42.0",
-    "prettier": "^2.8.8",
+    "eslint": "^8.55.0",
+    "eslint-plugin-prettier": "^5.0.0",
+    "prettier": "3.0.3",
     "typescript": "^5.1.3",
     "vsce": "^2.15.0"
   }

src/EditorLineDecorationManager.ts

@@ -2,24 +2,27 @@ import {
   workspace,
   Disposable,
   window,
-  TextEditorSelectionChangeEvent,
   Range,
   TextEditorDecorationType,
   DecorationRangeBehavior,
-  Position,
   ThemeColor,
   commands,
-} from "vscode";
-import Client, { FileInfo, OpcodesCounts } from "./client";
-
-const decoration: TextEditorDecorationType =
-  window.createTextEditorDecorationType({
-    after: {
-      margin: "0 0 0 3em",
-      textDecoration: "none",
-    },
-    rangeBehavior: DecorationRangeBehavior.ClosedOpen,
-  });
+  TextDocument,
+} from 'vscode';
+import Client, { FileInfo, OpcodesCounts } from './client';
+
+const decoration: TextEditorDecorationType = window.createTextEditorDecorationType({
+  after: {
+    margin: '0 0 0 3em',
+    textDecoration: 'none',
+  },
+  rangeBehavior: DecorationRangeBehavior.ClosedOpen,
+});
+
+type LineAccumulatedOpcodes = {
+  ranges: { range: Range; countInfo: OpcodesCounts }[];
+  lineOpcodes: { acir_size: number; brillig_size: number };
+};
 
 export class EditorLineDecorationManager extends Disposable {
   #didChangeActiveTextEditor: Disposable;
@@ -30,7 +33,7 @@ export class EditorLineDecorationManager extends Disposable {
 
     this.lspClients = lspClients;
 
-    window.onDidChangeActiveTextEditor((editor) => {
+    window.onDidChangeActiveTextEditor((_editor) => {
       this.displayAllTextDecorations();
     });
   }
@@ -39,69 +42,64 @@ export class EditorLineDecorationManager extends Disposable {
     const document = window?.activeTextEditor?.document;
 
     if (document) {
-      let workspaceFolder = workspace
-        .getWorkspaceFolder(document.uri)
-        .uri.toString();
+      const workspaceFolder = workspace.getWorkspaceFolder(document.uri).uri.toString();
 
       const activeClient = this.lspClients.get(workspaceFolder);
 
       if (activeClient?.profileRunResult) {
         // find file which we want to present hints for
-        let [fileIdKey, _] = Object.entries(
-          activeClient.profileRunResult.file_map
-        ).find(([fileId, fileElement]) => {
-          return fileElement.path === document.uri.path;
-        }) as [string, FileInfo];
+        const [fileIdKey, _] = Object.entries(activeClient.profileRunResult.file_map).find(
+          ([_fileId, fileElement]) => fileElement.path === document.uri.path,
+        ) as [string, FileInfo];
 
         const fileId = Number(fileIdKey);
 
         // Filter counts for file of interest
-        const filteredResults =
-          activeClient.profileRunResult.opcodes_counts.filter(
-            ([spanInfo, _]) => {
-              return spanInfo.file === fileId;
-            }
-          );
+        const filteredResults = activeClient.profileRunResult.opcodes_counts.filter(([spanInfo, _]) => {
+          return spanInfo.file === fileId;
+        });
 
         // Sum Opcodes for lines
-        const lineAccumulatedOpcodes = filteredResults
-          .map(([spanInfo, countInfo]) => {
-            const startPosition = document.positionAt(spanInfo.span.start);
-            const endPosition = document.positionAt(spanInfo.span.end);
-
-            const range = new Range(startPosition, endPosition);
-
-            return { range, countInfo };
-          })
-          // Lets accumulate ranges by line numbers
-          .reduce((accumulator, { range, countInfo }) => {
-            let lineInfo = accumulator[range.end.line];
-            if (!lineInfo) {
-              lineInfo = { ranges: [] };
-            }
-            lineInfo.ranges.push({ range, countInfo });
-            accumulator[range.end.line] = lineInfo;
-            return accumulator;
-          }, {});
-
-        // Count opcodes per line in accumulated collection
-        (Object.entries(lineAccumulatedOpcodes) as [number, any]).forEach(
-          ([lineNumber, lineInfo]) => {
-            lineInfo.lineOpcodes = lineInfo.ranges.reduce(
-              ({ acir_size, brillig_size }, { range, countInfo }) => {
-                acir_size = acir_size + countInfo.acir_size;
-                brillig_size = brillig_size + countInfo.brillig_size;
-                return { acir_size, brillig_size };
+        const lineAccumulatedOpcodes: Record<number, { ranges: { range: Range; countInfo: OpcodesCounts }[] }> =
+          filteredResults
+            .map(([spanInfo, countInfo]) => {
+              const startPosition = document.positionAt(spanInfo.span.start);
+              const endPosition = document.positionAt(spanInfo.span.end);
+
+              const range = new Range(startPosition, endPosition);
+
+              return { range, countInfo };
+            })
+            // Lets accumulate ranges by line numbers
+            .reduce(
+              (accumulator, { range, countInfo }) => {
+                let lineInfo = accumulator[range.end.line];
+                if (!lineInfo) {
+                  lineInfo = { ranges: [] };
+                }
+                lineInfo.ranges.push({ range, countInfo });
+                accumulator[range.end.line] = lineInfo;
+                return accumulator;
               },
-              { acir_size: 0, brillig_size: 0 }
+              {} as Record<number, { ranges: { range: Range; countInfo: OpcodesCounts }[] }>,
             );
-          }
-        );
 
-        updateDecorations(document, lineAccumulatedOpcodes);
+        // Count opcodes per line in accumulated collection
+        (Object.values(lineAccumulatedOpcodes) as LineAccumulatedOpcodes[]).forEach((lineInfo) => {
+          lineInfo.lineOpcodes = lineInfo.ranges.reduce(
+            ({ acir_size, brillig_size }, { countInfo }) => {
+              acir_size = acir_size + countInfo.acir_size;
+              brillig_size = brillig_size + countInfo.brillig_size;
+              return { acir_size, brillig_size };
+            },
+            { acir_size: 0, brillig_size: 0 },
+          );
+        });
+
+        updateDecorations(document, lineAccumulatedOpcodes as Record<number, LineAccumulatedOpcodes>);
 
         // Used to show Hide Commands in Command Pallette
-        commands.executeCommand("setContext", "noir.profileInfoPresent", true);
+        commands.executeCommand('setContext', 'noir.profileInfoPresent', true);
       }
     }
   }
@@ -116,19 +114,17 @@ export class EditorLineDecorationManager extends Disposable {
   }
 }
 
-function updateDecorations(document, lineAccumulatedOpcodes: object) {
+function updateDecorations(document: TextDocument, lineAccumulatedOpcodes: Record<number, LineAccumulatedOpcodes>) {
   const decorations = Object.entries(lineAccumulatedOpcodes)
     .flatMap(([lineNumber, lineInfo]) => {
       const decorators = [];
 
       const lineDecorators = lineDecorator(document, lineNumber, lineInfo);
       decorators.push(lineDecorators);
 
-      let hoverDecorators = lineInfo.ranges.map(({ range, countInfo }) => {
-        const hoverMessage = `${
-          countInfo.acir_size ? `${countInfo.acir_size} ACIR` : ""
-        } ${
-          countInfo.brillig_size ? `${countInfo.brillig_size} Brillig` : ""
+      const hoverDecorators = lineInfo.ranges.map(({ range, countInfo }) => {
+        const hoverMessage = `${countInfo.acir_size ? `${countInfo.acir_size} ACIR` : ''} ${
+          countInfo.brillig_size ? `${countInfo.brillig_size} Brillig` : ''
         } opcodes`;
         return {
           range,
@@ -144,22 +140,20 @@ function updateDecorations(document, lineAccumulatedOpcodes: object) {
   window?.activeTextEditor?.setDecorations(decoration, decorations);
 }
 
-function lineDecorator(document: any, lineNumber: string, lineInfo: any) {
+function lineDecorator(document: TextDocument, lineNumber: string, lineInfo: LineAccumulatedOpcodes) {
   const range: Range = document.lineAt(Number(lineNumber)).range;
-  const lineContent = `// ${
-    lineInfo.lineOpcodes.acir_size
-      ? `${lineInfo.lineOpcodes.acir_size} ACIR`
-      : ""
-  } ${lineInfo.brillig_size ? `${lineInfo.brillig_size} ACIR` : ""} opcodes`;
+  const lineContent = `// ${lineInfo.lineOpcodes.acir_size ? `${lineInfo.lineOpcodes.acir_size} ACIR` : ''} ${
+    lineInfo.lineOpcodes.brillig_size ? `${lineInfo.lineOpcodes.brillig_size} Brillig` : ''
+  } opcodes`;
   const decorator = {
     range,
     renderOptions: {
       after: {
-        backgroundColor: new ThemeColor("editorInlayHint.background"),
-        color: new ThemeColor("editorInlayHint.foreground"),
+        backgroundColor: new ThemeColor('editorInlayHint.background'),
+        color: new ThemeColor('editorInlayHint.foreground'),
         contentText: lineContent,
-        fontWeight: "normal",
-        fontStyle: "normal",
+        fontWeight: 'normal',
+        fontStyle: 'normal',
         textDecoration: `none; position: absolute;`,
       },
     },