import PropTypes from 'prop-types';
import NavLink from '../shared/buttons/nav-link';
import { DEFAULT_DECKS_ROUTE } from '../utils/index';

function PaymentVerify(props) {
  const { payment } = props;
  const paymentCode = payment.result.result;

  return (
    <div className='text-center text-xl'>
      {payment.status && [100, 201].includes(paymentCode) ? (
        paymentCode === 100 ? (
          <>
            <p>بسته‌های موردنظر شما با موفقیت خریداری گردید.</p>
            <p className='my-1'>
              <span>شماره مرجع: </span>
              <span>{payment.result.refNumber}</span>
            </p>
          </>
        ) : (
          <p>تراکنش با موفقیت انجام شده است.</p>
        )
      ) : (
        <p>متاسفانه تراکنش ناموفق بود.</p>
      )}
      <NavLink to={DEFAULT_DECKS_ROUTE} color='green' content='بازگشت' className='mx-auto my-6' />
    </div>
  );
}

PaymentVerify.propTypes = {
  payment: PropTypes.object.isRequired,
  code: PropTypes.string.isRequired
};

export default PaymentVerify;
