feat: Add task dependency viewer

Author: hverlin

package.json

@@ -436,6 +436,11 @@
 				"title": "Mise: Show mise tracked configurations",
 				"icon": "$(list-ordered)"
 			},
+			{
+				"command": "mise.visualizeTasksDeps",
+				"title": "Mise: Visualize Tasks Dependencies",
+				"icon": "$(git-merge)"
+			},
 			{
 				"command": "mise.setEnvVariable",
 				"title": "Mise: Set Environment Variable",
@@ -462,6 +467,11 @@
 					"when": "view == miseTasksView",
 					"group": "navigation@2"
 				},
+				{
+					"command": "mise.visualizeTasksDeps",
+					"when": "view == miseTasksView",
+					"group": "navigation@2"
+				},
 				{
 					"command": "mise.listAllTools",
 					"when": "view == miseToolsView",
@@ -653,6 +663,8 @@
 		"@vscode/codicons": "^0.0.36",
 		"async-cache-dedupe": "^2.2.0",
 		"cheerio": "^1.0.0",
+		"d3": "^7.9.0",
+		"d3-graphviz": "^5.6.0",
 		"react": "18.3.1",
 		"react-dom": "18.3.1",
 		"react-error-boundary": "^4.1.2",

pnpm-lock.yaml

@@ -11,6 +11,7 @@ export const MISE_INSTALL_TOOL = "mise.installTool";
 export const MISE_LIST_ALL_TOOLS = "mise.listAllTools";
 export const MISE_SHOW_SETTINGS = "mise.showSettings";
 export const MISE_SHOW_TRACKED_CONFIG = "mise.showTrackedConfig";
+export const MISE_VISUALIZE_TASKS_DEPS = "mise.visualizeTasksDeps";
 export const MISE_OPEN_ENV_VAR_DEFINITION = "mise.openEnvVariableDefinition";
 export const MISE_OPEN_FILE = "mise.openFile";
 export const MISE_OPEN_LOGS = "mise.openLogs";

src/commands.ts

@@ -15,6 +15,7 @@ import {
 	MISE_SELECT_WORKSPACE_FOLDER,
 	MISE_SHOW_SETTINGS,
 	MISE_SHOW_TRACKED_CONFIG,
+	MISE_VISUALIZE_TASKS_DEPS,
 } from "./commands";
 import {
 	CONFIGURATION_FLAGS,
@@ -346,6 +347,12 @@ export class MiseExtension {
 			}),
 		);
 
+		context.subscriptions.push(
+			vscode.commands.registerCommand(MISE_VISUALIZE_TASKS_DEPS, async () => {
+				WebViewPanel.createOrShow(context, this.miseService, "TASKS_DEPS");
+			}),
+		);
+
 		const allTomlFilesSelector = { scheme: "file", language: "toml" };
 
 		context.subscriptions.push(

src/miseExtension.ts

@@ -95,8 +95,14 @@ function ensureMiseCommand(
 
 export class MiseService {
 	private readonly context: vscode.ExtensionContext;
+	private readonly eventEmitter: vscode.EventEmitter<void>;
 	constructor(context: vscode.ExtensionContext) {
 		this.context = context;
+		this.eventEmitter = new vscode.EventEmitter();
+	}
+
+	subscribeToReloadEvent(listener: () => void): vscode.Disposable {
+		return this.eventEmitter.event(listener);
 	}
 
 	private hasVerifiedMiseVersion = false;
@@ -143,6 +149,7 @@ export class MiseService {
 
 	async invalidateCache() {
 		await Promise.all([this.dedupeCache.clear(), this.cache.clear()]);
+		this.eventEmitter.fire();
 	}
 
 	async initializeMisePath() {
@@ -1042,4 +1049,17 @@ export class MiseService {
 		logger.info(`New symlink created ${linkPath} -> ${binPath}`);
 		return configuredPath;
 	}
+
+	async getTaskDependencies(tasks: string[] | undefined) {
+		if (!this.getMiseBinaryPath()) {
+			return "";
+		}
+
+		const taskString = tasks ? tasks.map((task) => `"${task}"`).join(" ") : "";
+
+		const { stdout } = await this.cache.execCmd({
+			command: `tasks deps ${taskString} --dot`,
+		});
+		return stdout;
+	}
 }

src/miseService.ts

@@ -7,7 +7,20 @@ import { MISE_EDIT_SETTING } from "./commands";
 import type { MiseService } from "./miseService";
 import { logger } from "./utils/logger";
 
-type PanelView = "TOOLS" | "SETTINGS" | "TRACKED_CONFIGS";
+type PanelView = "TOOLS" | "SETTINGS" | "TRACKED_CONFIGS" | "TASKS_DEPS";
+
+function panelTitleForView(view: PanelView) {
+	switch (view) {
+		case "TOOLS":
+			return "Tools";
+		case "SETTINGS":
+			return "Settings";
+		case "TRACKED_CONFIGS":
+			return "Tracked Configs";
+		case "TASKS_DEPS":
+			return "Tasks Dependencies";
+	}
+}
 
 export default class WebViewPanel {
 	public static currentPanels: Record<string, WebViewPanel> = {};
@@ -54,7 +67,7 @@ export default class WebViewPanel {
 
 		this._panel = vscode.window.createWebviewPanel(
 			WebViewPanel.viewType,
-			`Mise: ${this.view === "TOOLS" ? "Tools" : this.view === "SETTINGS" ? "Settings" : "Tracked Configs"}`,
+			`Mise: ${panelTitleForView(this.view)}`,
 			column,
 			{
 				retainContextWhenHidden: false,
@@ -117,6 +130,16 @@ export default class WebViewPanel {
 									this.miseService.getTrackedConfigFiles(),
 								);
 							}
+							case "taskDeps": {
+								return executeAction(message, () =>
+									this.miseService.getTaskDependencies(message.variables.tasks),
+								);
+							}
+							case "tasks": {
+								return executeAction(message, () =>
+									this.miseService.getTasks(),
+								);
+							}
 						}
 						break;
 					case "mutation":
@@ -180,6 +203,14 @@ export default class WebViewPanel {
 					"workbench.action.webview.reloadWebviewAction",
 				);
 			});
+
+		miseService.subscribeToReloadEvent(() => {
+			this._panel.webview.postMessage({
+				type: "invalidateQueries",
+				requestId: "invalidateQueries",
+				data: null,
+			});
+		});
 	}
 
 	public dispose() {