Para MailMergic utilizamos tawk.to para nuestro chat en vivo. Con este widget, nuestros usuarios pueden enviarnos mensajes directamente desde nuestra aplicación.
Con la implementación anterior, nos encontrábamos con el problema de que todos los usuarios se nos mostraban en el dashboard de soporte en forma de V812368123891237 (o similar). En esta forma anonimizada, era difícil asignar las solicitudes de los usuarios a los usuarios registrados en nuestra aplicación.
Para mejorar nuestra atención al cliente, nos enfrentamos al reto de enviar atributos definidos por el usuario (como correo electrónico, nombre y apellidos) de nuestros usuarios registrados a la API de tawk.to.
Nos sorprendió un poco que no hubiera documentación al respecto, aunque React es uno de los frameworks de JavaScript más populares, y tawk.to también es un widget de chat muy popular.
A continuación te mostramos nuestra implementación en React.
En primer lugar, creamos un módulo que llama a la API tawk.to y le pasamos nuestros atributos definidos por el usuario durante el proceso onLoad (en nuestro ejemplo, correo electrónico, nombre y apellidos). Añadimos el módulo en el directorio src/util/tawkto.js.
A continuación, importamos este módulo en nuestro módulo AppRouter.js y utilizamos el gancho useEffect para llamar a nuestro módulo tawk.to:
Asegúrate de cargar el widget en la raíz de tu aplicación para que se muestre en todas las páginas.
Vea el código completo en Github.
