Change userEtherBalanceInWei to optional so we can know if its loading

This commit is contained in:
Brandon Millman
2018-05-31 11:40:21 -07:00
parent bee26daf0c
commit df27f4f118
13 changed files with 26 additions and 22 deletions

View File

@@ -10,7 +10,7 @@ export class BlockchainWatcher {
private _prevNetworkId: number; private _prevNetworkId: number;
private _shouldPollUserAddress: boolean; private _shouldPollUserAddress: boolean;
private _watchNetworkAndBalanceIntervalId: NodeJS.Timer; private _watchNetworkAndBalanceIntervalId: NodeJS.Timer;
private _prevUserEtherBalanceInWei: BigNumber; private _prevUserEtherBalanceInWei?: BigNumber;
private _prevUserAddressIfExists: string; private _prevUserAddressIfExists: string;
constructor( constructor(
dispatcher: Dispatcher, dispatcher: Dispatcher,
@@ -41,7 +41,7 @@ export class BlockchainWatcher {
} }
let prevNodeVersion: string; let prevNodeVersion: string;
this._prevUserEtherBalanceInWei = new BigNumber(0); this._prevUserEtherBalanceInWei = undefined;
this._dispatcher.updateNetworkId(this._prevNetworkId); this._dispatcher.updateNetworkId(this._prevNetworkId);
this._watchNetworkAndBalanceIntervalId = intervalUtils.setAsyncExcludingInterval( this._watchNetworkAndBalanceIntervalId = intervalUtils.setAsyncExcludingInterval(
async () => { async () => {
@@ -94,7 +94,7 @@ export class BlockchainWatcher {
} }
private async _updateUserWeiBalanceAsync(userAddress: string): Promise<void> { private async _updateUserWeiBalanceAsync(userAddress: string): Promise<void> {
const balanceInWei = await this._web3Wrapper.getBalanceInWeiAsync(userAddress); const balanceInWei = await this._web3Wrapper.getBalanceInWeiAsync(userAddress);
if (!balanceInWei.eq(this._prevUserEtherBalanceInWei)) { if (_.isUndefined(this._prevUserEtherBalanceInWei) || !balanceInWei.eq(this._prevUserEtherBalanceInWei)) {
this._prevUserEtherBalanceInWei = balanceInWei; this._prevUserEtherBalanceInWei = balanceInWei;
this._dispatcher.updateUserWeiBalance(balanceInWei); this._dispatcher.updateUserWeiBalance(balanceInWei);
} }

View File

@@ -18,7 +18,7 @@ interface EthWethConversionButtonProps {
ethToken: Token; ethToken: Token;
dispatcher: Dispatcher; dispatcher: Dispatcher;
blockchain: Blockchain; blockchain: Blockchain;
userEtherBalanceInWei: BigNumber; userEtherBalanceInWei?: BigNumber;
isOutdatedWrappedEther: boolean; isOutdatedWrappedEther: boolean;
onConversionSuccessful?: () => void; onConversionSuccessful?: () => void;
isDisabled?: boolean; isDisabled?: boolean;

View File

@@ -33,7 +33,7 @@ interface EthWrappersProps {
dispatcher: Dispatcher; dispatcher: Dispatcher;
tokenByAddress: TokenByAddress; tokenByAddress: TokenByAddress;
userAddress: string; userAddress: string;
userEtherBalanceInWei: BigNumber; userEtherBalanceInWei?: BigNumber;
lastForceTokenStateRefetch: number; lastForceTokenStateRefetch: number;
} }

View File

@@ -55,7 +55,7 @@ export interface LegacyPortalProps {
providerType: ProviderType; providerType: ProviderType;
screenWidth: ScreenWidths; screenWidth: ScreenWidths;
tokenByAddress: TokenByAddress; tokenByAddress: TokenByAddress;
userEtherBalanceInWei: BigNumber; userEtherBalanceInWei?: BigNumber;
userAddress: string; userAddress: string;
shouldBlockchainErrDialogBeOpen: boolean; shouldBlockchainErrDialogBeOpen: boolean;
userSuppliedOrderCache: Order; userSuppliedOrderCache: Order;

View File

@@ -14,7 +14,7 @@ export interface PortalOnboardingFlowProps {
providerType: ProviderType; providerType: ProviderType;
injectedProviderName: string; injectedProviderName: string;
blockchainIsLoaded: boolean; blockchainIsLoaded: boolean;
userEthBalanceInWei: BigNumber; userEtherBalanceInWei?: BigNumber;
tokenByAddress: TokenByAddress; tokenByAddress: TokenByAddress;
updateIsRunning: (isRunning: boolean) => void; updateIsRunning: (isRunning: boolean) => void;
updateOnboardingStep: (stepIndex: number) => void; updateOnboardingStep: (stepIndex: number) => void;
@@ -85,7 +85,7 @@ export class PortalOnboardingFlow extends React.Component<PortalOnboardingFlowPr
} }
private _userHasEth(): boolean { private _userHasEth(): boolean {
return this.props.userEthBalanceInWei > new BigNumber(0); return this.props.userEtherBalanceInWei > new BigNumber(0);
} }
private _userHasWeth(): boolean { private _userHasWeth(): boolean {

View File

@@ -57,7 +57,7 @@ export interface PortalProps {
providerType: ProviderType; providerType: ProviderType;
screenWidth: ScreenWidths; screenWidth: ScreenWidths;
tokenByAddress: TokenByAddress; tokenByAddress: TokenByAddress;
userEtherBalanceInWei: BigNumber; userEtherBalanceInWei?: BigNumber;
userAddress: string; userAddress: string;
shouldBlockchainErrDialogBeOpen: boolean; shouldBlockchainErrDialogBeOpen: boolean;
userSuppliedOrderCache: Order; userSuppliedOrderCache: Order;

View File

@@ -85,6 +85,9 @@ interface TokenBalancesState {
} }
export class TokenBalances extends React.Component<TokenBalancesProps, TokenBalancesState> { export class TokenBalances extends React.Component<TokenBalancesProps, TokenBalancesState> {
public static defaultProps: Partial<TokenBalancesProps> = {
userEtherBalanceInWei: new BigNumber(0),
};
private _isUnmounted: boolean; private _isUnmounted: boolean;
public constructor(props: TokenBalancesProps) { public constructor(props: TokenBalancesProps) {
super(props); super(props);

View File

@@ -61,7 +61,7 @@ export interface WalletProps {
dispatcher: Dispatcher; dispatcher: Dispatcher;
tokenByAddress: TokenByAddress; tokenByAddress: TokenByAddress;
trackedTokens: Token[]; trackedTokens: Token[];
userEtherBalanceInWei: BigNumber; userEtherBalanceInWei?: BigNumber;
lastForceTokenStateRefetch: number; lastForceTokenStateRefetch: number;
injectedProviderName: string; injectedProviderName: string;
providerType: ProviderType; providerType: ProviderType;
@@ -335,16 +335,16 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
private _renderEthRows(): React.ReactNode { private _renderEthRows(): React.ReactNode {
const icon = <img style={{ width: ICON_DIMENSION, height: ICON_DIMENSION }} src={ETHER_ICON_PATH} />; const icon = <img style={{ width: ICON_DIMENSION, height: ICON_DIMENSION }} src={ETHER_ICON_PATH} />;
const primaryText = this._renderAmount( const primaryText = this._renderAmount(
true, !_.isUndefined(this.props.userEtherBalanceInWei),
this.props.userEtherBalanceInWei, this.props.userEtherBalanceInWei || new BigNumber(0),
constants.DECIMAL_PLACES_ETH, constants.DECIMAL_PLACES_ETH,
constants.ETHER_SYMBOL, constants.ETHER_SYMBOL,
); );
const etherToken = this._getEthToken(); const etherToken = this._getEthToken();
const etherPrice = this.state.trackedTokenStateByAddress[etherToken.address].price; const etherPrice = this.state.trackedTokenStateByAddress[etherToken.address].price;
const secondaryText = this._renderValue( const secondaryText = this._renderValue(
true, !_.isUndefined(this.props.userEtherBalanceInWei) && !_.isUndefined(etherPrice),
this.props.userEtherBalanceInWei, this.props.userEtherBalanceInWei || new BigNumber(0),
constants.DECIMAL_PLACES_ETH, constants.DECIMAL_PLACES_ETH,
etherPrice, etherPrice,
); );
@@ -407,7 +407,8 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
): React.ReactNode { ): React.ReactNode {
const shouldShowWrapEtherItem = const shouldShowWrapEtherItem =
!_.isUndefined(this.state.wrappedEtherDirection) && !_.isUndefined(this.state.wrappedEtherDirection) &&
this.state.wrappedEtherDirection === accessoryItemConfig.wrappedEtherDirection; this.state.wrappedEtherDirection === accessoryItemConfig.wrappedEtherDirection &&
!_.isUndefined(this.props.userEtherBalanceInWei);
const additionalStyle = shouldShowWrapEtherItem ? walletItemStyles.focusedItem : styles.borderedItem; const additionalStyle = shouldShowWrapEtherItem ? walletItemStyles.focusedItem : styles.borderedItem;
const style = { ...styles.tokenItem, ...additionalStyle }; const style = { ...styles.tokenItem, ...additionalStyle };
const etherToken = this._getEthToken(); const etherToken = this._getEthToken();

View File

@@ -24,7 +24,7 @@ interface ConnectedState {
providerType: ProviderType; providerType: ProviderType;
tokenByAddress: TokenByAddress; tokenByAddress: TokenByAddress;
lastForceTokenStateRefetch: number; lastForceTokenStateRefetch: number;
userEtherBalanceInWei: BigNumber; userEtherBalanceInWei?: BigNumber;
screenWidth: ScreenWidths; screenWidth: ScreenWidths;
shouldBlockchainErrDialogBeOpen: boolean; shouldBlockchainErrDialogBeOpen: boolean;
userAddress: string; userAddress: string;

View File

@@ -21,7 +21,7 @@ interface ConnectedState {
providerType: ProviderType; providerType: ProviderType;
tokenByAddress: TokenByAddress; tokenByAddress: TokenByAddress;
lastForceTokenStateRefetch: number; lastForceTokenStateRefetch: number;
userEtherBalanceInWei: BigNumber; userEtherBalanceInWei?: BigNumber;
screenWidth: ScreenWidths; screenWidth: ScreenWidths;
shouldBlockchainErrDialogBeOpen: boolean; shouldBlockchainErrDialogBeOpen: boolean;
userAddress: string; userAddress: string;

View File

@@ -17,7 +17,7 @@ interface ConnectedState {
providerType: ProviderType; providerType: ProviderType;
injectedProviderName: string; injectedProviderName: string;
blockchainIsLoaded: boolean; blockchainIsLoaded: boolean;
userEthBalanceInWei: BigNumber; userEtherBalanceInWei?: BigNumber;
tokenByAddress: TokenByAddress; tokenByAddress: TokenByAddress;
} }
@@ -33,7 +33,7 @@ const mapStateToProps = (state: State): ConnectedState => ({
providerType: state.providerType, providerType: state.providerType,
injectedProviderName: state.injectedProviderName, injectedProviderName: state.injectedProviderName,
blockchainIsLoaded: state.blockchainIsLoaded, blockchainIsLoaded: state.blockchainIsLoaded,
userEthBalanceInWei: state.userEtherBalanceInWei, userEtherBalanceInWei: state.userEtherBalanceInWei,
tokenByAddress: state.tokenByAddress, tokenByAddress: state.tokenByAddress,
hasBeenSeen: state.hasPortalOnboardingBeenSeen, hasBeenSeen: state.hasPortalOnboardingBeenSeen,
}); });

View File

@@ -155,7 +155,7 @@ export class Dispatcher {
type: ActionTypes.UpdateOrderECSignature, type: ActionTypes.UpdateOrderECSignature,
}); });
} }
public updateUserWeiBalance(balance: BigNumber): void { public updateUserWeiBalance(balance?: BigNumber): void {
this._dispatch({ this._dispatch({
data: balance, data: balance,
type: ActionTypes.UpdateUserEtherBalance, type: ActionTypes.UpdateUserEtherBalance,

View File

@@ -39,7 +39,7 @@ export interface State {
tokenByAddress: TokenByAddress; tokenByAddress: TokenByAddress;
lastForceTokenStateRefetch: number; lastForceTokenStateRefetch: number;
userAddress: string; userAddress: string;
userEtherBalanceInWei: BigNumber; userEtherBalanceInWei?: BigNumber;
portalOnboardingStep: number; portalOnboardingStep: number;
isPortalOnboardingShowing: boolean; isPortalOnboardingShowing: boolean;
hasPortalOnboardingBeenSeen: boolean; hasPortalOnboardingBeenSeen: boolean;
@@ -81,7 +81,7 @@ export const INITIAL_STATE: State = {
tokenByAddress: {}, tokenByAddress: {},
lastForceTokenStateRefetch: moment().unix(), lastForceTokenStateRefetch: moment().unix(),
userAddress: '', userAddress: '',
userEtherBalanceInWei: new BigNumber(0), userEtherBalanceInWei: undefined,
userSuppliedOrderCache: undefined, userSuppliedOrderCache: undefined,
portalOnboardingStep: 0, portalOnboardingStep: 0,
isPortalOnboardingShowing: false, isPortalOnboardingShowing: false,