lbry-desktop/ui/page/wallet/view.jsx

48 lines
1.1 KiB
JavaScript

// @flow
import React from 'react';
import { useHistory } from 'react-router';
import TxoList from 'component/txoList';
import Page from 'component/page';
import WalletBalance from 'component/walletBalance';
import Spinner from 'component/spinner';
import YrblWalletEmpty from 'component/yrblWalletEmpty';
type Props = {
history: { action: string, push: (string) => void, replace: (string) => void },
location: { search: string, pathname: string },
totalBalance: ?number,
};
const WalletPage = (props: Props) => {
const {
location: { search },
} = useHistory();
const { totalBalance } = props;
const showIntro = totalBalance === 0;
const loading = totalBalance === undefined;
return (
<Page>
{loading && (
<div className="main--empty">
<Spinner delayed />
</div>
)}
{!loading && (
<>
{showIntro ? (
<YrblWalletEmpty includeWalletLink />
) : (
<div className="card-stack">
<WalletBalance />
<TxoList search={search} />
</div>
)}
</>
)}
</Page>
);
};
export default WalletPage;