feat: nested tree view for namespaced tasks

Author: pd93

package.json

@@ -42,6 +42,16 @@
       ]
     },
     "colors": [
+      {
+        "id": "vscodetask.namespace",
+        "description": "Color for up-to-date tasks in the activity bar.",
+        "defaults": {
+          "dark": "#5FBBB0",
+          "light": "#5FBBB0",
+          "highContrast": "#5FBBB0",
+          "highContrastLight": "#5FBBB0"
+        }
+      },
       {
         "id": "vscodetask.upToDate",
         "description": "Color for up-to-date tasks in the activity bar.",

src/providers/tasks.ts

@@ -1,6 +1,8 @@
 import * as vscode from 'vscode';
 import * as models from '../models';
 
+const namespaceSeparator = ':';
+
 export class Tasks implements vscode.TreeDataProvider<TaskTreeItem> {
     private _onDidChangeTreeData: vscode.EventEmitter<TaskTreeItem | undefined> = new vscode.EventEmitter<TaskTreeItem | undefined>();
     readonly onDidChangeTreeData: vscode.Event<TaskTreeItem | undefined> = this._onDidChangeTreeData.event;
@@ -10,12 +12,34 @@ export class Tasks implements vscode.TreeDataProvider<TaskTreeItem> {
         return element;
     }
 
-    getChildren(element?: TaskTreeItem): Thenable<TaskTreeItem[]> {
+    getChildren(parent?: TaskTreeItem): Thenable<TaskTreeItem[]> {
         var taskTreeItems: TaskTreeItem[] = [];
+        var namespaceTreeItems: TaskTreeItem[] = [];
+
+        // Loop over each task
         this._taskfile?.tasks.forEach(task => {
-            taskTreeItems.push(new TaskTreeItem(task, vscode.TreeItemCollapsibleState.None));
+
+            // Split the task's name into a namespace and label
+            var namespace = task.name.substring(0, task.name.lastIndexOf(namespaceSeparator));
+            var taskLabel = task.name.substring(task.name.lastIndexOf(namespaceSeparator) + 1, task.name.length);
+
+            // If the task's namespace is the same as the parent's namespace
+            // add the task to the tree
+            if ((parent && parent.namespace === namespace) || (!parent && namespace === "")) {
+                taskTreeItems.push(new TaskTreeItem(taskLabel, namespace, task, vscode.TreeItemCollapsibleState.None));
+                return;
+            }
+
+            // If the namespace is a direct child of the parent namespace
+            // and the namespace doesn't already exist in the tree
+            // add the namespace to the tree
+            if (!namespaceExistsInTree(namespaceTreeItems, namespace) && namespaceIsDirectChild(namespace, parent?.namespace)) {
+                let namespaceLabel = trimNamespacePrefix(namespace, parent?.namespace);
+                namespaceTreeItems.push(new TaskTreeItem(namespaceLabel, namespace, undefined, vscode.TreeItemCollapsibleState.Collapsed));
+                return;
+            }
         });
-        return Promise.resolve(taskTreeItems);
+        return Promise.resolve(namespaceTreeItems.concat(taskTreeItems));
     }
 
     refresh(taskfile?: models.Taskfile): void {
@@ -24,15 +48,36 @@ export class Tasks implements vscode.TreeDataProvider<TaskTreeItem> {
     }
 }
 
+function namespaceExistsInTree(tree: TaskTreeItem[], namespace: string) {
+    return tree.find(item => item.namespace === namespace) !== undefined;
+}
+
+function namespaceIsDirectChild(namespace: string, parentNamespace: string = "") {
+    return namespace.startsWith(parentNamespace) && !trimNamespacePrefix(namespace, parentNamespace).includes(namespaceSeparator);
+}
+
+function trimNamespacePrefix(str: string, prefix?: string) {
+    if (!prefix) {
+        return str;
+    }
+    if (str.startsWith(prefix)) {
+        return str.substring(prefix.length + 1);
+    }
+    return str;
+}
+
 class TaskTreeItem extends vscode.TreeItem {
     constructor(
-        private task: models.Task,
+        readonly label: string,
+        readonly namespace: string,
+        readonly task: models.Task | undefined,
         public readonly collapsibleState: vscode.TreeItemCollapsibleState
     ) {
-        super(task.name, collapsibleState);
-        this.tooltip = `${this.task.desc}`;
-        this.description = this.task.desc;
-        if (this.task.up_to_date) {
+        super(label, collapsibleState);
+        this.description = this.task?.desc;
+        if (!this.task) {
+            this.iconPath = new vscode.ThemeIcon('symbol-namespace', new vscode.ThemeColor('vscodetask.namespace'));
+        } else if (this.task.up_to_date) {
             this.iconPath = new vscode.ThemeIcon('debug-breakpoint-log-unverified', new vscode.ThemeColor('vscodetask.upToDate'));
         } else {
             this.iconPath = new vscode.ThemeIcon('debug-breakpoint-data-unverified', new vscode.ThemeColor('vscodetask.outOfDate'));