Select workspace folder in Project view

src/webview/WebviewProvider/index.ts

@@ -11,14 +11,14 @@ import {
   fetchPlatformData,
   fetchRuns,
   getRepoInfo,
-  queryWorkspace,
+  getWorkspaces,
+  getWorkspacePreview,
   getContainer,
   addPipeline
 } from "./lib";
 import { AuthProvider, getAccessToken } from "../../auth";
 import { jwtExpired } from "../../auth/AuthProvider/utils/jwt";
 import { sleep } from "./lib/utils";
-import { Pipeline } from "./lib/platform/types";
 import fetchHubPipelines from "./lib/platform/fetchHubPipelines";
 
 class WebviewProvider implements vscode.WebviewViewProvider {
@@ -87,6 +87,9 @@ class WebviewProvider implements vscode.WebviewViewProvider {
         case "addPipeline":
           this.addPipeline(message);
           break;
+        case "previewWorkspace":
+          this.previewWorkspace(message);
+          break;
       }
     });
 
@@ -190,11 +193,18 @@ class WebviewProvider implements vscode.WebviewViewProvider {
       await fetchPlatformData(accessToken, view.webview, _context, refresh);
     }
     if (viewID === "project") {
-      const nodes = await queryWorkspace();
-      view.webview.postMessage({ nodes });
+      const folders = getWorkspaces();
+      view.webview.postMessage({ folders });
     }
   }
 
+  private async previewWorkspace(name: string) {
+    const nodes = await getWorkspacePreview(name);
+    this._currentView?.webview.postMessage({
+      nodes
+    });
+  }
+
   private async emitTestCreated(filePath: string, successful: boolean) {
     this._currentView?.webview.postMessage({
       testCreated: {

src/webview/WebviewProvider/lib/index.ts

@@ -2,4 +2,4 @@ export { default as fetchPlatformData } from "./platform/fetchPlatformData";
 export { default as getAuthState } from "./platform/getAuthState";
 export * from "./platform/utils";
 
-export { queryWorkspace } from "./workspace/queryWorkspace";
+export { getWorkspaces, getWorkspacePreview } from "./workspace/previewWorkspace";

src/webview/WebviewProvider/lib/workspace/queryWorkspace.ts → src/webview/WebviewProvider/lib/workspace/previewWorkspace.ts

@@ -45,12 +45,14 @@ async function previewWorkspace(name: string): Promise<any> {
   }
 }
 
-export async function queryWorkspace(): Promise<TreeNode[]> {
+export function getWorkspaces(): string[] {
   const folders = vscode.workspace.workspaceFolders;
-  if (!folders || folders.length == 0)
+  if (!folders)
     return [];
+  return folders.map(folder => folder.name);
+}
 
-  const name = folders[0].name;
+export async function getWorkspacePreview(name: string): Promise<TreeNode[]> {
   const res: any = await previewWorkspace(name);
   if (!res || !res.result) {
     if (res?.error)

webview-ui/src/Context/WorkspaceProvider/index.tsx

@@ -3,6 +3,10 @@ import { createContext, useContext, useEffect, useState } from "react";
 import { TestCreation, TreeNode } from "./types";
 
 const WorkspaceContext = createContext<WorkspaceContextType>({
+  folders: [],
+  selectedFolder: 0,
+  setSelectedFolder: () => {},
+  previewWorkspace: () => {},
   nodes: [],
   findChildren: () => [],
   openFile: () => {},
@@ -23,6 +27,10 @@ const WorkspaceContext = createContext<WorkspaceContextType>({
 });
 
 interface WorkspaceContextType {
+  folders: string[];
+  selectedFolder: number;
+  setSelectedFolder: (index: number) => void;
+  previewWorkspace: (name: string) => void;
   nodes: TreeNode[];
   findChildren: (node: TreeNode) => TreeNode[];
   openFile: (filePath: string, line: number) => void;
@@ -52,6 +60,8 @@ type Props = {
 const WorkspaceProvider = ({ children, vscode, viewID, isCursor }: Props) => {
   const state = vscode.getState();
 
+  const [folders, setFolders] = useState<string[]>([]);
+  const [selectedFolder, setSelectedFolder] = useState<number>(0);
   const [nodes, setNodes] = useState<TreeNode[]>([]);
   const [testCreation, setCreatingTest] = useState<
     WorkspaceContextType["testCreation"]
@@ -68,6 +78,14 @@ const WorkspaceProvider = ({ children, vscode, viewID, isCursor }: Props) => {
   useEffect(() => {
     const handleMessage = (event: MessageEvent) => {
       const message = event.data;
+      if (message.folders) {
+        const folders = message.folders as string[];
+        setFolders(folders);
+        if (folders.length > 0) {
+          setSelectedFolder(0);
+          previewWorkspace(folders[0]);
+        }
+      }
       if (message.nodes) setNodes(message.nodes);
       if (message.testCreated) {
         const data = message.testCreated;
@@ -94,6 +112,10 @@ const WorkspaceProvider = ({ children, vscode, viewID, isCursor }: Props) => {
     return selectedItems.includes(name);
   }
 
+  function previewWorkspace(name: string) {
+    vscode.postMessage({ command: "previewWorkspace", name: name });
+  }
+
   function findChildren(node: TreeNode): TreeNode[] {
     if (!node.children) return [];
     return node.children.flatMap((call) =>
@@ -137,6 +159,10 @@ const WorkspaceProvider = ({ children, vscode, viewID, isCursor }: Props) => {
   return (
     <WorkspaceContext.Provider
       value={{
+        folders,
+        selectedFolder,
+        setSelectedFolder,
+        previewWorkspace,
         nodes,
         findChildren,
         openFile,

webview-ui/src/Layout/Project/index.tsx

@@ -13,14 +13,21 @@ function round(x: number) {
 }
 
 const Project = () => {
-  const { nodes } = useWorkspaceContext();
+  const { folders, selectedFolder, setSelectedFolder, previewWorkspace, nodes } = useWorkspaceContext();
   const [viewMode, setViewMode] = useState<ViewMode>("list");
   const [search, setSearch] = useState("");
 
-  const entryNodes = nodes.filter((n) => n.name === "<entry>");
+  function selectFolder(name: string) {
+    setSelectedFolder(folders.indexOf(name));
+    previewWorkspace(name);
+  }
+
+  function entryNodes() {
+    return nodes.filter((n) => n.name === "<entry>");
+  }
 
   function testCoverage() {
-    const totalCount = nodes.length - entryNodes.length;
+    const totalCount = nodes.length - entryNodes().length;
     if( totalCount == 0 )
       return <></>;
     const testCount = nodes.filter((n) => n.test !== undefined).length;
@@ -37,11 +44,12 @@ const Project = () => {
   };
 
   function treeView() {
-    if (entryNodes.length == 0)
+    const nodes = entryNodes();
+    if (nodes.length == 0)
       return <section className="cozy">No entry workflows found</section>;
     return (
       <div className={styles.container}>
-        {entryNodes.map((node) => (
+        {nodes.map((node) => (
           <FileNode node={node} searchTerm={search} />
         ))}
       </div>
@@ -60,6 +68,15 @@ const Project = () => {
 
   return (
     <>
+      <div className={styles.filters}>
+        <Select
+          options={folders.map(name => (
+            { label: name, value: name }
+          ))}
+          value={folders[selectedFolder]}
+          onChange={(value) => selectFolder(value as string)}
+        />
+      </div>
       <div className={styles.filters}>
         <Input
           value={search}