Perform manual connection request

This commit is contained in:
Alex P. 2024-10-31 09:47:06 +02:00
parent 2ec94b1113
commit 5ad4cce8f7
No known key found for this signature in database
GPG key ID: 54487A734A204D71
2 changed files with 45 additions and 6 deletions

View file

@ -4,10 +4,10 @@ import { Button, TextControl } from '@wordpress/components';
import PaymentMethodIcons from '../../ReusableComponents/PaymentMethodIcons';
import SettingsToggleBlock from '../../ReusableComponents/SettingsToggleBlock';
import Separator from '../../ReusableComponents/Separator';
import { useOnboardingDetails } from '../../../data';
import { useManualConnect, useOnboardingDetails } from '../../../data';
import DataStoreControl from '../../ReusableComponents/DataStoreControl';
const StepWelcome = ( { setStep, currentStep } ) => {
const StepWelcome = ( { setStep, currentStep, setCompleted } ) => {
return (
<div className="ppcp-r-page-welcome">
<OnboardingHeader
@ -37,7 +37,7 @@ const StepWelcome = ( { setStep, currentStep } ) => {
className="ppcp-r-page-welcome-or-separator"
text={ __( 'or', 'woocommerce-paypal-payments' ) }
/>
<WelcomeForm />
<WelcomeForm setCompleted={ setCompleted } />
</div>
</div>
);
@ -74,7 +74,7 @@ const WelcomeFeatures = () => {
);
};
const WelcomeForm = () => {
const WelcomeForm = ( { setCompleted } ) => {
const {
isSandboxMode,
setSandboxMode,
@ -86,6 +86,26 @@ const WelcomeForm = () => {
setClientSecret,
} = useOnboardingDetails();
const { connectManual } = useManualConnect();
const handleConnect = async () => {
try {
const res = await connectManual(
clientId,
clientSecret,
isSandboxMode
);
if ( ! res.success ) {
throw new Error( 'Request failed.' );
}
setCompleted( true );
} catch ( exc ) {
console.error( exc );
alert( 'Connection failed.' );
}
};
const advancedUsersDescription = sprintf(
// translators: %s: Link to PayPal REST application guide
__(
@ -156,7 +176,7 @@ const WelcomeForm = () => {
onChange={ setClientSecret }
type="password"
/>
<Button variant="secondary">
<Button variant="secondary" onClick={ handleConnect }>
{ __( 'Connect Account', 'woocommerce-paypal-payments' ) }
</Button>
</SettingsToggleBlock>

View file

@ -1,5 +1,6 @@
import { useSelect, useDispatch } from '@wordpress/data';
import { STORE_NAME } from '../constants';
import { NAMESPACE, STORE_NAME } from '../constants';
import apiFetch from '@wordpress/api-fetch';
export const useOnboardingDetails = () => {
const {
@ -82,3 +83,21 @@ export const useOnboardingStep = () => {
setCompleted: ( state ) => setDetailAndPersist( setCompleted, state ),
};
};
export const useManualConnect = () => {
const connectManual = async ( clientId, clientSecret, isSandboxMode ) => {
return await apiFetch( {
path: `${ NAMESPACE }/connect_manual`,
method: 'POST',
data: {
clientId,
clientSecret,
useSandbox: isSandboxMode,
},
} );
};
return {
connectManual,
};
};