aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts
diff options
context:
space:
mode:
authorBrandon Millman <brandon.millman@gmail.com>2018-05-30 23:27:38 +0800
committerBrandon Millman <brandon.millman@gmail.com>2018-06-01 02:54:25 +0800
commitb76c7387851585500e4465aeb24e27bd564844a8 (patch)
tree7a00f48bec31bd0300cefc0c8fe764c850502f8f /packages/website/ts
parent8ca9fb0251e72d79a33c760ffd9a27f501748d27 (diff)
downloaddexon-sol-tools-b76c7387851585500e4465aeb24e27bd564844a8.tar
dexon-sol-tools-b76c7387851585500e4465aeb24e27bd564844a8.tar.gz
dexon-sol-tools-b76c7387851585500e4465aeb24e27bd564844a8.tar.bz2
dexon-sol-tools-b76c7387851585500e4465aeb24e27bd564844a8.tar.lz
dexon-sol-tools-b76c7387851585500e4465aeb24e27bd564844a8.tar.xz
dexon-sol-tools-b76c7387851585500e4465aeb24e27bd564844a8.tar.zst
dexon-sol-tools-b76c7387851585500e4465aeb24e27bd564844a8.zip
Tweaks
Diffstat (limited to 'packages/website/ts')
-rw-r--r--packages/website/ts/components/wallet/wallet.tsx35
-rw-r--r--packages/website/ts/components/wallet/wallet_disconnected_item.tsx2
2 files changed, 29 insertions, 8 deletions
diff --git a/packages/website/ts/components/wallet/wallet.tsx b/packages/website/ts/components/wallet/wallet.tsx
index 74f3cc24f..65d0ab235 100644
--- a/packages/website/ts/components/wallet/wallet.tsx
+++ b/packages/website/ts/components/wallet/wallet.tsx
@@ -7,6 +7,7 @@ import {
import { BigNumber } from '@0xproject/utils';
import { Web3Wrapper } from '@0xproject/web3-wrapper';
import * as _ from 'lodash';
+import CircularProgress from 'material-ui/CircularProgress';
import FlatButton from 'material-ui/FlatButton';
import FloatingActionButton from 'material-ui/FloatingActionButton';
import { ListItem } from 'material-ui/List';
@@ -128,6 +129,9 @@ const styles: Styles = {
color: colors.mediumBlue,
fontWeight: 'bold',
},
+ loadingBody: {
+ height: 381,
+ },
};
const ETHER_ICON_PATH = '/images/ether.png';
@@ -204,7 +208,16 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
: _.concat(this._renderDisconnectedHeaderRows(), this._renderDisconnectedRows());
}
private _renderLoadingRows(): React.ReactNode {
- return <div />;
+ return _.concat(this._renderDisconnectedHeaderRows(), this._renderLoadingBodyRows());
+ }
+ private _renderLoadingBodyRows(): React.ReactElement<{}> {
+ return (
+ <div className="flex items-center" style={styles.loadingBody}>
+ <div className="mx-auto">
+ <CircularProgress size={40} thickness={5} />
+ </div>
+ </div>
+ );
}
private _renderDisconnectedHeaderRows(): React.ReactElement<{}> {
const userAddress = this.props.userAddress;
@@ -213,6 +226,7 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
<StandardIconRow
icon={<ActionAccountBalanceWallet color={colors.mediumBlue} />}
main={primaryText.toUpperCase()}
+ style={styles.borderedItem}
/>
);
}
@@ -472,12 +486,18 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
);
}
private _renderValue(isLoaded: boolean, amount: BigNumber, decimals: number, price?: BigNumber): React.ReactNode {
- let result = '$00.00';
- if (!_.isUndefined(price) && isLoaded) {
- const unitAmount = Web3Wrapper.toUnitAmount(amount, decimals);
- const value = unitAmount.mul(price);
- const formattedAmount = value.toFixed(USD_DECIMAL_PLACES);
- result = `$${formattedAmount}`;
+ let result;
+ if (isLoaded) {
+ if (_.isUndefined(price)) {
+ result = '--';
+ } else {
+ const unitAmount = Web3Wrapper.toUnitAmount(amount, decimals);
+ const value = unitAmount.mul(price);
+ const formattedAmount = value.toFixed(USD_DECIMAL_PLACES);
+ result = `$${formattedAmount}`;
+ }
+ } else {
+ result = '$0.00';
}
return (
<PlaceHolder hideChildren={!isLoaded}>
@@ -627,6 +647,7 @@ const PlaceHolder = (props: PlaceHolderProps) => {
const rootStyle: React.CSSProperties = {
backgroundColor: rootBackgroundColor,
display: 'inline-block',
+ borderRadius: 2,
};
const childrenVisibility = props.hideChildren ? 'hidden' : 'visible';
const childrenStyle: React.CSSProperties = { visibility: childrenVisibility };
diff --git a/packages/website/ts/components/wallet/wallet_disconnected_item.tsx b/packages/website/ts/components/wallet/wallet_disconnected_item.tsx
index 39a62e1fb..17fd8a19e 100644
--- a/packages/website/ts/components/wallet/wallet_disconnected_item.tsx
+++ b/packages/website/ts/components/wallet/wallet_disconnected_item.tsx
@@ -31,7 +31,7 @@ const styles: Styles = {
},
};
-const ITEM_HEIGHT = 292;
+const ITEM_HEIGHT = 381;
const METAMASK_ICON_WIDTH = 35;
const LEDGER_ICON_WIDTH = 30;
const BUTTON_BOTTOM_PADDING = 80;