Actualmente estoy desarrollando una aplicación usando Stripe Terminal para pagos físicos. Estoy usando una aplicación Electron que usa ReactJS para mostrar la interfaz del Punto de Venta. Debido a que este punto de venta utiliza varias páginas para diferentes funciones de caja debido a la naturaleza inusual del negocio, el software POS actualmente tiene varias páginas para manejar clientes y otras tareas administrativas, y una página de pago para cobrar a los clientes. Puedo hacer que la terminal funcione, pero en este momento, cada vez que la página se recarga o voy a otra página, pierdo la instancia de la terminal que tenía y tengo que volver a conectarme a la terminal, lo cual no es lo ideal. Estoy tratando de encontrar una manera de que una vez que abra la aplicación, se conecte a la terminal y luego retenga esa instancia durante todo el tiempo que la aplicación esté abierta.

La instancia de la terminal de Stripe debe crearse en el lado del cliente, por lo que tengo un archivo stripe.js cargado en ReactJS index.html, y en el archivo stripe.js creo una nueva instancia de la terminal con:

 var terminal = this.StripeTerminal.create({ onFetchConnectionToken: fetchConnectionToken, onUnexpectedReaderDisconnect: terminalDisconnected, });

pero cuando se recarga la pagina o voy a otra pagina, recarga el archivo stripe.js y la terminal se vuelve a conectar.

Intenté almacenar el objeto en localStorage usando los métodos que se encuentran aquí , pero no funcionó porque ejecutar una función del objeto terminal no funcionó (es decir JSON.parse(localStorage.getItem('terminal')).setReaderDisplay() )

¿Cómo puedo evitar que el archivo stripe.js se vuelva a cargar cada vez, o que el terminal se cree una vez y acceda a él en toda la aplicación?

¡Cualquier ayuda se agradece, gracias!