Description: The app supports testnet and mainnet via NEXT_PUBLIC_STELLAR_NETWORK, but there's no UI to indicate which network the user is on, and no easy way to switch (it requires changing the env variable and restarting). For development, a network switcher is useful.
Requirements:
- Display the current network (Testnet/Mainnet) in the Topbar or footer
- Add a visual indicator: colored dot (yellow for testnet, green for mainnet)
- In development mode, add a network switcher toggle
- Show a warning banner when on testnet: "You are on Stellar Testnet — transactions use test tokens"
- Hide the switcher in production (or gate it behind an admin setting)
Suggested execution steps:
- In
components/layout/Topbar.tsx or Footer.tsx, add a network indicator
- Read
NEXT_PUBLIC_STELLAR_NETWORK from env
- Display "Testnet" with a yellow dot or "Mainnet" with a green dot
- Add a warning banner at the top of the app when on testnet
- Optionally add a toggle for dev mode that reloads with a different network
Example commit message:
feat(stellar): add Stellar network indicator and testnet warning banner
Added network indicator (Testnet/Mainnet with colored dot) to the Topbar.
Shows a persistent warning banner "You are on Stellar Testnet" for
testnet environments. Helps users and developers identify the active
network at a glance.
Description: The app supports testnet and mainnet via
NEXT_PUBLIC_STELLAR_NETWORK, but there's no UI to indicate which network the user is on, and no easy way to switch (it requires changing the env variable and restarting). For development, a network switcher is useful.Requirements:
Suggested execution steps:
components/layout/Topbar.tsxorFooter.tsx, add a network indicatorNEXT_PUBLIC_STELLAR_NETWORKfrom envExample commit message: