Skip to content

feat: add Stellar network switching UI — testnet/mainnet toggle #389

@sanmipaul

Description

@sanmipaul

Summary

The frontend has no UI control for switching between Stellar Testnet and Mainnet. Users must manually edit environment variables and redeploy to change networks, which is error-prone and blocks QA workflows.

Desired Behavior

  • Network selector (Testnet / Mainnet) visible in the top navigation or settings panel
  • Switching network updates the Horizon URL, contract IDs, and passphrase used by `frontend/lib/contracts.ts`
  • Freighter wallet is prompted to switch to the matching network
  • Active network is persisted in `localStorage` and shown as a badge in the UI
  • Mainnet mode shows a prominent warning banner

Implementation Notes

  • Network config should live in `frontend/lib/network.ts` with typed `NetworkConfig` interface
  • Contract IDs per network stored in `frontend/lib/constants.ts`
  • Use Freighter's `setNetwork()` API when switching

Acceptance Criteria

  • Network toggle renders in nav
  • Switching network reloads contract clients with correct IDs
  • Freighter is notified of network change
  • Active network badge displayed
  • Mainnet warning shown
  • E2E test covers toggle behavior on testnet

References

  • `frontend/lib/contracts.ts`
  • `frontend/lib/constants.ts` (if exists)
  • Freighter API docs: `setNetwork()`

Metadata

Metadata

Labels

Stellar WaveIssues in the Stellar wave programenhancementNew feature or requestfrontendNext.js frontend work

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions