Rename component filename

This commit is contained in:
Emili Castells Guasch 2024-05-20 18:46:44 +02:00
parent a42488b41d
commit de3fd75f69
3 changed files with 47 additions and 45 deletions

View file

@ -7,6 +7,7 @@ import {
} from "@paypal/react-paypal-js";
import {CheckoutHandler} from "./checkout-handler";
import {createOrder, onApprove} from "../card-fields-config";
export function CardFields({config, eventRegistration, emitResponse}) {
const {onPaymentSetup} = eventRegistration;
@ -14,47 +15,6 @@ export function CardFields({config, eventRegistration, emitResponse}) {
const [cardFieldsForm, setCardFieldsForm] = useState();
async function createOrder() {
return fetch(config.scriptData.ajax.create_order.endpoint, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
nonce: config.scriptData.ajax.create_order.nonce,
context: config.scriptData.context,
payment_method: 'ppcp-credit-card-gateway',
}),
})
.then((response) => response.json())
.then((order) => {
return order.data.id;
})
.catch((err) => {
console.error(err);
});
}
function onApprove(data) {
fetch(config.scriptData.ajax.approve_order.endpoint, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
order_id: data.orderID,
nonce: config.scriptData.ajax.approve_order.nonce,
}),
})
.then((response) => response.json())
.then((data) => {
console.log(data)
})
.catch((err) => {
console.error(err);
});
}
const getCardFieldsForm = (cardFieldsForm) => {
setCardFieldsForm(cardFieldsForm)
}
@ -67,7 +27,7 @@ export function CardFields({config, eventRegistration, emitResponse}) {
resolve()
}, milliseconds)
})
}
};
useEffect(
() =>
@ -75,7 +35,7 @@ export function CardFields({config, eventRegistration, emitResponse}) {
async function handlePaymentProcessing() {
await cardFieldsForm.submit();
// TODO temporary workaround to wait for PayPal order in the session
// TODO temporary workaround to wait for onApprove to resolve
await wait(3000)
return {

View file

@ -1,5 +1,5 @@
import { registerPaymentMethod } from '@woocommerce/blocks-registry';
import {CardFields} from "./Components/CardFields";
import {CardFields} from "./Components/card-fields";
const config = wc.wcSettings.getSetting('ppcp-credit-card-gateway_data');
@ -7,7 +7,7 @@ registerPaymentMethod({
name: config.id,
label: <div dangerouslySetInnerHTML={{__html: config.title}}/>,
content: <CardFields config={config}/>,
edit: <p>edit...</p>,
edit: <div></div>,
ariaLabel: config.title,
canMakePayment: () => {return true},
})

View file

@ -0,0 +1,42 @@
const config = wc.wcSettings.getSetting('ppcp-credit-card-gateway_data');
export async function createOrder() {
return fetch(config.scriptData.ajax.create_order.endpoint, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
nonce: config.scriptData.ajax.create_order.nonce,
context: config.scriptData.context,
payment_method: 'ppcp-credit-card-gateway',
}),
})
.then((response) => response.json())
.then((order) => {
return order.data.id;
})
.catch((err) => {
console.error(err);
});
}
export function onApprove(data) {
fetch(config.scriptData.ajax.approve_order.endpoint, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
order_id: data.orderID,
nonce: config.scriptData.ajax.approve_order.nonce,
}),
})
.then((response) => response.json())
.then((data) => {
console.log(data)
})
.catch((err) => {
console.error(err);
});
}