71 lines
3 KiB
JavaScript
71 lines
3 KiB
JavaScript
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 { o as Ticket } from "../_libs/lucide-react.mjs";
|
|
import { a as MyText, i as MyButton, o as MyTextInput, t as AppContainer } from "./src-u_N1opJl.mjs";
|
|
import { n as trpc } from "./trpc-client-CQOIB5UU.mjs";
|
|
//#region node_modules/.nitro/vite/services/ssr/assets/me.coupons-CK-hvcuK.js
|
|
var import_react = /* @__PURE__ */ __toESM(require_react());
|
|
var import_jsx_runtime = require_jsx_runtime();
|
|
function CouponsPage() {
|
|
const [code, setCode] = (0, import_react.useState)("");
|
|
const { data } = trpc.user.coupon.getMyCoupons.useQuery();
|
|
const redeemMutation = trpc.user.coupon.redeemReservedCoupon.useMutation();
|
|
const utils = trpc.useUtils();
|
|
const coupons = data?.data || [];
|
|
const handleRedeem = () => {
|
|
if (!code.trim()) return;
|
|
redeemMutation.mutate({ couponCode: code.trim() }, { onSuccess: () => {
|
|
setCode("");
|
|
utils.user.coupon.getMyCoupons.invalidate();
|
|
} });
|
|
};
|
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(AppContainer, { children: [
|
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(MyText, {
|
|
weight: "bold",
|
|
className: "mb-4 text-xl",
|
|
children: "My Coupons"
|
|
}),
|
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
|
|
className: "mb-6 flex gap-2",
|
|
children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(MyTextInput, {
|
|
placeholder: "Enter coupon code",
|
|
value: code,
|
|
onChange: (e) => setCode(e.target.value),
|
|
className: "flex-1"
|
|
}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MyButton, {
|
|
onClick: handleRedeem,
|
|
disabled: redeemMutation.isPending || !code.trim(),
|
|
textContent: redeemMutation.isPending ? "Redeeming..." : "Redeem"
|
|
})]
|
|
}),
|
|
coupons.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
|
|
className: "flex flex-col items-center gap-4 py-20",
|
|
children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Ticket, { className: "h-12 w-12 text-gray-300" }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MyText, {
|
|
className: "text-gray-500",
|
|
children: "No coupons yet"
|
|
})]
|
|
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
className: "flex flex-col gap-3",
|
|
children: coupons.map((coupon) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
|
|
className: "rounded-xl border border-dashed border-brand-200 bg-brand-50 p-4",
|
|
children: [
|
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(MyText, {
|
|
weight: "bold",
|
|
className: "text-brand-700",
|
|
children: coupon.code
|
|
}),
|
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(MyText, {
|
|
className: "text-sm text-gray-600",
|
|
children: coupon.description || `${coupon.discountPercent || 0}% off`
|
|
}),
|
|
coupon.expiresAt && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(MyText, {
|
|
className: "mt-1 text-xs text-gray-400",
|
|
children: ["Expires: ", new Date(coupon.expiresAt).toLocaleDateString()]
|
|
})
|
|
]
|
|
}, coupon.id))
|
|
})
|
|
] });
|
|
}
|
|
//#endregion
|
|
export { CouponsPage as component };
|