chore(payment): update ezpay dev redirect notice
This commit is contained in:
@@ -17,7 +17,7 @@ import { StripePaymentDialog } from "./stripe-payment-dialog";
|
||||
import { SubscriptionCtaButton } from "./subscription-cta-button";
|
||||
import styles from "./subscription-cta-button.module.css";
|
||||
|
||||
const EZPAY_DEVELOPMENT_REDIRECT_DELAY_MS = 3000;
|
||||
const EZPAY_DEVELOPMENT_REDIRECT_DELAY_MS = 5000;
|
||||
|
||||
export interface SubscriptionCheckoutButtonProps {
|
||||
/** 是否可用(未选套餐 / 未勾选协议 → false) */
|
||||
@@ -149,6 +149,14 @@ export function SubscriptionCheckoutButton({
|
||||
stripeClientSecret !== null &&
|
||||
stripeClientSecret !== hiddenStripeClientSecret &&
|
||||
!payment.isPaid;
|
||||
const pendingEzpayRedirectOrderId =
|
||||
AppEnvUtil.isDevelopment() &&
|
||||
payment.payParams &&
|
||||
isEzpayPayment(payment.payParams) &&
|
||||
getPaymentUrl(payment.payParams) &&
|
||||
payment.currentOrderId
|
||||
? payment.currentOrderId
|
||||
: null;
|
||||
|
||||
return (
|
||||
<>
|
||||
@@ -174,6 +182,16 @@ export function SubscriptionCheckoutButton({
|
||||
{payment.errorMessage}
|
||||
</p>
|
||||
) : null}
|
||||
{pendingEzpayRedirectOrderId ? (
|
||||
<div className={styles.pendingRedirect} role="status">
|
||||
<span className={styles.pendingRedirectLabel}>
|
||||
Ezpay order created. Redirecting in 3 seconds.
|
||||
</span>
|
||||
<span className={styles.pendingRedirectOrder}>
|
||||
Order No. {pendingEzpayRedirectOrderId}
|
||||
</span>
|
||||
</div>
|
||||
) : null}
|
||||
{shouldShowStripeDialog ? (
|
||||
<StripePaymentDialog
|
||||
clientSecret={stripeClientSecret}
|
||||
|
||||
@@ -60,6 +60,32 @@
|
||||
animation: spin 0.8s linear infinite;
|
||||
}
|
||||
|
||||
.pendingRedirect {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
margin-top: var(--spacing-sm);
|
||||
padding: 10px 12px;
|
||||
border: 1px solid rgba(246, 87, 160, 0.2);
|
||||
border-radius: 14px;
|
||||
background: #ffffff;
|
||||
color: #3c3b3b;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.pendingRedirectLabel {
|
||||
font-size: var(--font-size-sm);
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.pendingRedirectOrder {
|
||||
color: #1e1e1e;
|
||||
font-size: var(--font-size-md);
|
||||
font-weight: 700;
|
||||
line-height: 1.3;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
|
||||
Reference in New Issue
Block a user