I integrate mollie script in gatsby layout
class Layout extends React.Component { constructor(props) { super(props) }
componentDidMount() {
}
componentDidUpdate() {
}
render() {
return (
<>
<BrowserRouter>
<Provider store={store}>
<Header/>
{this.props.children}
</Provider>
</BrowserRouter>
<Script src="https://js.mollie.com/v1/mollie.js"/>
</>
)
}
}
I integrate mollie script in gatsby layout I integrate mollie script in gatsby layout I integrate mollie script in gatsby layout
const PaymentPage = () => { const [paymentUrl, setPaymentUrl] = useState('');
const createPayment = async () => {
if (typeof window.Mollie !== 'undefined') {
try {
const mollie = window.Mollie({
apiKey: 'test_96m24F3ncSJyj7nFpmKP5pjSn3RzrD',
});
const payment = await mollie.payments.create({
amount: {
currency: 'EUR',
value: '10.00',
},
description: 'Sample Payment',
redirectUrl: 'http://localhost:8000/payment-success',
method: 'ideal', // Payment method (change as needed)
});
setPaymentUrl(payment._links.checkout.href);
} catch (error) {
console.error('Error creating payment:', error);
}
}
};
return (
<div>
<h1>Gatsby Mollie Integration Example</h1>
<button onClick={createPayment}>Create Payment</button>
{paymentUrl && (
<div>
<p>Click the button below to complete your payment:</p>
<a href={paymentUrl} target="_blank" rel="noopener noreferrer">
Complete Payment
</a>
</div>
)}
</div>
);
};
**My error : Error creating payment: TypeError: t.startsWith is not a function at new t (mollie.js:1:92514)