El Vault Widget de DEUNA permite guardar tarjetas de crédito y débito de forma segura. Para iniciar el proceso, debes usar la función initElements. Esta configura el Vault Widget, verifica la conectividad a Internet y carga el enlace.

Paso 1: Completar los Primeros Pasos

Antes de integrar el Vault Widget, es necesario que completes la sección de primeros pasos. En esta sección, te explicamos los requisitos necesarios y cómo inicializar el SDK. Puedes encontrar más información en Primeros Pasos con el SDK de Android.

Una vez que hayas completado estos pasos, podrás continuar con el paso 2.

Paso 2: Mostrar el Widget

Para mostrar el Vault Widget, primero define los callbacks y luego levanta el widget con initElements

val callbacks = ElementsCallbacks().apply{
    onSuccess = { response ->
        deunaSDK.closeElements(...) // Cierra el VAULT widget
    },
    onError = { error ->
        // handle the error
        deunaSDK.closeElements(...) // Cierra el VAULT widget
    },
    onClosed = {
       // El VAULT widget fue cerrado
    },
    onCanceled = {
      // El VAULT widget fue cerrado por el usuario
      // No es necesario llamar a closeElements(...)
    },
    eventListener = { type, response ->
       // Escuchar los eventos
    }
}

// Muestra el VAULT widget
deunaSDK.initElements(
    context = YOUR_ACTIVITY_CONTEXT,
    userToken = "<DEUNA user token>", // optional
    userInfo = DeunaSDK.UserInfo("Esteban", "Posada", "[email protected]"), // optional
    callbacks = callbacks
)

Parámetros

Parámetro	Descripción
`callbacks`	Una instancia de la clase ElementsCallbacks, la cual contiene callbacks que serán llamados en caso de éxito, error, o cuando el widget se cierre.
`closeEvents`	Un conjunto de valores de tipo ElementsEvent que especifican cuándo cerrar automáticamente el VAULT widget. Consulta los eventos del VAULT widget aquí
`userToken` (Opcional)	El token de un usuario obtenido usando la API de DEUNA https://docs.deuna.com/reference/users-register https://docs.deuna.com/reference/request-otp https://docs.deuna.com/reference/login-with-otp
`userInfo`(Opcional)	Instancia de la clase `DeunaSDK.UserInfo` que contiene `firstName`, `lastName` y `email`. Importante: en caso que el `userToken` no se enviado o sea un string vacío (""), este parámetro es requerido.

Paso 3: Escuchar los Eventos del Widget

Es crucial manejar adecuadamente los eventos del Vault Widget para ofrecer una experiencia fluida a los usuarios. Define los callbacks necesarios para actualizar la interfaz de tu aplicación.

3.1 Callbacks

Callback	¿Cuándo se dispara?
`onSuccess`	Se ejecuta cuando una tarjeta se guarda exitosamente. Este callback contiene un parámetro de tipo Map<String,Any> .
`onError`	Se ejecuta cuando ocurre un error al guardar la tarjeta. Este callback contiene un parámetro de tipo `ElementsError`
`onClosed`	Se ejecuta cuando el Vault Widget se cierra, independientemente de si la operación fue exitosa o ocurrió un error. NOTA: El orden de ejecución de `onCanceled` y `onClosed` es el siguiente: - Si el usuario cierra manualmente el widget (presionando el botón X o presionando el botón de retroceso): `onCanceled` > `onClosed`. - Si se cierra el widget mediante código llamando a closePaymentWidget, solo se ejecuta `onClosed`.
`onCanceled`	Se ejecuta cuando el usuario de forma intencional cierra el widget (presionando el botón X o presionando el botón de retroceso) sin que la operación se haya completado.
`eventListener`	Se ejecuta cuando se detectan eventos específicos en el Vault Widget. Este callback contiene un parámetro de tipo `ElementsEvent`

Paso 4 (Opcional): Cerrar el Widget

Por defecto, el Vault Widget solo se cierra cuando el usuario presiona el botón de cerrar del widget o cuando presiona el botón de "retroceso" en iOS. Para cerrar el modal cuando una operación es exitosa o cuando ocurre un error, debes llamar a la función closeElements.

El siguiente código de ejemplo muestra cómo cerrar el widget cuando una tarjeta se guarda exitosamente

val callbacks = ElementsCallbacks().apply {
    onSuccess = { response ->
        deunaSDK.closeElements() // Cierra el Vault Widget
        // Tu código adicional
    }
}

// Muestra el Vault Widget
deunaSDK.initElements(
    context = YOUR_ACTIVITY_CONTEXT,
    userToken = "<DEUNA user token>", // optional
    userInfo = DeunaSDK.UserInfo("Esteban", "Posada", "[email protected]"), // optional
    callbacks = callbacks
)

Paso 5 (Opcional): Revisar Ejemplo Demo App

Para comprender mejor la integración del Vault Widget, revisa el proyecto de ejemplo proporcionado por DEUNA. Este ejemplo te ayudará a entender mejor cómo implementar el widget en tu aplicación Android.

Para acceder al proyecto de ejemplo y obtener más información, consulta la documentación del Ejemplo de Proyecto para Android.