feat(vscode): Reveal project / run task (#811)

apps/vscode/src/app/ng-cli-commands.ts

@@ -1,14 +1,6 @@
-import {
-  commands,
-  ExtensionContext,
-  Task,
-  tasks,
-  window,
-  TaskScope
-} from 'vscode';
+import { commands, ExtensionContext, tasks, window } from 'vscode';
 
 import { NgTaskProvider } from './ng-task-provider/ng-task-provider';
-import { NgTaskDefinition } from './ng-task-provider/ng-task-definition';
 
 let ngTaskProvider: NgTaskProvider;
 export function registerNgCliCommands(
@@ -50,18 +42,15 @@ function runNgCliCommand(command: string) {
       }
 
       const [projectName, configuration] = selection.split(' --configuration=');
-      const taskDef: NgTaskDefinition = {
-        type: 'ng',
-        projectName,
-        configuration,
-        architectName: command
-      };
-      const task = ngTaskProvider.resolveTask(
-        new Task(taskDef, TaskScope.Workspace, 'n/a', 'n/a')
+
+      tasks.executeTask(
+        ngTaskProvider.createTask({
+          type: 'shell',
+          projectName,
+          configuration,
+          architectName: command
+        })
       );
-      if (task) {
-        tasks.executeTask(task);
-      }
     });
   };
 }

apps/vscode/src/app/ng-task-provider/ng-task-definition.ts

@@ -1,5 +1,5 @@
 export interface NgTaskDefinition {
-  type: string;
+  type: 'shell';
   projectName: string;
   architectName: string;
   configuration?: string;

apps/vscode/src/app/ng-task-provider/ng-task-provider.ts

@@ -1,14 +1,14 @@
-import { TaskProvider, ProviderResult, Task } from 'vscode';
-import { readJsonFile, FileUtils } from '@angular-console/server';
-import { getTaskId } from '../pseudo-terminal.factory';
+import { FileUtils, readJsonFile } from '@angular-console/server';
+import { ProviderResult, Task, TaskProvider } from 'vscode';
+
+import { NgTask } from './ng-task';
 import {
-  NgTaskDefinition,
   AngularJson,
   getArchitectTaskDefintions,
-  Projects,
-  ProjectDef
+  NgTaskDefinition,
+  ProjectDef,
+  Projects
 } from './ng-task-definition';
-import { NgTask } from './ng-task';
 
 export class NgTaskProvider implements TaskProvider {
   private workspacePath?: string;
@@ -39,11 +39,10 @@ export class NgTaskProvider implements TaskProvider {
           return [];
         }
 
-        const type = getTaskId();
         return Object.entries(project.architect).flatMap(
           ([architectName, architectDef]) =>
             getArchitectTaskDefintions(
-              { architectName, projectName, type },
+              { architectName, projectName, type: 'shell' },
               architectDef
             )
         );
@@ -62,17 +61,14 @@ export class NgTaskProvider implements TaskProvider {
       task.definition.architectName &&
       task.definition.projectName
     ) {
-      return NgTask.create(
-        {
-          ...(task.definition as NgTaskDefinition),
-          type: getTaskId()
-        },
-        this.workspacePath,
-        this.fileUtils
-      );
+      return this.createTask(task.definition as NgTaskDefinition);
     }
   }
 
+  createTask(definition: NgTaskDefinition) {
+    return NgTask.create(definition, this.workspacePath || '', this.fileUtils);
+  }
+
   getProjects(): Projects {
     if (!this.workspacePath) {
       return {};

apps/vscode/src/app/ng-task-provider/ng-task.ts

@@ -2,14 +2,15 @@ import { NgTaskDefinition } from './ng-task-definition';
 import { Task, TaskGroup, TaskScope } from 'vscode';
 import { getShellExecutionForConfig } from './shell-execution';
 import { FileUtils } from '@angular-console/server';
+import { getTaskId } from '../pseudo-terminal.factory';
 
 export class NgTask extends Task {
   static create(
     definition: NgTaskDefinition,
     workspacePath: string,
     fileUtils: FileUtils
   ): NgTask {
-    const { type, projectName, architectName, configuration } = definition;
+    const { projectName, architectName, configuration } = definition;
 
     const runTarget = configuration
       ? `${projectName}:${architectName}:${configuration}`
@@ -32,7 +33,7 @@ export class NgTask extends Task {
     const task = new NgTask(
       definition,
       TaskScope.Workspace,
-      type,
+      getTaskId(),
       displayCommand,
       getShellExecutionForConfig({
         isDryRun: false,

apps/vscode/src/app/pseudo-terminal.factory.ts

@@ -55,7 +55,7 @@ export function executeTask(config: PseudoTerminalConfig): PseudoTerminal {
 
   const taskId = getTaskId(config.isDryRun);
   const task = new Task(
-    { type: taskId },
+    { type: 'shell' },
     TaskScope.Workspace,
     taskId,
     config.displayCommand,

apps/vscode/src/app/tree-view/projects-tree-provider.ts

@@ -4,12 +4,14 @@ import {
   commands,
   ProviderResult,
   Selection,
+  tasks,
   TextDocument,
   TreeItem,
   TreeItemCollapsibleState,
   Uri,
   window,
-  workspace
+  workspace,
+  ExtensionContext
 } from 'vscode';
 
 import { NgTaskProvider } from '../ng-task-provider/ng-task-provider';
@@ -28,13 +30,26 @@ export class AngularJsonTreeItem extends TreeItem {
 export class AngularJsonTreeProvider extends AbstractTreeProvider<
   AngularJsonTreeItem
 > {
-  constructor(private readonly ngTaskProvider: NgTaskProvider) {
+  constructor(
+    context: ExtensionContext,
+    private readonly ngTaskProvider: NgTaskProvider
+  ) {
     super();
 
-    commands.registerCommand(
-      'angularConsole.editAngularJson',
-      this.editAngularJson,
-      this
+    ([
+      ['editAngularJson', this.editAngularJson],
+      ['revealInExplorer', this.revealInExplorer],
+      ['runTask', this.runTask]
+    ] as [string, (item: AngularJsonTreeItem) => Promise<any>][]).forEach(
+      ([commandSuffix, callback]) => {
+        context.subscriptions.push(
+          commands.registerCommand(
+            `angularConsole.${commandSuffix}`,
+            callback,
+            this
+          )
+        );
+      }
     );
   }
 
@@ -61,6 +76,17 @@ export class AngularJsonTreeProvider extends AbstractTreeProvider<
       command: 'angularConsole.editAngularJson',
       arguments: [item]
     };
+    if (!angularJsonLabel.architect) {
+      const projectDef = this.ngTaskProvider.getProjects()[
+        angularJsonLabel.project
+      ];
+      item.resourceUri = Uri.file(
+        join(this.ngTaskProvider.getWorkspacePath()!, projectDef.root)
+      );
+      item.contextValue = 'project';
+    } else {
+      item.contextValue = 'task';
+    }
 
     return item;
   }
@@ -165,6 +191,28 @@ export class AngularJsonTreeProvider extends AbstractTreeProvider<
     return scriptOffset;
   }
 
+  private async runTask(selection: AngularJsonTreeItem) {
+    const { architect, project } = selection.angularJsonLabel;
+    if (!architect) {
+      return;
+    }
+
+    return tasks.executeTask(
+      this.ngTaskProvider.createTask({
+        architectName: architect.name,
+        projectName: project,
+        configuration: architect.configuration,
+        type: 'shell'
+      })
+    );
+  }
+
+  private async revealInExplorer(selection: AngularJsonTreeItem) {
+    if (selection.resourceUri) {
+      commands.executeCommand('revealInExplorer', selection.resourceUri);
+    }
+  }
+
   private async editAngularJson(selection: AngularJsonTreeItem) {
     const angularJson = Uri.file(
       join(this.ngTaskProvider.getWorkspacePath()!, 'angular.json')

apps/vscode/src/main.ts

@@ -59,7 +59,8 @@ export function activate(context: ExtensionContext) {
   }) as TreeView<Workspace | WorkspaceRoute>;
   context.subscriptions.push(currentWorkspaceTreeView);
 
-  projectsTreeProvider = new ProjectsTreeProvider(taskProvider);
+  projectsTreeProvider = new ProjectsTreeProvider(context, taskProvider);
+
   projectsTreeView = window.createTreeView('angularConsoleJson', {
     treeDataProvider: projectsTreeProvider
   }) as TreeView<AngularJsonTreeItem>;

apps/vscode/src/package.json

@@ -43,7 +43,37 @@
     "jsonc-parser": "^2.1.1"
   },
   "contributes": {
+    "menus": {
+      "view/item/context": [
+        {
+          "command": "angularConsole.revealInExplorer",
+          "when": "view == angularConsoleJson && viewItem == project",
+          "group": "inline"
+        },
+        {
+          "command": "angularConsole.runTask",
+          "when": "view == angularConsoleJson && viewItem == task",
+          "group": "inline"
+        }
+      ]
+    },
     "commands": [
+      {
+        "command": "angularConsole.revealInExplorer",
+        "title": "Reveal in Explorer",
+        "icon": {
+          "light": "assets/folder-light.svg",
+          "dark": "assets/folder-dark.svg"
+        }
+      },
+      {
+        "command": "angularConsole.runTask",
+        "title": "Execute task",
+        "icon": {
+          "light": "assets/continue-light.svg",
+          "dark": "assets/continue-dark.svg"
+        }
+      },
       {
         "category": "ng",
         "title": "lint",