Bug🐛: multiple useChain() instances in a single React Component/Page renders only one

[kombos]

Describe the bug.

The test conditions have been reproduced in the branch: testBranch1

There are two useChain() implementation described in the js file: views->MntlToGravityBridge.js, with console.log set here

the bug is, on executing the app, only one of the useChain instances renders properly (first one), while the other still shows 'undefined/disconnected'

Describe the steps to reproduce the behavior

1. Run the App
2. go to the 'bridge' main menu item, to go to the bridge page, which as 4 subsections: assetmantle, gravity, ethereum and polygon
3. if you are already connected, disconnect the wallet using the button at the top right in the navbar
4. connect wallet again using button at the top right of navbar
5. Go to the browser console and check the value of the console log statement mentioned previously in bug description
6. The log only shows the wallet data for Assetmantle populated, while that of gravity is "undefined", "disconnected".

Expected behavior.

in the console log, the wallet data for both AssetMantle and Gravity chain should be populated

Screenshots.

Operating environment

macOS Ventura

Additional context

No response