mostly done with doing the iteration
This commit is contained in:
parent
4688b4bf58
commit
b3d3a1a454
3 changed files with 30 additions and 52 deletions
|
@ -10,6 +10,8 @@ import Card from 'component/common/card';
|
|||
import LbcSymbol from 'component/common/lbc-symbol';
|
||||
import I18nMessage from 'component/i18nMessage';
|
||||
import { formatNumberWithCommas } from 'util/number';
|
||||
import Icon from 'component/common/icon';
|
||||
|
||||
|
||||
type Props = {
|
||||
balance: number,
|
||||
|
@ -63,6 +65,7 @@ const WalletBalance = (props: Props) => {
|
|||
}, [doFetchUtxoCounts, balance, detailsExpanded]);
|
||||
|
||||
return (
|
||||
<div className={'columns'}>
|
||||
<Card
|
||||
title={<LbcSymbol postfix={formatNumberWithCommas(totalBalance)} isTitle />}
|
||||
subtitle={
|
||||
|
@ -181,6 +184,32 @@ const WalletBalance = (props: Props) => {
|
|||
</>
|
||||
}
|
||||
/>
|
||||
|
||||
<Card
|
||||
title={<><Icon size={18} icon={ICONS.FINANCE} />32 USD</>}
|
||||
subtitle={32 &&
|
||||
<I18nMessage>
|
||||
This is your pending balance that will be automatically sent to your bank account
|
||||
</I18nMessage>
|
||||
}
|
||||
actions={
|
||||
<>
|
||||
<h2 className="section__title--small">
|
||||
$32 Total Received Tips
|
||||
</h2>
|
||||
|
||||
<h2 className="section__title--small">
|
||||
$0 Withdrawn
|
||||
</h2>
|
||||
|
||||
<div className="section__actions">
|
||||
<Button button="secondary" label={__('Manage Accounts')} icon={ICONS.SETTINGS} navigate={`/$/${PAGES.SETTINGS_STRIPE_ACCOUNT}`} />
|
||||
<Button button="secondary" label={__('Manage Cards')} icon={ICONS.SETTINGS} navigate={`/$/${PAGES.SETTINGS_STRIPE_CARD}`} />
|
||||
</div>
|
||||
</>
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
|
|
|
@ -32,57 +32,9 @@ const WalletBalance = (props: Props) => {
|
|||
|
||||
<h2 className="section__title--small">
|
||||
${(accountDetails && (accountDetails.total_paid_out / 100)) || 0} Withdrawn
|
||||
{/* <Button */}
|
||||
{/* button="link" */}
|
||||
{/* label={detailsExpanded ? __('View less') : __('View more')} */}
|
||||
{/* iconRight={detailsExpanded ? ICONS.UP : ICONS.DOWN} */}
|
||||
{/* onClick={() => setDetailsExpanded(!detailsExpanded)} */}
|
||||
{/* /> */}
|
||||
</h2>
|
||||
|
||||
{/* view more section */}
|
||||
{/* commenting out because not implemented, but could be used in the future */}
|
||||
{/* {detailsExpanded && ( */}
|
||||
{/* <div className="section__subtitle"> */}
|
||||
{/* <dl> */}
|
||||
{/* <dt> */}
|
||||
{/* <span className="dt__text">{__('Earned from uploads')}</span> */}
|
||||
{/* /!* <span className="help--dt">({__('Earned from channel page')})</span> *!/ */}
|
||||
{/* </dt> */}
|
||||
{/* <dd> */}
|
||||
{/* <span className="dd__text"> */}
|
||||
{/* {Boolean(1) && ( */}
|
||||
{/* <Button */}
|
||||
{/* button="link" */}
|
||||
{/* className="dd__button" */}
|
||||
{/* icon={ICONS.UNLOCK} */}
|
||||
{/* /> */}
|
||||
{/* )} */}
|
||||
{/* <CreditAmount amount={1} precision={4} /> */}
|
||||
{/* </span> */}
|
||||
{/* </dd> */}
|
||||
|
||||
{/* <dt> */}
|
||||
{/* <span className="dt__text">{__('Earned from channel page')}</span> */}
|
||||
{/* /!* <span className="help--dt">({__('Delete or edit past content to spend')})</span> *!/ */}
|
||||
{/* </dt> */}
|
||||
{/* <dd> */}
|
||||
{/* <CreditAmount amount={1} precision={4} /> */}
|
||||
{/* </dd> */}
|
||||
|
||||
{/* /!* <dt> *!/ */}
|
||||
{/* /!* <span className="dt__text">{__('...supporting content')}</span> *!/ */}
|
||||
{/* /!* <span className="help--dt">({__('Delete supports to spend')})</span> *!/ */}
|
||||
{/* /!* </dt> *!/ */}
|
||||
{/* /!* <dd> *!/ */}
|
||||
{/* /!* <CreditAmount amount={1} precision={4} /> *!/ */}
|
||||
{/* /!* </dd> *!/ */}
|
||||
{/* </dl> */}
|
||||
{/* </div> */}
|
||||
{/* )} */}
|
||||
|
||||
<div className="section__actions">
|
||||
{/* <Button button="primary" label={__('Receive Payout')} icon={ICONS.SEND} /> */}
|
||||
<Button button="secondary" label={__('Account Configuration')} icon={ICONS.SETTINGS} navigate={`/$/${PAGES.SETTINGS_STRIPE_ACCOUNT}`} />
|
||||
</div>
|
||||
</>
|
||||
|
|
|
@ -159,6 +159,7 @@ const WalletPage = (props: Props) => {
|
|||
<>
|
||||
{/* @if TARGET='web' */}
|
||||
<Page>
|
||||
<WalletBalance />
|
||||
<Tabs onChange={onTabChange} index={tabIndex}>
|
||||
<TabList className="tabs__list--collection-edit-page">
|
||||
<Tab>{__('LBRY Credits')}</Tab>
|
||||
|
@ -182,7 +183,6 @@ const WalletPage = (props: Props) => {
|
|||
<YrblWalletEmpty includeWalletLink />
|
||||
) : (
|
||||
<div className="card-stack">
|
||||
<WalletBalance />
|
||||
<TxoList search={search} />
|
||||
</div>
|
||||
)}
|
||||
|
@ -193,13 +193,11 @@ const WalletPage = (props: Props) => {
|
|||
</TabPanel>
|
||||
<TabPanel>
|
||||
<div className="section card-stack">
|
||||
<WalletFiatBalance accountDetails={accountStatusResponse} />
|
||||
<WalletFiatAccountHistory transactions={accountTransactionResponse} />
|
||||
</div>
|
||||
</TabPanel>
|
||||
<TabPanel>
|
||||
<div className="section card-stack">
|
||||
<WalletFiatPaymentBalance transactions={customerTransactions} accountDetails={accountStatusResponse} />
|
||||
<WalletFiatPaymentHistory transactions={customerTransactions} />
|
||||
</div>
|
||||
</TabPanel>
|
||||
|
@ -220,7 +218,6 @@ const WalletPage = (props: Props) => {
|
|||
<YrblWalletEmpty includeWalletLink />
|
||||
) : (
|
||||
<div className="card-stack">
|
||||
<WalletBalance />
|
||||
<TxoList search={search} />
|
||||
</div>
|
||||
)}
|
||||
|
|
Loading…
Reference in a new issue