feat: register new command and tree view to extension

package.json

@@ -36,6 +36,10 @@
         {
           "id": "projectExplorer.layouts",
           "name": "Layouts"
+        },
+        {
+          "id": "projectExplorer.activeEditors",
+          "name": "Active Editors"
         }
       ]
     },
@@ -72,7 +76,7 @@
       "view/title": [
         {
           "command": "project-explorer.tree.refresh",
-          "when": "view == projectExplorer.pages || view == projectExplorer.layouts",
+          "when": "view == projectExplorer.pages || view == projectExplorer.layouts || view == projectExplorer.activeEditors",
           "group": "navigation"
         }
       ],

src/extension.ts

@@ -6,6 +6,7 @@ import PagesProvider from "./providers/pages-provider";
 import FileTreeItem from "./utils/file-tree-item";
 import LayoutsProvider from "./providers/layouts-provider";
 import path from "path";
+import ActiveEditorsProvider from "./providers/active-editors-provider";
 
 const workspaceUri = vscode.workspace.workspaceFolders![0].uri;
 let appDirUri: vscode.Uri;
@@ -31,7 +32,7 @@ export async function activate(_: vscode.ExtensionContext) {
 
   const pagesTree = new PagesProvider(appDirUri);
   const layoutsTree = new LayoutsProvider(appDirUri);
-
+  const activeEditorsTree = new ActiveEditorsProvider(appDirUri);
   nextSearch.register(_, async () => {
     await nextSearch.showDirectoryContents(appDirUri);
   });
@@ -47,9 +48,13 @@ export async function activate(_: vscode.ExtensionContext) {
   vscode.window.createTreeView("projectExplorer.layouts", {
     treeDataProvider: layoutsTree,
   });
+  vscode.window.createTreeView("projectExplorer.activeEditors", {
+    treeDataProvider: activeEditorsTree,
+  });
   vscode.commands.registerCommand("project-explorer.tree.refresh", () => {
     pagesTree.refresh();
     layoutsTree.refresh();
+    activeEditorsTree.refresh();
   });
   vscode.commands.registerCommand(
     "project-explorer.tree.delete",

src/providers/active-editors-provider.ts

@@ -1,7 +1,7 @@
 import * as vscode from "vscode";
 import { Provider } from "../utils/base-provider";
 import ActiveEditorsTreeItem from "../utils/active-editors-tree-item";
-class ActiveEditorsProvider
+export default class ActiveEditorsProvider
   extends Provider<ActiveEditorsTreeItem>
   implements vscode.TreeDataProvider<ActiveEditorsTreeItem>
 {
@@ -33,19 +33,18 @@ class ActiveEditorsProvider
   getChildren(
     element?: ActiveEditorsTreeItem | undefined
   ): vscode.ProviderResult<ActiveEditorsTreeItem[]> {
-    if (!element) {
-      return null;
+    try {
+      const activeEditors = vscode.window.visibleTextEditors;
+      this.refresh();
+      return activeEditors.map((editor) => {
+        return new ActiveEditorsTreeItem(
+          editor.document!.fileName,
+          vscode.TreeItemCollapsibleState.None
+        );
+      });
+    } catch (err) {
+      return [];
     }
-
-    vscode.window.visibleTextEditors.map((editor) => {
-      const activeEditor = new ActiveEditorsTreeItem(
-        editor.document.fileName,
-        vscode.TreeItemCollapsibleState.None
-      );
-      return editor.document.fileName.includes("page" || "layout")
-        ? activeEditor
-        : null;
-    });
   }
   closeEditor(element: ActiveEditorsTreeItem) {
     vscode.window.visibleTextEditors.map((editor) => {