@powerhousedao/network-admin 1.0.0-dev.6 → 1.0.0-dev.7

package/dist/editors/workstream-editor/editor.js

@@ -0,0 +1,800 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from "@powerhousedao/document-engineering";
+import { ToastContainer } from "@powerhousedao/design-system/connect";
+import { TextInput, Select, OIDInput, PHIDInput, ObjectSetTable, buildEnumCellEditor, } from "@powerhousedao/document-engineering";
+import { actions, } from "@powerhousedao/network-admin/document-models/workstream";
+import { actions as rfpActions, } from "@powerhousedao/network-admin/document-models/request-for-proposals";
+import { generateId } from "document-model/core";
+import { useDocumentById, useSelectedDrive, addDocument, useDocumentsInSelectedDrive, useParentFolderForSelectedNode, setSelectedNode, } from "@powerhousedao/reactor-browser";
+import { useEffect, useMemo, useState, useCallback } from "react";
+import { useSelectedWorkstreamDocument } from "@powerhousedao/network-admin/document-models/workstream";
+import { DocumentToolbar } from "@powerhousedao/design-system/connect";
+import { actions as sowActions, } from "@powerhousedao/project-management/document-models/scope-of-work";
+// Status options for the dropdown
+const statusOptions = [
+    { value: "RFP_DRAFT", label: "RFP Draft (RFP_DRAFT)" },
+    { value: "PREWORK_RFC", label: "Create Initial Proposal > PREWORK_RFC" },
+    { value: "RFP_CANCELLED", label: "Cancel RFP > RFP_CANCELLED" },
+    { value: "OPEN_FOR_PROPOSALS", label: "Open for Proposals" },
+    { value: "PROPOSAL_SUBMITTED", label: "Proposal Submitted" },
+    { value: "NOT_AWARDED", label: "Not Awarded" },
+    { value: "AWARDED", label: "Awarded" },
+    { value: "IN_PROGRESS", label: "In Progress" },
+    { value: "FINISHED", label: "Finished" },
+];
+const statusStyles = {
+    DRAFT: "bg-[#fcdfbd] text-[#ffa033] rounded px-2 py-1 font-semibold",
+    SUBMITTED: "bg-[#bfdffd] text-[#339cff] rounded px-2 py-1 font-semibold",
+    ACCEPTED: "bg-[#c8ecd1] text-[#4fc86f] rounded px-2 py-1 font-semibold",
+    REJECTED: "bg-[#ffaea8] text-[#de3333] rounded px-2 py-1 font-semibold",
+};
+export default function Editor() {
+    const [doc, dispatch] = useSelectedWorkstreamDocument();
+    const [state, setState] = useState(doc.state.global);
+    useEffect(() => {
+        setState(doc.state.global);
+    }, [doc.state.global]);
+    const [selectedDrive] = useSelectedDrive();
+    const [newNode, setNewNode] = useState(null);
+    // Local state to track newly created document IDs
+    const [newlyCreatedSowId, setNewlyCreatedSowId] = useState(null);
+    const [newlyCreatedPaymentTermsId, setNewlyCreatedPaymentTermsId] = useState(null);
+    const [newlyCreatedRfpId, setNewlyCreatedRfpId] = useState(null);
+    // Get the parent folder node for the currently selected node
+    const parentFolder = useParentFolderForSelectedNode();
+    // Set the selected node to the parent folder node (close the editor)
+    function _handleClose() {
+        setSelectedNode(parentFolder?.id);
+    }
+    // Loading states to prevent double-clicks
+    const [isCreatingRfp, setIsCreatingRfp] = useState(false);
+    const [isCreatingSow, setIsCreatingSow] = useState(false);
+    const [isCreatingPaymentTerms, setIsCreatingPaymentTerms] = useState(false);
+    const [, dispatchAction] = useDocumentById(newNode?.id);
+    const updateRFPDocWithDispatch = () => {
+        dispatchAction(rfpActions.editRfp({
+            title: `RFP-${state.title || ""}`,
+        }));
+    };
+    const updateSOWDocWithDispatch = () => {
+        dispatchAction(sowActions.editScopeOfWork({
+            title: `SOW-${state.title || ""}`,
+        }));
+    };
+    useEffect(() => {
+        if (newNode) {
+            if (newNode.documentType === "powerhouse/rfp") {
+                updateRFPDocWithDispatch();
+            }
+            else if (newNode.documentType === "powerhouse/scopeofwork") {
+                updateSOWDocWithDispatch();
+            }
+            setNewNode(null);
+        }
+    }, [newNode]);
+    const createRfpDocument = useCallback(async () => {
+        if (isCreatingRfp)
+            return null;
+        setIsCreatingRfp(true);
+        try {
+            const createdNode = await addDocument(selectedDrive?.header.id || "", `RFP-${state.title || ""}`, "powerhouse/rfp", undefined, undefined, undefined, "request-for-proposals-editor");
+            console.log("Created RFP document", createdNode);
+            if (createdNode) {
+                setNewNode(createdNode);
+            }
+            return createdNode;
+        }
+        catch (error) {
+            console.error("Failed to create RFP document:", error);
+            return null;
+        }
+        finally {
+            setIsCreatingRfp(false);
+        }
+    }, [isCreatingRfp, selectedDrive?.header.id, state.title]);
+    const createSowDocument = useCallback(async () => {
+        if (isCreatingSow)
+            return null;
+        setIsCreatingSow(true);
+        try {
+            const createdNode = await addDocument(selectedDrive?.header.id || "", `SOW-${state.title || ""}`, "powerhouse/scopeofwork", undefined, undefined, undefined, "scope-of-work-editor");
+            console.log("Created SOW document", createdNode);
+            if (createdNode) {
+                setNewNode(createdNode);
+            }
+            return createdNode;
+        }
+        catch (error) {
+            console.error("Failed to create SOW document:", error);
+            return null;
+        }
+        finally {
+            setIsCreatingSow(false);
+        }
+    }, [isCreatingSow, selectedDrive?.header.id, state.title]);
+    const createPaymentTermsDocument = useCallback(async () => {
+        if (isCreatingPaymentTerms)
+            return null;
+        setIsCreatingPaymentTerms(true);
+        try {
+            const createdNode = await addDocument(selectedDrive?.header.id || "", `Payment Terms-${state.title || ""}`, "payment-terms", undefined, undefined, undefined, "payment-terms-editor");
+            console.log("Created Payment Terms document", createdNode);
+            return createdNode;
+        }
+        catch (error) {
+            console.error("Failed to create Payment Terms document:", error);
+            return null;
+        }
+        finally {
+            setIsCreatingPaymentTerms(false);
+        }
+    }, [isCreatingPaymentTerms, selectedDrive?.header.id, state.title]);
+    const getDocumentNameById = useCallback((documentId) => {
+        const document = useDocumentById(documentId);
+        const [documentData] = document || [];
+        return documentData?.header.name || "";
+    }, [useDocumentById]);
+    // Local state to track manual input values
+    const [manualAuthorInput, setManualAuthorInput] = useState("");
+    // Effect to clear local state when global state is updated
+    useEffect(() => {
+        if (state.initialProposal?.sow && newlyCreatedSowId) {
+            setNewlyCreatedSowId(null);
+        }
+    }, [state.initialProposal?.sow, newlyCreatedSowId]);
+    // Effect to clear local state when global state is updated
+    useEffect(() => {
+        if (state.initialProposal?.paymentTerms && newlyCreatedPaymentTermsId) {
+            setNewlyCreatedPaymentTermsId(null);
+        }
+    }, [state.initialProposal?.paymentTerms, newlyCreatedPaymentTermsId]);
+    // Effect to clear local state when global state is updated
+    useEffect(() => {
+        if (state.rfp?.id && newlyCreatedRfpId) {
+            setNewlyCreatedRfpId(null);
+        }
+    }, [state.rfp?.id, newlyCreatedRfpId]);
+    const allDocuments = useDocumentsInSelectedDrive();
+    let rfpDocumentNode = undefined;
+    if (state.rfp?.id) {
+        rfpDocumentNode = allDocuments?.find((doc) => {
+            return (doc.header.documentType === "powerhouse/rfp" &&
+                doc.header.id === state.rfp?.id);
+        });
+    }
+    // Find SOW document node
+    let sowDocumentNode = undefined;
+    if (state.initialProposal?.sow) {
+        sowDocumentNode = allDocuments?.find((doc) => {
+            return (doc.header.documentType === "powerhouse/scopeofwork" &&
+                doc.header.id === state.initialProposal?.sow);
+        });
+    }
+    // Find Payment Terms document node
+    let paymentTermsDocumentNode = undefined;
+    if (state.initialProposal?.paymentTerms) {
+        paymentTermsDocumentNode = allDocuments?.find((doc) => {
+            return (doc.header.documentType === "payment-terms" &&
+                doc.header.id === state.initialProposal?.paymentTerms);
+        });
+    }
+    // Get RFP document data using useDocumentById hook - always call with stable ID
+    const rfpDocumentId = rfpDocumentNode?.header.id || "";
+    const rfpDocumentData = useDocumentById(rfpDocumentId);
+    const [rfpDocumentDataState] = rfpDocumentData || [];
+    // State to track RFP document
+    const [rfpDocument, setRfpDocument] = useState(undefined);
+    // Effect to update RFP document when nodes or document data changes
+    useEffect(() => {
+        if (rfpDocumentNode &&
+            rfpDocumentNode.header.id &&
+            rfpDocumentNode.header.id !== "" &&
+            rfpDocumentDataState?.state?.global) {
+            const newRfpDocument = {
+                ...rfpDocumentNode,
+                document: (rfpDocumentDataState?.state).global,
+            };
+            // Only update if the ID changed or if we don't have a document yet
+            setRfpDocument((prev) => {
+                if (!prev || prev.header.id !== newRfpDocument.header.id) {
+                    return newRfpDocument;
+                }
+                // Update if the document content changed
+                if (JSON.stringify(prev.document) !==
+                    JSON.stringify(newRfpDocument.document)) {
+                    return newRfpDocument;
+                }
+                return prev;
+            });
+        }
+        else if (!rfpDocumentNode ||
+            !rfpDocumentNode.header.id ||
+            rfpDocumentNode.header.id === "") {
+            setRfpDocument((prev) => (prev === undefined ? prev : undefined));
+        }
+    }, [rfpDocumentNode, rfpDocumentDataState, newlyCreatedRfpId]);
+    const searchRfpDocuments = (userInput) => {
+        const results = allDocuments?.filter((node) => node.header.documentType === "powerhouse/rfp" &&
+            (!userInput ||
+                node.header.name.toLowerCase().includes(userInput.toLowerCase()) ||
+                node.header.id.toLowerCase().includes(userInput.toLowerCase())));
+        return results?.map((doc) => ({
+            value: doc.header.id,
+            title: doc.header.name,
+            path: "",
+        }));
+    };
+    const searchSowDocuments = (userInput) => {
+        const results = allDocuments?.filter((node) => node.header.documentType === "powerhouse/scopeofwork" &&
+            (!userInput ||
+                node.header.name.toLowerCase().includes(userInput.toLowerCase()) ||
+                node.header.id.toLowerCase().includes(userInput.toLowerCase()) ||
+                (node.state?.global?.title
+                    ?.toLowerCase()
+                    .includes(userInput.toLowerCase()) ??
+                    false)));
+        return results?.map((doc) => ({
+            value: doc.header.id,
+            title: doc.state
+                ?.global?.title || doc.header.name,
+            path: "",
+        }));
+    };
+    const searchPaymentTermsDocuments = (userInput) => {
+        const results = allDocuments?.filter((node) => node.header.documentType === "payment-terms" &&
+            (!userInput ||
+                node.header.name.toLowerCase().includes(userInput.toLowerCase()) ||
+                node.header.id.toLowerCase().includes(userInput.toLowerCase())));
+        return results?.map((doc) => ({
+            value: doc.header.id,
+            title: doc.header.name,
+            path: "",
+        }));
+    };
+    // Handle workstream field changes
+    const handleWorkstreamChange = (field, value) => {
+        const action = actions.editWorkstream({
+            [field]: value || undefined,
+        });
+        dispatch(action);
+    };
+    // Handle status change
+    const handleStatusChange = (status) => {
+        const action = actions.editWorkstream({
+            status,
+        });
+        dispatch(action);
+    };
+    // Handle client field changes
+    const handleClientChange = (field, value) => {
+        const clientId = state.client?.id || generateId();
+        const clientInfoUpdate = {
+            clientId,
+        };
+        if (field === "name") {
+            clientInfoUpdate.name = value === "" ? "" : value || undefined;
+            clientInfoUpdate.icon = state.client?.icon || undefined;
+        }
+        else if (field === "icon") {
+            clientInfoUpdate.icon = value === "" ? "" : value || undefined;
+            clientInfoUpdate.name = state.client?.name || undefined;
+        }
+        const action = actions.editClientInfo(clientInfoUpdate);
+        dispatch(action);
+    };
+    // Handle client ID change
+    const handleClientIdChange = (clientId) => {
+        const action = actions.editClientInfo({
+            clientId,
+            name: state.client?.name || undefined,
+            icon: state.client?.icon || undefined,
+        });
+        dispatch(action);
+    };
+    const alternativeProposalsData = useMemo(() => {
+        return state.alternativeProposals.flatMap((p) => [
+            {
+                ...p,
+                authorName: p.author.name,
+                authorId: p.author.id,
+                authorIcon: p.author.icon,
+            },
+        ]);
+    }, [state.alternativeProposals]);
+    const getSowOptionById = useCallback((documentId) => {
+        if (!documentId)
+            return undefined;
+        const doc = allDocuments?.find((document) => {
+            return (document.header.documentType === "powerhouse/scopeofwork" &&
+                document.header.id === documentId);
+        });
+        if (!doc)
+            return undefined;
+        const title = doc.state?.global?.title;
+        return {
+            value: doc.header.id,
+            title: title || doc.header.name,
+            path: {
+                text: doc.header.name,
+                url: doc.header.id,
+            },
+            description: "",
+        };
+    }, [allDocuments]);
+    const getPaymentTermsOptionById = useCallback((documentId) => {
+        if (!documentId)
+            return undefined;
+        const doc = allDocuments?.find((document) => {
+            return (document.header.documentType === "payment-terms" &&
+                document.header.id === documentId);
+        });
+        if (!doc)
+            return undefined;
+        return {
+            value: doc.header.id,
+            title: doc.header.name,
+            path: {
+                text: doc.header.name,
+                url: doc.header.id,
+            },
+            description: "",
+        };
+    }, [allDocuments]);
+    const alternativeProposalsColumns = useMemo(() => [
+        {
+            field: "authorName",
+            title: "Author",
+            editable: true,
+            onSave: (newValue, context) => {
+                if (newValue !== context.row.author.name) {
+                    dispatch(actions.editAlternativeProposal({
+                        id: context.row.id,
+                        proposalAuthor: {
+                            id: context.row.author.id,
+                            name: newValue,
+                        },
+                    }));
+                    return true;
+                }
+                return false;
+            },
+            renderCell: (value) => {
+                if (value === undefined) {
+                    return (_jsx("div", { className: "text-left text-xs font-light italic text-gray-500", children: "+ Double-click to add new author" }));
+                }
+                return _jsx("div", { className: "text-left", children: value });
+            },
+        },
+        {
+            field: "sow",
+            title: "SOW",
+            type: "phid",
+            editable: true,
+            align: "center",
+            onSave: (newValue, context) => {
+                if (newValue !== context.row.sow) {
+                    dispatch(actions.editAlternativeProposal({
+                        id: context.row.id,
+                        sowId: newValue,
+                    }));
+                    return true;
+                }
+                return false;
+            },
+            renderCellEditor: (value, onChange, context) => {
+                const currentValue = value || "";
+                const initialOption = getSowOptionById(currentValue);
+                return (_jsx(PHIDInput, { value: currentValue, onChange: (newValue) => {
+                        onChange(newValue);
+                    }, onBlur: (e) => {
+                        if (e.target.value !== context.row.sow) {
+                            dispatch(actions.editAlternativeProposal({
+                                id: context.row.id,
+                                sowId: e.target.value,
+                            }));
+                        }
+                    }, placeholder: "Search for SOW Document", className: "w-full", variant: "withValueTitleAndDescription", initialOptions: initialOption ? [initialOption] : undefined, fetchOptionsCallback: async (userInput) => {
+                        const results = searchSowDocuments(userInput || "") || [];
+                        if (results.length === 0) {
+                            return Promise.reject(new Error("No SOW documents found"));
+                        }
+                        return results.map((doc) => ({
+                            value: doc.value,
+                            title: doc.title,
+                            path: {
+                                text: doc.path,
+                                url: doc.value,
+                            },
+                            description: "",
+                        }));
+                    }, fetchSelectedOptionCallback: async (documentId) => {
+                        const doc = searchSowDocuments(documentId)?.[0];
+                        if (!doc) {
+                            return Promise.reject(new Error("SOW document not found"));
+                        }
+                        return {
+                            value: doc.value,
+                            title: doc.title,
+                            path: {
+                                text: doc.path,
+                                url: doc.value,
+                            },
+                            description: "",
+                        };
+                    } }));
+            },
+            renderCell: (value) => {
+                if (!value)
+                    return null;
+                return _jsx("div", { className: "text-left", children: getDocumentNameById(value) });
+            },
+        },
+        {
+            field: "paymentTerms",
+            title: "Payment Terms",
+            type: "phid",
+            editable: true,
+            align: "center",
+            onSave: (newValue, context) => {
+                if (newValue !== context.row.paymentTerms) {
+                    dispatch(actions.editAlternativeProposal({
+                        id: context.row.id,
+                        paymentTermsId: newValue,
+                    }));
+                    return true;
+                }
+                return false;
+            },
+            renderCellEditor: (value, onChange, context) => {
+                const currentValue = value || "";
+                const initialOption = getPaymentTermsOptionById(currentValue);
+                return (_jsx(PHIDInput, { value: currentValue, onChange: (newValue) => {
+                        onChange(newValue);
+                    }, onBlur: (e) => {
+                        if (e.target.value !== context.row.paymentTerms) {
+                            dispatch(actions.editAlternativeProposal({
+                                id: context.row.id,
+                                paymentTermsId: e.target.value,
+                            }));
+                        }
+                    }, placeholder: "Search for Payment Terms Document", className: "w-full", variant: "withValueTitleAndDescription", initialOptions: initialOption ? [initialOption] : undefined, fetchOptionsCallback: async (userInput) => {
+                        const results = searchPaymentTermsDocuments(userInput || "") || [];
+                        if (results.length === 0) {
+                            return Promise.reject(new Error("No Payment Terms documents found"));
+                        }
+                        return results.map((doc) => ({
+                            value: doc.value,
+                            title: doc.title,
+                            path: {
+                                text: doc.path,
+                                url: doc.value,
+                            },
+                            description: "",
+                        }));
+                    }, fetchSelectedOptionCallback: async (documentId) => {
+                        const doc = searchPaymentTermsDocuments(documentId)?.[0];
+                        if (!doc) {
+                            return Promise.reject(new Error("Payment Terms document not found"));
+                        }
+                        return {
+                            value: doc.value,
+                            title: doc.title,
+                            path: {
+                                text: doc.path,
+                                url: doc.value,
+                            },
+                            description: "",
+                        };
+                    } }));
+            },
+            renderCell: (value) => {
+                if (!value)
+                    return null;
+                return _jsx("div", { className: "text-left", children: getDocumentNameById(value) });
+            },
+        },
+        {
+            field: "status",
+            title: "Status",
+            editable: true,
+            align: "center",
+            type: "enum",
+            valueGetter: (row) => row.status,
+            onSave: (newValue, context) => {
+                if (newValue !== context.row.status) {
+                    dispatch(actions.editAlternativeProposal({
+                        id: context.row.id,
+                        status: newValue,
+                    }));
+                    return true;
+                }
+                return false;
+            },
+            renderCellEditor: buildEnumCellEditor({
+                className: "w-[130px]",
+                options: [
+                    { value: "DRAFT", label: "Draft" },
+                    { value: "SUBMITTED", label: "Submitted" },
+                    { value: "ACCEPTED", label: "Accepted" },
+                    { value: "REJECTED", label: "Rejected" },
+                ],
+            }),
+            renderCell: (value) => {
+                if (!value)
+                    return null;
+                return (_jsx("div", { className: `text-center ${statusStyles[value]}`, children: value }));
+            },
+        },
+    ], [
+        dispatch,
+        getPaymentTermsOptionById,
+        getSowOptionById,
+        searchPaymentTermsDocuments,
+        searchSowDocuments,
+    ]);
+    return (_jsxs("div", { className: "w-full bg-gray-50", children: [_jsx(DocumentToolbar, {}), _jsxs("div", { className: "mx-auto min-h-screen max-w-4xl p-6", children: [_jsx("div", { className: "mb-6 rounded-lg bg-white p-6 shadow-sm", children: _jsx("h1", { className: "mb-2 text-3xl font-bold text-gray-900", children: "Workstream" }) }), _jsx("div", { className: "mb-6 rounded-lg bg-white p-6 shadow-sm", children: _jsxs("div", { className: "flex flex-row gap-6", children: [_jsxs("div", { className: "flex-1", children: [_jsx("label", { className: "mb-2 block text-sm font-medium text-gray-700", children: "Code" }), _jsx(TextInput, { className: "w-full", defaultValue: state.code || "", onBlur: (e) => {
+                                                if (e.target.value !== state.code) {
+                                                    handleWorkstreamChange("code", e.target.value);
+                                                }
+                                            }, placeholder: "Enter workstream code" })] }), _jsxs("div", { className: "flex-1", children: [_jsx("label", { className: "mb-2 block text-sm font-medium text-gray-700", children: "Title" }), _jsx(TextInput, { className: "w-full", defaultValue: state.title || "", onBlur: (e) => {
+                                                if (e.target.value !== state.title) {
+                                                    handleWorkstreamChange("title", e.target.value);
+                                                }
+                                            }, placeholder: "Enter workstream title" })] }), _jsx("div", { className: "flex-1", children: _jsx(Select, { label: "Status", options: statusOptions, value: state.status, onChange: (value) => handleStatusChange(value) }) })] }) }), _jsxs("div", { className: "rounded-lg border border-gray-300 bg-white p-6 shadow-sm", children: [_jsx("h2", { className: "mb-4 text-lg font-medium text-gray-900", children: "Client" }), _jsxs("div", { className: "space-y-4", children: [_jsxs("div", { children: [_jsx("label", { className: "mb-2 block text-sm font-medium text-gray-700", children: "Client ID" }), _jsxs("div", { className: "flex items-center space-x-2", children: [_jsx("div", { className: "flex-shrink-0", children: _jsx("svg", { className: "h-5 w-5 text-gray-400", fill: "currentColor", viewBox: "0 0 20 20", children: _jsx("path", { fillRule: "evenodd", d: "M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z", clipRule: "evenodd" }) }) }), _jsx(TextInput, { className: "flex-1", defaultValue: state.client?.id || "", onBlur: (e) => {
+                                                            if (e.target.value !== state.client?.id) {
+                                                                handleClientIdChange(e.target.value);
+                                                            }
+                                                        }, placeholder: "Enter client ID" }), _jsx("div", { className: "flex-shrink-0", children: _jsx("svg", { className: "h-5 w-5 text-gray-400", fill: "currentColor", viewBox: "0 0 20 20", children: _jsx("path", { fillRule: "evenodd", d: "M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z", clipRule: "evenodd" }) }) })] })] }), _jsxs("div", { children: [_jsx("label", { className: "mb-2 block text-sm font-medium text-gray-700", children: "Name" }), _jsx(TextInput, { className: "w-full", defaultValue: state.client?.name || "", onBlur: (e) => {
+                                                    if (e.target.value !== state.client?.name) {
+                                                        handleClientChange("name", e.target.value);
+                                                    }
+                                                }, placeholder: "Enter client name" })] }), _jsxs("div", { children: [_jsx("label", { className: "mb-2 block text-sm font-medium text-gray-700", children: "Icon" }), _jsxs("div", { className: "flex items-center space-x-2", children: [_jsx("div", { className: "flex-shrink-0", children: _jsx("svg", { className: "h-5 w-5 text-gray-400", fill: "currentColor", viewBox: "0 0 20 20", children: _jsx("path", { fillRule: "evenodd", d: "M4.083 9h1.946c.089-1.546.383-2.97.837-4.118A6.004 6.004 0 004.083 9zM10 2a8 8 0 100 16 8 8 0 000-16zm0 2c-.076 0-.232.032-.465.262-.238.234-.497.623-.737 1.182-.389.907-.673 2.142-.766 3.556h3.936c-.093-1.414-.377-2.649-.766-3.556-.24-.56-.5-.948-.737-1.182C10.232 4.032 10.076 4 10 4zm3.971 5c-.089-1.546-.383-2.97-.837-4.118A6.004 6.004 0 0115.917 9h-1.946zm-2.003 2H8.032c.093 1.414.377 2.649.766 3.556.24.56.5.948.737 1.182.233.23.389.262.465.262.076 0 .232-.032.465-.262.238-.234.498-.623.737-1.182.389-.907.673-2.142.766-3.556zm1.166 4.118c.454-1.147.748-2.572.837-4.118h1.946a6.004 6.004 0 01-2.783 4.118zm-6.268 0C6.412 13.97 6.118 12.546 6.03 11H4.083a6.004 6.004 0 002.783 4.118z", clipRule: "evenodd" }) }) }), _jsxs("div", { className: "flex items-center space-x-2", children: [_jsx(TextInput, { className: "flex-1", defaultValue: state.client?.icon || "", onBlur: (e) => {
+                                                                    if (e.target.value !== state.client?.icon) {
+                                                                        handleClientChange("icon", e.target.value);
+                                                                    }
+                                                                }, placeholder: "Enter client icon URL" }), state.client?.icon ? (_jsx("img", { src: state.client?.icon, alt: "Client Icon", className: "h-10 w-10 object-cover" })) : ("")] })] })] })] })] }), _jsxs("div", { className: "mb-6 mt-6 rounded-lg bg-white p-6 shadow-sm", children: [_jsx("h1", { className: "mb-4 text-2xl text-gray-900", children: "Request for Proposal" }), _jsx("div", { className: "flex w-full flex-row items-center gap-8", children: _jsx("div", { className: "w-[350px]", children: _jsx(OIDInput, { name: "Request for Proposal", label: "RFP Document", placeholder: "Search for RFP Document", variant: "withValueTitleAndDescription", value: newlyCreatedRfpId || state.rfp?.id || "", onBlur: (e) => {
+                                            if (e.target.value !== state.rfp?.id) {
+                                                dispatch(actions.setRequestForProposal({
+                                                    rfpId: e.target.value,
+                                                    title: rfpDocument?.document.title || "",
+                                                }));
+                                            }
+                                        }, 
+                                        // search options as the user types
+                                        fetchOptionsCallback: async (userInput) => {
+                                            const results = searchRfpDocuments(userInput || "") || [];
+                                            if (results?.length === 0) {
+                                                return Promise.reject(new Error("No RFP documents found"));
+                                            }
+                                            return results?.map((doc) => ({
+                                                value: doc.value,
+                                                title: doc.title,
+                                                path: {
+                                                    text: doc.path,
+                                                    url: doc.value,
+                                                },
+                                                description: "",
+                                                icon: "File",
+                                            }));
+                                        }, 
+                                        // get details of a specific option by its ID/value
+                                        fetchSelectedOptionCallback: async (documentId) => {
+                                            console.log("fetching selected option", documentId);
+                                            const doc = searchRfpDocuments(documentId)?.[0];
+                                            if (!doc) {
+                                                return Promise.reject(new Error("RFP document not found"));
+                                            }
+                                            return {
+                                                value: doc.value,
+                                                title: doc.title,
+                                                path: {
+                                                    text: doc.path,
+                                                    url: doc.title,
+                                                },
+                                                description: "",
+                                                icon: "File",
+                                            };
+                                        }, initialOptions: [
+                                            {
+                                                value: rfpDocument?.header.id || "",
+                                                title: rfpDocument?.document.title || "",
+                                                path: {
+                                                    text: rfpDocument?.document.title || "",
+                                                    url: rfpDocument?.header.id || "",
+                                                },
+                                                description: "",
+                                                icon: "File",
+                                            },
+                                        ] }) }) }), !rfpDocument ? (_jsx("div", { className: "mt-4", children: _jsx(Button, { color: "light", className: "cursor-pointer hover:bg-gray-600 hover:text-white disabled:cursor-not-allowed disabled:opacity-50", title: "Save Workstream", "aria-description": "Save Workstream", disabled: isCreatingRfp, onClick: async () => {
+                                        const createdNode = await createRfpDocument();
+                                        if (createdNode) {
+                                            setNewlyCreatedRfpId(createdNode.id);
+                                            dispatch(actions.setRequestForProposal({
+                                                rfpId: createdNode.id,
+                                                title: createdNode.name,
+                                            }));
+                                        }
+                                    }, children: isCreatingRfp ? "Creating..." : "Create RFP Document" }) })) : ("")] }), rfpDocument ? (_jsx("div", { children: state.initialProposal ? (_jsxs("div", { className: "mb-6 rounded-lg bg-white p-6 shadow-sm", children: [_jsx("h1", { className: "mb-4 text-2xl text-gray-900", children: "Initial Proposal" }), _jsxs("div", { className: "mb-6 flex flex-row gap-4", children: [_jsx("div", { className: "flex-1", children: _jsx(TextInput, { label: "Author", value: manualAuthorInput ||
+                                                    state.initialProposal?.author?.name ||
+                                                    "", onChange: (e) => {
+                                                    setManualAuthorInput(e.target.value);
+                                                }, onBlur: (e) => {
+                                                    if (e.target.value !== state.initialProposal?.author?.name) {
+                                                        dispatch(actions.editInitialProposal({
+                                                            id: state.initialProposal?.id || "",
+                                                            proposalAuthor: {
+                                                                id: generateId(),
+                                                                name: e.target.value,
+                                                            },
+                                                        }));
+                                                    }
+                                                } }) }), _jsx("div", { className: "flex-1", children: _jsx(Select, { label: "Status", options: [
+                                                    { value: "DRAFT", label: "Draft" },
+                                                    { value: "SUBMITTED", label: "Submitted" },
+                                                    { value: "ACCEPTED", label: "Accepted" },
+                                                    { value: "REJECTED", label: "Rejected" },
+                                                ], value: state.initialProposal.status || "DRAFT", onChange: (value) => {
+                                                    if (value !== state.initialProposal?.status) {
+                                                        dispatch(actions.editInitialProposal({
+                                                            id: state.initialProposal?.id || "",
+                                                            status: value,
+                                                        }));
+                                                    }
+                                                } }) })] }), _jsxs("div", { className: "mb-6 flex flex-row gap-4", children: [_jsxs("div", { className: "flex-1", children: [_jsx(OIDInput, { name: "Scope of Work", label: "Scope Of Work", placeholder: "Search for SOW Document", variant: "withValueTitleAndDescription", value: newlyCreatedSowId || state.initialProposal?.sow || "", onBlur: (e) => {
+                                                        if (e.target.value !== state.initialProposal?.sow) {
+                                                            dispatch(actions.editInitialProposal({
+                                                                id: state.initialProposal?.id || "",
+                                                                sowId: e.target.value,
+                                                            }));
+                                                        }
+                                                    }, 
+                                                    // search options as the user types
+                                                    fetchOptionsCallback: async (userInput) => {
+                                                        const results = searchSowDocuments(userInput || "") || [];
+                                                        if (results?.length === 0) {
+                                                            return Promise.reject(new Error("No SOW documents found"));
+                                                        }
+                                                        return results?.map((doc) => ({
+                                                            value: doc.value,
+                                                            title: doc.title,
+                                                            path: {
+                                                                text: doc.path,
+                                                                url: doc.value,
+                                                            },
+                                                            description: "",
+                                                            icon: "File",
+                                                        }));
+                                                    }, 
+                                                    // get details of a specific option by its ID/value
+                                                    fetchSelectedOptionCallback: async (documentId) => {
+                                                        const doc = searchSowDocuments(documentId)?.[0];
+                                                        if (!doc) {
+                                                            return Promise.reject(new Error("SOW document not found"));
+                                                        }
+                                                        return {
+                                                            value: doc.value,
+                                                            title: doc.title,
+                                                            path: {
+                                                                text: doc.path,
+                                                                url: doc.title,
+                                                            },
+                                                            description: "",
+                                                            icon: "File",
+                                                        };
+                                                    }, initialOptions: sowDocumentNode
+                                                        ? [
+                                                            {
+                                                                value: sowDocumentNode.header.id,
+                                                                title: sowDocumentNode.state?.global?.title ||
+                                                                    sowDocumentNode.header.name,
+                                                                path: {
+                                                                    text: sowDocumentNode.header.name,
+                                                                    url: sowDocumentNode.header.id,
+                                                                },
+                                                                description: "",
+                                                                icon: "File",
+                                                            },
+                                                        ]
+                                                        : undefined }), _jsx("button", { className: "mt-1 rounded-md bg-gray-100 p-1 text-sm hover:bg-gray-200 disabled:cursor-not-allowed disabled:opacity-50", disabled: isCreatingSow, onClick: async () => {
+                                                        console.log("Creating sow");
+                                                        const createdNode = await createSowDocument();
+                                                        if (createdNode) {
+                                                            setNewlyCreatedSowId(createdNode.id);
+                                                            dispatch(actions.editInitialProposal({
+                                                                id: state.initialProposal?.id || "",
+                                                                sowId: createdNode.id,
+                                                            }));
+                                                        }
+                                                    }, children: isCreatingSow ? "Creating..." : "Create sow" })] }), _jsxs("div", { className: "flex-1", children: [_jsx(OIDInput, { name: "Payment Terms", label: "Payment Terms", placeholder: "Search for Payment Terms Document", variant: "withValueTitleAndDescription", value: newlyCreatedPaymentTermsId ||
+                                                        state.initialProposal?.paymentTerms ||
+                                                        "", onBlur: (e) => {
+                                                        if (e.target.value !== state.initialProposal?.paymentTerms) {
+                                                            dispatch(actions.editInitialProposal({
+                                                                id: state.initialProposal?.id || "",
+                                                                paymentTermsId: e.target.value,
+                                                            }));
+                                                        }
+                                                    }, 
+                                                    // search options as the user types
+                                                    fetchOptionsCallback: async (userInput) => {
+                                                        const results = searchPaymentTermsDocuments(userInput || "") || [];
+                                                        if (results?.length === 0) {
+                                                            return Promise.reject(new Error("No Payment Terms documents found"));
+                                                        }
+                                                        return results?.map((doc) => ({
+                                                            value: doc.value,
+                                                            title: doc.title,
+                                                            path: {
+                                                                text: doc.path,
+                                                                url: doc.value,
+                                                            },
+                                                            description: "",
+                                                            icon: "File",
+                                                        }));
+                                                    }, 
+                                                    // get details of a specific option by its ID/value
+                                                    fetchSelectedOptionCallback: async (documentId) => {
+                                                        const doc = searchPaymentTermsDocuments(documentId)?.[0];
+                                                        if (!doc) {
+                                                            return Promise.reject(new Error("Payment Terms document not found"));
+                                                        }
+                                                        return {
+                                                            value: doc.value,
+                                                            title: doc.title,
+                                                            path: {
+                                                                text: doc.path,
+                                                                url: doc.title,
+                                                            },
+                                                            description: "",
+                                                            icon: "File",
+                                                        };
+                                                    }, initialOptions: paymentTermsDocumentNode
+                                                        ? [
+                                                            {
+                                                                value: paymentTermsDocumentNode.header.id,
+                                                                title: paymentTermsDocumentNode.header.name,
+                                                                path: {
+                                                                    text: paymentTermsDocumentNode.header.name,
+                                                                    url: paymentTermsDocumentNode.header.id,
+                                                                },
+                                                                description: "",
+                                                                icon: "File",
+                                                            },
+                                                        ]
+                                                        : undefined }), _jsx("button", { className: "mt-1 rounded-md bg-gray-100 p-1 text-sm hover:bg-gray-200 disabled:cursor-not-allowed disabled:opacity-50", disabled: isCreatingPaymentTerms, onClick: async () => {
+                                                        console.log("Creating payment terms");
+                                                        const createdNode = await createPaymentTermsDocument();
+                                                        if (createdNode) {
+                                                            setNewlyCreatedPaymentTermsId(createdNode.id);
+                                                            dispatch(actions.editInitialProposal({
+                                                                id: state.initialProposal?.id || "",
+                                                                paymentTermsId: createdNode.id,
+                                                            }));
+                                                        }
+                                                    }, children: isCreatingPaymentTerms
+                                                        ? "Creating..."
+                                                        : "Create Payment Terms" })] })] }), _jsxs("div", { children: [_jsx("h2", { className: "mb-4 text-lg font-medium text-gray-900", children: "Alternative Proposals" }), _jsx(ObjectSetTable, { columns: alternativeProposalsColumns, data: alternativeProposalsData, allowRowSelection: true, onDelete: (data) => {
+                                                if (data.length > 0) {
+                                                    data.forEach((d) => {
+                                                        dispatch(actions.removeAlternativeProposal({
+                                                            id: d.id,
+                                                        }));
+                                                    });
+                                                }
+                                            }, onAdd: (data) => {
+                                                if (data.authorName) {
+                                                    dispatch(actions.addAlternativeProposal({
+                                                        id: generateId(),
+                                                        proposalAuthor: {
+                                                            id: generateId(),
+                                                            name: data.authorName,
+                                                        },
+                                                    }));
+                                                }
+                                            } })] })] })) : (_jsxs("div", { className: "mb-6 rounded-lg bg-white p-6 shadow-sm", children: [_jsx("h1", { className: "mb-4 text-2xl text-gray-900", children: "Initial Proposal" }), _jsx("div", { className: "mt-4", children: _jsx(Button, { color: "light", className: "cursor-pointer hover:bg-gray-600 hover:text-white", title: "Create Initial Proposal", "aria-description": "Create Initial Proposal", onClick: () => {
+                                            console.log("Creating initial proposal");
+                                            dispatch(actions.editInitialProposal({
+                                                id: generateId(),
+                                            }));
+                                        }, children: "Create Initial Proposal" }) })] })) })) : null, _jsx(ToastContainer, {})] })] }));
+}