medusajs-documents-plugin 1.1.49 → 1.1.51

package/.medusa/server/src/admin/index.js

@@ -422,6 +422,18 @@ const DocumentsPage = () => {
   const [customDocModalOpen, setCustomDocModalOpen] = react.useState(false);
   const [sendModalOpen, setSendModalOpen] = react.useState(false);
   const [selectedDoc, setSelectedDoc] = react.useState(null);
+  const [editModalOpen, setEditModalOpen] = react.useState(false);
+  const [editingDoc, setEditingDoc] = react.useState(null);
+  const [isUpdatingDoc, setIsUpdatingDoc] = react.useState(false);
+  const [editForm, setEditForm] = react.useState({
+    title: "",
+    customer_name: "",
+    customer_email: "",
+    customer_phone: "",
+    notes: "",
+    terms: "",
+    items: []
+  });
   const [settings, setSettings] = react.useState({
     company_name: "Store",
     storefront_url: "",
@@ -983,6 +995,77 @@ const DocumentsPage = () => {
       alert("Error sending notification.");
     }
   };
+  const handleOpenEditModal = (doc) => {
+    setEditingDoc(doc);
+    let meta = doc.metadata || {};
+    if (typeof meta === "string") {
+      try {
+        meta = JSON.parse(meta);
+      } catch (_) {
+        meta = {};
+      }
+    }
+    const docItems = Array.isArray(meta == null ? void 0 : meta.items) && meta.items.length > 0 ? meta.items.map((it) => ({
+      title: it.title || it.name || "Item",
+      description: it.description || "",
+      quantity: Number(it.quantity || 1),
+      unit_price: Number(it.unit_price || it.rate || 0)
+    })) : [
+      {
+        title: doc.title || "Service / Goods",
+        description: "",
+        quantity: 1,
+        unit_price: Number(doc.total_amount || 0)
+      }
+    ];
+    setEditForm({
+      title: doc.title || (doc.type === "invoice" ? "Tax Invoice" : "Quotation"),
+      customer_name: doc.customer_name || "",
+      customer_email: doc.customer_email || "",
+      customer_phone: doc.customer_phone || "",
+      notes: (meta == null ? void 0 : meta.notes) || "",
+      terms: (meta == null ? void 0 : meta.terms) || "",
+      items: docItems
+    });
+    setEditModalOpen(true);
+  };
+  const handleSaveEditDocument = async (e) => {
+    if (!editingDoc) return;
+    setIsUpdatingDoc(true);
+    try {
+      const calculatedTotal = editForm.items.reduce(
+        (sum, it) => sum + Number(it.quantity || 1) * Number(it.unit_price || 0),
+        0
+      );
+      const res = await fetch(`/admin/documents/${editingDoc.id}`, {
+        method: "PUT",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({
+          title: editForm.title,
+          customer_name: editForm.customer_name,
+          customer_email: editForm.customer_email,
+          customer_phone: editForm.customer_phone,
+          notes: editForm.notes,
+          terms: editForm.terms,
+          items: editForm.items,
+          total: calculatedTotal
+        })
+      });
+      const data = await res.json();
+      if (!res.ok || data.error) {
+        throw new Error(data.message || "Failed to update document");
+      }
+      setEditModalOpen(false);
+      setEditingDoc(null);
+      await loadDocuments();
+      alert("Document updated successfully and synced with Zoho Books!");
+    } catch (err) {
+      alert(`Error updating document: ${err.message}`);
+    } finally {
+      setIsUpdatingDoc(false);
+    }
+  };
   const handleSyncToZoho = async (docId) => {
     try {
       const res = await fetch(`/admin/documents/${docId}/sync-zoho`, {
@@ -1365,6 +1448,16 @@ const DocumentsPage = () => {
                         children: /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownTray, { className: "w-4 h-4" })
                       }
                     ),
+                    (doc.type === "invoice" || doc.type === "estimate" || doc.type === "quote") && /* @__PURE__ */ jsxRuntime.jsx(
+                      "button",
+                      {
+                        type: "button",
+                        onClick: () => handleOpenEditModal(doc),
+                        className: "p-1.5 rounded hover:bg-ui-bg-subtle text-ui-fg-subtle hover:text-purple-600 cursor-pointer",
+                        title: "Edit Quote / Invoice & Sync with Zoho Books",
+                        children: /* @__PURE__ */ jsxRuntime.jsx(icons.PencilSquare, { className: "w-4 h-4" })
+                      }
+                    ),
                     /* @__PURE__ */ jsxRuntime.jsx(
                       "button",
                       {
@@ -1512,6 +1605,16 @@ const DocumentsPage = () => {
                           children: /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownTray, { className: "w-3.5 h-3.5" })
                         }
                       ),
+                      (subDoc.type === "invoice" || subDoc.type === "estimate" || subDoc.type === "quote") && /* @__PURE__ */ jsxRuntime.jsx(
+                        "button",
+                        {
+                          type: "button",
+                          onClick: () => handleOpenEditModal(subDoc),
+                          className: "p-1 rounded hover:bg-ui-bg-subtle text-ui-fg-subtle hover:text-purple-600",
+                          title: "Edit Quote / Invoice & Sync with Zoho Books",
+                          children: /* @__PURE__ */ jsxRuntime.jsx(icons.PencilSquare, { className: "w-3.5 h-3.5" })
+                        }
+                      ),
                       /* @__PURE__ */ jsxRuntime.jsx(
                         "button",
                         {
@@ -1607,6 +1710,16 @@ const DocumentsPage = () => {
                   children: /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownTray, { className: "w-4 h-4" })
                 }
               ),
+              (doc.type === "invoice" || doc.type === "estimate" || doc.type === "quote") && /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => handleOpenEditModal(doc),
+                  className: "p-1.5 rounded hover:bg-ui-bg-subtle text-ui-fg-subtle hover:text-purple-600 cursor-pointer",
+                  title: "Edit Quote / Invoice & Sync with Zoho Books",
+                  children: /* @__PURE__ */ jsxRuntime.jsx(icons.PencilSquare, { className: "w-4 h-4" })
+                }
+              ),
               /* @__PURE__ */ jsxRuntime.jsx(
                 "button",
                 {
@@ -3977,6 +4090,241 @@ Your *{document_title} #{display_id}* has been generated.
           )
         ] }) })
       ] })
+    ] }) }),
+    editModalOpen && editingDoc && /* @__PURE__ */ jsxRuntime.jsx(ui.FocusModal, { open: editModalOpen, onOpenChange: setEditModalOpen, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.FocusModal.Content, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.FocusModal.Header, { className: "flex items-center justify-between px-6 py-4 border-b border-ui-border-base", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(icons.PencilSquare, { className: "w-5 h-5 text-purple-600" }),
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Heading, { level: "h2", children: [
+            "Edit ",
+            editingDoc.type === "invoice" ? "Invoice" : "Quote / Estimate",
+            " #",
+            editingDoc.display_id
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { color: "purple", size: "small", children: "Zoho Synced" })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ui.Button,
+            {
+              variant: "secondary",
+              size: "small",
+              onClick: () => setEditModalOpen(false),
+              disabled: isUpdatingDoc,
+              children: "Cancel"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ui.Button,
+            {
+              variant: "primary",
+              size: "small",
+              onClick: () => handleSaveEditDocument(),
+              isLoading: isUpdatingDoc,
+              disabled: isUpdatingDoc,
+              className: "bg-purple-600 hover:bg-purple-700 text-white",
+              children: "Save & Sync to Zoho Books"
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.FocusModal.Body, { className: "p-6 flex flex-col gap-6 max-w-3xl mx-auto overflow-y-auto max-h-[80vh]", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { className: "text-xs", children: "Document Title" }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Input,
+              {
+                value: editForm.title,
+                onChange: (e) => setEditForm({ ...editForm, title: e.target.value }),
+                size: "small"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { className: "text-xs", children: "Customer Name" }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Input,
+              {
+                value: editForm.customer_name,
+                onChange: (e) => setEditForm({ ...editForm, customer_name: e.target.value }),
+                size: "small"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { className: "text-xs", children: "Customer Email" }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Input,
+              {
+                value: editForm.customer_email,
+                onChange: (e) => setEditForm({ ...editForm, customer_email: e.target.value }),
+                size: "small"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { className: "text-xs", children: "Customer Phone" }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Input,
+              {
+                value: editForm.customer_phone,
+                onChange: (e) => setEditForm({ ...editForm, customer_phone: e.target.value }),
+                size: "small"
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { className: "text-xs font-semibold", children: "Itemized Line Items" }),
+            /* @__PURE__ */ jsxRuntime.jsxs(
+              ui.Button,
+              {
+                variant: "secondary",
+                size: "small",
+                onClick: () => setEditForm({
+                  ...editForm,
+                  items: [
+                    ...editForm.items,
+                    { title: "", description: "", quantity: 1, unit_price: 0 }
+                  ]
+                }),
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(icons.Plus, { className: "w-3.5 h-3.5 mr-1" }),
+                  " Add Line Item"
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: editForm.items.map((it, idx) => /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              className: "p-3 border border-ui-border-base rounded-lg bg-ui-bg-base flex flex-col gap-2",
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-12 gap-2 items-start", children: [
+                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-6 flex flex-col gap-1", children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { className: "text-[11px] text-ui-fg-subtle", children: "Item Title *" }),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      ui.Input,
+                      {
+                        placeholder: "Item name / Service",
+                        value: it.title,
+                        onChange: (e) => {
+                          const newItems = [...editForm.items];
+                          newItems[idx] = { ...newItems[idx], title: e.target.value };
+                          setEditForm({ ...editForm, items: newItems });
+                        },
+                        size: "small"
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-2 flex flex-col gap-1", children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { className: "text-[11px] text-ui-fg-subtle", children: "Qty" }),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      ui.Input,
+                      {
+                        type: "number",
+                        min: "1",
+                        value: it.quantity,
+                        onChange: (e) => {
+                          const newItems = [...editForm.items];
+                          newItems[idx] = { ...newItems[idx], quantity: Number(e.target.value) || 1 };
+                          setEditForm({ ...editForm, items: newItems });
+                        },
+                        size: "small"
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-3 flex flex-col gap-1", children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { className: "text-[11px] text-ui-fg-subtle", children: "Unit Price" }),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      ui.Input,
+                      {
+                        type: "number",
+                        step: "0.01",
+                        value: it.unit_price,
+                        onChange: (e) => {
+                          const newItems = [...editForm.items];
+                          newItems[idx] = { ...newItems[idx], unit_price: Number(e.target.value) || 0 };
+                          setEditForm({ ...editForm, items: newItems });
+                        },
+                        size: "small"
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-1 pt-6 flex justify-end", children: /* @__PURE__ */ jsxRuntime.jsx(
+                    ui.Button,
+                    {
+                      variant: "transparent",
+                      size: "small",
+                      onClick: () => {
+                        const newItems = editForm.items.filter((_, i) => i !== idx);
+                        setEditForm({ ...editForm, items: newItems });
+                      },
+                      className: "text-ui-fg-muted hover:text-ui-fg-error p-1",
+                      children: /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "w-4 h-4" })
+                    }
+                  ) })
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { className: "text-[11px] text-ui-fg-subtle", children: "Description (Optional)" }),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    ui.Input,
+                    {
+                      placeholder: "Optional item details / specifications",
+                      value: it.description,
+                      onChange: (e) => {
+                        const newItems = [...editForm.items];
+                        newItems[idx] = { ...newItems[idx], description: e.target.value };
+                        setEditForm({ ...editForm, items: newItems });
+                      },
+                      size: "small"
+                    }
+                  )
+                ] })
+              ]
+            },
+            idx
+          )) }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end items-center gap-4 py-2 border-t border-ui-border-base", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-xs text-ui-fg-subtle", children: "Calculated Total:" }),
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-sm font-semibold", children: formatCurrency(
+              editForm.items.reduce(
+                (sum, it) => sum + (Number(it.quantity) || 1) * (Number(it.unit_price) || 0),
+                0
+              ),
+              editingDoc.currency_code || "KES"
+            ) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { className: "text-xs", children: "Notes / Client Remarks" }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Textarea,
+              {
+                value: editForm.notes,
+                onChange: (e) => setEditForm({ ...editForm, notes: e.target.value }),
+                rows: 3,
+                placeholder: "Notes visible on the document..."
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { className: "text-xs", children: "Terms & Conditions" }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Textarea,
+              {
+                value: editForm.terms,
+                onChange: (e) => setEditForm({ ...editForm, terms: e.target.value }),
+                rows: 3,
+                placeholder: "Terms and conditions..."
+              }
+            )
+          ] })
+        ] })
+      ] })
     ] }) })
   ] });
 };