6532efdfad
show superchats in order properly scroll properly when switching tabs calculate fiat tips properly sum up lbc amounts refactor code a bit remove why isnt this working bit bugfix cant tip fiat if no lbc balance add toast when someone does a tip for a comment add error toast for card page show error on account connection page automatically truncate to two decimals close to working perfectly show decimals value better increase size of input value one bug left but almost working perfectly reverse so newest transactions come first fixing bug caused by floating point precision eslint fixes remove unused conditional get stuff ready for merge bugfix and cleanup requested changes fixing flow errors fix last flow error and touchups fiat and lbc tabs coming along support setting currency as the default tab via query param add wallet fiat balance fixing naming add fiat transactions using es6 to populate data should be fine but keeps crashing transaction listing working add no transactions thing about to add a third tab add third tab add card last 4 to transaction history some renaming show payments successfully show filler for subscriptions display if no transactions or subs working but in the wrong component approaching something thats working showing total tipped amount about to add last couple features cleanup More touchups adding last features calculate the total amount of unique creators tipped couple touchups remove transaction listings from settings add view transactions buttons small optimization add subscriptions section fix lot of linting errors and make command more userful
99 lines
3.4 KiB
JavaScript
99 lines
3.4 KiB
JavaScript
// @flow
|
|
import * as ICONS from 'constants/icons';
|
|
import * as PAGES from 'constants/pages';
|
|
import React from 'react';
|
|
import CreditAmount from 'component/common/credit-amount';
|
|
import Button from 'component/button';
|
|
import Card from 'component/common/card';
|
|
import Icon from 'component/common/icon';
|
|
import I18nMessage from 'component/i18nMessage';
|
|
|
|
type Props = {
|
|
accountDetails: any,
|
|
};
|
|
|
|
const WalletBalance = (props: Props) => {
|
|
const {
|
|
accountDetails,
|
|
} = props;
|
|
|
|
console.log('account details');
|
|
console.log(accountDetails);
|
|
|
|
const [detailsExpanded, setDetailsExpanded] = React.useState(false);
|
|
|
|
return (
|
|
<>{<Card
|
|
title={<><Icon size="18" icon={ICONS.FINANCE} />{(accountDetails && (accountDetails.total_received_unpaid / 100)) || 0} USD</>}
|
|
subtitle={
|
|
<I18nMessage>
|
|
This is your remaining balance that can still be withdrawn to your bank account
|
|
</I18nMessage>
|
|
}
|
|
actions={
|
|
<>
|
|
<h2 className="section__title--small">
|
|
${(accountDetails && (accountDetails.total_tipped / 100)) || 0} Total Received Tips
|
|
</h2>
|
|
|
|
<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 */}
|
|
{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>
|
|
</>
|
|
}
|
|
/>}</>
|
|
);
|
|
};
|
|
|
|
export default WalletBalance;
|