@powerhousedao/network-admin 0.0.60 → 0.0.62

package/dist/document-models/workstream/tests/workstream.test.js

@@ -0,0 +1,55 @@
+import { generateMock } from "@powerhousedao/codegen";
+import { describe, expect, it } from "vitest";
+import { reducer, utils, isWorkstreamDocument, editWorkstream, editClientInfo, setRequestForProposal, addPaymentRequest, removePaymentRequest, EditWorkstreamInputSchema, EditClientInfoInputSchema, SetRequestForProposalInputSchema, AddPaymentRequestInputSchema, RemovePaymentRequestInputSchema, } from "@powerhousedao/network-admin/document-models/workstream";
+describe("WorkstreamOperations", () => {
+    it("should handle editWorkstream operation", () => {
+        const document = utils.createDocument();
+        const input = generateMock(EditWorkstreamInputSchema());
+        const updatedDocument = reducer(document, editWorkstream(input));
+        expect(isWorkstreamDocument(updatedDocument)).toBe(true);
+        expect(updatedDocument.operations.global).toHaveLength(1);
+        expect(updatedDocument.operations.global[0].action.type).toBe("EDIT_WORKSTREAM");
+        expect(updatedDocument.operations.global[0].action.input).toStrictEqual(input);
+        expect(updatedDocument.operations.global[0].index).toEqual(0);
+    });
+    it("should handle editClientInfo operation", () => {
+        const document = utils.createDocument();
+        const input = generateMock(EditClientInfoInputSchema());
+        const updatedDocument = reducer(document, editClientInfo(input));
+        expect(isWorkstreamDocument(updatedDocument)).toBe(true);
+        expect(updatedDocument.operations.global).toHaveLength(1);
+        expect(updatedDocument.operations.global[0].action.type).toBe("EDIT_CLIENT_INFO");
+        expect(updatedDocument.operations.global[0].action.input).toStrictEqual(input);
+        expect(updatedDocument.operations.global[0].index).toEqual(0);
+    });
+    it("should handle setRequestForProposal operation", () => {
+        const document = utils.createDocument();
+        const input = generateMock(SetRequestForProposalInputSchema());
+        const updatedDocument = reducer(document, setRequestForProposal(input));
+        expect(isWorkstreamDocument(updatedDocument)).toBe(true);
+        expect(updatedDocument.operations.global).toHaveLength(1);
+        expect(updatedDocument.operations.global[0].action.type).toBe("SET_REQUEST_FOR_PROPOSAL");
+        expect(updatedDocument.operations.global[0].action.input).toStrictEqual(input);
+        expect(updatedDocument.operations.global[0].index).toEqual(0);
+    });
+    it("should handle addPaymentRequest operation", () => {
+        const document = utils.createDocument();
+        const input = generateMock(AddPaymentRequestInputSchema());
+        const updatedDocument = reducer(document, addPaymentRequest(input));
+        expect(isWorkstreamDocument(updatedDocument)).toBe(true);
+        expect(updatedDocument.operations.global).toHaveLength(1);
+        expect(updatedDocument.operations.global[0].action.type).toBe("ADD_PAYMENT_REQUEST");
+        expect(updatedDocument.operations.global[0].action.input).toStrictEqual(input);
+        expect(updatedDocument.operations.global[0].index).toEqual(0);
+    });
+    it("should handle removePaymentRequest operation", () => {
+        const document = utils.createDocument();
+        const input = generateMock(RemovePaymentRequestInputSchema());
+        const updatedDocument = reducer(document, removePaymentRequest(input));
+        expect(isWorkstreamDocument(updatedDocument)).toBe(true);
+        expect(updatedDocument.operations.global).toHaveLength(1);
+        expect(updatedDocument.operations.global[0].action.type).toBe("REMOVE_PAYMENT_REQUEST");
+        expect(updatedDocument.operations.global[0].action.input).toStrictEqual(input);
+        expect(updatedDocument.operations.global[0].index).toEqual(0);
+    });
+});

package/dist/editors/builders/editor.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { DocumentToolbar } from "@powerhousedao/design-system/connect";
 import { useSelectedBuildersDocument } from "../../document-models/builders/hooks.js";
 import { actions as buildersActions } from "../../document-models/builders/actions.js";
-import { setSelectedNode, useParentFolderForSelectedNode, useDrives, useGetDocuments, } from "@powerhousedao/reactor-browser";
+import { setSelectedNode, useParentFolderForSelectedNode, useDrives, useDocuments, } from "@powerhousedao/reactor-browser";
 import { useMemo, useCallback, useState, useEffect } from "react";
 import { ObjectSetTable, PHIDInput, } from "@powerhousedao/document-engineering";
 import { useRemoteBuilderProfiles } from "./hooks/useRemoteBuilderProfiles.js";
@@ -96,7 +96,7 @@ export default function Editor() {
         return builderProfileNodesWithDriveId.map(({ node }) => node.id);
     }, [builderProfileNodesWithDriveId]);
     // Fetch all builder profile documents from all drives
-    const builderProfileDocuments = useGetDocuments(builderPhids);
+    const builderProfileDocuments = useDocuments(builderPhids);
     // Create a map of PHID to document for quick lookup (local drives)
     const localBuilderProfileMap = useMemo(() => {
         const map = new Map();

package/dist/editors/builders/module.d.ts

@@ -1,4 +1,4 @@
 import type { EditorModule } from "document-model";
-/** Document editor module for the Todo List document type */
+/** Document editor module for the "["powerhouse/builders"]" document type */
 export declare const Builders: EditorModule;
 //# sourceMappingURL=module.d.ts.map

package/dist/editors/builders/module.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../../../editors/builders/module.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAGnD,6DAA6D;AAC7D,eAAO,MAAM,QAAQ,EAAE,YAOtB,CAAC"}
+{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../../../editors/builders/module.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAGnD,6EAA6E;AAC7E,eAAO,MAAM,QAAQ,EAAE,YAOtB,CAAC"}

package/dist/editors/builders/module.js

@@ -1,5 +1,5 @@
 import { lazy } from "react";
-/** Document editor module for the Todo List document type */
+/** Document editor module for the "["powerhouse/builders"]" document type */
 export const Builders = {
     Component: lazy(() => import("./editor.js")),
     documentTypes: ["powerhouse/builders"],

package/dist/editors/editors.js

@@ -1,14 +1,14 @@
+import { Builders } from "./builders/module.js";
 import { NetworkAdmin } from "./network-admin/module.js";
 import { NetworkProfileEditor } from "./network-profile/module.js";
 import { PaymentTermsEditor } from "./payment-terms/module.js";
 import { RequestForProposalsEditor } from "./request-for-proposals/module.js";
 import { WorkstreamEditor } from "./workstream/module.js";
-import { Builders } from "./builders/module.js";
 export const editors = [
+    Builders,
     NetworkAdmin,
     NetworkProfileEditor,
     PaymentTermsEditor,
     RequestForProposalsEditor,
     WorkstreamEditor,
-    Builders,
 ];

package/dist/editors/index.d.ts

@@ -1,11 +1,7 @@
-/**
- * This is a scaffold file meant for customization.
- * Delete the file and run the code generator again to have it reset
- */
+export { Builders } from "./builders/module.js";
 export { NetworkAdmin } from "./network-admin/module.js";
 export { NetworkProfileEditor } from "./network-profile/module.js";
 export { PaymentTermsEditor } from "./payment-terms/module.js";
 export { RequestForProposalsEditor } from "./request-for-proposals/module.js";
 export { WorkstreamEditor } from "./workstream/module.js";
-export { Builders } from "./builders/module.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/editors/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../editors/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EAAE,yBAAyB,EAAE,MAAM,mCAAmC,CAAC;AAC9E,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../editors/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EAAE,yBAAyB,EAAE,MAAM,mCAAmC,CAAC;AAC9E,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC"}

package/dist/editors/index.js

@@ -1,10 +1,6 @@
-/**
- * This is a scaffold file meant for customization.
- * Delete the file and run the code generator again to have it reset
- */
+export { Builders } from "./builders/module.js";
 export { NetworkAdmin } from "./network-admin/module.js";
 export { NetworkProfileEditor } from "./network-profile/module.js";
 export { PaymentTermsEditor } from "./payment-terms/module.js";
 export { RequestForProposalsEditor } from "./request-for-proposals/module.js";
 export { WorkstreamEditor } from "./workstream/module.js";
-export { Builders } from "./builders/module.js";

package/dist/editors/network-admin/components/CreateDocument.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Document creation UI component.
+ * Displays available document types as clickable buttons.
+ */
+export declare function CreateDocument(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CreateDocument.d.ts.map

package/dist/editors/network-admin/components/CreateDocument.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CreateDocument.d.ts","sourceRoot":"","sources":["../../../../editors/network-admin/components/CreateDocument.tsx"],"names":[],"mappings":"AAMA;;;GAGG;AACH,wBAAgB,cAAc,4CAsB7B"}

package/dist/editors/network-admin/components/CreateDocument.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { showCreateDocumentModal, useAllowedDocumentModelModules, } from "@powerhousedao/reactor-browser";
+/**
+ * Document creation UI component.
+ * Displays available document types as clickable buttons.
+ */
+export function CreateDocument() {
+    const allowedDocumentModelModules = useAllowedDocumentModelModules();
+    return (_jsxs("div", { children: [_jsx("h3", { className: "mb-3 mt-4 text-sm font-bold text-gray-600", children: "Create document" }), _jsx("div", { className: "flex w-full flex-wrap gap-4", children: allowedDocumentModelModules?.map((documentModelModule) => {
+                    return (_jsx(CreateDocumentButton, { documentModelModule: documentModelModule }, documentModelModule.documentModel.global.id));
+                }) })] }));
+}
+function CreateDocumentButton({ documentModelModule }) {
+    const documentType = documentModelModule.documentModel.global.id;
+    const documentModelName = documentModelModule.documentModel.global.name || documentType;
+    const documentModelDescription = documentModelModule.documentModel.global.description;
+    return (_jsx("button", { className: "cursor-pointer rounded-md bg-gray-200 py-2 px-3 hover:bg-gray-300", title: documentModelName, "aria-description": documentModelDescription, onClick: () => showCreateDocumentModal(documentType), children: documentModelName }));
+}

package/dist/editors/network-admin/components/DriveContents.d.ts

@@ -0,0 +1,3 @@
+/** Shows the documents and folders in the selected drive */
+export declare function DriveContents(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DriveContents.d.ts.map

package/dist/editors/network-admin/components/DriveContents.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DriveContents.d.ts","sourceRoot":"","sources":["../../../../editors/network-admin/components/DriveContents.tsx"],"names":[],"mappings":"AAMA,4DAA4D;AAC5D,wBAAgB,aAAa,4CAU5B"}

package/dist/editors/network-admin/components/DriveContents.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { CreateDocument } from "./CreateDocument.js";
+import { EmptyState } from "./EmptyState.js";
+import { Files } from "./Files.js";
+import { Folders } from "./Folders.js";
+import { NavigationBreadcrumbs } from "./NavigationBreadcrumbs.js";
+/** Shows the documents and folders in the selected drive */
+export function DriveContents() {
+    return (_jsxs("div", { className: "space-y-6 px-6", children: [_jsx(NavigationBreadcrumbs, {}), _jsx(Folders, {}), _jsx(Files, {}), _jsx(EmptyState, {}), _jsx(CreateDocument, {})] }));
+}

package/dist/editors/network-admin/components/DriveExplorer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DriveExplorer.d.ts","sourceRoot":"","sources":["../../../../editors/network-admin/components/DriveExplorer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAmDlD;;;GAGG;AACH,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,EAAE,WAAW,2CAkpBtD"}
+{"version":3,"file":"DriveExplorer.d.ts","sourceRoot":"","sources":["../../../../editors/network-admin/components/DriveExplorer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AA0BlD;;;GAGG;AACH,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,EAAE,WAAW,2CA6ZtD"}

package/dist/editors/network-admin/components/DriveExplorer.js

@@ -1,26 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useEffect, useMemo, useCallback, useRef } from "react";
-import { Sidebar, SidebarProvider, Button, } from "@powerhousedao/document-engineering";
-import { setSelectedNode, useSelectedDrive, useSelectedFolder, useUserPermissions, useDocumentsInSelectedDrive, useFileNodesInSelectedDrive, useNodeActions, useSelectedDocument, showDeleteNodeModal, addDocument, dispatchActions, } from "@powerhousedao/reactor-browser";
+import { useState, useEffect, useCallback, useRef } from "react";
+import { setSelectedNode, useSelectedDriveSafe, useSelectedFolder, useUserPermissions, useDocumentsInSelectedDrive, useFileNodesInSelectedDrive, useNodeActions, useSelectedDocumentSafe, showDeleteNodeModal, addDocument, dispatchActions, } from "@powerhousedao/reactor-browser";
+import { Button } from "@powerhousedao/document-engineering";
 import { CreateDocumentModal } from "@powerhousedao/design-system/connect";
 import {} from "document-model";
-import { PaymentIcon } from "./icons/PaymentIcon.js";
-import { RfpIcon } from "./icons/RfpIcon.js";
-import { SowIcon } from "./icons/SowIcon.js";
 import { WorkstreamIcon } from "./icons/WorkstreamIcon.js";
-import { Earth } from "lucide-react";
 import { editClientInfo, editWorkstream, } from "../../../document-models/workstream/gen/creators.js";
-const WorkstreamStatusEnums = [
-    "RFP_DRAFT",
-    "PREWORK_RFC",
-    "RFP_CANCELLED",
-    "OPEN_FOR_PROPOSALS",
-    "PROPOSAL_SUBMITTED",
-    "NOT_AWARDED",
-    "AWARDED",
-    "IN_PROGRESS",
-    "FINISHED",
-];
+import { FolderTree } from "./FolderTree.js";
 /**
  * Main drive explorer component with sidebar navigation and content area.
  * Layout: Left sidebar (folder tree) + Right content area (files/folders + document editor)
@@ -35,13 +21,13 @@ export function DriveExplorer({ children }) {
     const selectedDocumentModel = useRef(null);
     // === STATE MANAGEMENT HOOKS ===
     // Core state hooks for drive navigation
-    const [selectedDrive] = useSelectedDrive(); // Currently selected drive
+    const [selectedDrive] = useSelectedDriveSafe(); // Currently selected drive
     const selectedFolder = useSelectedFolder(); // Currently selected folder
     const allDocuments = useDocumentsInSelectedDrive();
     const fileChildren = useFileNodesInSelectedDrive();
     const { onRenameNode } = useNodeActions();
     // Listen to global selected document state (for external editors like Scope of Work)
-    const [globalSelectedDocument] = useSelectedDocument();
+    const [globalSelectedDocument] = useSelectedDocumentSafe();
     const networkAdminDocuments = allDocuments?.filter((doc) => doc.header.documentType === "powerhouse/network-profile" ||
         doc.header.documentType === "powerhouse/workstream" ||
         doc.header.documentType === "powerhouse/scopeofwork" ||
@@ -59,193 +45,11 @@ export function DriveExplorer({ children }) {
     }, [globalSelectedDocument]);
     // Check if current active document is a Scope of Work (should show in full view)
     const isScopeOfWorkFullView = globalSelectedDocument?.header.documentType === "powerhouse/scopeofwork";
-    // Convert network admin documents to SidebarNode format
-    const sidebarNodes = useMemo(() => {
-        // Group documents by type
-        const workstreamDocs = (networkAdminDocuments?.filter((doc) => doc.header.documentType === "powerhouse/workstream") ?? []);
-        const networkProfileDocs = (networkAdminDocuments?.filter((doc) => doc.header.documentType === "powerhouse/network-profile") ?? []);
-        const [buildersDoc] = (networkAdminDocuments?.filter((doc) => doc.header.documentType === "powerhouse/builders") ?? []);
-        const workstreamsNode = {
-            id: "workstreams",
-            title: "Workstreams",
-            children: [
-                ...WorkstreamStatusEnums.map((status) => {
-                    const statusTitle = status
-                        .toLowerCase()
-                        .split("_")
-                        .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
-                        .join(" ");
-                    return {
-                        id: `workstream-status-${status}`,
-                        title: statusTitle +
-                            (workstreamDocs.filter((doc) => doc.state.global.status === status).length > 0
-                                ? ` (${workstreamDocs.filter((doc) => doc.state.global.status === status).length})`
-                                : ""),
-                        children: workstreamDocs
-                            .filter((doc) => doc.state.global.status === status)
-                            .map((doc) => {
-                            let sow = null;
-                            let paymentTerms = null;
-                            let rfp = null;
-                            if (doc.state.global.initialProposal) {
-                                sow = doc.state.global.initialProposal.sow;
-                                paymentTerms = doc.state.global.initialProposal.paymentTerms;
-                            }
-                            if (doc.state.global.rfp) {
-                                rfp = doc.state.global.rfp.id;
-                            }
-                            const sowDoc = allDocuments?.find((doc) => doc.header.id === sow);
-                            const rfpDoc = allDocuments?.find((doc) => doc.header.id === rfp);
-                            const pmtDoc = allDocuments?.find((doc) => doc.header.id === paymentTerms);
-                            // get alternative proposals
-                            const alternativeProposals = doc.state.global.alternativeProposals;
-                            const returnableChildren = {
-                                id: `editor-${doc.header.id}`,
-                                title: `${doc.state.global.code ? doc.state.global.code + " - " : ""}${doc.state.global.title || doc.header.name}`,
-                                icon: _jsx(WorkstreamIcon, { className: "w-5 h-5" }),
-                                children: rfpDoc
-                                    ? [
-                                        {
-                                            id: `editor-${rfpDoc.header.id}`,
-                                            title: "Request For Proposal",
-                                            icon: _jsx(RfpIcon, { className: "w-5 h-5" }),
-                                        },
-                                    ]
-                                    : [],
-                            };
-                            // if sowDoc or pmtDoc is included in the wstrChildDocs, then add a child with the title "Initial Proposal"
-                            const children = [];
-                            if (sowDoc) {
-                                children.push({
-                                    id: `editor-${sowDoc.header.id}`,
-                                    title: "Scope of Work",
-                                    icon: _jsx(SowIcon, { className: "w-5 h-5" }),
-                                });
-                            }
-                            if (pmtDoc) {
-                                children.push({
-                                    id: `editor-${pmtDoc.header.id}`,
-                                    title: "Payment Terms",
-                                    icon: _jsx(PaymentIcon, { className: "w-5 h-5" }),
-                                });
-                            }
-                            if (children.length) {
-                                returnableChildren.children = [
-                                    ...(returnableChildren.children ?? []),
-                                    {
-                                        id: "initial-proposal",
-                                        title: "Initial Proposal",
-                                        children: children,
-                                    },
-                                ];
-                            }
-                            if (alternativeProposals.length > 0) {
-                                returnableChildren.children = [
-                                    ...(returnableChildren.children ?? []),
-                                    {
-                                        id: "alternative-proposals",
-                                        title: `Alternative Proposals (${alternativeProposals.length})`,
-                                        children: alternativeProposals.map((proposal) => {
-                                            // Find documents for this specific proposal
-                                            const proposalSowDoc = allDocuments?.find((doc) => doc.header.id === proposal.sow);
-                                            const proposalPaymentTermsDoc = allDocuments?.find((doc) => doc.header.id === proposal.paymentTerms);
-                                            // Filter to only include documents that exist
-                                            const proposalChildDocs = [
-                                                proposalSowDoc,
-                                                proposalPaymentTermsDoc,
-                                            ].filter((doc) => doc !== undefined && doc !== null);
-                                            return {
-                                                id: `alternative-proposal-${proposal.id}`,
-                                                title: `${proposal.author.name}`,
-                                                children: proposalChildDocs.map((childDoc) => {
-                                                    const dynamicTitle = childDoc.header.documentType ===
-                                                        "powerhouse/scopeofwork"
-                                                        ? "Scope of Work"
-                                                        : childDoc.header.documentType ===
-                                                            "payment-terms"
-                                                            ? "Payment Terms"
-                                                            : "";
-                                                    return {
-                                                        id: `editor-${childDoc.header.id}`,
-                                                        title: dynamicTitle,
-                                                        icon: childDoc.header.documentType ===
-                                                            "powerhouse/scopeofwork" ? (_jsx(SowIcon, { className: "w-5 h-5" })) : (_jsx(PaymentIcon, { className: "w-5 h-5" })),
-                                                    };
-                                                }),
-                                            };
-                                        }),
-                                    },
-                                ];
-                            }
-                            return returnableChildren;
-                        }),
-                    };
-                }),
-            ],
-        };
-        const networkInfoNode = {
-            id: "network-information",
-            title: "Network Information",
-            children: [
-                // Add network profile documents
-                ...networkProfileDocs.map((doc) => ({
-                    id: `editor-${doc.header.id}`,
-                    title: "Network Profile",
-                    icon: _jsx(Earth, { className: "w-5 h-5" }),
-                })),
-            ],
-        };
-        const buildersNode = {
-            id: `editor-${buildersDoc?.header.id}`,
-            title: "Builders",
-            children: [],
-        };
-        return [workstreamsNode, networkInfoNode, buildersNode];
-    }, [networkAdminDocuments]);
-    // Handle sidebar node selection
-    const handleActiveNodeChange = useCallback((nodeId) => {
-        console.log("nodeId", nodeId);
-        // Find the node by ID
-        const findNodeById = (nodes, id) => {
-            for (const node of nodes) {
-                if (node.id === id) {
-                    return node;
-                }
-                if (node.children) {
-                    const found = findNodeById(node.children, id);
-                    if (found)
-                        return found;
-                }
-            }
-            return null;
-        };
-        const newNode = findNodeById(sidebarNodes, nodeId);
-        if (!newNode)
-            return;
-        // Always update the active sidebar node ID
-        setActiveSidebarNodeId(newNode.id);
-        if (newNode.id === "workstreams") {
-            setSelectedNode(undefined);
-            setSelectedRootNode("workstreams");
-        }
-        else if (newNode.id === "network-information") {
-            setSelectedNode(undefined);
-            setSelectedRootNode("network-information");
-            // Handle network information display
-        }
-        else if (newNode.id.startsWith("editor-")) {
-            createBuildersDocument();
-            // Extract file ID from editor-{file.id} format
-            const fileId = newNode.id.replace("editor-", "");
-            setSelectedNode(fileId);
-        }
-    }, [setSelectedNode, sidebarNodes]);
     // === EVENT HANDLERS ===
     // Display function that switches views based on active node ID
     const displayActiveNode = (activeNodeId) => {
         // Determine the type of node and extract the actual ID
         let nodeType = "unknown";
-        let actualId = activeNodeId;
         if (activeNodeId === "workstreams") {
             nodeType = "workstreams";
         }
@@ -254,7 +58,6 @@ export function DriveExplorer({ children }) {
         }
         else if (activeNodeId.startsWith("editor-")) {
             nodeType = "file";
-            actualId = activeNodeId.replace("editor-", "");
         }
         const networkProfileDoc = networkAdminDocuments?.find((doc) => doc.header.documentType === "powerhouse/network-profile");
         switch (nodeType) {
@@ -336,8 +139,6 @@ export function DriveExplorer({ children }) {
             selectedDocumentModel.current = null;
             console.log("Created document node", node);
             if (node) {
-                // Customize: Auto-open created document by uncommenting below
-                // setActiveDocumentId(node.id);
                 // Refresh the sidebar by triggering a re-render
                 // Set the root node based on the document type that was created
                 if (documentType === "powerhouse/network-profile") {
@@ -351,7 +152,7 @@ export function DriveExplorer({ children }) {
         catch (error) {
             console.error("Failed to create document:", error);
         }
-    }, [selectedDrive?.header.id, modalDocumentType]);
+    }, [selectedDrive?.header.id, modalDocumentType, networkAdminDocuments]);
     // Create builders document
     const createBuildersDocument = useCallback(async () => {
         try {
@@ -376,12 +177,8 @@ export function DriveExplorer({ children }) {
         }
     }, [selectedDrive?.header.id, allDocuments]);
     // === RENDER ===
-    return (_jsx(SidebarProvider, { nodes: sidebarNodes, children: isScopeOfWorkFullView && children ? (_jsx("div", { className: "h-full w-full", children: children })) : (
+    return (_jsx("div", { className: "h-full", children: isScopeOfWorkFullView && children ? (_jsx("div", { className: "h-full w-full", children: children })) : (
         /* === NORMAL VIEW WITH SIDEBAR === */
-        _jsxs("div", { className: "flex h-full", children: [_jsx(Sidebar, { nodes: sidebarNodes, activeNodeId: activeSidebarNodeId, onActiveNodeChange: (node) => handleActiveNodeChange(node.id), sidebarTitle: "Network Admin", showSearchBar: true, allowPinning: true, resizable: true, initialWidth: 300, maxWidth: 500, enableMacros: 4, handleOnTitleClick: () => {
-                        setSelectedNode(undefined);
-                        setActiveSidebarNodeId("workstreams");
-                        setSelectedRootNode("workstreams");
-                    } }), _jsx("div", { className: "flex-1 overflow-y-auto", children: _jsx("div", { className: "h-full", children: children ||
+        _jsxs("div", { className: "flex h-full", children: [_jsx(FolderTree, { activeSidebarNodeId: activeSidebarNodeId, setActiveSidebarNodeId: setActiveSidebarNodeId, setSelectedRootNode: setSelectedRootNode, createBuildersDocument: createBuildersDocument }), _jsx("div", { className: "flex-1 overflow-y-auto", children: _jsx("div", { className: "h-full", children: children ||
                             displayActiveNode(selectedFolder?.id || selectedRootNode) }) }), _jsx(CreateDocumentModal, { onContinue: onCreateDocument, onOpenChange: (open) => setOpenModal(open), open: openModal })] })) }));
 }

package/dist/editors/network-admin/components/EmptyState.d.ts

@@ -0,0 +1,3 @@
+/** Shows a message when the selected drive or folder is empty */
+export declare function EmptyState(): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=EmptyState.d.ts.map

package/dist/editors/network-admin/components/EmptyState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../../../editors/network-admin/components/EmptyState.tsx"],"names":[],"mappings":"AAEA,iEAAiE;AACjE,wBAAgB,UAAU,mDAWzB"}

package/dist/editors/network-admin/components/EmptyState.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useNodesInSelectedDriveOrFolder } from "@powerhousedao/reactor-browser";
+/** Shows a message when the selected drive or folder is empty */
+export function EmptyState() {
+    const nodes = useNodesInSelectedDriveOrFolder();
+    const hasNodes = nodes.length > 0;
+    if (hasNodes)
+        return null;
+    return (_jsxs("div", { className: "py-12 text-center text-gray-500", children: [_jsx("p", { className: "text-lg", children: "This folder is empty" }), _jsx("p", { className: "mt-2 text-sm", children: "Create your first document or folder below" })] }));
+}

package/dist/editors/network-admin/components/Files.d.ts

@@ -0,0 +1,3 @@
+/** Shows the files in the selected drive or folder */
+export declare function Files(): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=Files.d.ts.map

package/dist/editors/network-admin/components/Files.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Files.d.ts","sourceRoot":"","sources":["../../../../editors/network-admin/components/Files.tsx"],"names":[],"mappings":"AAMA,sDAAsD;AACtD,wBAAgB,KAAK,mDAiBpB"}

package/dist/editors/network-admin/components/Files.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { FileItem } from "@powerhousedao/design-system/connect";
+import { useNodesInSelectedDriveOrFolder, isFileNodeKind, } from "@powerhousedao/reactor-browser";
+/** Shows the files in the selected drive or folder */
+export function Files() {
+    const nodes = useNodesInSelectedDriveOrFolder();
+    const fileNodes = nodes.filter((n) => isFileNodeKind(n));
+    const hasFiles = fileNodes.length > 0;
+    if (!hasFiles)
+        return null;
+    return (_jsxs("div", { children: [_jsx("h3", { className: "mb-2 text-sm font-semibold text-gray-600", children: "Documents" }), _jsx("div", { className: "flex flex-wrap gap-4", children: fileNodes.map((fileNode) => (_jsx(FileItem, { fileNode: fileNode }, fileNode.id))) })] }));
+}

package/dist/editors/network-admin/components/FolderTree.d.ts

@@ -0,0 +1,14 @@
+import type { FileNode } from "document-drive";
+interface FolderTreeProps {
+    activeSidebarNodeId: string;
+    setActiveSidebarNodeId: (id: string) => void;
+    setSelectedRootNode: (node: string) => void;
+    createBuildersDocument: () => Promise<FileNode | null | undefined>;
+}
+/**
+ * Hierarchical folder tree navigation component using Sidebar from document-engineering.
+ * Displays folders and files in a tree structure with expand/collapse functionality, search, and resize support.
+ */
+export declare function FolderTree({ activeSidebarNodeId, setActiveSidebarNodeId, setSelectedRootNode, createBuildersDocument, }: FolderTreeProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=FolderTree.d.ts.map

package/dist/editors/network-admin/components/FolderTree.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FolderTree.d.ts","sourceRoot":"","sources":["../../../../editors/network-admin/components/FolderTree.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AA0B/C,UAAU,eAAe;IACvB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,sBAAsB,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,mBAAmB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,sBAAsB,EAAE,MAAM,OAAO,CAAC,QAAQ,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;CACpE;AAED;;;GAGG;AACH,wBAAgB,UAAU,CAAC,EACzB,mBAAmB,EACnB,sBAAsB,EACtB,mBAAmB,EACnB,sBAAsB,GACvB,EAAE,eAAe,2CA+QjB"}