import { useState } from 'react';
function DepositForm() {
const [amount, setAmount] = useState('');
const [step, setStep] = useState('');
const [loading, setLoading] = useState(false);
const handleDeposit = async () => {
setLoading(true);
try {
const parsedAmount = await sdk.vault.parseAmount(tokenAddress, amount);
await sdk.vault.deposit({
tokenAddress,
amount: parsedAmount,
onProgress: ({ step, message }) => {
setStep(message);
},
});
alert('Deposit successful!');
} catch (error) {
alert(`Deposit failed: ${error.message}`);
} finally {
setLoading(false);
setStep('');
}
};
return (
<div>
<input
type="text"
value={amount}
onChange={(e) => setAmount(e.target.value)}
placeholder="Amount"
disabled={loading}
/>
<button onClick={handleDeposit} disabled={loading}>
{loading ? step || 'Processing...' : 'Deposit'}
</button>
</div>
);
}