OwlCyberSecurity - MANAGER

Edit File: page.tsx

import Link from "next/link";
import { notFound } from "next/navigation";
import React from "react";

type PageProps = {
  searchParams: { [key: string]: string | string[] | undefined };
};

async function WalletChargeCallbackZarinpal({ searchParams }: PageProps) {
  const walletChargeCallback = await fetchWalletChargeFromBank(
    searchParams.Authority,
    searchParams.Status
  );

if (walletChargeCallback) {
    if (searchParams.Status === "OK") {
      return (
        <div className="invoice-bank-callback-container">
          <div className="invoice-bank-callback-notif-container success">
            <div className="invoice-bank-callback-notif-head">
              <div className="flex items-center gap-2">
                <img src="/assets/images/icons/success.png" alt="" />
                <h4>پرداخت موفق</h4>
              </div>
            </div>
            <div className="invoice-bank-callback-notif-content">
              <div className="flex flex-col gap-2 text-[var(--text-gray)]">
                <p className="text-[var(--base-green)] font-IRANSansBold">
                  پرداخت با موفقیت انجام شد.
                </p>
                <p>
                  مقدار پرداختی شما:
                  {walletChargeCallback?.amount}
                </p>
                <p>کد پیگیری بانک: {walletChargeCallback?.refnumber}</p>
                <p>تاریخ: {walletChargeCallback?.created_at}</p>
              </div>
              <div className="flex items-center justify-center">
                <Link
                  className="bg-[var(--base-blue)] text-white px-5 py-2 rounded-[12px]"
                  href="/dashboard/wallet"
                >
                  بازگشت به کیف پول
                </Link>
              </div>
            </div>
          </div>
        </div>
      );
    }
    if (searchParams.Status === "NOK") {
      return (
        <div className="invoice-bank-callback-container">
          <div className="invoice-bank-callback-notif-container failed">
            <div className="invoice-bank-callback-notif-head">
              <div className="flex items-center gap-2">
                <img src="/assets/images/icons/false.png" alt="" />
                <h4>پرداخت ناموفق</h4>
              </div>
            </div>
            <div className="invoice-bank-callback-notif-content">
              <div className="flex flex-col gap-2 text-[var(--text-gray)]">
                <p className="text-[var(--base-red)] font-IRANSansBold">
                  پرداخت با موفقیت انجام نشد.
                </p>
                <p>{walletChargeCallback}</p>
              </div>
              <div className="flex items-center justify-center">
                <Link
                  className="bg-[var(--base-blue)] text-white px-5 py-2 rounded-[12px]"
                  href="/dashboard/wallet"
                >
                  بازگشت به کیف پول
                </Link>
              </div>
            </div>
          </div>
        </div>
      );
    }
  } else {
    null;
  }
}

export default WalletChargeCallbackZarinpal;