MercadoPago Payment Integration

POST https://mercadopago-jcv.fagal142010.workers.dev/

POST /api/payment/mercadopago/create-preference

const response = await fetch('https://mercadopago-jcv.fagal142010.workers.dev/', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    items: [
      {
        title: 'JCV Fitness - Plan Pro',
        description: 'Plan de alimentacion personalizado + Rutina gimnasio',
        quantity: 1,
        unitPrice: 89900,
        currencyId: 'COP'
      }
    ],
    payer: {
      email: '[email protected]',
      name: 'Juan Perez'
    },
    planType: 'PLAN_PRO',
    userId: 'user-uuid-123'
  })
});

const data = await response.json();
console.log('Preference ID:', data.id);
// Redirect user to data.initPoint or data.sandboxInitPoint

{
  "id": "123456789-abcd-efgh-ijkl-mnopqrstuvwx",
  "initPoint": "https://www.mercadopago.com.co/checkout/v1/redirect?pref_id=123456789-abcd-efgh-ijkl-mnopqrstuvwx",
  "sandboxInitPoint": "https://sandbox.mercadopago.com.co/checkout/v1/redirect?pref_id=123456789-abcd-efgh-ijkl-mnopqrstuvwx"
}

import { createPaymentPreference, renderWalletBrick } from '@/features/payment/utils/mercado-pago';

// Step 1: Create preference from backend
const preference = await createPaymentPreference({
  items: [{
    title: 'JCV Fitness - Plan Pro',
    quantity: 1,
    unitPrice: 89900,
    currencyId: 'COP'
  }],
  payer: {
    email: user.email,
    name: user.name
  }
});

// Step 2: Render MercadoPago Wallet Brick
await renderWalletBrick(
  'wallet-container', // Container ID
  preference.id,
  {
    onReady: () => console.log('Wallet ready'),
    onSubmit: () => console.log('Payment submitted'),
    onError: (error) => console.error('Payment error:', error)
  }
);