tonder-web-sdk 1.16.1 → 1.16.6-beta.DEV-1433.1

package/src/data/cardApi.js

@@ -1,143 +0,0 @@
-import {
-  buildErrorResponse,
-  buildErrorResponseFromCatch,
-} from "../helpers/utils";
-import {MESSAGES} from "../shared/constants/messages";
-
-/**
- * Saves or updates a customer's card information.
- *
- * This function sends a POST request to save or update the card information for a customer.
- *
- * @param {string} baseUrl - The base URL of the API.
- * @param {string} customerToken - The customer's authentication token.
- * @param {string} secureToken - Token generated by secure-token endpoint.
- * @param {string | number} businessId - The business ID.
- * @param {import("../../types").ISaveCardSkyflowRequest} data - The card information to be saved.
- * @returns {Promise<import("../../types").ISaveCardResponse>} The saved card data.
- *
- * @throws {import("../../types").IApiError} Throws an error object if the save/update operation fails.
- */
-export async function saveCustomerCard(
-  baseUrl,
-  customerToken,
-  secureToken,
-  businessId,
-  data,
-) {
-  try {
-    const url = `${baseUrl}/api/v1/business/${businessId}/cards/`;
-    const response = await fetch(url, {
-      method: "POST",
-      headers: {
-        Authorization: `Bearer ${secureToken}`,
-        "User-Token": customerToken,
-        "Content-Type": "application/json",
-      },
-      body: JSON.stringify(data),
-    });
-
-    if (response.ok) return await response.json();
-
-    const res_json = await response.json();
-    if (response.status === 409) {
-      if ((res_json.error = "Card number already exists.")) {
-        return {
-          code: 200,
-          body: res_json,
-          name: "",
-          message: res_json.error,
-        };
-      }
-    }
-    throw await buildErrorResponse(response, res_json);
-  } catch (error) {
-    throw buildErrorResponseFromCatch(error);
-  }
-}
-
-/**
- * Removes a customer's card.
- * @param {string} baseUrl - The base URL of the  API.
- * @param {string} customerToken - The customer's authentication token.
- * @param {string} secureToken - Token generated by secure-token endpoint.
- * @param {string} skyflowId - The Skyflow ID of the card to be removed.
- * @param {string} businessId - The business ID.
- * @returns {Promise<string>} The result of the card removal operation.
- *
- * @throws {import("../../types").IApiError} Throws an error object if the operation fails.
- */
-export async function removeCustomerCard(
-  baseUrl,
-  customerToken,
-  secureToken,
-  skyflowId = "",
-  businessId,
-) {
-  try {
-    const url = `${baseUrl}/api/v1/business/${businessId}/cards/${skyflowId}`;
-
-    const response = await fetch(url, {
-      method: "DELETE",
-      headers: {
-        Authorization: `Bearer ${secureToken}`,
-        "Content-Type": "application/json",
-        "User-Token": customerToken,
-      },
-    });
-
-    if(response.status === 204) return MESSAGES.cardSaved;
-    if (response.ok && "json" in response) return await response.json();
-    const res_json = await response.json();
-
-    throw await buildErrorResponse(response, res_json);
-  } catch (error) {
-    throw buildErrorResponseFromCatch(error);
-  }
-}
-
-/**
- * Fetches a customer's saved cards.
- * @param {string} baseUrl - The base URL of the  API.
- * @param {string} customerToken - The customer's authentication token.
- * @param {string} secureToken - Token generated by secure-token endpoint.
- * @param {string} businessId - The business ID.
- * @param {AbortSignal} signal - The abort signal to cancel the request.
- * @returns {Promise<import("../../types").ICustomerCardsResponse>} The customer's saved cards.
- *
- * @throws {import("../../types").IApiError} Throws an error object if the operation fails.
- */
-export async function fetchCustomerCards(
-  baseUrl,
-  customerToken,
-  secureToken,
-  businessId,
-  signal= null,
-) {
-  try {
-    const url = `${baseUrl}/api/v1/business/${businessId}/cards/`;
-    const response = await fetch(url, {
-      method: "GET",
-      headers: {
-        Authorization: `Bearer ${secureToken}`,
-        "User-Token": customerToken,
-      },
-      signal,
-    });
-    if (response.ok) return await response.json();
-    if (response.status === 401) {
-      return {
-        code: 401,
-        body: {},
-        name: "",
-        message: "Unauthorized",
-      };
-    }
-
-    const res_json = await response.json();
-
-    throw await buildErrorResponse(response, res_json, MESSAGES.getCardsError);
-  } catch (error) {
-    throw buildErrorResponseFromCatch(error, MESSAGES.getCardsError);
-  }
-}

package/src/data/checkoutApi.js

@@ -1,92 +0,0 @@
-/**
- * Creates a new order in the  system.
- * @param {string} baseUrl - The base URL of the  API.
- * @param {string} apiKey - The API key for authentication.
- * @param {Object} orderItems - The items to be included in the order.
- * @returns {Promise<Object>} The created order data.
- */
-export async function createOrder(baseUrl, apiKey, orderItems) {
-    const url = `${baseUrl}/api/v1/orders/`;
-    const data = orderItems;
-    const response = await fetch(url, {
-        method: "POST",
-        headers: {
-            "Content-Type": "application/json",
-            Authorization: `Token ${apiKey}`,
-        },
-        body: JSON.stringify(data),
-    });
-    if (response.status === 201) {
-        const jsonResponse = await response.json();
-        return jsonResponse;
-    } else {
-        throw new Error(`Error: ${response.statusText}`);
-    }
-}
-
-/**
- * Creates a new payment in the  system.
- * @param {string} baseUrl - The base URL of the  API.
- * @param {string} apiKey - The API key for authentication.
- * @param {Object} paymentItems - The payment details.
- * @returns {Promise<Object>} The created payment data.
- */
-export async function createPayment(baseUrl, apiKey, paymentItems) {
-    const url = `${baseUrl}/api/v1/business/${paymentItems.business_pk}/payments/`;
-    const data = paymentItems;
-    const response = await fetch(url, {
-        method: "POST",
-        headers: {
-            "Content-Type": "application/json",
-            Authorization: `Token ${apiKey}`,
-        },
-        body: JSON.stringify(data),
-    });
-    if (response.status >= 200 && response.status <=299) {
-        const jsonResponse = await response.json();
-        return jsonResponse;
-    } else {
-        throw new Error(`Error: ${response.statusText}`);
-    }
-}
-
-/**
- * Initiates the checkout process.
- *
- * This function sends a POST request to the checkout router API with the provided
- * checkout details. If the request is successful, it returns the response data.
- * If the request fails, it throws an error that includes the status and details of the failure.
- *
- * @param {string} baseUrl - The base URL of the API.
- * @param {string} apiKey - The API key for authentication.
- * @param {import("../../types").IStartCheckoutRequest | import("../../types").IStartCheckoutIdRequest} routerItems - The checkout details to be sent in the request body.
- * @returns {Promise<import("../../types").IStartCheckoutResponse>} The checkout process result.
- *
- * @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.
- */
-export async function startCheckoutRouter(baseUrl, apiKey, routerItems) {
-    try {
-        const url = `${baseUrl}/api/v1/checkout-router/`;
-        const data = routerItems;
-        const response = await fetch(url, {
-            method: "POST",
-            headers: {
-                "Content-Type": "application/json",
-                Authorization: `Token ${apiKey}`,
-            },
-            body: JSON.stringify(data),
-        });
-        if (response.status >= 200 && response.status <= 299) {
-            return await response.json();
-        } else {
-            const errorResponse = await response.json();
-            const error = new Error("Failed to start checkout router");
-            error.details = errorResponse;
-            throw error;
-        }
-    } catch (error) {
-        throw error
-    }
-}

package/src/data/customerApi.js

@@ -1,37 +0,0 @@
-/**
- * Registers a new customer or fetches an existing customer.
- * @param {string} baseUrl - The base URL of the  API.
- * @param {string} apiKey - The API key for authentication.
- * @param {Object} customer - The customer data.
- * @param {AbortSignal} signal - The abort signal to cancel the request.
- * @returns {Promise<Object>} The registered or fetched customer data.
- */
-export async function registerOrFetchCustomer(
-  baseUrl,
-  apiKey,
-  customer,
-  signal = null,
-) {
-  const url = `${baseUrl}/api/v1/customer/`;
-  const data = {
-    email: customer.email,
-    first_name: customer?.firstName,
-    last_name: customer?.lastName,
-    phone: customer?.phone,
-  };
-  const response = await fetch(url, {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/json",
-      Authorization: `Token ${apiKey}`,
-    },
-    signal: signal,
-    body: JSON.stringify(data),
-  });
-
-  if (response.status === 201) {
-    return await response.json();
-  } else {
-    throw new Error(`Error: ${response.statusText}`);
-  }
-}

package/src/data/index.js

@@ -1,17 +0,0 @@
-import { fetchBusiness } from './businessApi';
-import { registerOrFetchCustomer } from './customerApi';
-import { createOrder } from './checkoutApi';
-import { saveCustomerCard, removeCustomerCard, fetchCustomerCards } from './cardApi';
-import { fetchCustomerAPMs } from './apmApi';
-import { getOpenpayDeviceSessionID } from './openPayApi';
-
-export {
-    registerOrFetchCustomer,
-    createOrder,
-    saveCustomerCard,
-    removeCustomerCard,
-    fetchCustomerCards,
-    fetchBusiness,
-    fetchCustomerAPMs,
-    getOpenpayDeviceSessionID
-};

package/src/data/openPayApi.js

@@ -1,16 +0,0 @@
-/**
- * Generates an Openpay device session ID.
- * @param {string} merchant_id - The Openpay merchant ID.
- * @param {string} public_key - The Openpay public key.
- * @param {AbortSignal} signal - The abort signal to cancel the request.
- * @returns {Promise<string>} The generated device session ID.
- */
-
-export async function getOpenpayDeviceSessionID(merchant_id, public_key, signal) {
-    let openpay = await window.OpenPay;
-    openpay.setId(merchant_id);
-    openpay.setApiKey(public_key);
-    openpay.setSandboxMode(true);
-    var response = await openpay.deviceData.setup({signal});
-    return response;
-}

package/src/data/skyflowApi.js

@@ -1,18 +0,0 @@
-
-
-export async function getVaultToken (baseUrl, apiKey, signal = null){
-    const response = await fetch(`${baseUrl}/api/v1/vault-token/`, {
-        method: 'GET',
-        headers: {
-            'Authorization': `Token ${apiKey}`,
-        },
-        signal: signal,
-    });
-
-    if (response.ok) {
-        const responseBody = await response.json();
-        return responseBody.token;
-    } else {
-        throw new Error('Failed to retrieve bearer token');
-    }
-}

package/src/helpers/skyflow.js

@@ -1,361 +0,0 @@
-import { defaultStyles } from "./styles";
-import {getVaultToken} from "../data/skyflowApi";
-import {buildErrorResponseFromCatch} from "./utils";
-
-export async function initSkyflow(
-  vaultId,
-  vaultUrl,
-  baseUrl,
-  apiKey,
-  signal,
-  customStyles = {},
-  collectorIds,
-) {
-  const skyflow = await initializeSkyflow(vaultId, vaultUrl, baseUrl, apiKey, signal);
-
-  // Create collect Container.
-  const collectContainer = await skyflow.container(
-    Skyflow.ContainerType.COLLECT
-  );
-
-  // Custom styles for collect elements.
-  var collectStylesOptions = Object.keys(customStyles).length === 0 ? defaultStyles : customStyles
-
-  const stylesForCardNumber = { ...collectStylesOptions.inputStyles.base };
-  stylesForCardNumber.textIndent = '44px';
-
-  const lengthMatchRule = {
-    type: Skyflow.ValidationRuleType.LENGTH_MATCH_RULE,
-    params: {
-      max: 70,
-    },
-  };
-
-
-
-  const cardHolderNameElement = await collectContainer.create({
-    table: "cards",
-    column: "cardholder_name",
-    ...collectStylesOptions,
-    label: collectStylesOptions.labels?.nameLabel,
-    placeholder: collectStylesOptions.placeholders?.namePlaceholder,
-    type: Skyflow.ElementType.CARDHOLDER_NAME,
-    validations: [lengthMatchRule, regexMatchRule],
-  });
-
-  handleSkyflowElementEvents(
-    cardHolderNameElement,
-    "titular de la tarjeta",
-    collectStylesOptions.errorTextStyles
-  );
-
-  // Create collect elements.
-  const cardNumberElement = await collectContainer.create({
-    table: "cards",
-    column: "card_number",
-    ...collectStylesOptions,
-    inputStyles: {
-      ...collectStylesOptions.inputStyles,
-      base: stylesForCardNumber
-    },
-    label: collectStylesOptions.labels?.cardLabel,
-    placeholder: collectStylesOptions.placeholders?.cardPlaceholder,
-    type: Skyflow.ElementType.CARD_NUMBER,
-    validations: [regexMatchRule],
-  });
-
-  handleSkyflowElementEvents(
-    cardNumberElement,
-    "número de tarjeta",
-    collectStylesOptions.errorTextStyles
-  );
-
-  const cvvElement = await collectContainer.create({
-    table: "cards",
-    column: "cvv",
-    ...collectStylesOptions,
-    label: collectStylesOptions.labels?.cvvLabel,
-    placeholder: collectStylesOptions.placeholders?.cvvPlaceholder,
-    type: Skyflow.ElementType.CVV,
-    validations: [regexMatchRule],
-  });
-
-  handleSkyflowElementEvents(
-    cvvElement,
-    "",
-    collectStylesOptions.errorTextStyles
-  );
-
-  const expiryMonthElement = await collectContainer.create({
-    table: "cards",
-    column: "expiration_month",
-    ...collectStylesOptions,
-    label: collectStylesOptions.labels?.expiryDateLabel,
-    placeholder: collectStylesOptions.placeholders?.expiryMonthPlaceholder,
-    type: Skyflow.ElementType.EXPIRATION_MONTH,
-    validations: [regexMatchRule],
-  });
-
-  handleSkyflowElementEvents(
-    expiryMonthElement,
-    "",
-    collectStylesOptions.errorTextStyles
-  );
-
-  const expiryYearElement = await collectContainer.create({
-    table: "cards",
-    column: "expiration_year",
-    ...collectStylesOptions,
-    label: "",
-    placeholder: collectStylesOptions.placeholders?.expiryYearPlaceholder,
-    type: Skyflow.ElementType.EXPIRATION_YEAR,
-    validations: [regexMatchRule],
-  });
-
-  handleSkyflowElementEvents(
-    expiryYearElement,
-    "",
-    collectStylesOptions.errorTextStyles
-  );
-
-
-  const elementsConfig = {
-    cardNumber: {
-      element: cardNumberElement,
-      container: "#collectCardNumber",
-    },
-    cvv: {
-      element: cvvElement,
-      container: "#collectCvv",
-    },
-    expiryMonth: {
-      element: expiryMonthElement,
-      container: "#collectExpirationMonth",
-    },
-    expiryYear: {
-      element: expiryYearElement,
-      container: "#collectExpirationYear",
-    },
-    cardHolderName: {
-      element: cardHolderNameElement,
-      container: "#collectCardholderName",
-    },
-  };
-
-  await mountElements(elementsConfig)
-
-  return {
-    container: collectContainer,
-    elements: { 
-      cardHolderNameElement, 
-      cardNumberElement, 
-      cvvElement, 
-      expiryMonthElement, 
-      expiryYearElement 
-    } 
-  }
-}
-
-
-export async function initUpdateSkyflow(
-                                    skyflowId,
-                                    vaultId,
-                                    vaultUrl,
-                                    baseUrl,
-                                    apiKey,
-                                    signal,
-                                    customStyles = {},
-                                          ){
-
-
-  const skyflow = await initializeSkyflow(vaultId, vaultUrl, baseUrl, apiKey, signal);
-
-  var collectStylesOptions = Object.keys(customStyles).length === 0 ? defaultStyles : customStyles
-
-
-  // Create collect Container.
-  const collectContainer = await skyflow.container(
-      Skyflow.ContainerType.COLLECT
-  );
-
-  const cvvElement = await collectContainer.create({
-    table: "cards",
-    column: "cvv",
-    ...collectStylesOptions,
-    label: collectStylesOptions.labels?.cvvLabel,
-    placeholder: collectStylesOptions.placeholders?.cvvPlaceholder,
-    type: Skyflow.ElementType.CVV,
-    validations: [regexMatchRule],
-    skyflowID: skyflowId
-  });
-
-  handleSkyflowElementEvents(
-      cvvElement,
-      "",
-      collectStylesOptions.errorTextStyles
-  );
-
-  const elementsConfig = {
-    cvv: {
-      element: cvvElement,
-      container: `#collectCvv${skyflowId}`,
-    }
-  };
-  await mountElements(elementsConfig)
-
-  return {
-    container: collectContainer,
-    elements: {
-      cvvElement,
-    }
-  }
-}
-
-async function initializeSkyflow(vaultId, vaultUrl, baseUrl, apiKey, signal){
-  return await Skyflow.init({
-    vaultID: vaultId,
-    vaultURL: vaultUrl,
-    getBearerToken: async () => {
-      // Pass the signal to the fetch call
-      return await getVaultToken(baseUrl, apiKey, signal)
-    },
-    options: {
-      logLevel: Skyflow.LogLevel.ERROR,
-      env: Skyflow.Env.DEV,
-    },
-  });
-}
-
-
-async function mountElements(elementsConfig) {
-  if (typeof elementsConfig !== "object" || elementsConfig === null) {
-    throw new Error("Invalid configuration object");
-  }
-
-  for (const [elementKey, { element, container }] of Object.entries(elementsConfig)) {
-    if (element && container) {
-      element.mount(container);
-    } else {
-      console.warn(
-          `Skipping mount for '${elementKey}' due to missing element or container.`
-      );
-    }
-  }
-}
-
-function handleSkyflowElementEvents(element, fieldMessage= "", error_styles = {}, resetOnFocus = true, requiredMessage = "El campo es requerido", invalidMessage= "El campo es inválido") {
-  if ("on" in element) {
-    element.on(Skyflow.EventName.CHANGE, (state) => {
-      updateErrorLabel(element, error_styles, "transparent")
-    });
-
-    element.on(Skyflow.EventName.BLUR, (state) => {
-      if (!state.isValid) {
-        const msj_error = state.isEmpty ? requiredMessage : fieldMessage != "" ?`El campo ${fieldMessage} es inválido`: invalidMessage;
-        element.setError(msj_error);
-      }
-      updateErrorLabel(element, error_styles)
-    });
-
-    element.on(Skyflow.EventName.FOCUS, (state) => {
-      updateErrorLabel(element, error_styles, "transparent")
-      element.resetError();
-    });
-  }
-}
-
-function updateErrorLabel(element, errorStyles, color = "" ){
-  if(Object.keys(errorStyles).length > 0){
-    element.update({
-      errorTextStyles: {
-        ...errorStyles,
-        base: {
-          ...(errorStyles.base && {...errorStyles.base}),
-          ...(color != "" && {color})
-        }
-      }
-    })
-  }
-}
-
-export async  function getSkyflowTokens({baseUrl, apiKey, vault_id, vault_url, data }) {
-  const skyflow = Skyflow.init({
-    vaultID: vault_id,
-    vaultURL: vault_url,
-    getBearerToken: async () => await getVaultToken(baseUrl, apiKey),
-    options: {
-      logLevel: Skyflow.LogLevel.ERROR,
-      env: Skyflow.Env.DEV,
-    },
-  });
-
-  const collectContainer = skyflow.container(Skyflow.ContainerType.COLLECT);
-
-  const fieldPromises = await getFieldsPromise(data, collectContainer);
-
-  const result = await Promise.all(fieldPromises);
-  const mountFail = result.some((item) => !item);
-
-  if (mountFail) {
-    throw buildErrorResponseFromCatch(
-        Error("Ocurrió un error al montar los campos de la tarjeta"),
-    );
-  } else {
-    try {
-      const collectResponseSkyflowTonder = await collectContainer.collect();
-      if (collectResponseSkyflowTonder)
-        return collectResponseSkyflowTonder["records"][0]["fields"];
-      throw buildErrorResponseFromCatch(
-          Error("Por favor, verifica todos los campos de tu tarjeta"),
-      );
-    } catch (error) {
-      throw buildErrorResponseFromCatch(error);
-    }
-  }
-}
-async function getFieldsPromise(data, collectContainer) {
-  const fields = await getFields(data, collectContainer);
-  if (!fields) return [];
-  return fields.map((field) => {
-    return new Promise((resolve) => {
-      const div = document.createElement("div");
-      div.hidden = true;
-      div.id = `id-${field.key}`;
-      document.querySelector(`body`)?.appendChild(div);
-      setTimeout(() => {
-        field.element.mount(`#id-${field.key}`);
-        setInterval(() => {
-          if (field.element.isMounted()) {
-            const value = data[field.key];
-            field.element.update({ value: value });
-            return resolve(field.element.isMounted());
-          }
-        }, 120);
-      }, 120);
-    });
-  })
-}
-
-async function getFields(data, collectContainer) {
-  return await Promise.all(
-      Object.keys(data).map(async (key) => {
-        const cardHolderNameElement = await collectContainer.create({
-          table: "cards",
-          column: key,
-          type: Skyflow.ElementType.INPUT_FIELD,
-        });
-        return { element: cardHolderNameElement, key: key };
-      })
-  )
-}
-
-const regexEmpty = RegExp("^(?!\s*$).+");
-const regexMatchRule = {
-  type: Skyflow.ValidationRuleType.REGEX_MATCH_RULE,
-  params: {
-    regex: regexEmpty,
-    error: "El campo es requerido" // Optional, default error is 'VALIDATION FAILED'.
-  }
-}
-
-