diff options
author | Brandon Millman <brandon@0xproject.com> | 2018-05-09 02:01:40 +0800 |
---|---|---|
committer | GitHub <noreply@github.com> | 2018-05-09 02:01:40 +0800 |
commit | 1b102f9ed327952f80f6347a64600e02169020b3 (patch) | |
tree | e9ef437f4baa6b8c3dcc24f105cf84c7ca6dfa70 /packages/website/ts/components/portal/portal.tsx | |
parent | e9d70b7b1edb5089a6e5e2a9ee8c964ab4b4d4ab (diff) | |
parent | 6c38481550d3bc57413ffb013d1b94a53672202b (diff) | |
download | dexon-sol-tools-1b102f9ed327952f80f6347a64600e02169020b3.tar dexon-sol-tools-1b102f9ed327952f80f6347a64600e02169020b3.tar.gz dexon-sol-tools-1b102f9ed327952f80f6347a64600e02169020b3.tar.bz2 dexon-sol-tools-1b102f9ed327952f80f6347a64600e02169020b3.tar.lz dexon-sol-tools-1b102f9ed327952f80f6347a64600e02169020b3.tar.xz dexon-sol-tools-1b102f9ed327952f80f6347a64600e02169020b3.tar.zst dexon-sol-tools-1b102f9ed327952f80f6347a64600e02169020b3.zip |
Merge pull request #570 from 0xProject/feature/website/wallet-add-tokens
Portal v2 add tokens flow
Diffstat (limited to 'packages/website/ts/components/portal/portal.tsx')
-rw-r--r-- | packages/website/ts/components/portal/portal.tsx | 37 |
1 files changed, 35 insertions, 2 deletions
diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx index 507860ee6..e198a9f03 100644 --- a/packages/website/ts/components/portal/portal.tsx +++ b/packages/website/ts/components/portal/portal.tsx @@ -8,13 +8,14 @@ import { Blockchain } from 'ts/blockchain'; import { BlockchainErrDialog } from 'ts/components/dialogs/blockchain_err_dialog'; import { LedgerConfigDialog } from 'ts/components/dialogs/ledger_config_dialog'; import { PortalDisclaimerDialog } from 'ts/components/dialogs/portal_disclaimer_dialog'; +import { AssetPicker } from 'ts/components/generate_order/asset_picker'; import { RelayerIndex } from 'ts/components/relayer_index/relayer_index'; import { TopBar } from 'ts/components/top_bar/top_bar'; import { FlashMessage } from 'ts/components/ui/flash_message'; import { Wallet } from 'ts/components/wallet/wallet'; import { localStorage } from 'ts/local_storage/local_storage'; import { Dispatcher } from 'ts/redux/dispatcher'; -import { BlockchainErrs, HashData, Order, ProviderType, ScreenWidths, TokenByAddress } from 'ts/types'; +import { BlockchainErrs, HashData, Order, ProviderType, ScreenWidths, TokenByAddress, TokenVisibility } from 'ts/types'; import { constants } from 'ts/utils/constants'; import { Translate } from 'ts/utils/translate'; import { utils } from 'ts/utils/utils'; @@ -48,6 +49,7 @@ interface PortalState { prevPathname: string; isDisclaimerDialogOpen: boolean; isLedgerDialogOpen: boolean; + isAssetPickerDialogOpen: boolean; } const THROTTLE_TIMEOUT = 100; @@ -89,6 +91,7 @@ export class Portal extends React.Component<PortalProps, PortalState> { prevUserAddress: this.props.userAddress, prevPathname: this.props.location.pathname, isDisclaimerDialogOpen: !hasAcceptedDisclaimer, + isAssetPickerDialogOpen: false, isLedgerDialogOpen: false, }; } @@ -105,7 +108,7 @@ export class Portal extends React.Component<PortalProps, PortalState> { // We re-set the entire redux state when the portal is unmounted so that when it is re-rendered // the initialization process always occurs from the same base state. This helps avoid // initialization inconsistencies (i.e While the portal was unrendered, the user might have - // become disconnected from their backing Ethereum node, changes user accounts, etc...) + // become disconnected from their backing Ethereum node, changed user accounts, etc...) this.props.dispatcher.resetState(); } public componentWillReceiveProps(nextProps: PortalProps) { @@ -176,6 +179,7 @@ export class Portal extends React.Component<PortalProps, PortalState> { injectedProviderName={this.props.injectedProviderName} providerType={this.props.providerType} onToggleLedgerDialog={this._onToggleLedgerDialog.bind(this)} + onAddToken={this._onAddToken.bind(this)} /> </div> <div className="flex-auto px3" style={styles.scrollContainer}> @@ -208,15 +212,44 @@ export class Portal extends React.Component<PortalProps, PortalState> { isOpen={this.state.isLedgerDialogOpen} /> )} + <AssetPicker + userAddress={this.props.userAddress} + networkId={this.props.networkId} + blockchain={this._blockchain} + dispatcher={this.props.dispatcher} + isOpen={this.state.isAssetPickerDialogOpen} + currentTokenAddress={''} + onTokenChosen={this._onTokenChosen.bind(this)} + tokenByAddress={this.props.tokenByAddress} + tokenVisibility={TokenVisibility.UNTRACKED} + /> </div> </div> ); } + private _onTokenChosen(tokenAddress: string) { + if (_.isEmpty(tokenAddress)) { + this.setState({ + isAssetPickerDialogOpen: false, + }); + return; + } + const token = this.props.tokenByAddress[tokenAddress]; + this.props.dispatcher.updateTokenByAddress([token]); + this.setState({ + isAssetPickerDialogOpen: false, + }); + } private _onToggleLedgerDialog() { this.setState({ isLedgerDialogOpen: !this.state.isLedgerDialogOpen, }); } + private _onAddToken() { + this.setState({ + isAssetPickerDialogOpen: !this.state.isAssetPickerDialogOpen, + }); + } private _onPortalDisclaimerAccepted() { localStorage.setItem(constants.LOCAL_STORAGE_KEY_ACCEPT_DISCLAIMER, 'set'); this.setState({ |