i have created a payment service plugn in wix for paypro payments. im able to authenticate, receive token and receive response. But i cant see payment page instead i see a error There was a problem with your payment

Here is my code

import { payproRequest, getAuthToken } from 'backend/paypro-wrapper.js';

/**
 * This payment plugin endpoint is triggered when a merchant provides required data to connect their PSP account to a Wix site.
 * The plugin has to verify the merchant's credentials and ensure the merchant has an operational PSP account.
 * @param {import('interfaces-psp-v1-payment-service-provider').ConnectAccountOptions} options
 * @returns {Promise<import('interfaces-psp-v1-payment-service-provider').ConnectAccountResponse>}
 */
export const connectAccount = async (options, context) => {
  return {
    'accountId': 'PayPro',
    'credentials': {
      'clientId': options.credentials.clientid,
      'clientsecret': options.credentials.clientsecret
    }
  };
};

/**
 * This payment plugin endpoint is triggered when a buyer pays on a Wix site.
 * The plugin has to process this payment request but prevent double payments for the same `wixTransactionId`.
 * @param {import('interfaces-psp-v1-payment-service-provider').CreateTransactionOptions} options
 * @returns {Promise<import('interfaces-psp-v1-payment-service-provider').CreateTransactionResponse>}
 */
export const createTransaction = async (options, context) => {
  try {
    // Retrieve the authentication token
    const { clientId, clientsecret } = options.merchantCredentials;
    const authToken = await getAuthToken(clientId, clientsecret);

    if (!authToken) {
      throw new Error('Authentication failed.');
    }

    // Create the order
    let orderResponse = await createOrder(options, authToken);
    return orderResponse;
  } catch (error) {
    console.error('Error creating transaction:', error);
    return {
      'status': 'FAILURE',
      'errorCode': 'TRANSACTION_ERROR',
      'errorMessage': error.message
    };
  }
};

/**
 * Creates a new order using the PayPro API.
 * @param {import('interfaces-psp-v1-payment-service-provider').CreateTransactionOptions} transactionRequest
 * @param {string} authToken
 * @returns {Promise<object>}
 */
export async function createOrder(transactionRequest, authToken) {
  try {
    // Convert currency units from major to minor.
    let orderAmount = parseInt(transactionRequest.order.description.totalAmount) / Math.pow(10, 2);

    // Helper function to format date in MM/DD/YYYY
    function formatDate(date) {
      let d = new Date(date);
      let month = ('0' + (d.getMonth() + 1)).slice(-2);
      let day = ('0' + d.getDate()).slice(-2);
      let year = d.getFullYear();
      return `${month}/${day}/${year}`;
    }

    // Combine address fields into a single string
    function formatAddress(address) {
      return [
        address.addressLine1 || "",
        address.addressLine2 || "",
        address.city || "",
        address.state || "",
        address.zipCode || "",
        address.country || ""
      ].filter(line => line).join(', ');
    }

    // Construct the request body
    let body = [
      {
        "MerchantId": "The_Belt" // Replace with actual MerchantId if necessary
      },
      {
        "OrderNumber": transactionRequest.wixTransactionId,
        "OrderAmount": orderAmount.toString(),
        "OrderDueDate": formatDate(new Date()), // Adjust to your actual due date
        "OrderType": "Service",
        "IssueDate": formatDate(new Date()), // Adjust to your actual issue date
        "OrderExpireAfterSeconds": "0",
        "CustomerName": `${transactionRequest.order.description.billingAddress.firstName} ${transactionRequest.order.description.billingAddress.lastName}`,
        "CustomerMobile": transactionRequest.order.description.billingAddress.phone || "",
        "CustomerEmail": transactionRequest.order.description.billingAddress.email || "",
        "CustomerAddress": formatAddress(transactionRequest.order.description.billingAddress) // Combine address fields
      }
    ];

    console.log("Request body:", JSON.stringify(body)); // Log the request body

    // Send the order creation request to the PayPro API
    const paymentProviderResponse = await payproRequest('POST', '/v2/ppro/co', body, transactionRequest.merchantCredentials.clientId, transactionRequest.merchantCredentials.clientsecret);

    // Handle the response
    if (paymentProviderResponse.status === 'success') {
      // Example response handling
      console.log("Formatted response:", JSON.stringify(paymentProviderResponse.data));
      return { 
        'pluginTransactionId': paymentProviderResponse.data.OrderNumber, 
        'redirectUrl': paymentProviderResponse.data.Click2Pay // Use the Click2Pay URL for redirecting
      };
    } else {
      return {
        'status': 'FAILURE',
        'reasonCode': 6000,
        'errorCode': 'GENERAL_ERROR',
        'errorMessage': paymentProviderResponse.message || 'Something went wrong with the order request'
      };
    }
  } catch (error) {
    console.error('Error creating order request: ', error);
    return {
      'status': 'FAILURE',
      'errorCode': 'ORDER_ERROR',
      'errorMessage': error.message
    };
  }
}

/**
 * This payment plugin endpoint is triggered when a merchant refunds a payment made on a Wix site.
 * The plugin has to process this refund request but prevent double refunds for the same `wixRefundId`.
 * @param {import('interfaces-psp-v1-payment-service-provider').RefundTransactionOptions} options
 * @returns {Promise<import('interfaces-psp-v1-payment-service-provider').CreateRefundResponse>}
 */
export const refundTransaction = async (options, context) => {
  try {
    let refundSession = await createRefund(options);
    return refundSession;
  } catch (error) {
    return error;
  }
};

I see the below in log

"root":{
"insertId":"..........XcCgHqxL01DOApUrd85cbF"
"timestamp":"2024-09-10T22:23:37.762Z"
"labels":{
"siteUrl":"n/a"
"revision":"2514"
"namespace":"Velo"
"tenantId":"f834fac1-1fd9-48d3-a66d-86af61d917ef"
"viewMode":"Site"
}
"operation":{
"id":"1726006981.8944167359422923258"
"producer":"backend"
}
"jsonPayload":{
"message":"{"__tag":"ValidationError","errors":[{"path":"","message":"must NOT have additional properties"}]}"
}
"severity":"ERROR"
"receiveTimestamp":"2024-09-10T22:23:37.848Z"
}

i receive a response with Paypro Id and short_Click2Pay which is a payment url. when i open tihs url in a browser it shows the payment page. i have been on this for two days and unable to fix this. the body has the parameters that paypro api needs. im not sure what additonal properties are being sent. Also is my code correct or missing something in call back url for create order method

Anyhelp is appreciated