fix(electron): sync network status display with Settings in real-time

Previously, the network badge (testnet/mainnet) in Layout sidebar only
loaded once on mount and didn't update when user changed network in
Settings page.

Changes:
- Layout.tsx: Read network from localStorage first (consistent with
  transaction.ts), then fallback to Electron API
- Layout.tsx: Listen for 'storage' event (cross-tab) and custom
  'kava-network-change' event (same-tab) to update display
- Settings.tsx: Dispatch custom event when switching networks so
  Layout can update immediately

Android app doesn't have this issue - it uses StateFlow which
automatically triggers re-renders when settings change.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
hailin 2026-01-01 03:24:19 -08:00
parent fd5f4d10ed
commit 77bbb43eb5
2 changed files with 39 additions and 3 deletions

View File

@ -26,9 +26,41 @@ export default function Layout({ children }: LayoutProps) {
useEffect(() => {
checkAllServices();
// 获取当前 Kava 网络
window.electronAPI?.kava.getNetwork().then(result => {
setKavaNetwork(result.network);
});
const loadNetwork = () => {
// 优先从 localStorage 读取(与 transaction.ts 保持一致)
const storedNetwork = localStorage.getItem('kava_network') as 'mainnet' | 'testnet' | null;
if (storedNetwork) {
setKavaNetwork(storedNetwork);
} else {
// 后备:从 Electron API 读取
window.electronAPI?.kava.getNetwork().then(result => {
setKavaNetwork(result.network);
});
}
};
loadNetwork();
// 监听 localStorage 变化(当其他标签页切换网络时触发)
const handleStorageChange = (e: StorageEvent) => {
if (e.key === 'kava_network' && e.newValue) {
setKavaNetwork(e.newValue as 'mainnet' | 'testnet');
}
};
// 监听同一窗口的自定义事件Settings 页面切换网络时触发)
const handleCustomNetworkChange = (e: Event) => {
const customEvent = e as CustomEvent<{ network: 'mainnet' | 'testnet' }>;
setKavaNetwork(customEvent.detail.network);
};
window.addEventListener('storage', handleStorageChange);
window.addEventListener('kava-network-change', handleCustomNetworkChange);
return () => {
window.removeEventListener('storage', handleStorageChange);
window.removeEventListener('kava-network-change', handleCustomNetworkChange);
};
}, [checkAllServices]);
const handleRefresh = async () => {

View File

@ -187,6 +187,8 @@ export default function Settings() {
setKavaNetwork('testnet');
// 同步到 localStorage 供前端工具函数使用
localStorage.setItem('kava_network', 'testnet');
// 触发自定义事件通知 Layout 更新网络状态显示
window.dispatchEvent(new CustomEvent('kava-network-change', { detail: { network: 'testnet' } }));
setMessage({ type: 'success', text: '已切换到 Kava 测试网' });
}
}}
@ -201,6 +203,8 @@ export default function Settings() {
setKavaNetwork('mainnet');
// 同步到 localStorage 供前端工具函数使用
localStorage.setItem('kava_network', 'mainnet');
// 触发自定义事件通知 Layout 更新网络状态显示
window.dispatchEvent(new CustomEvent('kava-network-change', { detail: { network: 'mainnet' } }));
setMessage({ type: 'success', text: '已切换到 Kava 主网' });
}
}}