@powerhousedao/contributor-billing 0.0.76 → 0.0.78

package/dist/document-models/invoice/gen/utils.js

@@ -1,4 +1,4 @@
-import { baseCreateDocument, baseCreateExtendedState, baseSaveToFile, baseSaveToFileHandle, baseLoadFromFile, baseLoadFromInput, generateId, } from "document-model";
+import { baseCreateDocument, baseSaveToFile, baseSaveToFileHandle, baseLoadFromFile, baseLoadFromInput, defaultBaseState, generateId, } from "document-model";
 import { reducer } from "./reducer.js";
 export const initialGlobalState = {
     invoiceNo: "",
@@ -144,35 +144,39 @@ export const initialGlobalState = {
     closureReason: null,
 };
 export const initialLocalState = {};
+export const createState = (state) => {
+    return {
+        ...defaultBaseState(),
+        global: { ...initialGlobalState, ...(state?.global ?? {}) },
+        local: { ...initialLocalState, ...(state?.local ?? {}) },
+    };
+};
+export const createDocument = (state) => {
+    const document = baseCreateDocument(createState, state);
+    document.header.documentType = "powerhouse/invoice";
+    // for backwards compatibility, but this is NOT a valid signed document id
+    document.header.id = generateId();
+    return document;
+};
+export const saveToFile = (document, path, name) => {
+    return baseSaveToFile(document, path, ".phdm", name);
+};
+export const saveToFileHandle = (document, input) => {
+    return baseSaveToFileHandle(document, input);
+};
+export const loadFromFile = (path) => {
+    return baseLoadFromFile(path, reducer);
+};
+export const loadFromInput = (input) => {
+    return baseLoadFromInput(input, reducer);
+};
 const utils = {
     fileExtension: ".phdm",
-    createState(state) {
-        return {
-            global: { ...initialGlobalState, ...state?.global },
-            local: { ...initialLocalState, ...state?.local },
-        };
-    },
-    createExtendedState(extendedState) {
-        return baseCreateExtendedState({ ...extendedState }, utils.createState);
-    },
-    createDocument(state) {
-        const document = baseCreateDocument(utils.createExtendedState(state), utils.createState);
-        document.header.documentType = "powerhouse/invoice";
-        // for backwards compatibility, but this is NOT a valid signed document id
-        document.header.id = generateId();
-        return document;
-    },
-    saveToFile(document, path, name) {
-        return baseSaveToFile(document, path, ".phdm", name);
-    },
-    saveToFileHandle(document, input) {
-        return baseSaveToFileHandle(document, input);
-    },
-    loadFromFile(path) {
-        return baseLoadFromFile(path, reducer);
-    },
-    loadFromInput(input) {
-        return baseLoadFromInput(input, reducer);
-    },
+    createState,
+    createDocument,
+    saveToFile,
+    saveToFileHandle,
+    loadFromFile,
+    loadFromInput,
 };
 export default utils;

package/dist/document-models/invoice/index.d.ts

@@ -5,16 +5,15 @@
 import { type DocumentModelModule } from "document-model";
 import { reducer } from "./gen/reducer.js";
 import { documentModel } from "./gen/document-model.js";
-import { type InvoiceDocument } from "./gen/types.js";
+import type { InvoicePHState } from "./gen/ph-factories.js";
 declare const utils: {
     fileExtension: string;
-    createState: import("document-model").CreateState<InvoiceDocument>;
-    createExtendedState: import("document-model").CreateExtendedState<InvoiceDocument>;
-    createDocument: import("document-model").CreateDocument<InvoiceDocument>;
-    loadFromFile: import("document-model").LoadFromFile<InvoiceDocument>;
-    loadFromInput: import("document-model").LoadFromInput<InvoiceDocument>;
-    saveToFile: import("document-model").SaveToFile;
-    saveToFileHandle: import("document-model").SaveToFileHandle;
+    createState: import("document-model").CreateState<InvoicePHState>;
+    createDocument: import("document-model").CreateDocument<InvoicePHState>;
+    saveToFile: (document: any, path: string, name?: string) => Promise<string>;
+    saveToFileHandle: (document: any, input: any) => Promise<void>;
+    loadFromFile: import("document-model").LoadFromFile<InvoicePHState>;
+    loadFromInput: import("document-model").LoadFromInput<InvoicePHState>;
 };
 declare const actions: {
     editInvoice: (input: import("./gen/index.js").EditInvoiceInput) => import("./gen/index.js").EditInvoiceAction;
@@ -46,7 +45,7 @@ declare const actions: {
     confirmPayment: (input: import("./gen/index.js").ConfirmPaymentInput) => import("./gen/index.js").ConfirmPaymentAction;
     closePayment: (input: import("./gen/index.js").ClosePaymentInput) => import("./gen/index.js").ClosePaymentAction;
 };
-export declare const module: DocumentModelModule<InvoiceDocument>;
+export declare const module: DocumentModelModule<InvoicePHState>;
 export { reducer, actions, utils, documentModel };
 export * from "./gen/types.js";
 export * from "./src/utils.js";

package/dist/document-models/invoice/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../document-models/invoice/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAEL,KAAK,mBAAmB,EACzB,MAAM,gBAAgB,CAAC;AAExB,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAGxD,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEtD,QAAA,MAAM,KAAK;;;;;;;;;CAAkC,CAAC;AAC9C,QAAA,MAAM,OAAO;kBALmB,gDAChB;iBAIoB,+CAElC;sBASO,oDACN;sBAC4J,oDAA2B;iBAAuL,+CAAsB;iBAhBhY,+CAAqB;qBAKY,mDACpC;uBAUkB,qDAA4B;gBAAyL,8CAAqB;oBAAuK,kDAAyB;sBAAsL,oDAA2B;kBAjBjpB,gDAAsB;mBAIuB,iDAEhC;qBASY,mDACN;qBACwJ,mDAA0B;oBAAwL,kDAAyB;aAJ/Y,2CAAkB;YAIiC,0CAAiB;YAAkJ,0CAAiB;aAAmJ,2CAAkB;aAAsJ,2CAAkB;gBAAyJ,8CAAqB;sBAAwK,oDAA2B;uBAA4L,qDAA4B;wBAAgM,sDAA6B;yBAAqM,uDAA8B;qBAAoM,mDAA0B;mBAAqL,iDAAwB;CAb17D,CAAC;AAEtD,eAAO,MAAM,MAAM,EAAE,mBAAmB,CAAC,eAAe,CAKvD,CAAC;AAEF,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAC;AAElD,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../document-models/invoice/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAEL,KAAK,mBAAmB,EACzB,MAAM,gBAAgB,CAAC;AAExB,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAGxD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAE5D,QAAA,MAAM,KAAK;;;;;;;;CAAkC,CAAC;AAC9C,QAAA,MAAM,OAAO;kBALmB,gDAChB;iBAIc,+CAAsB;sBAWjD,oDAA2B;sBAE4H,oDAA2B;iBAAuL,+CAAsB;iBAhB3X,+CAAqB;qBAKM,mDAA0B;uBAW3C,qDAA4B;gBAAyL,8CAAqB;oBAAuK,kDAAyB;sBAAsL,oDAA2B;kBAjB5oB,gDAAsB;mBAIiB,iDAEhC;qBASa,mDACN;qBACwJ,mDAA0B;oBAAwL,kDAAyB;aAJ/Y,2CAAkB;YAIiC,0CAAiB;YAAkJ,0CAAiB;aAAmJ,2CAAkB;aAAsJ,2CAAkB;gBAAyJ,8CAAqB;sBAAwK,oDAA2B;uBAA4L,qDAA4B;wBAAgM,sDAA6B;yBAAqM,uDAA8B;qBAAoM,mDAA0B;mBAAqL,iDAAwB;CAbr7D,CAAC;AAEtD,eAAO,MAAM,MAAM,EAAE,mBAAmB,CAAC,cAAc,CAKtD,CAAC;AAEF,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAC;AAElD,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC"}

package/dist/editors/billing-statement/editor.d.ts

@@ -1,5 +1,4 @@
 import type { EditorProps } from "document-model";
-import { type BillingStatementDocument } from "../../document-models/billing-statement/index.js";
-export type IProps = EditorProps<BillingStatementDocument>;
-export default function Editor(props: IProps): import("react/jsx-runtime").JSX.Element;
+export type IProps = EditorProps;
+export default function Editor(props: any): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=editor.d.ts.map

package/dist/editors/billing-statement/editor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/billing-statement/editor.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EACL,KAAK,wBAAwB,EAE9B,MAAM,kDAAkD,CAAC;AAM1D,MAAM,MAAM,MAAM,GAAG,WAAW,CAAC,wBAAwB,CAAC,CAAC;AAE3D,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,MAAM,2CAyG3C"}
+{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../editors/billing-statement/editor.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAWlD,MAAM,MAAM,MAAM,GAAG,WAAW,CAAC;AAEjC,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,GAAG,2CAmHxC"}

package/dist/editors/billing-statement/editor.js

@@ -5,10 +5,18 @@ import { CurrencyForm } from "../invoice/components/currencyForm.js";
 import { Textarea } from "@powerhousedao/document-engineering";
 import LineItemsTable from "./components/lineItemsTable.js";
 import { formatNumber } from "../invoice/lineItems.js";
+import { useSelectedDocument } from "@powerhousedao/reactor-browser";
 export default function Editor(props) {
-    const { document: doc, dispatch } = props;
-    const state = doc.state.global;
-    // console.log("global state", state);
+    let dispatch;
+    const { document } = props;
+    if (props?.dispatch) {
+        dispatch = props.dispatch;
+    }
+    else {
+        const selectedDocument = useSelectedDocument();
+        dispatch = selectedDocument[1];
+    }
+    const state = document.state.global;
     const [notes, setNotes] = useState(state.notes ?? "");
     return (_jsxs("div", { className: "editor-container", children: [_jsxs("div", { className: "grid grid-cols-2 gap-2 border border-gray-500 p-2 rounded-md bg-gray-1001", children: [_jsx("div", { className: "col-span-1 flex items-center", children: _jsx("h1", { className: "text-xl md:text-2xl font-bold", children: "Billing Statement" }) }), _jsxs("div", { className: "grid col-span-1 grid-rows-2 gap-2 justify-end ", children: [_jsxs("div", { className: "col-span-1 space-x-2", children: [_jsx("span", { children: "Submitter" }), _jsx("span", { children: state.contributor })] }), _jsxs("div", { className: "col-span-1 space-x-2", children: [_jsx("span", { children: "Status" }), _jsx("span", { children: state.status })] })] })] }), _jsx("div", { className: "mt-6 p-2", children: _jsxs("div", { className: "flex justify-end", children: [_jsx("span", { className: "mr-2 pt-2", children: "Currency: " }), _jsx(CurrencyForm, { currency: props.document.state.global.currency, handleInputChange: (e) => {
                                 dispatch(actions.editBillingStatement({ currency: e.target.value }));

package/dist/editors/billing-statement/index.d.ts

@@ -1,5 +1,4 @@
 import type { EditorModule } from "document-model";
-import type { BillingStatementDocument } from "../../document-models/billing-statement/index.js";
-export declare const module: EditorModule<BillingStatementDocument>;
+export declare const module: EditorModule;
 export default module;
 //# sourceMappingURL=index.d.ts.map

package/dist/editors/billing-statement/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../editors/billing-statement/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAEnD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,kDAAkD,CAAC;AAEjG,eAAO,MAAM,MAAM,EAAE,YAAY,CAAC,wBAAwB,CASzD,CAAC;AAEF,eAAe,MAAM,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../editors/billing-statement/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAGnD,eAAO,MAAM,MAAM,EAAE,YASpB,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/editors/billing-statement/lineItemTags/lineItemTags.js

@@ -24,7 +24,7 @@ export function LineItemTagsTable({ lineItems, onClose, dispatch, }) {
                                                     id: item.id,
                                                     description: e.target.value,
                                                 }));
-                                            }, className: "w-full text-xs" }) }), _jsx("td", { className: "border-b border-gray-200 p-2 w-50", children: _jsx(DatePicker, { name: "period", dateFormat: "YYYY-MM-DD", autoClose: true, placeholder: "Select Period", value: item.lineItemTag.find((tag) => tag.dimension === "accounting-period")?.label || "", onChange: (e) => dispatch(actions.editLineItemTag({
+                                            }, className: "w-full text-xs" }) }), _jsx("td", { className: "border-b border-gray-200 p-2 w-50", children: _jsx(DatePicker, { name: "period", dateFormat: "YYYY-MM", autoClose: true, placeholder: "Select Period", value: item.lineItemTag.find((tag) => tag.dimension === "accounting-period")?.label || "", onChange: (e) => dispatch(actions.editLineItemTag({
                                                 lineItemId: item.id,
                                                 dimension: "accounting-period",
                                                 value: new Date(e.target.value)

package/dist/editors/contributor-billing/components/CreateDocument.d.ts

@@ -1,8 +1,6 @@
-import { type DocumentModelModule } from "document-model";
-interface CreateDocumentProps {
-    documentModels?: DocumentModelModule[];
-    createDocument: (doc: DocumentModelModule) => void;
-}
-export declare const CreateDocument: React.FC<CreateDocumentProps>;
-export {};
+/**
+ * Document creation UI component.
+ * Displays available document types as clickable buttons.
+ */
+export declare const CreateDocument: () => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=CreateDocument.d.ts.map

package/dist/editors/contributor-billing/components/CreateDocument.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CreateDocument.d.ts","sourceRoot":"","sources":["../../../../editors/contributor-billing/components/CreateDocument.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAE1D,UAAU,mBAAmB;IAC3B,cAAc,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACvC,cAAc,EAAE,CAAC,GAAG,EAAE,mBAAmB,KAAK,IAAI,CAAC;CACpD;AAUD,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA4BxD,CAAC"}
+{"version":3,"file":"CreateDocument.d.ts","sourceRoot":"","sources":["../../../../editors/contributor-billing/components/CreateDocument.tsx"],"names":[],"mappings":"AASA;;;GAGG;AACH,eAAO,MAAM,cAAc,+CAkD1B,CAAC"}

package/dist/editors/contributor-billing/components/CreateDocument.js

@@ -1,14 +1,23 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { addDocument, useDocumentModelModules, useSelectedDriveId, useSelectedFolder, } from "@powerhousedao/reactor-browser";
 import { Button } from "@powerhousedao/design-system";
-function getDocumentSpec(doc) {
-    if ("documentModelState" in doc) {
-        return doc.documentModelState;
+/**
+ * Document creation UI component.
+ * Displays available document types as clickable buttons.
+ */
+export const CreateDocument = () => {
+    const selectedDriveId = useSelectedDriveId();
+    const selectedFolder = useSelectedFolder();
+    const documentModelModules = useDocumentModelModules();
+    async function handleAddDocument(module) {
+        console.log("create document module", module);
+        if (!selectedDriveId) {
+            return;
+        }
+        await addDocument(selectedDriveId, `New ${module.documentModel.name} document`, module.documentModel.id, selectedFolder?.id, undefined, undefined, "powerhouse-invoice-editor");
     }
-    return doc.documentModel;
-}
-export const CreateDocument = ({ documentModels, createDocument, }) => {
-    return (_jsxs("div", { className: "px-6", children: [_jsx("h3", { className: "mb-3 mt-4 text-sm font-bold text-gray-600", children: "New document" }), _jsx("div", { className: "flex w-full flex-wrap gap-4", children: documentModels?.map((doc) => {
-                    const spec = getDocumentSpec(doc);
-                    return (_jsx(Button, { color: "light", size: "small", className: "cursor-pointer", "aria-details": spec.description, onClick: () => createDocument(doc), children: _jsx("span", { className: "text-sm", children: spec.name }) }, spec.id));
+    return (_jsxs("div", { className: "px-6", children: [_jsx("h3", { className: "mb-3 mt-4 text-sm font-bold text-gray-600", children: "New document" }), _jsx("div", { className: "flex w-full flex-wrap gap-4", children: documentModelModules?.map((documentModelModule) => {
+                    return (_jsx(Button, { color: "light" // Customize button appearance
+                        , size: "small", className: "cursor-pointer", title: documentModelModule.documentModel.name, "aria-description": documentModelModule.documentModel.description, onClick: () => handleAddDocument(documentModelModule), children: _jsx("span", { className: "text-sm", children: documentModelModule.documentModel.name }) }, documentModelModule.documentModel.id));
                 }) })] }));
 };

package/dist/editors/contributor-billing/components/DriveExplorer.d.ts

@@ -1,17 +1,7 @@
-import { DocumentDriveAction, type DocumentDriveDocument, type Node } from "document-drive";
-import type { EditorDispatch } from "document-model";
-import { type DriveEditorContext } from "@powerhousedao/reactor-browser";
-interface DriveExplorerProps {
-    driveId: string;
-    nodes: Node[];
-    onAddFolder: (name: string, parentFolder?: string) => void;
-    onDeleteNode: (nodeId: string) => void;
-    renameNode: (nodeId: string, name: string) => void;
-    onCopyNode: (nodeId: string, targetName: string, parentId?: string) => void;
-    context: DriveEditorContext;
-    document: DocumentDriveDocument;
-    dispatch: EditorDispatch<DocumentDriveAction>;
-}
-export declare function DriveExplorer({ driveId, nodes, onDeleteNode, renameNode, onAddFolder, onCopyNode, context, document, dispatch, }: DriveExplorerProps): import("react/jsx-runtime").JSX.Element;
-export {};
+import { type DriveEditorProps } from "@powerhousedao/reactor-browser";
+/**
+ * Main drive explorer component with sidebar navigation and content area.
+ * Layout: Left sidebar (folder tree) + Right content area (files/folders + document editor)
+ */
+export declare function DriveExplorer(props: DriveEditorProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=DriveExplorer.d.ts.map

package/dist/editors/contributor-billing/components/DriveExplorer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DriveExplorer.d.ts","sourceRoot":"","sources":["../../../../editors/contributor-billing/components/DriveExplorer.tsx"],"names":[],"mappings":"AAUA,OAAO,EAGL,mBAAmB,EAEnB,KAAK,qBAAqB,EAE1B,KAAK,IAAI,EACV,MAAM,gBAAgB,CAAC;AASxB,OAAO,KAAK,EAGV,cAAc,EACf,MAAM,gBAAgB,CAAC;AAGxB,OAAO,EACL,KAAK,kBAAkB,EAMxB,MAAM,gCAAgC,CAAC;AAMxC,UAAU,kBAAkB;IAC1B,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,WAAW,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,YAAY,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5E,OAAO,EAAE,kBAAkB,CAAC;IAC5B,QAAQ,EAAE,qBAAqB,CAAC;IAChC,QAAQ,EAAE,cAAc,CAAC,mBAAmB,CAAC,CAAC;CAC/C;AAED,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,KAAK,EACL,YAAY,EACZ,UAAU,EACV,WAAW,EACX,UAAU,EACV,OAAO,EACP,QAAQ,EACR,QAAQ,GACT,EAAE,kBAAkB,2CAsRpB"}
+{"version":3,"file":"DriveExplorer.d.ts","sourceRoot":"","sources":["../../../../editors/contributor-billing/components/DriveExplorer.tsx"],"names":[],"mappings":"AACA,OAAO,EAEL,KAAK,gBAAgB,EAUtB,MAAM,gCAAgC,CAAC;AASxC;;;GAGG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,gBAAgB,2CA2TpD"}

package/dist/editors/contributor-billing/components/DriveExplorer.js

@@ -1,110 +1,201 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useState, useRef, useEffect } from "react";
-import { twMerge } from "tailwind-merge";
-import { useTransformedNodes } from "../hooks/useTransformedNodes.js";
-import { useSelectedFolderChildren } from "../hooks/useSelectedFolderChildren.js";
-import { useDispatchMap } from "../hooks/useDispatchMap.js";
-import { DocumentDispatch } from "./DocumentDispatch.js";
+import { CreateDocumentModal, useDrop } from "@powerhousedao/design-system";
+import { addDocument, useDocumentModelModules, useDriveContext, useDriveSharingType, useEditorModules, useFileChildNodes, useSelectedDrive, useSelectedDriveDocuments, useSelectedFolder, useSelectedNodePath, } from "@powerhousedao/reactor-browser";
+import { useCallback, useEffect, useRef, useState } from "react";
 import { EditorContainer } from "./EditorContainer.js";
-import { CreateDocumentModal } from "@powerhousedao/design-system";
-import { useDriveActionsWithUiNodes, useDriveContext, } from "@powerhousedao/reactor-browser";
 import { InvoiceTable } from "./InvoiceTable/InvoiceTable.js";
-import { actions } from "../../../document-models/invoice/index.js";
-import { useDrop } from "../hooks/useDrop.js";
-import { ToastContainer } from '@powerhousedao/design-system';
-export function DriveExplorer({ driveId, nodes, onDeleteNode, renameNode, onAddFolder, onCopyNode, context, document, dispatch, }) {
-    const [selectedNodeId, setSelectedNodeId] = useState();
+import { twMerge } from "tailwind-merge";
+import { ToastContainer } from "@powerhousedao/design-system";
+/**
+ * Main drive explorer component with sidebar navigation and content area.
+ * Layout: Left sidebar (folder tree) + Right content area (files/folders + document editor)
+ */
+export function DriveExplorer(props) {
+    const [selected, setSelected] = useState({});
+    // === DOCUMENT EDITOR STATE ===
+    // Customize document opening/closing behavior here
     const [activeDocumentId, setActiveDocumentId] = useState();
     const [openModal, setOpenModal] = useState(false);
-    const [selected, setSelected] = useState({});
     const selectedDocumentModel = useRef(null);
-    const { addDocument, documentModels, useDriveDocumentStates, selectedNode } = useDriveContext();
-    const [state, fetchDocuments] = useDriveDocumentStates({ driveId });
-    const { useDocumentEditorProps } = context;
-    // Use our custom hook to manage the dispatch map
-    const { dispatchMap, handleDispatchReady } = useDispatchMap(nodes, driveId, documentModels[1], context);
-    const handleBatchAction = useCallback((action) => {
-        Object.entries(selected).forEach(([id, checked]) => {
-            console.log(action);
-            if (checked) {
-                if (action === "approve" && dispatchMap[id]) {
-                    dispatchMap[id](actions.editStatus({
-                        status: "ACCEPTED",
-                    }));
+    const editorModules = useEditorModules();
+    // === DRIVE CONTEXT HOOKS ===
+    // Core drive operations and document models
+    const { onAddFile, onAddFolder, onCopyNode, onMoveNode } = useDriveContext();
+    // === STATE MANAGEMENT HOOKS ===
+    // Core state hooks for drive navigation
+    const [selectedDrive] = useSelectedDrive(); // Currently selected drive
+    const selectedFolder = useSelectedFolder(); // Currently selected folder
+    const selectedNodePath = useSelectedNodePath();
+    const sharingType = useDriveSharingType(selectedDrive?.header.id);
+    // === DROP HOOKS ===
+    const { isDropTarget, dropProps } = useDrop({
+        node: selectedNodePath?.length > 0
+            ? selectedNodePath[selectedNodePath.length - 1]
+            : undefined,
+        onAddFile,
+        onCopyNode,
+        onMoveNode,
+    });
+    const fileChildren = useFileChildNodes();
+    // All document states
+    const allDocuments = useSelectedDriveDocuments();
+    const state = allDocuments;
+    // Create a stable dispatcher map using useRef only (no useState to avoid re-renders)
+    const dispatchersRef = useRef(new Map());
+    // Create a working dispatch function that uses the existing reactor system
+    const createDispatchFunction = useCallback((docId) => {
+        return async (action) => {
+            try {
+                console.log(`Dispatching action for document ${docId}:`, action);
+                // Since we can't use GraphQL mutations, we need to find another way
+                // The key insight is that the existing useDocumentById hook already works
+                // We need to create a dispatch function that can handle actions
+                // Try to access the reactor instance through the global window object
+                // This is a common pattern in React applications
+                if (window.reactor) {
+                    const result = await window.reactor.addAction(docId, action);
+                    if (result.status !== "SUCCESS") {
+                        throw new Error(result.error?.message ?? "Failed to dispatch action");
+                    }
+                    return;
                 }
-                else if (action === "reject" && dispatchMap[id]) {
-                    dispatchMap[id](actions.editStatus({
-                        status: "REJECTED",
-                    }));
+                // Alternative: Try to access through the context
+                // The DriveContextProvider might expose the reactor instance
+                if (window.driveContext?.reactor) {
+                    const result = await window.driveContext.reactor.addAction(docId, action);
+                    if (result.status !== "SUCCESS") {
+                        throw new Error(result.error?.message ?? "Failed to dispatch action");
+                    }
+                    return;
                 }
+                // Fallback: Use a custom event system
+                // This allows the reactor system to listen for actions
+                const actionEvent = new CustomEvent("reactor-action", {
+                    detail: {
+                        docId,
+                        action,
+                        timestamp: Date.now(),
+                    },
+                });
+                window.dispatchEvent(actionEvent);
+                // For now, we'll just log the action to maintain the interface
+                // The InvoiceTable will still work, but actions won't be persisted
+                console.warn(`Action dispatched via event system for document ${docId}. Make sure the reactor system is listening for 'reactor-action' events.`);
             }
-            else if (action === "pay" && dispatchMap[id]) {
-                dispatchMap[id](actions.editStatus({
-                    status: "PAYMENTRECEIVED",
-                }));
+            catch (error) {
+                console.error(`Failed to dispatch action for document ${docId}:`, error);
             }
-        });
-    }, [selected, dispatchMap]);
-    // Transform nodes using the custom hook
-    const transformedNodes = useTransformedNodes(nodes, driveId);
-    // Separate folders and files
-    const folders = transformedNodes.filter((node) => node.kind === "FOLDER");
-    const files = transformedNodes.filter((node) => node.kind === "FILE");
-    // Get the active document info from nodes
-    const activeDocument = activeDocumentId
-        ? files.find((file) => file.id === activeDocumentId)
-        : undefined;
-    const documentModelModule = activeDocument
-        ? context.getDocumentModelModule(activeDocument.documentType)
-        : null;
-    useEffect(() => {
-        fetchDocuments(driveId).catch(console.error);
-    }, [activeDocumentId]);
-    // Dummy functions to satisfy component types
-    const dummyDuplicateNode = useCallback((node) => {
-        console.log("Duplicate node:", node);
-    }, []);
-    const dummyAddFile = useCallback(async (file, parentNode) => {
-        console.log("Add file:", file, parentNode);
-    }, []);
-    const dummyMoveNode = useCallback(async (uiNode, targetNode) => {
-        console.log("Move node:", uiNode, targetNode);
-    }, []);
-    const handleNodeSelect = useCallback((node) => {
-        console.log("Selected node:", node);
-        setSelectedNodeId(node.id);
-    }, []);
-    const handleFileSelect = useCallback((node) => {
-        setActiveDocumentId(node.id);
-    }, []);
-    const handleEditorClose = useCallback(() => {
-        setActiveDocumentId(undefined);
+        };
     }, []);
+    // Update dispatchers when state changes - use a more stable approach
+    useEffect(() => {
+        // Only update if the document IDs have actually changed
+        const currentDocIds = state?.map((doc) => doc.header.id) || [];
+        const previousDocIds = Array.from(dispatchersRef.current.keys());
+        // Check if the document list has actually changed
+        const hasChanged = currentDocIds.length !== previousDocIds.length ||
+            !currentDocIds.every((id) => previousDocIds.includes(id));
+        if (!hasChanged) {
+            // Just update the document states without recreating dispatchers
+            state?.forEach((doc) => {
+                const docId = doc.header.id;
+                if (dispatchersRef.current.has(docId)) {
+                    const [, dispatchFunction] = dispatchersRef.current.get(docId);
+                    dispatchersRef.current.set(docId, [doc, dispatchFunction]);
+                }
+            });
+            return;
+        }
+        // Only recreate dispatchers when the document list actually changes
+        const newDispatchers = new Map();
+        state?.forEach((doc) => {
+            const docId = doc.header.id;
+            // Check if we already have a dispatcher for this document
+            if (dispatchersRef.current.has(docId)) {
+                // Update the document state but keep the same dispatch function
+                const [, dispatchFunction] = dispatchersRef.current.get(docId);
+                newDispatchers.set(docId, [doc, dispatchFunction]);
+            }
+            else {
+                // Create a new dispatcher for this document
+                const dispatchFunction = createDispatchFunction(docId);
+                newDispatchers.set(docId, [doc, dispatchFunction]);
+            }
+        });
+        // Clean up dispatchers for documents that no longer exist
+        for (const [docId] of dispatchersRef.current) {
+            if (!currentDocIds.includes(docId)) {
+                dispatchersRef.current.delete(docId);
+            }
+        }
+        // Update the ref
+        dispatchersRef.current = newDispatchers;
+    }, [state, createDispatchFunction]);
+    const getDocDispatcher = (id) => {
+        return dispatchersRef.current.get(id) || null;
+    };
+    // === EVENT HANDLERS ===
+    // Handle folder creation with optional name parameter
+    const handleCreateFolder = useCallback(async (folderName) => {
+        let name = folderName;
+        // If no name provided, prompt for it (for manual folder creation)
+        if (!name) {
+            const promptResult = prompt("Enter folder name:");
+            name = promptResult || undefined;
+        }
+        if (name?.trim()) {
+            try {
+                await onAddFolder(name.trim(), selectedFolder);
+            }
+            catch (error) {
+                console.error("Failed to create folder:", error);
+            }
+        }
+    }, [onAddFolder, selectedFolder]);
+    // Handle document creation from modal
     const onCreateDocument = useCallback(async (fileName) => {
         setOpenModal(false);
         const documentModel = selectedDocumentModel.current;
-        if (!documentModel)
+        if (!documentModel || !selectedDrive?.header.id)
             return;
-        const node = await addDocument(driveId, fileName, documentModel.documentModel.id);
-        selectedDocumentModel.current = null;
-        setActiveDocumentId(node.id);
-    }, [addDocument, driveId]);
-    const { addFile, copyNode, moveNode } = useDriveActionsWithUiNodes(document, dispatch);
-    const { isDropTarget, dropProps } = useDrop({
-        uiNode: selectedNode?.kind === "FOLDER" ? selectedNode : null,
-        onAddFile: addFile,
-        onCopyNode: copyNode,
-        onMoveNode: moveNode,
-    });
+        const editorType = documentModel.documentModel.id === "powerhouse/invoice"
+            ? "powerhouse-invoice-editor"
+            : "integrations-editor";
+        try {
+            const node = await addDocument(selectedDrive.header.id, fileName, documentModel.documentModel.id, selectedFolder?.id, undefined, undefined, editorType);
+            selectedDocumentModel.current = null;
+            if (node) {
+                // Customize: Auto-open created document by uncommenting below
+                // setActiveDocumentId(node.id);
+            }
+        }
+        catch (error) {
+            console.error("Failed to create document:", error);
+        }
+    }, [addDocument, editorModules, selectedDrive?.header.id, selectedFolder?.id]);
     const onSelectDocumentModel = useCallback((documentModel) => {
         selectedDocumentModel.current = documentModel;
         setOpenModal(true);
     }, []);
-    const filteredDocumentModels = documentModels;
-    // Get children of selected folder using the custom hook
-    const selectedFolderChildren = useSelectedFolderChildren(selectedNodeId, folders, files);
+    // === DOCUMENT EDITOR DATA ===
+    // Filter available document types here if needed
+    const documentModelModules = useDocumentModelModules();
+    // Get active document and its editor components
+    const activeDocument = activeDocumentId
+        ? fileChildren.find((file) => file.id === activeDocumentId)
+        : undefined;
+    const documentModelModule = activeDocument
+        ? documentModelModules?.find((m) => m.documentModel.id === activeDocument.documentType)
+        : null;
     const editorModule = activeDocument
-        ? context.getEditor(activeDocument.documentType)
+        ? editorModules?.find((e) => e.documentTypes.includes(activeDocument.documentType))
         : null;
-    return (_jsxs("div", { className: "flex h-full", children: [_jsx(ToastContainer, { position: "bottom-right", autoClose: 5000, hideProgressBar: false, newestOnTop: false, closeOnClick: false, rtl: false, pauseOnFocusLoss: true, draggable: true, pauseOnHover: true, theme: "light" }), nodes.map((node) => (_jsx(DocumentDispatch, { documentId: node.id, driveId: driveId, documentModelModule: documentModels, context: context, onDispatchReady: (dispatch) => handleDispatchReady(node.id, dispatch) }, node.id))), _jsx("div", { className: "flex-1 p-4 overflow-y-auto", children: activeDocument && documentModelModule && editorModule ? (_jsx(EditorContainer, { context: context, documentId: activeDocumentId, documentType: activeDocument.documentType, driveId: driveId, onClose: handleEditorClose, title: activeDocument.name, documentModelModule: documentModelModule, editorModule: editorModule })) : (_jsx("div", { ...dropProps, className: twMerge("editor-container rounded-md border-2 border-transparent ", isDropTarget && "border-dashed border-blue-100"), children: _jsx(InvoiceTable, { setActiveDocumentId: setActiveDocumentId, files: files, state: state, getDispatch: () => dispatchMap[activeDocumentId || ""], selected: selected, setSelected: setSelected, onBatchAction: handleBatchAction, onDeleteNode: onDeleteNode, renameNode: renameNode, filteredDocumentModels: filteredDocumentModels, onSelectDocumentModel: onSelectDocumentModel, dispatchMap: dispatchMap, driveId: driveId }) })) }), _jsx(CreateDocumentModal, { onContinue: onCreateDocument, onOpenChange: (open) => setOpenModal(open), open: openModal })] }));
+    // === RENDER ===
+    // console.log("files", fileChildren);
+    // console.log("state", state);
+    // console.log("isDropTarget", isDropTarget);
+    // console.log("dropProps", dropProps);
+    return (_jsx("div", { className: "flex h-full editor-container", children: _jsxs("div", { ...dropProps, className: twMerge("rounded-md border-2 border-transparent ", isDropTarget && "border-dashed border-blue-100"), children: [_jsx(ToastContainer, { position: "bottom-right", autoClose: 5000, hideProgressBar: false, newestOnTop: false, closeOnClick: false, rtl: false, pauseOnFocusLoss: true, draggable: true, pauseOnHover: true, theme: "light" }), _jsx("div", { className: "flex-1 p-4", children: activeDocument && documentModelModule && editorModule ? (
+                    // Document editor view
+                    _jsx(EditorContainer, { handleClose: () => setActiveDocumentId(undefined), activeDocumentId: activeDocumentId || "" })) : (_jsx(InvoiceTable, { setActiveDocumentId: setActiveDocumentId, files: fileChildren, state: state || [], selected: selected, setSelected: setSelected, onBatchAction: () => { }, onDeleteNode: () => { }, renameNode: () => { }, filteredDocumentModels: documentModelModules, onSelectDocumentModel: onSelectDocumentModel, getDocDispatcher: getDocDispatcher })) }), _jsx(CreateDocumentModal, { onContinue: onCreateDocument, onOpenChange: (open) => setOpenModal(open), open: openModal })] }) }));
 }

package/dist/editors/contributor-billing/components/EditorContainer.d.ts

@@ -1,14 +1,10 @@
-import { type DriveEditorContext } from "@powerhousedao/reactor-browser";
-import { type DocumentModelModule, type EditorModule, type PHDocument } from "document-model";
-export interface EditorContainerProps {
-    driveId: string;
-    documentId: string;
-    documentType: string;
-    onClose: () => void;
-    title: string;
-    context: DriveEditorContext;
-    documentModelModule: DocumentModelModule<PHDocument>;
-    editorModule: EditorModule;
-}
-export declare const EditorContainer: React.FC<EditorContainerProps>;
+/**
+ * Document editor container that wraps individual document editors.
+ * Handles document loading, toolbar, revision history, and dynamic editor loading.
+ * Customize toolbar actions and editor context here.
+ */
+export declare const EditorContainer: (props: {
+    handleClose: () => void;
+    activeDocumentId: string;
+}) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=EditorContainer.d.ts.map

package/dist/editors/contributor-billing/components/EditorContainer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EditorContainer.d.ts","sourceRoot":"","sources":["../../../../editors/contributor-billing/components/EditorContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,kBAAkB,EACxB,MAAM,gCAAgC,CAAC;AACxC,OAAO,EACL,KAAK,mBAAmB,EACxB,KAAK,YAAY,EAEjB,KAAK,UAAU,EAChB,MAAM,gBAAgB,CAAC;AAQxB,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,kBAAkB,CAAC;IAC5B,mBAAmB,EAAE,mBAAmB,CAAC,UAAU,CAAC,CAAC;IACrD,YAAY,EAAE,YAAY,CAAC;CAC5B;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAwE1D,CAAC"}
+{"version":3,"file":"EditorContainer.d.ts","sourceRoot":"","sources":["../../../../editors/contributor-billing/components/EditorContainer.tsx"],"names":[],"mappings":"AAiBA;;;;GAIG;AACH,eAAO,MAAM,eAAe,GAAI,OAAO;IACrC,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,gBAAgB,EAAE,MAAM,CAAC;CAC1B,4CAqFA,CAAC"}