aljaz/mutiny-web
1
0
Fork 0
mirror of https://github.com/aljazceru/mutiny-web.git synced 2025-12-24 01:24:28 +01:00
Code Issues Packages Projects Releases Wiki Activity

backup and restore prompts

Browse Source
This commit is contained in:
Paul Miller
2023-05-04 15:18:10 -05:00
parent 6fed129275
commit 91f66f345d
9 changed files with 164 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
src/components/BalanceBox.tsx
View File

@@ -17,54 +17,26 @@ function SyncingIndicator() {
}
export default function BalanceBox() {
const [state, _] = useMegaStore();
const fetchOnchainBalance = async () => {
console.log("Refetching onchain balance");
await state.node_manager?.sync();
const balance = await state.node_manager?.get_balance();
return balance
};
// TODO: it's hacky to do these separately, but ln doesn't need the sync so I don't want to wait
const fetchLnBalance = async () => {
console.log("Refetching ln balance");
const balance = await state.node_manager?.get_balance();
return balance
};
const [onChainBalance, { refetch: refetchOnChainBalance }] = createResource(fetchOnchainBalance);
const [lnBalance, { refetch: refetchLnBalance }] = createResource(fetchLnBalance);
function refetchBalance() {
refetchLnBalance();
refetchOnChainBalance();
}
const [state, actions] = useMegaStore();
return (
<>
<FancyCard title="Lightning">
<Suspense fallback={<Amount amountSats={0} showFiat loading={true} />}>
<Show when={lnBalance()}>
<Amount amountSats={lnBalance()?.lightning} showFiat />
</Show>
</Suspense>
<Amount amountSats={state.balance?.lightning || 0} showFiat />
</FancyCard>
<FancyCard title="On-Chain" tag={onChainBalance.loading && <SyncingIndicator />}>
<Suspense fallback={<Amount amountSats={0} showFiat loading={true} />}>
<div onClick={refetchBalance}>
<Amount amountSats={onChainBalance()?.confirmed} showFiat loading={onChainBalance.loading} />
</div>
</Suspense>
<FancyCard title="On-Chain" tag={state.is_syncing && <SyncingIndicator />}>
<div onClick={actions.sync}>
<Amount amountSats={state.balance?.confirmed} showFiat />
</div>
<Suspense>
<Show when={onChainBalance()?.unconfirmed}>
<Show when={state.balance?.unconfirmed}>
<div class="flex flex-col gap-2">
<header class='text-sm font-semibold uppercase text-white/50'>
Unconfirmed Balance
</header>
<div class="text-white/50">
{prettyPrintAmount(onChainBalance()?.unconfirmed)} <span class='text-sm'>SATS</span>
{prettyPrintAmount(state.balance?.unconfirmed)} <span class='text-sm'>SATS</span>
</div>
</div>
</Show>