PHP XMPP Pre-binding for chat based on Ejabberd, Keeping users logged-in across page reloads

We are developing a website based on PhP, javascript. We have developed a chat client/window based on strophe.js.

We need to enable single-site login, whereby users already authenticated in your website will also automatically be logged in on the chat server, This session should also persist across page loads. In other words, we don’t want the user to have to give their chat credentials every time they reload the page.

We need you to help us to improve the code so that it can keep users logged-in across page reloads.
The purpose is to enable shared sessions whereby users already logged in to the website will also automatically be logged in on the XMPP server. Once a user is logged in, the session will be kept alive across page loads.

However, it’s not so stable. When we open a new page, the chat window will initiate the connection to the XMPP/Ejabberd server again.

We need you to help us either diagnose issue and fix all the related chat issues.
Or, help us integrate another XMPP/Ejabberd javascript client into our website. It needs to be stable. For example, integreate converse.js into our website.

In our project, we only use multi-user based chat, no individual chat.

The other chat issue is that, when a user has messages that have not been read, it should display a red dot, so that user knows there’s some new message.
These links might be helpful for you understand the issue.

https://archersys.readthedocs.io/en/stable/#prebinding-and-single-session-support

https://dev.libraryh3lp.com/http-pre-bind.html

https://phppackages.org/s/prebind

XMPP BOSH toolkit

https://hotexamples.com/examples/-/XmppPrebind/-/php-xmppprebind-class-examples.html

The work needs to be done within one week using remote control software like teamviewr or anydsk.