Vitron-Front/app/routes/profile.wallet.payment.tsx
Arda Samadi 16389fdd85 fix(desktop): lay out dashboard sub-pages + form pages for wide screens
- HeaderWithSupport is now lg:hidden (all its callers are desktop-full-width
  store/profile pages), removing the stray mobile back+support bar on desktop.
- Constrain + title the previously mobile-only pages so their content doesn't
  stretch edge-to-edge on desktop: store edit/create form (StoreForm), add
  product, shipping method, financial sub-pages (cash-funds/reports/
  transactions), order detail, instagram auth; and profile add/edit address,
  set detail, and payment result. Forms use a narrow centered column, lists/
  details a wider one. Transactions keeps its filter button (header restyled,
  not hidden).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-09 12:06:13 +03:30

64 lines
3.0 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import type { MetaFunction } from "@remix-run/node";
import { useNavigate, useSearchParams } from "@remix-run/react";
import { CheckCircle2, XCircle } from "lucide-react";
import { Button } from "../components/ui/button";
import ProfilePagesHeader from "../components/ProfilePagesHeader";
export const meta: MetaFunction = () => {
return [
{ title: "نتیجه پرداخت - ویترون" },
{ name: "description", content: "نتیجه پرداخت و تراکنش شما در ویترون. بررسی وضعیت پرداخت، کد پیگیری و اطلاعات تراکنش مالی." },
{ name: "keywords", content: "نتیجه پرداخت، تراکنش، کد پیگیری، پرداخت موفق، پرداخت ناموفق، ویترون" },
{ name: "robots", content: "noindex, follow" },
{ property: "og:title", content: "نتیجه پرداخت - ویترون" },
{ property: "og:description", content: "نتیجه پرداخت و تراکنش شما در ویترون. بررسی وضعیت پرداخت، کد پیگیری و اطلاعات تراکنش مالی." },
{ property: "og:type", content: "website" },
{ name: "twitter:card", content: "summary" },
{ name: "twitter:title", content: "نتیجه پرداخت - ویترون" },
{ name: "twitter:description", content: "نتیجه پرداخت و تراکنش شما در ویترون. بررسی وضعیت پرداخت، کد پیگیری و اطلاعات تراکنش مالی." },
];
};
export default function PaymentResult() {
const [searchParams] = useSearchParams();
const status = searchParams.get("status");
const refId = searchParams.get("ref_id");
const reason = searchParams.get("reason");
const navigate = useNavigate();
return (
<div className="flex flex-col gap-6 w-full items-center lg:max-w-[640px] lg:mx-auto lg:pt-6">
<ProfilePagesHeader title="نتیجه پرداخت" />
<div className="flex flex-col gap-6 items-center mt-[100px] px-4">
{status === "success" ? (
<>
<CheckCircle2 className="text-primary size-16" />
<p className="text-B16 text-center">پرداخت با موفقیت انجام شد</p>
<div className="flex flex-col items-center gap-1">
<p className="text-R14 text-GRAY">کد پیگیری:</p>
<p className="text-B16">{refId}</p>
</div>
</>
) : (
<>
<XCircle className="text-RED size-16" />
<p className="text-B16 text-center">پرداخت ناموفق</p>
<p className="text-R14 text-GRAY text-center">
{reason ||
"متاسفانه مشکلی در پرداخت پیش آمده است. لطفا دوباره تلاش کنید."}
</p>
</>
)}
<Button
className="w-full"
size={"xl"}
variant="dark"
onClick={() => navigate("/profile/wallet")}
>
بازگشت به کیف پول
</Button>
</div>
</div>
);
}