tonder-web-sdk 1.16.3 → 1.16.6-beta.DEV-1433.2

package/src/classes/3dsHandler.js

@@ -1,199 +0,0 @@
-export class ThreeDSHandler {
-  constructor({ payload = null, apiKey, baseUrl }) {
-    this.baseUrl = baseUrl;
-    this.apiKey = apiKey;
-    this.payload = payload;
-  }
-
-  saveVerifyTransactionUrl() {
-    const url = this.payload?.next_action?.redirect_to_url?.verify_transaction_status_url;
-    if (url) {
-      this.saveUrlWithExpiration(url);
-    } else {
-      const url = this.payload?.next_action?.iframe_resources?.verify_transaction_status_url;
-      if (url) {
-        this.saveUrlWithExpiration(url);
-      } else {
-        console.log("No verify_transaction_status_url found");
-      }
-    }
-  }
-
-  saveUrlWithExpiration(url) {
-    try {
-      const now = new Date();
-      const item = {
-        url: url,
-        // Expires after 20 minutes
-        expires: now.getTime() + 20 * 60 * 1000,
-      };
-      localStorage.setItem("verify_transaction_status", JSON.stringify(item));
-    } catch (error) {
-      console.log("error: ", error);
-    }
-  }
-
-  getUrlWithExpiration() {
-    const item = JSON.parse(localStorage.getItem("verify_transaction_status"));
-    if (!item) return;
-
-    const now = new Date();
-    if (now.getTime() > item.expires) {
-      this.removeVerifyTransactionUrl();
-      return null;
-    } else {
-      return item.url;
-    }
-  }
-
-  removeVerifyTransactionUrl() {
-    localStorage.removeItem("verify_transaction_status");
-  }
-
-  getVerifyTransactionUrl() {
-    return localStorage.getItem("verify_transaction_status");
-  }
-
-  loadIframe() {
-    const iframe = this.payload?.next_action?.iframe_resources?.iframe;
-    if (iframe) {
-      return new Promise((resolve, reject) => {
-        const iframe = this.payload?.next_action?.iframe_resources?.iframe;
-
-        if (iframe) {
-          // TODO: This is not working for Azul
-          this.saveVerifyTransactionUrl();
-          const container = document.createElement("div");
-          container.innerHTML = iframe;
-          document.body.appendChild(container);
-
-          // Create and append the script tag manually
-          const script = document.createElement("script");
-          script.textContent = 'document.getElementById("tdsMmethodForm").submit();';
-          container.appendChild(script);
-
-          // Resolve the promise when the iframe is loaded
-          const iframeElement = document.getElementById("tdsMmethodTgtFrame");
-          iframeElement.onload = () => resolve(true);
-        } else {
-          console.log("No redirection found");
-          reject(false);
-        }
-      });
-    }
-  }
-
-  getRedirectUrl() {
-    return this.payload?.next_action?.redirect_to_url?.url;
-  }
-
-  redirectToChallenge() {
-    const url = this.getRedirectUrl();
-    if (url) {
-      this.saveVerifyTransactionUrl();
-      window.location = url;
-    } else {
-      console.log("No redirection found");
-    }
-  }
-
-  // Returns an object
-  // https://example.com/?name=John&age=30&city=NewYork
-  // { name: "John", age: "30", city: "NewYork" }
-  getURLParameters() {
-    const parameters = {};
-    const urlParams = new URLSearchParams(window.location.search);
-
-    for (const [key, value] of urlParams) {
-      parameters[key] = value;
-    }
-
-    return parameters;
-  }
-
-  // TODO: Remove this duplication
-  handleSuccessTransaction(response) {
-    this.removeVerifyTransactionUrl();
-    console.log("Transacción autorizada");
-    return response;
-  }
-
-  handleDeclinedTransaction(response) {
-    this.removeVerifyTransactionUrl();
-    return response;
-  }
-
-  async handle3dsChallenge(response_json) {
-    // Create the form element:
-    const form = document.createElement("form");
-    form.name = "frm";
-    form.method = "POST";
-    form.action = response_json.redirect_post_url;
-
-    // Add hidden fields:
-    const creqInput = document.createElement("input");
-    creqInput.type = "hidden";
-    creqInput.name = "creq";
-    creqInput.value = response_json.creq;
-    form.appendChild(creqInput);
-
-    if (response_json.term_url) {
-      const termUrlInput = document.createElement("input");
-      termUrlInput.type = "hidden";
-      termUrlInput.name = "TermUrl";
-      termUrlInput.value = response_json.term_url;
-      form.appendChild(termUrlInput);
-    }
-
-    // Append the form to the body:
-    document.body.appendChild(form);
-    form.submit();
-  }
-
-  // TODO: This works for Azul
-  async handleTransactionResponse(response) {
-    const response_json = await response.json();
-    // Azul property
-    if (response_json.status === "Pending" && response_json.redirect_post_url) {
-      return await this.handle3dsChallenge(response_json);
-    } else if (["Success", "Authorized"].includes(response_json.status)) {
-      return this.handleSuccessTransaction(response_json);
-    } else {
-      this.handleDeclinedTransaction();
-      return response_json;
-    }
-  }
-
-  async verifyTransactionStatus() {
-    const verifyUrl = this.getUrlWithExpiration();
-    if (verifyUrl) {
-      const url = `${this.baseUrl}${verifyUrl}`;
-      try {
-        const response = await fetch(url, {
-          method: "GET",
-          headers: {
-            "Content-Type": "application/json",
-            Authorization: `Token ${this.apiKey}`,
-          },
-          // body: JSON.stringify(data),
-        });
-        if (response.status !== 200) {
-          console.error("La verificación de la transacción falló.");
-          this.removeVerifyTransactionUrl();
-          return response;
-        }
-
-        return await this.handleTransactionResponse(response);
-      } catch (error) {
-        console.error("Error al verificar la transacción:", error);
-        this.removeVerifyTransactionUrl();
-      }
-    } else {
-      console.log("No verify_transaction_status_url found");
-    }
-  }
-
-  setPayload = payload => {
-    this.payload = payload;
-  };
-}

package/src/classes/BaseInlineCheckout.js

@@ -1,303 +0,0 @@
-import { ThreeDSHandler } from "./3dsHandler.js";
-import {
-  createOrder,
-  fetchBusiness,
-  getOpenpayDeviceSessionID,
-  registerOrFetchCustomer,
-} from "../data";
-import { TONDER_URL_BY_MODE } from "../shared/constants/tonderUrl";
-import { globalLoader } from "./globalLoader";
-import { createPayment, startCheckoutRouter } from "../data/checkoutApi";
-import { getBrowserInfo, injectMercadoPagoSecurity } from "../helpers/utils";
-
-export class BaseInlineCheckout {
-  baseUrl = "";
-  cartTotal = "0";
-  secureToken = "";
-  constructor({ mode = "stage", apiKey, returnUrl, callBack = () => {} }) {
-    this.apiKeyTonder = apiKey;
-    this.returnUrl = returnUrl;
-    this.callBack = callBack;
-    this.mode = mode;
-    this.baseUrl = TONDER_URL_BY_MODE[this.mode] || TONDER_URL_BY_MODE["stage"];
-    this.abortController = new AbortController();
-    this.process3ds = new ThreeDSHandler({
-      apiKey: apiKey,
-      baseUrl: this.baseUrl,
-    });
-  }
-
-  /**
-   * The configureCheckout function allows you to set initial information, such as the customer's email, which is used to retrieve a list of saved cards.
-   * @param {import("../../types").IConfigureCheckout} data - Configuration data including customer information and potentially other settings.
-   * @returns {void}.
-   * @public
-   */
-  configureCheckout(data) {
-    if ("secureToken" in data) this.#handleSecureToken(data["secureToken"]);
-    this.#setCheckoutData(data);
-  }
-
-  /**
-   * Verifies the 3DS transaction status.
-   * @returns {Promise<import("../../types").ITransaction | void>} The result of the 3DS verification and checkout resumption.
-   * @public
-   */
-  async verify3dsTransaction() {
-    globalLoader.show();
-    const result3ds = await this.process3ds.verifyTransactionStatus();
-    const resultCheckout = await this.#resumeCheckout(result3ds);
-    this.process3ds.setPayload(resultCheckout);
-    const response = await this.#handle3dsRedirect(resultCheckout);
-    globalLoader.remove();
-    return response;
-  }
-
-  /**
-   * Processes a payment.
-   * @param {import("../../types").IProcessPaymentRequest} data - Payment data including customer, cart, and other relevant information.
-   * @returns {Promise<import("../../types").IStartCheckoutResponse>} A promise that resolves with the payment response or 3DS redirect or is rejected with an error.
-   *
-   * @throws {Error} Throws an error if the checkout process fails. The error object contains
-   * additional `details` property with the response from the server if available.
-   * @property {import("../../types").IStartCheckoutErrorResponse} error.details - The response body from the server when an error occurs.
-   *
-   * @public
-   */
-  payment(data) {
-    return new Promise(async (resolve, reject) => {
-      try {
-        this.#setCheckoutData(data);
-        const response = await this._checkout(data);
-        this.process3ds.setPayload(response);
-        this.callBack(response);
-        const payload = await this.#handle3dsRedirect(response);
-        if (payload) {
-          resolve(response);
-        }
-      } catch (error) {
-        reject(error);
-      }
-    });
-  }
-
-  async _initializeCheckout() {
-    const { mercado_pago } = await this.#fetchMerchantData();
-
-    if (!!mercado_pago && !!mercado_pago.active) {
-      injectMercadoPagoSecurity();
-    }
-  }
-
-  async _getCustomer(customer, signal) {
-    return await registerOrFetchCustomer(this.baseUrl, this.apiKeyTonder, customer, signal);
-  }
-
-  async _checkout() {
-    throw new Error("The #checkout method should be implement in child classes.");
-  }
-
-  _setCartTotal(total) {
-    throw new Error("The #setCartTotal method should be implement in child classes.");
-  }
-
-  async _handleCheckout({ card, payment_method, customer }) {
-    const { openpay_keys, reference, business } = this.merchantData;
-    const total = Number(this.cartTotal);
-    try {
-      let deviceSessionIdTonder;
-      if (!deviceSessionIdTonder && openpay_keys.merchant_id && openpay_keys.public_key) {
-        deviceSessionIdTonder = await getOpenpayDeviceSessionID(
-          openpay_keys.merchant_id,
-          openpay_keys.public_key,
-          this.abortController.signal,
-        );
-      }
-
-      const { id, auth_token } = customer;
-
-      const orderItems = {
-        business: this.apiKeyTonder,
-        client: auth_token,
-        billing_address_id: null,
-        shipping_address_id: null,
-        amount: total,
-        status: "A",
-        reference: reference,
-        is_oneclick: true,
-        items: this.cartItems,
-      };
-      const jsonResponseOrder = await createOrder(this.baseUrl, this.apiKeyTonder, orderItems);
-
-      // Create payment
-      const now = new Date();
-      const dateString = now.toISOString();
-
-      const paymentItems = {
-        business_pk: business.pk,
-        client_id: id,
-        amount: total,
-        date: dateString,
-        order_id: jsonResponseOrder.id,
-        customer_order_reference: this.order_reference ? this.order_reference : reference,
-      };
-      const jsonResponsePayment = await createPayment(
-        this.baseUrl,
-        this.apiKeyTonder,
-        paymentItems,
-      );
-
-      // Checkout router
-      const routerItems = {
-        name: this.firstName || "",
-        last_name: this.lastName || "",
-        email_client: this.email,
-        phone_number: this.phone,
-        return_url: this.returnUrl,
-        id_product: "no_id",
-        quantity_product: 1,
-        id_ship: "0",
-        instance_id_ship: "0",
-        amount: total,
-        title_ship: "shipping",
-        description: "transaction",
-        device_session_id: deviceSessionIdTonder ? deviceSessionIdTonder : null,
-        token_id: "",
-        order_id: jsonResponseOrder.id,
-        business_id: business.pk,
-        payment_id: jsonResponsePayment.pk,
-        source: "sdk",
-        metadata: this.metadata,
-        browser_info: getBrowserInfo(),
-        currency: this.currency,
-        ...(!!payment_method ? { payment_method } : { card }),
-        ...(typeof MP_DEVICE_SESSION_ID !== "undefined"
-          ? { mp_device_session_id: MP_DEVICE_SESSION_ID }
-          : {}),
-      };
-
-      const jsonResponseRouter = await startCheckoutRouter(
-        this.baseUrl,
-        this.apiKeyTonder,
-        routerItems,
-      );
-
-      if (jsonResponseRouter) {
-        return jsonResponseRouter;
-      } else {
-        return false;
-      }
-    } catch (error) {
-      console.log(error);
-      throw error;
-    }
-  }
-
-  #setCheckoutData(data) {
-    if (!data) return;
-    this.#handleCustomer(data.customer);
-    this._setCartTotal(data.cart?.total);
-    this.#setCartItems(data.cart?.items);
-    this.#handleMetadata(data);
-    this.#handleCurrency(data);
-    this.#handleCard(data);
-  }
-
-  async #fetchMerchantData() {
-    this.merchantData = await fetchBusiness(
-      this.baseUrl,
-      this.apiKeyTonder,
-      this.abortController.signal,
-    );
-    return this.merchantData;
-  }
-
-  async #resumeCheckout(response) {
-    // Stop the routing process if the transaction is either hard declined or successful
-    if (response?.decline?.error_type === "Hard" || !!response?.checkout?.is_route_finished) {
-      return response;
-    }
-
-    if (["Success", "Authorized"].includes(response?.transaction_status)) {
-      return response;
-    }
-
-    if (response) {
-      globalLoader.show();
-      const routerItems = {
-        checkout_id: response?.checkout?.id,
-      };
-      try {
-        return await startCheckoutRouter(this.baseUrl, this.apiKeyTonder, routerItems);
-      } catch (error) {
-        // throw error
-      } finally {
-        globalLoader.remove();
-      }
-      return response;
-    }
-  }
-
-  #handleCustomer(customer) {
-    if (!customer) return;
-
-    this.firstName = customer?.firstName;
-    this.lastName = customer?.lastName;
-    this.country = customer?.country;
-    this.address = customer?.street;
-    this.city = customer?.city;
-    this.state = customer?.state;
-    this.postCode = customer?.postCode;
-    this.email = customer?.email;
-    this.phone = customer?.phone;
-    this.customer = customer;
-  }
-
-  #handleSecureToken(secureToken) {
-    this.secureToken = secureToken;
-  }
-
-  #handleMetadata(data) {
-    this.metadata = data?.metadata;
-    this.order_reference = data?.order_reference;
-  }
-
-  #handleCurrency(data) {
-    this.currency = data?.currency;
-  }
-
-  #handleCard(data) {
-    this.card = data?.card;
-  }
-
-  #setCartItems(items) {
-    this.cartItems = items;
-  }
-
-  async #handle3dsRedirect(response) {
-    console.log("Handling 3DS redirect...");
-    const iframe = response?.next_action?.iframe_resources?.iframe;
-    const threeDsChallenge = response?.next_action?.three_ds_challenge;
-
-    if (iframe) {
-      try {
-        await this.process3ds.loadIframe();
-        const res = await this.process3ds.verifyTransactionStatus();
-        return res;
-      } catch (error) {
-        console.log("Error loading iframe:", error);
-      }
-    } else if (threeDsChallenge) {
-      await this.process3ds.handle3dsChallenge(threeDsChallenge);
-      const res = await this.process3ds.verifyTransactionStatus();
-      return res;
-    } else {
-      const redirectUrl = this.process3ds.getRedirectUrl();
-      if (redirectUrl) {
-        this.process3ds.redirectToChallenge();
-      } else {
-        return response;
-      }
-    }
-  }
-}

package/src/classes/LiteInlineCheckout.js

@@ -1,217 +0,0 @@
-import { BaseInlineCheckout } from "./BaseInlineCheckout";
-import {
-  fetchCustomerAPMs,
-  fetchCustomerCards,
-  saveCustomerCard,
-  removeCustomerCard,
-  registerOrFetchCustomer,
-} from "../data";
-import { getSkyflowTokens } from "../helpers/skyflow";
-import { getPaymentMethodDetails } from "../shared/catalog/paymentMethodsCatalog";
-import { formatPublicErrorResponse, getCardType } from "../helpers/utils";
-import { MESSAGES } from "../shared/constants/messages";
-
-export class LiteInlineCheckout extends BaseInlineCheckout {
-  #customerData;
-  constructor({ mode = "stage", apiKey, returnUrl, callBack = () => {} }) {
-    super({ mode, apiKey, returnUrl, callBack });
-  }
-
-  /**
-   * Initializes and prepares the checkout for use.
-   * This method set up the initial environment.
-   * @returns {Promise<void>} A promise that resolves when the checkout has been initialized.
-   * @throws {Error} If there's any problem during the checkout initialization.
-   * @public
-   */
-  async injectCheckout() {
-    await this._initializeCheckout();
-  }
-
-  /**
-   * Retrieves the list of cards associated with a customer.
-   * @returns {Promise<import("../../types").ICustomerCardsResponse>} A promise that resolves with the customer's card data.
-   *
-   * @throws {import("../../types").IPublicError} Throws an error object if the operation fails.
-   *
-   * @public
-   */
-  async getCustomerCards() {
-    try {
-      const { auth_token } = await this.#getCustomer();
-      const response = await fetchCustomerCards(
-        this.baseUrl,
-        auth_token,
-        this.secureToken,
-        this.merchantData.business.pk,
-      );
-      return {
-        ...response,
-        cards: response.cards.map(ic => ({
-          ...ic,
-          icon: getCardType(ic.fields.card_scheme),
-        })),
-      };
-    } catch (error) {
-      throw formatPublicErrorResponse(
-        {
-          message: MESSAGES.getCardsError,
-        },
-        error,
-      );
-    }
-  }
-
-  /**
-   * Saves a card to a customer's account. This method can be used to add a new card
-   * or update an existing one.
-   * @param {import("../../types").ISaveCardRequest} card - The card information to be saved.
-   * @returns {Promise<import("../../types").ISaveCardResponse>} A promise that resolves with the saved card data.
-   *
-   * @throws {import("../../types").IPublicError} Throws an error object if the operation fails.
-   *
-   * @public
-   */
-  async saveCustomerCard(card) {
-    try {
-      const { auth_token } = await this.#getCustomer();
-      const { vault_id, vault_url, business } = this.merchantData;
-
-      const skyflowTokens = await getSkyflowTokens({
-        vault_id: vault_id,
-        vault_url: vault_url,
-        data: card,
-        baseUrl: this.baseUrl,
-        apiKey: this.apiKeyTonder,
-      });
-
-      return await saveCustomerCard(
-        this.baseUrl,
-        auth_token,
-        this.secureToken,
-        business?.pk,
-        skyflowTokens,
-      );
-    } catch (error) {
-      throw formatPublicErrorResponse(
-        {
-          message: MESSAGES.saveCardError,
-        },
-        error,
-      );
-    }
-  }
-
-  /**
-   * Removes a card from a customer's account.
-   * @param {string} skyflowId - The unique identifier of the card to be deleted.
-   * @returns {Promise<string>} A promise that resolves when the card is successfully deleted.
-   *
-   * @throws {import("../../types").IPublicError} Throws an error object if the operation fails.
-   *
-   * @public
-   */
-  async removeCustomerCard(skyflowId) {
-    try {
-      const { auth_token } = await this.#getCustomer();
-      const { business } = this.merchantData;
-
-      return await removeCustomerCard(
-        this.baseUrl,
-        auth_token,
-        this.secureToken,
-        skyflowId,
-        business?.pk,
-      );
-    } catch (error) {
-      throw formatPublicErrorResponse(
-        {
-          message: MESSAGES.removeCardError,
-        },
-        error,
-      );
-    }
-  }
-
-  /**
-   * Retrieves the list of available Alternative Payment Methods (APMs).
-   * @returns {Promise<import("../../types").IPaymentMethod[]>} A promise that resolves with the list of APMs.
-   *
-   * @throws {import("../../types").IPublicError} Throws an error object if the operation fails.
-   *
-   * @public
-   */
-  async getCustomerPaymentMethods() {
-    try {
-      const response = await fetchCustomerAPMs(this.baseUrl, this.apiKeyTonder);
-
-      const apms_results =
-        response && "results" in response && response["results"].length > 0
-          ? response["results"]
-          : [];
-
-      return apms_results
-        .filter(apmItem => apmItem.category.toLowerCase() !== "cards")
-        .map(apmItem => {
-          const apm = {
-            id: apmItem.pk,
-            payment_method: apmItem.payment_method,
-            priority: apmItem.priority,
-            category: apmItem.category,
-            ...getPaymentMethodDetails(apmItem.payment_method),
-          };
-          return apm;
-        })
-        .sort((a, b) => a.priority - b.priority);
-    } catch (error) {
-      throw formatPublicErrorResponse(
-        {
-          message: MESSAGES.getPaymentMethodsError,
-        },
-        error,
-      );
-    }
-  }
-
-  _setCartTotal(total) {
-    this.cartTotal = total;
-  }
-
-  async _checkout({ card, payment_method }) {
-    const customer = await this._getCustomer(this.customer, this.abortController.signal);
-    const { vault_id, vault_url } = this.merchantData;
-    let skyflowTokens;
-    if (!payment_method || payment_method !== "" || payment_method === null) {
-      if (typeof card === "string") {
-        skyflowTokens = {
-          skyflow_id: card,
-        };
-      } else {
-        skyflowTokens = await getSkyflowTokens({
-          vault_id: vault_id,
-          vault_url: vault_url,
-          data: { ...card, card_number: card.card_number.replace(/\s+/g, "") },
-          baseUrl: this.baseUrl,
-          apiKey: this.apiKeyTonder,
-        });
-      }
-    }
-
-    return await this._handleCheckout({
-      card: skyflowTokens,
-      payment_method,
-      customer,
-    });
-  }
-
-  async #getCustomer() {
-    if (!!this.#customerData) return this.#customerData;
-
-    this.#customerData = await registerOrFetchCustomer(
-      this.baseUrl,
-      this.apiKeyTonder,
-      this.customer,
-    );
-    return this.#customerData;
-  }
-}