import { o as __toESM } from "../_runtime.mjs"; import { h as require_react, m as require_jsx_runtime } from "../_libs/react+tanstack__react-query.mjs"; import { S as ArrowLeft } from "../_libs/lucide-react.mjs"; import { a as p, i as MyButton, r as LoadingDialog, s as MyTouchableOpacity, t as AppContainer } from "./src-u_N1opJl.mjs"; import { n as trpc } from "./trpc-client-CQOIB5UU.mjs"; import { l as useNavigate } from "../_libs/@tanstack/react-router+[...].mjs"; import { t as Route } from "./me.orders._id-9KyXzQNP.mjs"; //#region node_modules/.nitro/vite/services/ssr/assets/me.orders._id-Cq7m-7ba.js var import_react = /* @__PURE__ */ __toESM(require_react()); var import_jsx_runtime = require_jsx_runtime(); function OrderDetailPage() { const { id } = Route.useParams(); const navigate = useNavigate(); const orderId = Number(id); const [showCancelDialog, setShowCancelDialog] = (0, import_react.useState)(false); const { data } = trpc.user.order.getOrderById.useQuery({ orderId }); const cancelMutation = trpc.user.order.cancelOrder.useMutation(); const order = data?.data; const handleCancel = () => { cancelMutation.mutate({ orderId }, { onSuccess: () => setShowCancelDialog(false) }); }; if (!order) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AppContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(p, { children: "Loading..." }) }); return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(AppContainer, { children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(MyTouchableOpacity, { onClick: () => navigate({ to: "/me/orders" }), className: "mb-4 flex items-center gap-2", children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(ArrowLeft, { className: "h-5 w-5" }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(p, { children: "Back to Orders" })] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mb-4", children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(p, { weight: "bold", className: "text-xl", children: ["Order #", order.id] }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: `mt-1 inline-block rounded-full px-3 py-1 text-xs font-medium ${order.status === "delivered" ? "bg-green-100 text-green-700" : order.status === "cancelled" ? "bg-red-100 text-red-700" : "bg-yellow-100 text-yellow-700"}`, children: order.status })] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mb-6", children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(p, { weight: "semibold", className: "mb-2", children: "Items" }), (order.items || []).map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between border-b border-gray-100 py-2", children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(p, { className: "text-sm", children: [ item.product?.name || `Product #${item.productId}`, " x", item.quantity ] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(p, { className: "text-sm font-bold", children: ["₹", item.price || 0] })] }, i)), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between pt-2", children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(p, { weight: "bold", children: "Total" }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(p, { weight: "bold", className: "text-brand-600", children: ["₹", order.totalAmount || 0] })] }) ] }), order.address && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mb-6", children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(p, { weight: "semibold", className: "mb-2", children: "Delivery Address" }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "rounded-xl border border-gray-100 bg-gray-50 p-3", children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(p, { weight: "semibold", children: order.address.name }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(p, { className: "text-sm text-gray-600", children: [ order.address.addressLine1, ", ", order.address.city ] }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(p, { className: "text-sm text-gray-500", children: order.address.phone }) ] })] }), order.status !== "cancelled" && order.status !== "delivered" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MyButton, { variant: "red", fullWidth: true, textContent: cancelMutation.isPending ? "Cancelling..." : "Cancel Order", onClick: () => setShowCancelDialog(true), disabled: cancelMutation.isPending }), showCancelDialog && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mx-4 w-full max-w-sm rounded-xl bg-white p-6", children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(p, { weight: "bold", className: "mb-2 text-lg", children: "Cancel Order?" }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(p, { className: "mb-6 text-sm text-gray-600", children: "Are you sure you want to cancel this order?" }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex gap-3", children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(MyButton, { textContent: "No, Keep It", onClick: () => setShowCancelDialog(false), className: "flex-1 bg-gray-100 text-gray-700" }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MyButton, { variant: "red", textContent: "Yes, Cancel", onClick: handleCancel, className: "flex-1", disabled: cancelMutation.isPending })] }) ] }) }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LoadingDialog, { open: cancelMutation.isPending, message: "Cancelling order..." }) ] }); } //#endregion export { OrderDetailPage as component };