crowetic/protocol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Allow user to select other token on success

Browse Source
This commit is contained in:
Steve Klebanoff 2018-11-20 09:51:14 -08:00
parent 3169b72406
commit 7ad5dbc59d
2 changed files with 11 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
packages/instant/src/components/erc20_asset_amount_input.tsx
View File

@ -23,6 +23,7 @@ export interface ERC20AssetAmountInputProps {
startingFontSizePx: number;
fontColor?: ColorOption;
isDisabled: boolean;
canSelectOtherAsset: boolean;
numberOfAssetsAvailable?: number;
}
@ -53,7 +54,6 @@ export class ERC20AssetAmountInput extends React.Component<ERC20AssetAmountInput
const { onChange, ...rest } = this.props;
const amountBorderBottom = this.props.isDisabled ? '' : `1px solid ${transparentWhite}`;
const onSymbolClick = this._generateSelectAssetClickHandler();
const isEnabled = !this.props.isDisabled;
return (
<React.Fragment>
<Container borderBottom={amountBorderBottom} display="inline-block">
@ -75,11 +75,11 @@ export class ERC20AssetAmountInput extends React.Component<ERC20AssetAmountInput
fontSize={`${this.state.currentFontSizePx}px`}
fontColor={ColorOption.white}
textTransform="uppercase"
onClick={isEnabled ? onSymbolClick : undefined}
onClick={this.props.canSelectOtherAsset ? onSymbolClick : undefined}
>
{assetUtils.formattedSymbolForAsset(asset)}
</Text>
{isEnabled && this._renderChevronIcon()}
{this.props.canSelectOtherAsset && this._renderChevronIcon()}
</Flex>
</Container>
</React.Fragment>

8
packages/instant/src/containers/selected_erc20_asset_amount_input.ts
View File

@ -26,6 +26,7 @@ interface ConnectedState {
isDisabled: boolean;
numberOfAssetsAvailable?: number;
affiliateInfo?: AffiliateInfo;
canSelectOtherAsset: boolean;
}
interface ConnectedDispatch {
@ -50,6 +51,11 @@ const mapStateToProps = (state: State, _ownProps: SelectedERC20AssetAmountInputP
? (state.selectedAsset as ERC20Asset)
: undefined;
const numberOfAssetsAvailable = _.isUndefined(state.availableAssets) ? undefined : state.availableAssets.length;
const canSelectOtherAsset =
numberOfAssetsAvailable && numberOfAssetsAvailable > 1
? isEnabled || processState === OrderProcessState.Success
: false;
const assetBuyer = state.providerState.assetBuyer;
return {
assetBuyer,
@ -58,6 +64,7 @@ const mapStateToProps = (state: State, _ownProps: SelectedERC20AssetAmountInputP
isDisabled,
numberOfAssetsAvailable,
affiliateInfo: state.affiliateInfo,
canSelectOtherAsset,
};
};
@ -104,6 +111,7 @@ const mergeProps = (
},
isDisabled: connectedState.isDisabled,
numberOfAssetsAvailable: connectedState.numberOfAssetsAvailable,
canSelectOtherAsset: connectedState.canSelectOtherAsset,
};
};