From eba6dcc49741e7c036189220e01090a952efb8b5 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Wed, 9 May 2018 15:45:46 -0700 Subject: Update wallet footer and add remove token functionality --- packages/website/ts/components/portal/portal.tsx | 50 ++++++++++++++++++++---- packages/website/ts/components/wallet/wallet.tsx | 31 +++++++++++++-- 2 files changed, 69 insertions(+), 12 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx index b5e8150c4..4cbc65ce4 100644 --- a/packages/website/ts/components/portal/portal.tsx +++ b/packages/website/ts/components/portal/portal.tsx @@ -14,8 +14,10 @@ import { TopBar, TopBarDisplayType } 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 { trackedTokenStorage } from 'ts/local_storage/tracked_token_storage'; import { Dispatcher } from 'ts/redux/dispatcher'; import { BlockchainErrs, HashData, Order, ProviderType, ScreenWidths, TokenByAddress, TokenVisibility } from 'ts/types'; +import { configs } from 'ts/utils/configs'; import { constants } from 'ts/utils/constants'; import { Translate } from 'ts/utils/translate'; import { utils } from 'ts/utils/utils'; @@ -49,7 +51,13 @@ interface PortalState { prevPathname: string; isDisclaimerDialogOpen: boolean; isLedgerDialogOpen: boolean; - isAssetPickerDialogOpen: boolean; + tokenManagementState: TokenManagementState; +} + +enum TokenManagementState { + Add = 'Add', + Remove = 'Remove', + None = 'None', } const THROTTLE_TIMEOUT = 100; @@ -90,7 +98,7 @@ export class Portal extends React.Component { prevUserAddress: this.props.userAddress, prevPathname: this.props.location.pathname, isDisclaimerDialogOpen: !hasAcceptedDisclaimer, - isAssetPickerDialogOpen: false, + tokenManagementState: TokenManagementState.None, isLedgerDialogOpen: false, }; } @@ -142,6 +150,11 @@ export class Portal extends React.Component { ); const allTokens = _.values(this.props.tokenByAddress); const trackedTokens = _.filter(allTokens, t => t.isTracked); + const isAssetPickerDialogOpen = this.state.tokenManagementState !== TokenManagementState.None; + const tokenVisibility = + this.state.tokenManagementState === TokenManagementState.Add + ? TokenVisibility.UNTRACKED + : TokenVisibility.TRACKED; return (
@@ -180,6 +193,7 @@ export class Portal extends React.Component { providerType={this.props.providerType} onToggleLedgerDialog={this._onToggleLedgerDialog.bind(this)} onAddToken={this._onAddToken.bind(this)} + onRemoveToken={this._onRemoveToken.bind(this)} />
@@ -217,11 +231,11 @@ export class Portal extends React.Component { networkId={this.props.networkId} blockchain={this._blockchain} dispatcher={this.props.dispatcher} - isOpen={this.state.isAssetPickerDialogOpen} + isOpen={isAssetPickerDialogOpen} currentTokenAddress={''} onTokenChosen={this._onTokenChosen.bind(this)} tokenByAddress={this.props.tokenByAddress} - tokenVisibility={TokenVisibility.UNTRACKED} + tokenVisibility={tokenVisibility} />
@@ -230,14 +244,29 @@ export class Portal extends React.Component { private _onTokenChosen(tokenAddress: string) { if (_.isEmpty(tokenAddress)) { this.setState({ - isAssetPickerDialogOpen: false, + tokenManagementState: TokenManagementState.None, }); return; } const token = this.props.tokenByAddress[tokenAddress]; - this.props.dispatcher.updateTokenByAddress([token]); + const isDefaultTrackedToken = _.includes(configs.DEFAULT_TRACKED_TOKEN_SYMBOLS, token.symbol); + if (this.state.tokenManagementState === TokenManagementState.Remove && !isDefaultTrackedToken) { + if (token.isRegistered) { + // Remove the token from tracked tokens + const newToken = { + ...token, + isTracked: false, + }; + this.props.dispatcher.updateTokenByAddress([newToken]); + } else { + this.props.dispatcher.removeTokenToTokenByAddress(token); + } + trackedTokenStorage.removeTrackedToken(this.props.userAddress, this.props.networkId, tokenAddress); + } else if (isDefaultTrackedToken) { + this.props.dispatcher.showFlashMessage(`Cannot remove ${token.name} because it's a default token`); + } this.setState({ - isAssetPickerDialogOpen: false, + tokenManagementState: TokenManagementState.None, }); } private _onToggleLedgerDialog() { @@ -247,7 +276,12 @@ export class Portal extends React.Component { } private _onAddToken() { this.setState({ - isAssetPickerDialogOpen: !this.state.isAssetPickerDialogOpen, + tokenManagementState: TokenManagementState.Add, + }); + } + private _onRemoveToken() { + this.setState({ + tokenManagementState: TokenManagementState.Remove, }); } private _onPortalDisclaimerAccepted() { diff --git a/packages/website/ts/components/wallet/wallet.tsx b/packages/website/ts/components/wallet/wallet.tsx index a28012aaf..079c0e3b3 100644 --- a/packages/website/ts/components/wallet/wallet.tsx +++ b/packages/website/ts/components/wallet/wallet.tsx @@ -9,8 +9,11 @@ import { import { BigNumber } from '@0xproject/utils'; import * as _ from 'lodash'; import FlatButton from 'material-ui/FlatButton'; +import FloatingActionButton from 'material-ui/FloatingActionButton'; import { List, ListItem } from 'material-ui/List'; import ActionAccountBalanceWallet from 'material-ui/svg-icons/action/account-balance-wallet'; +import ContentAdd from 'material-ui/svg-icons/content/add'; +import ContentRemove from 'material-ui/svg-icons/content/remove'; import NavigationArrowDownward from 'material-ui/svg-icons/navigation/arrow-downward'; import NavigationArrowUpward from 'material-ui/svg-icons/navigation/arrow-upward'; import Close from 'material-ui/svg-icons/navigation/close'; @@ -56,6 +59,7 @@ export interface WalletProps { providerType: ProviderType; onToggleLedgerDialog: () => void; onAddToken: () => void; + onRemoveToken: () => void; } interface WalletState { @@ -138,6 +142,7 @@ const ZRX_TOKEN_SYMBOL = 'ZRX'; const ETHER_SYMBOL = 'ETH'; const ICON_DIMENSION = 24; const TOKEN_AMOUNT_DISPLAY_PRECISION = 3; +const BODY_ITEM_KEY = 'BODY'; const HEADER_ITEM_KEY = 'HEADER'; const FOOTER_ITEM_KEY = 'FOOTER'; const DISCONNECTED_ITEM_KEY = 'DISCONNECTED'; @@ -248,7 +253,7 @@ export class Wallet extends React.Component { }; return ( { }); } private _renderFooterRows() { - const primaryText = '+ other tokens'; return ( + + + + + + +
+ add/remove tokens +
+ + } + disabled={true} innerDivStyle={styles.footerItemInnerDiv} - onClick={this.props.onAddToken} /> ); } -- cgit v1.2.3 From a6f72de09d7b2c9738b78d2097baa9906838fbe9 Mon Sep 17 00:00:00 2001 From: Leonid Logvinov Date: Tue, 8 May 2018 15:42:07 +0200 Subject: Rename deployer to sol-compiler --- packages/website/ts/components/top_bar/top_bar.tsx | 16 ++-- .../ts/containers/deployer_documentation.ts | 102 --------------------- .../ts/containers/sol_compiler_documentation.ts | 99 ++++++++++++++++++++ .../ts/containers/subproviders_documentation.ts | 2 +- packages/website/ts/index.tsx | 9 +- .../website/ts/pages/documentation/doc_page.tsx | 2 +- packages/website/ts/types.ts | 6 +- 7 files changed, 118 insertions(+), 118 deletions(-) delete mode 100644 packages/website/ts/containers/deployer_documentation.ts create mode 100644 packages/website/ts/containers/sol_compiler_documentation.ts (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/top_bar/top_bar.tsx b/packages/website/ts/components/top_bar/top_bar.tsx index 2502bea6d..23130853c 100644 --- a/packages/website/ts/components/top_bar/top_bar.tsx +++ b/packages/website/ts/components/top_bar/top_bar.tsx @@ -149,10 +149,10 @@ export class TopBar extends React.Component { primaryText={this.props.translate.get(Key.OrderUtils, Deco.CapWords)} /> , - + , @@ -328,10 +328,10 @@ export class TopBar extends React.Component { )} - {!this._isViewingDeployerDocs() && ( - + {!this._isViewingSolCompilerDocs() && ( + - {this.props.translate.get(Key.Deployer, Deco.Cap)}{' '} + {this.props.translate.get(Key.SolCompiler, Deco.Cap)}{' '} {this.props.translate.get(Key.Docs, Deco.Cap)} @@ -476,8 +476,8 @@ export class TopBar extends React.Component { _.includes(this.props.location.pathname, WebsiteLegacyPaths.Web3Wrapper) ); } - private _isViewingDeployerDocs() { - return _.includes(this.props.location.pathname, WebsitePaths.Deployer); + private _isViewingSolCompilerDocs() { + return _.includes(this.props.location.pathname, WebsitePaths.SolCompiler); } private _isViewingJsonSchemasDocs() { return _.includes(this.props.location.pathname, WebsitePaths.JSONSchemas); @@ -498,7 +498,7 @@ export class TopBar extends React.Component { this._isViewingFAQ() || this._isViewingSmartContractsDocs() || this._isViewingWeb3WrapperDocs() || - this._isViewingDeployerDocs() || + this._isViewingSolCompilerDocs() || this._isViewingJsonSchemasDocs() || this._isViewingSolCovDocs() || this._isViewingSubprovidersDocs() || diff --git a/packages/website/ts/containers/deployer_documentation.ts b/packages/website/ts/containers/deployer_documentation.ts deleted file mode 100644 index e20cc195b..000000000 --- a/packages/website/ts/containers/deployer_documentation.ts +++ /dev/null @@ -1,102 +0,0 @@ -import { constants as docConstants, DocsInfo, DocsInfoConfig, SupportedDocJson } from '@0xproject/react-docs'; -import * as _ from 'lodash'; -import * as React from 'react'; -import { connect } from 'react-redux'; -import { Dispatch } from 'redux'; -import { DocPage as DocPageComponent, DocPageProps } from 'ts/pages/documentation/doc_page'; -import { Dispatcher } from 'ts/redux/dispatcher'; -import { State } from 'ts/redux/reducer'; -import { DocPackages, Environments, WebsitePaths } from 'ts/types'; -import { configs } from 'ts/utils/configs'; -import { constants } from 'ts/utils/constants'; -import { Translate } from 'ts/utils/translate'; - -/* tslint:disable:no-var-requires */ -const IntroMarkdown = require('md/docs/deployer/introduction'); -const InstallationMarkdown = require('md/docs/deployer/installation'); -const UsageMarkdown = require('md/docs/deployer/usage'); -/* tslint:enable:no-var-requires */ - -const docSections = { - introduction: 'introduction', - installation: 'installation', - usage: 'usage', - compiler: 'compiler', - deployer: 'deployer', - types: docConstants.TYPES_SECTION_NAME, -}; - -const docsInfoConfig: DocsInfoConfig = { - id: DocPackages.Deployer, - type: SupportedDocJson.TypeDoc, - displayName: 'Deployer', - packageUrl: 'https://github.com/0xProject/0x-monorepo', - menu: { - introduction: [docSections.introduction], - install: [docSections.installation], - usage: [docSections.usage], - compiler: [docSections.compiler], - deployer: [docSections.deployer], - types: [docSections.types], - }, - sectionNameToMarkdown: { - [docSections.introduction]: IntroMarkdown, - [docSections.installation]: InstallationMarkdown, - [docSections.usage]: UsageMarkdown, - }, - sectionNameToModulePath: { - [docSections.compiler]: ['"deployer/src/compiler"'], - [docSections.deployer]: ['"deployer/src/deployer"'], - [docSections.types]: ['"deployer/src/utils/types"', '"types/src/index"'], - }, - menuSubsectionToVersionWhenIntroduced: {}, - sections: docSections, - visibleConstructors: [docSections.compiler, docSections.deployer], - typeConfigs: { - // Note: This needs to be kept in sync with the types exported in index.ts. Unfortunately there is - // currently no way to extract the re-exported types from index.ts via TypeDoc :( - publicTypes: [ - 'CompilerOptions', - 'DeployerOptions', - 'BaseDeployerOptions', - 'UrlDeployerOptions', - 'ProviderDeployerOptions', - 'TxData', - ], - typeNameToExternalLink: { - Web3: constants.URL_WEB3_DOCS, - BigNumber: constants.URL_BIGNUMBERJS_GITHUB, - ContractInstance: 'https://github.com/0xProject/web3-typescript-typings/blob/f5bcb96/index.d.ts#L98', - }, - typeNameToPrefix: { - ContractInstance: 'Web3', - }, - }, -}; -const docsInfo = new DocsInfo(docsInfoConfig); - -interface ConnectedState { - docsVersion: string; - availableDocVersions: string[]; - docsInfo: DocsInfo; - translate: Translate; -} - -interface ConnectedDispatch { - dispatcher: Dispatcher; -} - -const mapStateToProps = (state: State, ownProps: DocPageProps): ConnectedState => ({ - docsVersion: state.docsVersion, - availableDocVersions: state.availableDocVersions, - translate: state.translate, - docsInfo, -}); - -const mapDispatchToProps = (dispatch: Dispatch): ConnectedDispatch => ({ - dispatcher: new Dispatcher(dispatch), -}); - -export const Documentation: React.ComponentClass = connect(mapStateToProps, mapDispatchToProps)( - DocPageComponent, -); diff --git a/packages/website/ts/containers/sol_compiler_documentation.ts b/packages/website/ts/containers/sol_compiler_documentation.ts new file mode 100644 index 000000000..0cf595645 --- /dev/null +++ b/packages/website/ts/containers/sol_compiler_documentation.ts @@ -0,0 +1,99 @@ +import { constants as docConstants, DocsInfo, DocsInfoConfig, SupportedDocJson } from '@0xproject/react-docs'; +import * as _ from 'lodash'; +import * as React from 'react'; +import { connect } from 'react-redux'; +import { Dispatch } from 'redux'; +import { DocPage as DocPageComponent, DocPageProps } from 'ts/pages/documentation/doc_page'; +import { Dispatcher } from 'ts/redux/dispatcher'; +import { State } from 'ts/redux/reducer'; +import { DocPackages, Environments, WebsitePaths } from 'ts/types'; +import { configs } from 'ts/utils/configs'; +import { constants } from 'ts/utils/constants'; +import { Translate } from 'ts/utils/translate'; + +/* tslint:disable:no-var-requires */ +const IntroMarkdown = require('md/docs/sol-compiler/introduction'); +const InstallationMarkdown = require('md/docs/sol-compiler/installation'); +const UsageMarkdown = require('md/docs/sol-compiler/usage'); +/* tslint:enable:no-var-requires */ + +const docSections = { + introduction: 'introduction', + installation: 'installation', + usage: 'usage', + compiler: 'compiler', + types: docConstants.TYPES_SECTION_NAME, +}; + +const docsInfoConfig: DocsInfoConfig = { + id: DocPackages.SolCompiler, + type: SupportedDocJson.TypeDoc, + displayName: 'Sol Compiler', + packageUrl: 'https://github.com/0xProject/0x-monorepo', + menu: { + introduction: [docSections.introduction], + install: [docSections.installation], + usage: [docSections.usage], + compiler: [docSections.compiler], + types: [docSections.types], + }, + sectionNameToMarkdown: { + [docSections.introduction]: IntroMarkdown, + [docSections.installation]: InstallationMarkdown, + [docSections.usage]: UsageMarkdown, + }, + sectionNameToModulePath: { + [docSections.compiler]: ['"sol-compiler/src/compiler"'], + [docSections.types]: ['"sol-compiler/src/utils/types"', '"types/src/index"'], + }, + menuSubsectionToVersionWhenIntroduced: {}, + sections: docSections, + visibleConstructors: [docSections.compiler], + typeConfigs: { + // Note: This needs to be kept in sync with the types exported in index.ts. Unfortunately there is + // currently no way to extract the re-exported types from index.ts via TypeDoc :( + publicTypes: [ + 'CompilerOptions', + 'DeployerOptions', + 'BaseDeployerOptions', + 'UrlDeployerOptions', + 'ProviderDeployerOptions', + 'TxData', + ], + typeNameToExternalLink: { + Web3: constants.URL_WEB3_DOCS, + BigNumber: constants.URL_BIGNUMBERJS_GITHUB, + ContractInstance: 'https://github.com/0xProject/web3-typescript-typings/blob/f5bcb96/index.d.ts#L98', + }, + typeNameToPrefix: { + ContractInstance: 'Web3', + }, + }, +}; +const docsInfo = new DocsInfo(docsInfoConfig); + +interface ConnectedState { + docsVersion: string; + availableDocVersions: string[]; + docsInfo: DocsInfo; + translate: Translate; +} + +interface ConnectedDispatch { + dispatcher: Dispatcher; +} + +const mapStateToProps = (state: State, ownProps: DocPageProps): ConnectedState => ({ + docsVersion: state.docsVersion, + availableDocVersions: state.availableDocVersions, + translate: state.translate, + docsInfo, +}); + +const mapDispatchToProps = (dispatch: Dispatch): ConnectedDispatch => ({ + dispatcher: new Dispatcher(dispatch), +}); + +export const Documentation: React.ComponentClass = connect(mapStateToProps, mapDispatchToProps)( + DocPageComponent, +); diff --git a/packages/website/ts/containers/subproviders_documentation.ts b/packages/website/ts/containers/subproviders_documentation.ts index a14d06a3f..2178baea8 100644 --- a/packages/website/ts/containers/subproviders_documentation.ts +++ b/packages/website/ts/containers/subproviders_documentation.ts @@ -74,7 +74,7 @@ const docsInfoConfig: DocsInfoConfig = { [docSections.redundantRPCSubprovider]: ['"subproviders/src/subproviders/redundant_rpc"'], [docSections.ganacheSubprovider]: ['"subproviders/src/subproviders/ganache"'], [docSections.nonceTrackerSubprovider]: ['"subproviders/src/subproviders/nonce_tracker"'], - [docSections.types]: ['"deployer/src/utils/types"', '"types/src/index"', '"subproviders/src/types"'], + [docSections.types]: ['"sol-compiler/src/utils/types"', '"types/src/index"', '"subproviders/src/types"'], }, menuSubsectionToVersionWhenIntroduced: {}, sections: docSections, diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx index 1b1255214..2688d0259 100644 --- a/packages/website/ts/index.tsx +++ b/packages/website/ts/index.tsx @@ -54,8 +54,8 @@ const LazyConnectDocumentation = createLazyComponent('Documentation', async () = const LazyWeb3WrapperDocumentation = createLazyComponent('Documentation', async () => System.import(/* webpackChunkName: "web3WrapperDocs" */ 'ts/containers/web3_wrapper_documentation'), ); -const LazyDeployerDocumentation = createLazyComponent('Documentation', async () => - System.import(/* webpackChunkName: "deployerDocs" */ 'ts/containers/deployer_documentation'), +const LazySolCompilerDocumentation = createLazyComponent('Documentation', async () => + System.import(/* webpackChunkName: "solCompilerDocs" */ 'ts/containers/sol_compiler_documentation'), ); const LazyJSONSchemasDocumentation = createLazyComponent('Documentation', async () => System.import(/* webpackChunkName: "jsonSchemasDocs" */ 'ts/containers/json_schemas_documentation'), @@ -91,7 +91,10 @@ render( - + Date: Thu, 10 May 2018 15:18:33 +0200 Subject: Add a legacy endpoint for the deployer --- packages/website/ts/index.tsx | 4 ++++ packages/website/ts/types.ts | 1 + 2 files changed, 5 insertions(+) (limited to 'packages/website/ts') diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx index 2688d0259..49bcdeaac 100644 --- a/packages/website/ts/index.tsx +++ b/packages/website/ts/index.tsx @@ -126,6 +126,10 @@ render( path={`${WebsiteLegacyPaths.Web3Wrapper}/:version?`} component={LazyWeb3WrapperDocumentation} /> + diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index 51a3bcba6..58929a0c6 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -344,6 +344,7 @@ export enum Docs { export enum WebsiteLegacyPaths { ZeroExJs = '/docs/0xjs', Web3Wrapper = '/docs/web3_wrapper', + Deployer = '/docs/deployer', } export enum WebsitePaths { -- cgit v1.2.3 From f854f3ee2bd74bbb61ed465099168b4d391f92c8 Mon Sep 17 00:00:00 2001 From: Leonid Logvinov Date: Thu, 10 May 2018 15:20:00 +0200 Subject: Remove unused deployer docs configs --- .../ts/containers/sol_compiler_documentation.ts | 21 ++++----------------- 1 file changed, 4 insertions(+), 17 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/containers/sol_compiler_documentation.ts b/packages/website/ts/containers/sol_compiler_documentation.ts index 0cf595645..2f6486146 100644 --- a/packages/website/ts/containers/sol_compiler_documentation.ts +++ b/packages/website/ts/containers/sol_compiler_documentation.ts @@ -28,7 +28,7 @@ const docSections = { const docsInfoConfig: DocsInfoConfig = { id: DocPackages.SolCompiler, type: SupportedDocJson.TypeDoc, - displayName: 'Sol Compiler', + displayName: 'Solidity Compiler', packageUrl: 'https://github.com/0xProject/0x-monorepo', menu: { introduction: [docSections.introduction], @@ -52,22 +52,9 @@ const docsInfoConfig: DocsInfoConfig = { typeConfigs: { // Note: This needs to be kept in sync with the types exported in index.ts. Unfortunately there is // currently no way to extract the re-exported types from index.ts via TypeDoc :( - publicTypes: [ - 'CompilerOptions', - 'DeployerOptions', - 'BaseDeployerOptions', - 'UrlDeployerOptions', - 'ProviderDeployerOptions', - 'TxData', - ], - typeNameToExternalLink: { - Web3: constants.URL_WEB3_DOCS, - BigNumber: constants.URL_BIGNUMBERJS_GITHUB, - ContractInstance: 'https://github.com/0xProject/web3-typescript-typings/blob/f5bcb96/index.d.ts#L98', - }, - typeNameToPrefix: { - ContractInstance: 'Web3', - }, + publicTypes: ['CompilerOptions'], + typeNameToExternalLink: {}, + typeNameToPrefix: {}, }, }; const docsInfo = new DocsInfo(docsInfoConfig); -- cgit v1.2.3 From 2e1c2d9dfeca4439435fdf1ed58504142963585a Mon Sep 17 00:00:00 2001 From: Leonid Logvinov Date: Thu, 10 May 2018 16:57:51 +0200 Subject: Fix templates --- packages/website/ts/components/top_bar/top_bar.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/top_bar/top_bar.tsx b/packages/website/ts/components/top_bar/top_bar.tsx index 23130853c..5a1b50310 100644 --- a/packages/website/ts/components/top_bar/top_bar.tsx +++ b/packages/website/ts/components/top_bar/top_bar.tsx @@ -390,7 +390,7 @@ export class TopBar extends React.Component { (!this._isViewing0xjsDocs() && !this._isViewingSmartContractsDocs() && !this._isViewingWeb3WrapperDocs() && - !this._isViewingDeployerDocs() && + !this._isViewingSolCompilerDocs() && !this._isViewingJsonSchemasDocs() && !this._isViewingSolCovDocs() && !this._isViewingSubprovidersDocs() && -- cgit v1.2.3