101 lines
2.7 KiB
JavaScript
101 lines
2.7 KiB
JavaScript
|
/**
|
||
|
|
* External dependencies
|
||
|
|
*/
|
||
|
|
import { __ } from '@wordpress/i18n';
|
||
|
|
import { ADMIN_URL as adminUrl } from '@woocommerce/wc-admin-settings';
|
||
|
|
import { Stepper, Link } from '@woocommerce/components';
|
||
|
|
import { Button } from '@wordpress/components';
|
||
|
|
import interpolateComponents from 'interpolate-components';
|
||
|
|
import { useSelect } from '@wordpress/data';
|
||
|
|
import { SETTINGS_STORE_NAME } from '@woocommerce/data';
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Internal dependencies
|
||
|
|
*/
|
||
|
|
import { getCountryCode } from '../../../dashboard/utils';
|
||
|
|
|
||
|
|
export const MERCADOPAGO_PLUGIN = 'woocommerce-mercadopago';
|
||
|
|
|
||
|
|
export const MercadoPago = ( { installStep, markConfigured } ) => {
|
||
|
|
const { countryCode } = useSelect( ( select ) => {
|
||
|
|
const { getSettings } = select( SETTINGS_STORE_NAME );
|
||
|
|
const { general: generalSettings = {} } = getSettings( 'general' );
|
||
|
|
return {
|
||
|
|
countryCode: getCountryCode(
|
||
|
|
generalSettings.woocommerce_default_country
|
||
|
|
),
|
||
|
|
};
|
||
|
|
} );
|
||
|
|
return (
|
||
|
|
<Stepper
|
||
|
|
isVertical
|
||
|
|
isPending={ ! installStep.isComplete }
|
||
|
|
currentStep={ installStep.isComplete ? 'connect' : 'install' }
|
||
|
|
steps={ [
|
||
|
|
installStep,
|
||
|
|
{
|
||
|
|
key: 'connect',
|
||
|
|
label: __(
|
||
|
|
'Connect to your Mercado Pago account',
|
||
|
|
'woocommerce-admin'
|
||
|
|
),
|
||
|
|
content: (
|
||
|
|
<MercadoPagoCredentialsStep
|
||
|
|
countryCode={ countryCode }
|
||
|
|
onFinish={ () => markConfigured( 'mercadopago' ) }
|
||
|
|
/>
|
||
|
|
),
|
||
|
|
},
|
||
|
|
] }
|
||
|
|
/>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
const MercadoPagoCredentialsStep = ( { countryCode, onFinish } ) => {
|
||
|
|
const getRegistrationURL = () => {
|
||
|
|
const mercadoPagoURL = 'https://www.mercadopago.com';
|
||
|
|
if (
|
||
|
|
! [ 'AR', 'BR', 'CL', 'CO', 'MX', 'PE', 'UY' ].includes(
|
||
|
|
countryCode
|
||
|
|
)
|
||
|
|
) {
|
||
|
|
return mercadoPagoURL;
|
||
|
|
}
|
||
|
|
|
||
|
|
// As each country has its own domain, we will return the correct one. Otherwise, for example, a Spanish speaker could be redirected to a Mercado Pago page in Portuguese, etc.
|
||
|
|
return `${ mercadoPagoURL }.${ countryCode.toLowerCase() }/registration-company?confirmation_url=${ mercadoPagoURL }.${ countryCode.toLowerCase() }%2Fcomo-cobrar`;
|
||
|
|
};
|
||
|
|
|
||
|
|
const settingsLink = (
|
||
|
|
<Link
|
||
|
|
href={ `${ adminUrl }admin.php?page=wc-settings&tab=checkout` }
|
||
|
|
target="_blank"
|
||
|
|
type="external"
|
||
|
|
/>
|
||
|
|
);
|
||
|
|
|
||
|
|
const accountLink = (
|
||
|
|
<Link href={ getRegistrationURL() } target="_blank" type="external" />
|
||
|
|
);
|
||
|
|
|
||
|
|
const configureText = interpolateComponents( {
|
||
|
|
mixedString: __(
|
||
|
|
'Mercado Pago can be configured under your {{settingsLink}}store settings.{{/settingsLink}} Create your Mercado Pago account {{accountLink}}here.{{/accountLink}}',
|
||
|
|
'woocommerce-admin'
|
||
|
|
),
|
||
|
|
components: {
|
||
|
|
accountLink,
|
||
|
|
settingsLink,
|
||
|
|
},
|
||
|
|
} );
|
||
|
|
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
<p>{ configureText }</p>
|
||
|
|
<Button isPrimary onClick={ onFinish }>
|
||
|
|
{ __( 'Continue', 'woocommerce-admin' ) }
|
||
|
|
</Button>
|
||
|
|
</>
|
||
|
|
);
|
||
|
|
};
|