feat(web): add Freighter account & network event listeners to useWallet

[ShantelPeters]

Summary

hooks/useWallet.ts previously captured a static, one-shot snapshot of wallet state upon component mount and manual connection. If a user switched accounts or networks inside the Freighter browser extension mid-session, the application continued operating against stale wallet credentials until a manual page refresh.

This PR adds real-time event listeners for account and network changes in useWallet, ensuring seamless automatic synchronization with the Freighter extension.

---

Key Changes

• Freighter Event Listeners (useWallet.ts):
  • Dynamically imports @stellar/freighter-api and registers onAccountChange, onNetworkChange, and WatchWalletChanges fallback handlers.
  • Automatically updates wallet state (address, network, networkPassphrase, status) on wallet events.
• Mid-Session Address Change Toast:
  • Triggers a subtle notification ("Switched to GABC…XYZ") and accessibility announcement via useAnnounce when an active wallet address changes mid-session.
• Leak Safety & Teardown:
  • Stores unsubscribe handles (supporting both function returns and { remove: () => void } objects) and disposes of all listeners when the hook unmounts.
• Re-Render Loop Prevention:
  • Utilizes stable reference refs (announceRef, addNotificationRef) for context methods inside state update callbacks to eliminate infinite re-render loops.
• Demo Mode Isolation:
  • Skips Freighter extension event listener registration during active demo mode sessions (isDemoMode()).
• Comprehensive Unit Testing (useWallet.test.ts):
  • Added unit test cases covering account change registration, mid-session address change detection & toast output, network updates, and cleanup on unmount.

---

Verification & Testing

• TypeScript Type Check: tsc --noEmit on useWallet.ts and useWallet.test.ts passed with 0 errors.
• Automated Vitest Suite: All 24 unit tests in hooks/useWallet.test.ts and tests/useNetworkMismatch.test.ts passed cleanly.

 ✓ tests/useNetworkMismatch.test.ts (6 tests)
 ✓ hooks/useWallet.test.ts (18 tests)

 Test Files  2 passed (2)
      Tests  24 passed (24)

CLOSES #515 

[drips-wave]

@ShantelPeters Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

[coderabbitai]

Important

• 🔍 Trigger review

This repository does not receive automatic reviews because it has fewer than 10 stars.

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 68e28357-8cdf-47e7-b526-2bd6f77e2b9a

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}