Rough and ready jump-to-definition for Phoenix component functions in…

.gitignore

@@ -1 +1,3 @@
 *.vsix
+out/
+node_modules/

.vscode/launch.json

@@ -12,7 +12,11 @@
             "runtimeExecutable": "${execPath}",
             "args": [
                 "--extensionDevelopmentPath=${workspaceFolder}"
-            ]
+            ],
+            "outFiles": [
+                "${workspaceFolder}/out/**/*.js"
+            ],
+            "preLaunchTask": "npm: watch"
         }
     ]
 }

package.json

@@ -3,7 +3,7 @@
     "displayName": "Phoenix Framework",
     "homepage": "https://www.phoenixframework.org",
     "description": "Syntax highlighting support for HEEx",
-    "version": "0.1.2",
+    "version": "0.1.2-m1",
     "author": "Marlus Saraiva",
     "publisher": "phoenixframework",
     "license": "MIT",
@@ -13,11 +13,15 @@
         "url": "https://github.com/phoenixframework/vscode-phoenix.git"
     },
     "engines": {
-        "vscode": "^1.25.1"
+        "vscode": "^1.95.0"
     },
     "categories": [
         "Programming Languages"
     ],
+    "main": "./out/commands/extension.js",
+    "activationEvents": [
+        "onLanguage:elixir"
+    ],
     "contributes": {
         "languages": [
             {
@@ -48,6 +52,24 @@
                     "text.html.heex": "phoenix-heex"
                 }
             }
+        ],
+        "commands": [
+            {
+                "command": "phoenixFunctionNavigator.goToDefinition",
+                "title": "Go to Component Definition"
+            },
+            {
+                "command": "phoenixFunctionNavigator.goToReference",
+                "title": "Go to Component References"
+            }
         ]
+    },
+    "scripts": {
+        "watch": "tsc"
+    },
+    "devDependencies": {
+        "@types/vscode": "^1.95.0",
+        "path": "^0.12.7",
+        "typescript": "^5.6.3"
     }
 }

src/commands/extension.ts

@@ -0,0 +1,94 @@
+import * as vscode from 'vscode';
+
+
+export function activate(context: vscode.ExtensionContext) {
+  const languages = [{ scheme: 'file', language: 'elixir' }, { scheme: 'file', language: 'phoenix-heex' }];
+
+  // Register the definition provider for Elixir files
+  const definitionProvider = vscode.languages.registerDefinitionProvider(
+    languages,
+    new PhoenixComponentDefinitionProvider()
+  );
+
+  // Register the reference provider for Elixir files
+  const referenceProvider = vscode.languages.registerReferenceProvider(
+    languages,
+    new PhoenixComponentReferenceProvider()
+  );
+
+  context.subscriptions.push(definitionProvider, referenceProvider);
+}
+
+class PhoenixComponentDefinitionProvider implements vscode.DefinitionProvider {
+  async provideDefinition(
+    document: vscode.TextDocument,
+    position: vscode.Position,
+    token: vscode.CancellationToken
+  ): Promise<vscode.Definition | undefined> {
+    const range = document.getWordRangeAtPosition(position, /<\.\w+/);
+    if (!range) return;
+
+    const tagText = document.getText(range);
+    const tagMatch = tagText.match(/<\.(\w+)/)
+    if(!tagMatch) return;
+
+    const functionName = tagMatch[1];
+
+    const functionRegex = new RegExp(`defp?\\s+${functionName}\\s*`);
+    const privateMatch = functionRegex.exec(document.getText())
+    if(privateMatch){
+      const position = document.positionAt(privateMatch.index);
+        return new vscode.Location(document.uri, position);
+    }
+
+    const files = await vscode.workspace.findFiles('lib/*_web/**/*.ex');
+    console.log("Candidate .ex files", files)
+    for (const file of files) {
+      const fileContent = await vscode.workspace.openTextDocument(file);
+
+      const match = functionRegex.exec(fileContent.getText());
+
+      if (match) {
+        const position = fileContent.positionAt(match.index);
+        return new vscode.Location(file, position);
+      }
+    }
+    return;
+  }
+}
+
+class PhoenixComponentReferenceProvider implements vscode.ReferenceProvider {
+  async provideReferences(
+    document: vscode.TextDocument,
+    position: vscode.Position,
+    context: vscode.ReferenceContext,
+    token: vscode.CancellationToken
+  ): Promise<vscode.Location[]> {
+    const range = document.getWordRangeAtPosition(position, /<\.\w+\/>/);
+    if (!range) return [];
+
+    const tagText = document.getText(range);
+    const match = tagText.match(/<\.(\w+)\s*\/>/);
+    if (!match) return [];
+
+    const functionName = match[1];
+    const referencePattern = new RegExp(`<\\.${functionName}\\s*\\/?>`, 'g');
+
+    const locations: vscode.Location[] = [];
+    const files = await vscode.workspace.findFiles('**/*.heex', '**/deps/**');
+
+    for (const file of files) {
+      const fileContent = await vscode.workspace.openTextDocument(file);
+      const text = fileContent.getText();
+      let match;
+
+      while ((match = referencePattern.exec(text)) !== null) {
+        const position = fileContent.positionAt(match.index);
+        locations.push(new vscode.Location(file, position));
+      }
+    }
+    return locations;
+  }
+}
+
+export function deactivate() {}

tsconfig.json

@@ -0,0 +1,11 @@
+{
+  "compilerOptions": {
+    "target": "es2018",
+    "module": "commonjs",
+    "outDir": "out",      
+    "rootDir": "src",     
+    "strict": true,
+    "sourceMap": true     
+  },
+  "include": ["src"]
+}