import React, { useState, useEffect } from 'react';
import { View, Text, FlatList, Button, ActivityIndicator } from 'react-native';
function BalanceScreen({ sdk }: { sdk: PrivacyBoost }) {
const [balances, setBalances] = useState<TokenBalance[]>([]);
const [loading, setLoading] = useState(true);
const loadBalances = async () => {
try {
const allBalances = await sdk.getAllBalances();
setBalances(allBalances);
} catch (error) {
console.log('Failed to load balances:', error);
}
setLoading(false);
};
useEffect(() => {
loadBalances();
}, []);
if (loading) return <ActivityIndicator />;
return (
<View style={{ padding: 16 }}>
<FlatList
data={balances}
keyExtractor={(item) => item.tokenAddress}
renderItem={({ item }) => (
<View style={{ paddingVertical: 8 }}>
<Text style={{ fontWeight: 'bold' }}>{item.symbol ?? item.tokenAddress}</Text>
<Text>Shielded: {sdk.formatAmount(item.shieldedBalance, item.decimals)}</Text>
<Text>Wallet: {sdk.formatAmount(item.walletBalance, item.decimals)}</Text>
</View>
)}
ListEmptyComponent={<Text>No balances found</Text>}
/>
<Button title="Refresh" onPress={loadBalances} />
</View>
);
}