gofnnp/w-aura
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Develop

Browse Source
This commit is contained in:
Daniil Chemerkin 2024-06-16 22:51:39 +00:00
parent bb8d8073e3
commit ab9250f5c3
5 changed files with 63 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/PaymentPage/methods/CheckoutForm/index.tsx
View File

@ -17,6 +17,7 @@ interface ICheckoutFormProps {
subscriptionReceiptId?: string;
returnUrl?: string;
confirmType?: "payment" | "setup";
isHide?: boolean;
}
export default function CheckoutForm({
@ -24,6 +25,7 @@ export default function CheckoutForm({
subscriptionReceiptId,
returnUrl,
confirmType = "payment",
isHide = false,
}: ICheckoutFormProps) {
const stripe = useStripe();
const elements = useElements();
@ -70,13 +72,19 @@ export default function CheckoutForm({
return (
<form
className="payment-form-stripe"
className={`payment-form-stripe ${isHide ? styles.hide : ""}`}
id="payment-form"
onSubmit={handleSubmit}
>
{children ? children : null}
<PaymentElement
options={{ terms: { card: "never" } }}
options={{
terms: { card: "never" },
wallets: {
googlePay: "never",
applePay: "never",
},
}}
onReady={() => setFormReady(true)}
/>
<MainButton

5
src/components/PaymentPage/methods/CheckoutForm/styles.module.css
View File

@ -9,6 +9,11 @@
gap: 16px;
}
.hide {
height: 0;
visibility: hidden;
}
.payment-loader {
display: flex;
justify-content: center;

9
src/components/PaymentPage/methods/ExpressCheckoutStripe/index.tsx
View File

@ -94,7 +94,10 @@ function ExpressCheckoutStripe({
<div className={`${styles.container} ${isHideForm ? styles.hide : ""}`}>
<ExpressCheckoutElement
onReady={onReady}
onLoadError={() => onChangeLoading && onChangeLoading(false)}
onLoadError={(e) => {
console.log("Error: ", e);
onChangeLoading && onChangeLoading(false);
}}
onConfirm={onConfirm}
options={{
layout: {
@ -102,6 +105,10 @@ function ExpressCheckoutStripe({
overflow: "never",
},
paymentMethodOrder: ["apple_pay", "google_pay", "amazon_pay", "link"],
wallets: {
googlePay: "always",
applePay: "always",
},
}}
/>
{errorMessage && <p className={styles.error}>{errorMessage}</p>}

37
src/components/pages/ABDesign/v1/pages/TrialPayment/components/PaymentModal/index.tsx
View File

@ -160,28 +160,31 @@ function PaymentModal({
)}
<div className={styles["payment-method-container"]}>
{stripePromise && clientSecret && (
<Elements stripe={stripePromise} options={{ clientSecret }}>
<ExpressCheckoutStripe
clientSecret={clientSecret}
returnUrl={returnUrl}
isHide={
selectedPaymentMethod !== EPaymentMethod.PAYMENT_BUTTONS
}
onAvailable={(_isAvailable, _availableMethods) =>
onAvailableExpressCheckout(_isAvailable, _availableMethods)
}
onChangeLoading={(isLoading) =>
setIsLoadingExpressCheckout(isLoading)
}
/>
{selectedPaymentMethod === EPaymentMethod.CREDIT_CARD && (
<>
<Elements stripe={stripePromise} options={{ clientSecret }}>
<ExpressCheckoutStripe
clientSecret={clientSecret}
returnUrl={returnUrl}
isHide={
selectedPaymentMethod !== EPaymentMethod.PAYMENT_BUTTONS
}
onAvailable={(_isAvailable, _availableMethods) =>
onAvailableExpressCheckout(_isAvailable, _availableMethods)
}
onChangeLoading={(isLoading) =>
setIsLoadingExpressCheckout(isLoading)
}
/>
</Elements>
<Elements stripe={stripePromise} options={{ clientSecret }}>
<CheckoutForm
confirmType={paymentType}
subscriptionReceiptId={paymentIntentId}
returnUrl={returnUrl}
isHide={selectedPaymentMethod !== EPaymentMethod.CREDIT_CARD}
/>
)}
</Elements>
</Elements>
</>
)}
</div>
<SecurityPayments />

37
src/components/pages/TrialPayment/components/PaymentModal/index.tsx
View File

@ -165,28 +165,31 @@ function PaymentModal({
)}
<div className={styles["payment-method-container"]}>
{stripePromise && clientSecret && (
<Elements stripe={stripePromise} options={{ clientSecret }}>
<ExpressCheckoutStripe
clientSecret={clientSecret}
returnUrl={returnUrl}
isHide={
selectedPaymentMethod !== EPaymentMethod.PAYMENT_BUTTONS
}
onAvailable={(_isAvailable, _availableMethods) =>
onAvailableExpressCheckout(_isAvailable, _availableMethods)
}
onChangeLoading={(isLoading) =>
setIsLoadingExpressCheckout(isLoading)
}
/>
{selectedPaymentMethod === EPaymentMethod.CREDIT_CARD && (
<>
<Elements stripe={stripePromise} options={{ clientSecret }}>
<ExpressCheckoutStripe
clientSecret={clientSecret}
returnUrl={returnUrl}
isHide={
selectedPaymentMethod !== EPaymentMethod.PAYMENT_BUTTONS
}
onAvailable={(_isAvailable, _availableMethods) =>
onAvailableExpressCheckout(_isAvailable, _availableMethods)
}
onChangeLoading={(isLoading) =>
setIsLoadingExpressCheckout(isLoading)
}
/>
</Elements>
<Elements stripe={stripePromise} options={{ clientSecret }}>
<CheckoutForm
confirmType={paymentType}
subscriptionReceiptId={paymentIntentId}
returnUrl={returnUrl}
isHide={selectedPaymentMethod !== EPaymentMethod.CREDIT_CARD}
/>
)}
</Elements>
</Elements>
</>
)}
</div>
<SecurityPayments />