UI-REACT: Connect wallet button doesn't work with react-router-dom

[manylovv]

Bug description I use react-router-dom and @ton-connect/ui-react and they don't seem to work well together.

Let's say we have the 'Connect wallet' button on the '/' route, and we also have an '/about' route with some content.

When using the <Link /> component provided by the react-router-dom package, if we go from '/' to '/about' and then back to '/' (using <Link /> or the back arrow in the browser), the 'Connect wallet' button just disappears.

Steps to reproduce the behavior:

1. Clone this repo with an example - https://github.com/manylovv/ton-button-issue
2. Run npm install and npm run dev command in the console
3. Open localhost:5173 in your browser
4. Click the 'Go to about page' link
5. Go back to the home page by clicking 'Go to home page' link (you can also use browser history back arrow)
6. You can see that 'Connect wallet' button just disappears.

Expected behavior The button should be on the page after going back to the page

Screen recording with the issue https://www.loom.com/share/fd9ad90a1eb44836829f54012fce2c02

• OS: macOS
• Browser: Chrome
• Package version: 1.0.0-beta.5

[siandreev]

Fixed in @tonconnect/ui-react 1.0.0-beta.6

[manylovv]

@siandreev Thank you so much!