UNPKG

medusa-plugin-paypal

Version:
130 lines (129 loc) 4.78 kB
import { jsx, jsxs } from "react/jsx-runtime"; import { defineWidgetConfig } from "@medusajs/admin-sdk"; import { Container, Heading, Text, Badge, IconButton } from "@medusajs/ui"; import { Spinner, ArrowUpRightOnBox } from "@medusajs/icons"; import { useState, useEffect } from "react"; function getPayPalPayment(order) { if (order.payment_collections && order.payment_collections.length > 0) { const paymentCollection = order.payment_collections[0]; if (paymentCollection.payments && paymentCollection.payments.length > 0) { const payment = paymentCollection.payments[0]; return payment.provider_id === "pp_paypal" ? payment : null; } } return null; } function getPaypalPaymentId(payment) { var _a; let intent = "captures"; switch (payment.data.intent) { case "capture": intent = "captures"; break; case "authorize": intent = "authorizations"; break; case "refund": intent = "refunds"; break; } if (((_a = payment.data) == null ? void 0 : _a.purchaseUnits) && payment.data.purchaseUnits.length > 0) { if (payment.data.purchaseUnits[0].payments[intent] && payment.data.purchaseUnits[0].payments[intent].length > 0) return payment.data.purchaseUnits[0].payments[intent][0].id; } } function getPaypalDetailUrl(payment) { var _a; let isSandbox = false; if (((_a = payment.data) == null ? void 0 : _a.links) && payment.data.links.length > 0) { isSandbox = payment.data.links.some( (link) => link.href.includes("sandbox") ); } if (isSandbox) { return `https://www.sandbox.paypal.com/activity/payment/${getPaypalPaymentId( payment )}`; } return `https://www.paypal.com/activity/payment/${getPaypalPaymentId( payment )}`; } const OrderDetailWidget = ({ data: order }) => { var _a; const paypalPayment = getPayPalPayment(order); if (!paypalPayment) { return ""; } const [payment, setPayment] = useState(null); const [loading, setLoading] = useState(true); const paypalOrderId = (_a = paypalPayment == null ? void 0 : paypalPayment.data) == null ? void 0 : _a.id; const id = getPaypalPaymentId(paypalPayment); const paypalDetailUrl = getPaypalDetailUrl(paypalPayment); useEffect(() => { if (!loading) return; fetch(`${__BACKEND_URL__ || ""}/admin/plugin/paypal/orders/${paypalOrderId}`, { method: "GET", credentials: "include" }).then((res) => res.json()).then((data) => { setPayment(data); setLoading(false); }); }, [loading]); return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(Container, { className: "divide-y p-0", children: [ /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between px-6 py-4", children: /* @__PURE__ */ jsx(Heading, { className: "w-100", level: "h2", children: "Paypal" }) }), /* @__PURE__ */ jsx("div", { children: loading || !payment ? /* @__PURE__ */ jsx("div", { className: "flex justify-center items-center py-8", children: /* @__PURE__ */ jsx(Spinner, {}) }) : /* @__PURE__ */ jsxs("div", { className: "w-full grid grid-cols-4 sm:grid-cols-2 gap-4 p-4", children: [ /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(Text, { size: "xsmall", children: [ "Intent:", " ", /* @__PURE__ */ jsx(Badge, { size: "2xsmall", color: "green", children: payment.intent }) ] }) }), /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(Text, { size: "xsmall", children: [ "Status:", " ", /* @__PURE__ */ jsx(Badge, { size: "2xsmall", color: "green", children: payment.purchase_units[0].payments.captures[0].status }) ] }) }), /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(Text, { size: "xsmall", children: [ id, " ", /* @__PURE__ */ jsx(IconButton, { size: "2xsmall", variant: "transparent", children: /* @__PURE__ */ jsx("a", { href: paypalDetailUrl, target: "_blank", children: /* @__PURE__ */ jsx(ArrowUpRightOnBox, {}) }) }), " " ] }) }), /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(Text, { size: "xsmall", children: [ "Payer: ", payment.payer.name.given_name, " ", payment.payer.name.surname ] }) }) ] }) }) ] }) }); }; defineWidgetConfig({ zone: "order.details.side.after" }); const widgetModule = { widgets: [ { Component: OrderDetailWidget, zone: ["order.details.side.after"] } ] }; const routeModule = { routes: [] }; const menuItemModule = { menuItems: [] }; const formModule = { customFields: {} }; const displayModule = { displays: {} }; const plugin = { widgetModule, routeModule, menuItemModule, formModule, displayModule }; export { plugin as default };