implement editor previews for stripe cc and check payment methods (https://github.com/woocommerce/woocommerce-blocks/pull/2190)
This commit is contained in:
parent
a00d06b7f2
commit
70f8b48165
|
@ -14,8 +14,6 @@ import { PAYMENT_METHOD_NAME } from './constants';
|
||||||
|
|
||||||
const settings = getSetting( 'cheque_data', {} );
|
const settings = getSetting( 'cheque_data', {} );
|
||||||
|
|
||||||
const EditPlaceHolder = () => <div>TODO: Edit preview soon...</div>;
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @typedef {import('@woocommerce/type-defs/registered-payment-method-props').RegisteredPaymentMethodProps} RegisteredPaymentMethodProps
|
* @typedef {import('@woocommerce/type-defs/registered-payment-method-props').RegisteredPaymentMethodProps} RegisteredPaymentMethodProps
|
||||||
*/
|
*/
|
||||||
|
@ -40,6 +38,10 @@ const Content = ( { activePaymentMethod, eventRegistration } ) => {
|
||||||
) : null;
|
) : null;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const Edit = ( props ) => {
|
||||||
|
return <Content { ...props } />;
|
||||||
|
};
|
||||||
|
|
||||||
const offlineChequePaymentMethod = {
|
const offlineChequePaymentMethod = {
|
||||||
name: PAYMENT_METHOD_NAME,
|
name: PAYMENT_METHOD_NAME,
|
||||||
label: (
|
label: (
|
||||||
|
@ -51,7 +53,7 @@ const offlineChequePaymentMethod = {
|
||||||
</strong>
|
</strong>
|
||||||
),
|
),
|
||||||
content: <Content />,
|
content: <Content />,
|
||||||
edit: <EditPlaceHolder />,
|
edit: <Edit />,
|
||||||
canMakePayment: () => true,
|
canMakePayment: () => true,
|
||||||
ariaLabel: decodeEntities(
|
ariaLabel: decodeEntities(
|
||||||
settings.title || __( 'Check Payment', 'woo-gutenberg-products-block' )
|
settings.title || __( 'Check Payment', 'woo-gutenberg-products-block' )
|
||||||
|
|
|
@ -10,10 +10,12 @@ import { loadStripe } from '../stripe-utils';
|
||||||
import { StripeCreditCard } from './payment-method';
|
import { StripeCreditCard } from './payment-method';
|
||||||
import { PAYMENT_METHOD_NAME } from './constants';
|
import { PAYMENT_METHOD_NAME } from './constants';
|
||||||
|
|
||||||
const EditPlaceHolder = () => <div>TODO: Card edit preview soon...</div>;
|
|
||||||
|
|
||||||
const stripePromise = loadStripe();
|
const stripePromise = loadStripe();
|
||||||
|
|
||||||
|
const Edit = ( props ) => {
|
||||||
|
return <StripeCreditCard stripe={ stripePromise } { ...props } />;
|
||||||
|
};
|
||||||
|
|
||||||
const stripeCcPaymentMethod = {
|
const stripeCcPaymentMethod = {
|
||||||
name: PAYMENT_METHOD_NAME,
|
name: PAYMENT_METHOD_NAME,
|
||||||
label: (
|
label: (
|
||||||
|
@ -22,7 +24,7 @@ const stripeCcPaymentMethod = {
|
||||||
</strong>
|
</strong>
|
||||||
),
|
),
|
||||||
content: <StripeCreditCard stripe={ stripePromise } />,
|
content: <StripeCreditCard stripe={ stripePromise } />,
|
||||||
edit: <EditPlaceHolder />,
|
edit: <Edit />,
|
||||||
canMakePayment: () => stripePromise,
|
canMakePayment: () => stripePromise,
|
||||||
ariaLabel: __(
|
ariaLabel: __(
|
||||||
'Stripe Credit Card payment method',
|
'Stripe Credit Card payment method',
|
||||||
|
|
Loading…
Reference in New Issue