From a14424ae5f45784db5e75c2d6a9098dc96914c9e Mon Sep 17 00:00:00 2001 From: Leonid Logvinov Date: Mon, 11 Dec 2017 12:43:19 +0100 Subject: Move isAddress to shared utils and remove all dependencies on ethereum-address --- packages/website/ts/components/inputs/address_input.tsx | 2 +- packages/website/ts/globals.d.ts | 5 ----- 2 files changed, 1 insertion(+), 6 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/inputs/address_input.tsx b/packages/website/ts/components/inputs/address_input.tsx index 8b03b8d12..832324fda 100644 --- a/packages/website/ts/components/inputs/address_input.tsx +++ b/packages/website/ts/components/inputs/address_input.tsx @@ -1,4 +1,4 @@ -import {isAddress} from 'ethereum-address'; +import {addressUtils} from '@0xproject/utils'; import * as _ from 'lodash'; import {colors} from 'material-ui/styles'; import TextField from 'material-ui/TextField'; diff --git a/packages/website/ts/globals.d.ts b/packages/website/ts/globals.d.ts index b4611f583..3144d7eb5 100644 --- a/packages/website/ts/globals.d.ts +++ b/packages/website/ts/globals.d.ts @@ -55,11 +55,6 @@ interface System { } declare var System: System; -// ethereum-address declarations -declare module 'ethereum-address' { - export const isAddress: (address: string) => boolean; -} - // jsonschema declarations // Source: https://github.com/tdegrunt/jsonschema/blob/master/lib/index.d.ts declare interface Schema { -- cgit v1.2.3 From c61fe3ce64e58e7ae427642430621b857c3a716d Mon Sep 17 00:00:00 2001 From: Leonid Logvinov Date: Tue, 12 Dec 2017 13:33:12 +0100 Subject: Don't unsubscribe on error. It's done automatically --- packages/website/ts/blockchain.ts | 9 +++------ 1 file changed, 3 insertions(+), 6 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/blockchain.ts b/packages/website/ts/blockchain.ts index 76640a072..172ba6b52 100644 --- a/packages/website/ts/blockchain.ts +++ b/packages/website/ts/blockchain.ts @@ -468,8 +468,7 @@ export class Blockchain { public destroy() { clearInterval(this.zrxPollIntervalId); this.web3Wrapper.destroy(); - // tslint:disable-next-line:no-floating-promises - this.stopWatchingExchangeLogFillEventsAsync(); // fire and forget + this.stopWatchingExchangeLogFillEvents(); } private async showEtherScanLinkAndAwaitTransactionMinedAsync( txHash: string): Promise { @@ -485,7 +484,7 @@ export class Blockchain { } private async rehydrateStoreWithContractEvents() { // Ensure we are only ever listening to one set of events - await this.stopWatchingExchangeLogFillEventsAsync(); + this.stopWatchingExchangeLogFillEvents(); if (!this.doesUserAddressExist()) { return; // short-circuit @@ -517,8 +516,6 @@ export class Blockchain { // to rollbar and stop watching when one occurs // tslint:disable-next-line:no-floating-promises errorReporter.reportAsync(err); // fire and forget - // tslint:disable-next-line:no-floating-promises - this.stopWatchingExchangeLogFillEventsAsync(); // fire and forget return; } else { const decodedLog = decodedLogEvent.log; @@ -593,7 +590,7 @@ export class Blockchain { tradeHistoryStorage.setFillsLatestBlock(this.userAddress, this.networkId, blockNumberToSet); } } - private async stopWatchingExchangeLogFillEventsAsync() { + private stopWatchingExchangeLogFillEvents(): void { this.zeroEx.exchange.unsubscribeAll(); } private async getTokenRegistryTokensByAddressAsync(): Promise { -- cgit v1.2.3 From 16a970b65d72a07ef4ebd9d0ec062f9323525f2e Mon Sep 17 00:00:00 2001 From: Leonid Logvinov Date: Tue, 12 Dec 2017 13:56:19 +0100 Subject: Fix an invocation --- packages/website/ts/components/inputs/address_input.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/inputs/address_input.tsx b/packages/website/ts/components/inputs/address_input.tsx index 832324fda..40ae722d9 100644 --- a/packages/website/ts/components/inputs/address_input.tsx +++ b/packages/website/ts/components/inputs/address_input.tsx @@ -62,7 +62,7 @@ export class AddressInput extends React.Component Date: Mon, 11 Dec 2017 17:01:58 -0800 Subject: Add WebSocketOrderbookChannel to connect docs --- packages/website/ts/containers/connect_documentation.tsx | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/containers/connect_documentation.tsx b/packages/website/ts/containers/connect_documentation.tsx index b074d955b..8ecc1e37c 100644 --- a/packages/website/ts/containers/connect_documentation.tsx +++ b/packages/website/ts/containers/connect_documentation.tsx @@ -23,6 +23,7 @@ const connectDocSections = { introduction: 'introduction', installation: 'installation', httpClient: 'httpClient', + webSocketOrderbookChannel: 'webSocketOrderbookChannel', types: 'types', }; @@ -42,6 +43,9 @@ const docsInfoConfig: DocsInfoConfig = { httpClient: [ connectDocSections.httpClient, ], + webSocketOrderbookChannel: [ + connectDocSections.webSocketOrderbookChannel, + ], types: [ connectDocSections.types, ], @@ -56,6 +60,9 @@ const docsInfoConfig: DocsInfoConfig = { 'Client', 'FeesRequest', 'FeesResponse', + 'OrderbookChannel', + 'OrderbookChannelHandler', + 'OrderbookChannelSubscriptionOpts', 'OrderbookRequest', 'OrderbookResponse', 'OrdersRequest', @@ -64,14 +71,19 @@ const docsInfoConfig: DocsInfoConfig = { 'TokenTradeInfo', 'Order', 'SignedOrder', + 'ECSignature', ], sectionNameToModulePath: { [connectDocSections.httpClient]: ['"src/http_client"'], + [connectDocSections.webSocketOrderbookChannel]: ['"src/ws_orderbook_channel"'], [connectDocSections.types]: ['"src/types"'], }, menuSubsectionToVersionWhenIntroduced: {}, sections: connectDocSections, - visibleConstructors: [connectDocSections.httpClient], + visibleConstructors: [ + connectDocSections.httpClient, + connectDocSections.webSocketOrderbookChannel, + ], convertToDocAgnosticFormatFn: typeDocUtils.convertToDocAgnosticFormat.bind(typeDocUtils), }; const docsInfo = new DocsInfo(docsInfoConfig); -- cgit v1.2.3 From 2ffcc853fd71e5aa3e84fb54260cbd96f1c72b5b Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Tue, 12 Dec 2017 10:14:19 -0800 Subject: Fix typedoc_utils to take into account subPackageName when rendering call path --- packages/website/ts/utils/typedoc_utils.ts | 74 ++++++++++++++++++------------ 1 file changed, 44 insertions(+), 30 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/utils/typedoc_utils.ts b/packages/website/ts/utils/typedoc_utils.ts index 803cfa0cf..ff8060781 100644 --- a/packages/website/ts/utils/typedoc_utils.ts +++ b/packages/website/ts/utils/typedoc_utils.ts @@ -103,7 +103,7 @@ export const typeDocUtils = { case KindString.Constructor: isConstructor = true; const constructor = typeDocUtils._convertMethod( - entity, isConstructor, docsInfo.sections, sectionName, + entity, isConstructor, docsInfo.sections, sectionName, docsInfo.subPackageName, ); docSection.constructors.push(constructor); break; @@ -112,7 +112,7 @@ export const typeDocUtils = { if (entity.flags.isPublic) { isConstructor = false; const method = typeDocUtils._convertMethod( - entity, isConstructor, docsInfo.sections, sectionName, + entity, isConstructor, docsInfo.sections, sectionName, docsInfo.subPackageName, ); docSection.methods.push(method); } @@ -120,7 +120,8 @@ export const typeDocUtils = { case KindString.Property: if (!typeDocUtils.isPrivateOrProtectedProperty(entity.name)) { - const property = typeDocUtils._convertProperty(entity, docsInfo.sections, sectionName); + const property = typeDocUtils._convertProperty( + entity, docsInfo.sections, sectionName, docsInfo.subPackageName); docSection.properties.push(property); } break; @@ -131,7 +132,8 @@ export const typeDocUtils = { case KindString.Enumeration: case KindString['Type alias']: if (docsInfo.isPublicType(entity.name)) { - const customType = typeDocUtils._convertCustomType(entity, docsInfo.sections, sectionName); + const customType = typeDocUtils._convertCustomType( + entity, docsInfo.sections, sectionName, docsInfo.subPackageName); docSection.types.push(customType); } break; @@ -142,16 +144,17 @@ export const typeDocUtils = { }); return docSection; }, - _convertCustomType(entity: TypeDocNode, sections: SectionsMap, sectionName: string): CustomType { + _convertCustomType(entity: TypeDocNode, sections: SectionsMap, sectionName: string, + subPackageName: string): CustomType { const typeIfExists = !_.isUndefined(entity.type) ? - typeDocUtils._convertType(entity.type, sections, sectionName) : + typeDocUtils._convertType(entity.type, sections, sectionName, subPackageName) : undefined; const isConstructor = false; const methodIfExists = !_.isUndefined(entity.declaration) ? - typeDocUtils._convertMethod(entity.declaration, isConstructor, sections, sectionName) : + typeDocUtils._convertMethod(entity.declaration, isConstructor, sections, sectionName, subPackageName) : undefined; const indexSignatureIfExists = !_.isUndefined(entity.indexSignature) ? - typeDocUtils._convertIndexSignature(entity.indexSignature[0], sections, sectionName) : + typeDocUtils._convertIndexSignature(entity.indexSignature[0], sections, sectionName, subPackageName) : undefined; const commentIfExists = !_.isUndefined(entity.comment) && !_.isUndefined(entity.comment.shortText) ? entity.comment.shortText : @@ -160,7 +163,7 @@ export const typeDocUtils = { const childrenIfExist = !_.isUndefined(entity.children) ? _.map(entity.children, (child: TypeDocNode) => { const childTypeIfExists = !_.isUndefined(child.type) ? - typeDocUtils._convertType(child.type, sections, sectionName) : + typeDocUtils._convertType(child.type, sections, sectionName, subPackageName) : undefined; const c: CustomTypeChild = { name: child.name, @@ -183,21 +186,23 @@ export const typeDocUtils = { }; return customType; }, - _convertIndexSignature(entity: TypeDocNode, sections: SectionsMap, sectionName: string): IndexSignature { + _convertIndexSignature(entity: TypeDocNode, sections: SectionsMap, sectionName: string, + subPackageName: string): IndexSignature { const key = entity.parameters[0]; const indexSignature = { keyName: key.name, - keyType: typeDocUtils._convertType(key.type, sections, sectionName), + keyType: typeDocUtils._convertType(key.type, sections, sectionName, subPackageName), valueName: entity.type.name, }; return indexSignature; }, - _convertProperty(entity: TypeDocNode, sections: SectionsMap, sectionName: string): Property { + _convertProperty(entity: TypeDocNode, sections: SectionsMap, sectionName: string, + subPackageName: string): Property { const source = entity.sources[0]; const commentIfExists = !_.isUndefined(entity.comment) ? entity.comment.shortText : undefined; const property = { name: entity.name, - type: typeDocUtils._convertType(entity.type, sections, sectionName), + type: typeDocUtils._convertType(entity.type, sections, sectionName, subPackageName), source: { fileName: source.fileName, line: source.line, @@ -207,28 +212,35 @@ export const typeDocUtils = { return property; }, _convertMethod( - entity: TypeDocNode, isConstructor: boolean, sections: SectionsMap, sectionName: string, + entity: TypeDocNode, isConstructor: boolean, sections: SectionsMap, sectionName: string, subPackageName: string, ): TypescriptMethod { const signature = entity.signatures[0]; const source = entity.sources[0]; const hasComment = !_.isUndefined(signature.comment); const isStatic = _.isUndefined(entity.flags.isStatic) ? false : entity.flags.isStatic; - const topLevelInterface = isStatic ? 'ZeroEx.' : 'zeroEx.'; // HACK: we use the fact that the sectionName is the same as the property name at the top-level // of the public interface. In the future, we shouldn't use this hack but rather get it from the JSON. - let callPath = (!_.isUndefined(sections.zeroEx) && sectionName !== sections.zeroEx) ? - `${topLevelInterface}${sectionName}.` : - topLevelInterface; - callPath = isConstructor || entity.name === '__type' ? '' : callPath; + let callPath; + if (isConstructor || entity.name === '__type') { + callPath = ''; + } else if (subPackageName === '0x.js') { + const topLevelInterface = isStatic ? 'ZeroEx.' : 'zeroEx.'; + callPath = (!_.isUndefined(sections.zeroEx) && sectionName !== sections.zeroEx) ? + `${topLevelInterface}${sectionName}.` : + topLevelInterface; + } else { + callPath = `${sectionName}.`; + } const parameters = _.map(signature.parameters, param => { - return typeDocUtils._convertParameter(param, sections, sectionName); + return typeDocUtils._convertParameter(param, sections, sectionName, subPackageName); }); - const returnType = typeDocUtils._convertType(signature.type, sections, sectionName); + const returnType = typeDocUtils._convertType(signature.type, sections, sectionName, subPackageName); const typeParameter = _.isUndefined(signature.typeParameter) ? undefined : - typeDocUtils._convertTypeParameter(signature.typeParameter[0], sections, sectionName); + typeDocUtils._convertTypeParameter( + signature.typeParameter[0], sections, sectionName, subPackageName); const method = { isConstructor, @@ -247,15 +259,17 @@ export const typeDocUtils = { }; return method; }, - _convertTypeParameter(entity: TypeDocNode, sections: SectionsMap, sectionName: string): TypeParameter { - const type = typeDocUtils._convertType(entity.type, sections, sectionName); + _convertTypeParameter(entity: TypeDocNode, sections: SectionsMap, sectionName: string, + subPackageName: string): TypeParameter { + const type = typeDocUtils._convertType(entity.type, sections, sectionName, subPackageName); const parameter = { name: entity.name, type, }; return parameter; }, - _convertParameter(entity: TypeDocNode, sections: SectionsMap, sectionName: string): Parameter { + _convertParameter(entity: TypeDocNode, sections: SectionsMap, sectionName: string, + subPackageName: string): Parameter { let comment = ''; if (entity.comment && entity.comment.shortText) { comment = entity.comment.shortText; @@ -267,7 +281,7 @@ export const typeDocUtils = { entity.flags.isOptional : false; - const type = typeDocUtils._convertType(entity.type, sections, sectionName); + const type = typeDocUtils._convertType(entity.type, sections, sectionName, subPackageName); const parameter = { name: entity.name, @@ -277,17 +291,17 @@ export const typeDocUtils = { }; return parameter; }, - _convertType(entity: TypeDocType, sections: SectionsMap, sectionName: string): Type { + _convertType(entity: TypeDocType, sections: SectionsMap, sectionName: string, subPackageName: string): Type { const typeArguments = _.map(entity.typeArguments, typeArgument => { - return typeDocUtils._convertType(typeArgument, sections, sectionName); + return typeDocUtils._convertType(typeArgument, sections, sectionName, subPackageName); }); const types = _.map(entity.types, t => { - return typeDocUtils._convertType(t, sections, sectionName); + return typeDocUtils._convertType(t, sections, sectionName, subPackageName); }); const isConstructor = false; const methodIfExists = !_.isUndefined(entity.declaration) ? - typeDocUtils._convertMethod(entity.declaration, isConstructor, sections, sectionName) : + typeDocUtils._convertMethod(entity.declaration, isConstructor, sections, sectionName, subPackageName) : undefined; const elementTypeIfExists = !_.isUndefined(entity.elementType) ? -- cgit v1.2.3 From d0916e196c5872ee9ac82941f4a9f323f5179e74 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Tue, 12 Dec 2017 14:53:39 -0600 Subject: progress weth page --- packages/website/ts/blockchain.ts | 2 + packages/website/ts/components/eth_wrappers.tsx | 214 ++++++++++++++++++++++++ packages/website/ts/components/fill_order.tsx | 1 - packages/website/ts/components/portal.tsx | 18 ++ packages/website/ts/components/portal_menu.tsx | 8 + packages/website/ts/types.ts | 10 ++ packages/website/ts/utils/configs.ts | 13 +- 7 files changed, 264 insertions(+), 2 deletions(-) create mode 100644 packages/website/ts/components/eth_wrappers.tsx (limited to 'packages/website/ts') diff --git a/packages/website/ts/blockchain.ts b/packages/website/ts/blockchain.ts index 172ba6b52..5bc95238b 100644 --- a/packages/website/ts/blockchain.ts +++ b/packages/website/ts/blockchain.ts @@ -602,6 +602,8 @@ export class Blockchain { // HACK: For now we have a hard-coded list of iconUrls for the dummyTokens // TODO: Refactor this out and pull the iconUrl directly from the TokenRegistry const iconUrl = constants.iconUrlBySymbol[t.symbol]; + // TEMPORARY HACK: Swap out for new WETH address + const address = t.symbol === 'WETH' ? '0x739E78d6bEbbDF24105a5145fA04436589d1CBd9' : t.address; const token: Token = { iconUrl, address: t.address, diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx new file mode 100644 index 000000000..277929870 --- /dev/null +++ b/packages/website/ts/components/eth_wrappers.tsx @@ -0,0 +1,214 @@ +import {ZeroEx} from '0x.js'; +import BigNumber from 'bignumber.js'; +import * as _ from 'lodash'; +import Divider from 'material-ui/Divider'; +import Paper from 'material-ui/Paper'; +import RaisedButton from 'material-ui/RaisedButton'; +import {colors} from 'material-ui/styles'; +import { + Table, + TableBody, + TableHeader, + TableHeaderColumn, + TableRow, + TableRowColumn, +} from 'material-ui/Table'; +import * as moment from 'moment'; +import * as React from 'react'; +import {Blockchain} from 'ts/blockchain'; +import {LifeCycleRaisedButton} from 'ts/components/ui/lifecycle_raised_button'; +import {trackedTokenStorage} from 'ts/local_storage/tracked_token_storage'; +import {Dispatcher} from 'ts/redux/dispatcher'; +import { + OutdatedWrappedEther, + TokenByAddress, + TokenStateByAddress, +} from 'ts/types'; +import {configs} from 'ts/utils/configs'; +import {constants} from 'ts/utils/constants'; +import {errorReporter} from 'ts/utils/error_reporter'; +import {utils} from 'ts/utils/utils'; + +const PRECISION = 5; +const DATE_FORMAT = 'D/M/YY'; +const ICON_DIMENSION = 40; +const ETHER_ICON_PATH = '/images/ether.png'; +const OUTDATED_WETH_ICON_PATH = '/images/wrapped_eth_gray.png'; +const ETHER_TOKEN_SYMBOL = 'WETH'; + +interface EthWrappersProps { + networkId: number; + blockchain: Blockchain; + dispatcher: Dispatcher; + tokenByAddress: TokenByAddress; + tokenStateByAddress: TokenStateByAddress; + userAddress: string; + userEtherBalance: BigNumber; +} + +interface EthWrappersState {} + +export class EthWrappers extends React.Component { + constructor(props: EthWrappersProps) { + super(props); + this.state = {}; + } + public componentDidMount() { + window.scrollTo(0, 0); + } + public render() { + const tokens = _.values(this.props.tokenByAddress); + const wethToken = _.find(tokens, {symbol: 'WETH'}); + const wethState = this.props.tokenStateByAddress[wethToken.address]; + const wethBalance = ZeroEx.toUnitAmount(wethState.balance, 18); + return ( +
+

ETH Wrapper

+ +
+
+ Wrap ETH into an ERC20-compliant Ether token +
+
+ + + + ETH Token + Balance + + {'ETH <-> WETH'} + + + + + + +
+ +
+ Ether +
+
+ + + {this.props.userEtherBalance.toFixed(PRECISION)} ETH + + + + + + + +
+ +
+ Wrapped Ether +
+
+ + + {wethBalance.toFixed(PRECISION)} WETH + + + + + + +
+
+
+

Outdated WETH

+ +
+ The{' '} + + canonical WETH + contract is updated when necessary. + Unwrap outdated WETH in order to
 retrieve your ETH and move it + to the updated WETH token. +
+
+ + + + WETH Version + Balance + + {'WETH -> ETH'} + + + + + {this.renderOutdatedWeths()} + +
+
+
+ ); + } + private renderOutdatedWeths() { + const rows = _.map(configs.outdatedWrappedEthers, (outdatedWETH: OutdatedWrappedEther) => { + const timestampMsRange = outdatedWETH.timestampMsRangeByNetworkId[this.props.networkId]; + const startMoment = moment(timestampMsRange.startTimestampMs); + const endMoment = moment(timestampMsRange.endTimestampMs); + return ( + + +
+ +
+ {startMoment.format(DATE_FORMAT)}-{endMoment.format(DATE_FORMAT)} +
+
+ + + 0 WETH + + + + + + ); + }); + return rows; + } + private async wrapEthAsync() { + // TODO + } + private async unwrapEthAsync() { + // TODO + } +} // tslint:disable:max-file-line-count diff --git a/packages/website/ts/components/fill_order.tsx b/packages/website/ts/components/fill_order.tsx index 388c72d8e..77a9cfddb 100644 --- a/packages/website/ts/components/fill_order.tsx +++ b/packages/website/ts/components/fill_order.tsx @@ -4,7 +4,6 @@ import BigNumber from 'bignumber.js'; import * as _ from 'lodash'; import {Card, CardHeader, CardText} from 'material-ui/Card'; import Divider from 'material-ui/Divider'; -import Paper from 'material-ui/Paper'; import RaisedButton from 'material-ui/RaisedButton'; import TextField from 'material-ui/TextField'; import * as moment from 'moment'; diff --git a/packages/website/ts/components/portal.tsx b/packages/website/ts/components/portal.tsx index 62a5d2eac..57e75dab3 100644 --- a/packages/website/ts/components/portal.tsx +++ b/packages/website/ts/components/portal.tsx @@ -9,6 +9,7 @@ import {Route, Switch} from 'react-router-dom'; import {Blockchain} from 'ts/blockchain'; import {BlockchainErrDialog} from 'ts/components/dialogs/blockchain_err_dialog'; import {PortalDisclaimerDialog} from 'ts/components/dialogs/portal_disclaimer_dialog'; +import {EthWrappers} from 'ts/components/eth_wrappers'; import {FillOrder} from 'ts/components/fill_order'; import {Footer} from 'ts/components/footer'; import {PortalMenu} from 'ts/components/portal_menu'; @@ -205,6 +206,10 @@ export class Portal extends React.Component {
{this.props.blockchainIsLoaded ? + {
); } + private renderEthWrapper() { + return ( + + ); + } private renderTradeHistory() { return ( {this.renderMenuItemWithIcon('Trade history', 'zmdi-format-list-bulleted')} + + {this.renderMenuItemWithIcon('ETH wrapper', 'zmdi-circle-o')} + ); } diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index d225e7784..05e797ceb 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -683,4 +683,14 @@ export interface DocsInfoConfig { menuSubsectionToVersionWhenIntroduced?: {[sectionName: string]: string}; } +export interface TimestampMsRange { + startTimestampMs: number; + endTimestampMs: number; +} + +export interface OutdatedWrappedEther { + address: string; + timestampMsRangeByNetworkId: {[networkId: number]: TimestampMsRange}; +} + // tslint:disable:max-file-line-count diff --git a/packages/website/ts/utils/configs.ts b/packages/website/ts/utils/configs.ts index 63fcd27b6..e84dbd38f 100644 --- a/packages/website/ts/utils/configs.ts +++ b/packages/website/ts/utils/configs.ts @@ -1,5 +1,5 @@ import * as _ from 'lodash'; -import {Environments} from 'ts/types'; +import {Environments, OutdatedWrappedEther} from 'ts/types'; const BASE_URL = window.location.origin; const isDevelopment = _.includes(BASE_URL, 'https://0xproject.dev:3572') || @@ -15,4 +15,15 @@ export const configs = { defaultTrackedTokenSymbols: ['WETH', 'ZRX'], lastLocalStorageFillClearanceDate: '2017-11-22', isMainnetEnabled: true, + outdatedWrappedEthers: [ + { + address: '0x05d090b51c40b020eab3bfcb6a2dff130df22e9c', + timestampMsRangeByNetworkId: { + 42: { + startTimestampMs: 1501614680000, + endTimestampMs: 1513106129000, + }, + }, + } as OutdatedWrappedEther, + ], }; -- cgit v1.2.3 From 565010408e9dc2dd43a00dfdaefd51035008dd6f Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Wed, 13 Dec 2017 19:44:27 -0600 Subject: Remove temporary hack --- packages/website/ts/blockchain.ts | 2 -- 1 file changed, 2 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/blockchain.ts b/packages/website/ts/blockchain.ts index 5bc95238b..172ba6b52 100644 --- a/packages/website/ts/blockchain.ts +++ b/packages/website/ts/blockchain.ts @@ -602,8 +602,6 @@ export class Blockchain { // HACK: For now we have a hard-coded list of iconUrls for the dummyTokens // TODO: Refactor this out and pull the iconUrl directly from the TokenRegistry const iconUrl = constants.iconUrlBySymbol[t.symbol]; - // TEMPORARY HACK: Swap out for new WETH address - const address = t.symbol === 'WETH' ? '0x739E78d6bEbbDF24105a5145fA04436589d1CBd9' : t.address; const token: Token = { iconUrl, address: t.address, -- cgit v1.2.3 From b054080fa1da88460f52021278fb33b8d88371a3 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Wed, 13 Dec 2017 19:45:44 -0600 Subject: Remove ETH-WETH convert button from balances page --- packages/website/ts/components/token_balances.tsx | 24 ----------------------- packages/website/ts/types.ts | 1 - 2 files changed, 25 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx index ae5ef9222..799fecc69 100644 --- a/packages/website/ts/components/token_balances.tsx +++ b/packages/website/ts/components/token_balances.tsx @@ -23,7 +23,6 @@ import * as React from 'react'; import ReactTooltip = require('react-tooltip'); import firstBy = require('thenby'); import {Blockchain} from 'ts/blockchain'; -import {EthWethConversionButton} from 'ts/components/eth_weth_conversion_button'; import {AssetPicker} from 'ts/components/generate_order/asset_picker'; import {AllowanceToggle} from 'ts/components/inputs/allowance_toggle'; import {SendButton} from 'ts/components/send_button'; @@ -425,16 +424,6 @@ export class TokenBalances extends React.Component } - {token.symbol === ETHER_TOKEN_SYMBOL && - - } {token.symbol === ZRX_TOKEN_SYMBOL && this.props.networkId === constants.TESTNET_NETWORK_ID && ); - case BalanceErrs.wethConversionFailed: - return ( -
- Converting between Ether and Ether Tokens failed unexpectedly. - Please refresh the page and try again. -
- ); - case BalanceErrs.allowanceSettingFailed: return (
diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index 05e797ceb..4caa09025 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -135,7 +135,6 @@ export enum BalanceErrs { faucetRequestFailed, faucetQueueIsFull, mintingFailed, - wethConversionFailed, sendFailed, allowanceSettingFailed, } -- cgit v1.2.3 From ceae51fe322ebf444d0c8b61fdb7a86ab11c8071 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Wed, 13 Dec 2017 19:46:48 -0600 Subject: Make label optional and make sure the input field still renders properly without it --- packages/website/ts/components/inputs/token_amount_input.tsx | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/inputs/token_amount_input.tsx b/packages/website/ts/components/inputs/token_amount_input.tsx index f39341a4f..1ae9bc85e 100644 --- a/packages/website/ts/components/inputs/token_amount_input.tsx +++ b/packages/website/ts/components/inputs/token_amount_input.tsx @@ -8,9 +8,9 @@ import {BalanceBoundedInput} from 'ts/components/inputs/balance_bounded_input'; import {InputErrMsg, Token, TokenState, ValidatedBigNumberCallback, WebsitePaths} from 'ts/types'; interface TokenAmountInputProps { - label: string; token: Token; tokenState: TokenState; + label?: string; amount?: BigNumber; shouldShowIncompleteErrs: boolean; shouldCheckBalance: boolean; @@ -26,8 +26,9 @@ export class TokenAmountInput extends React.Component +
-
+
{this.props.token.symbol}
-- cgit v1.2.3 From 105bcc6664f0d4ab642486977f1edaf8d84b020e Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Wed, 13 Dec 2017 19:58:33 -0600 Subject: Clear trackedTokens so that a user starts tracking the new WETH and no longer the old one --- packages/website/ts/index.tsx | 2 ++ packages/website/ts/local_storage/tracked_token_storage.ts | 11 +++++++++++ packages/website/ts/utils/configs.ts | 1 + 3 files changed, 14 insertions(+) (limited to 'packages/website/ts') diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx index 922102d96..61cd6c2f5 100644 --- a/packages/website/ts/index.tsx +++ b/packages/website/ts/index.tsx @@ -10,6 +10,7 @@ import {BrowserRouter as Router, Link, Redirect, Route, Switch} from 'react-rout import * as injectTapEventPlugin from 'react-tap-event-plugin'; import {createStore, Store as ReduxStore} from 'redux'; import {createLazyComponent} from 'ts/lazy_component'; +import {trackedTokenStorage} from 'ts/local_storage/tracked_token_storage'; import {tradeHistoryStorage} from 'ts/local_storage/trade_history_storage'; import {About} from 'ts/pages/about/about'; import {FAQ} from 'ts/pages/faq/faq'; @@ -29,6 +30,7 @@ BigNumber.config({ // Check if we've introduced an update that requires us to clear the tradeHistory local storage entries tradeHistoryStorage.clearIfRequired(); +trackedTokenStorage.clearIfRequired(); const CUSTOM_GREY = 'rgb(39, 39, 39)'; const CUSTOM_GREEN = 'rgb(102, 222, 117)'; diff --git a/packages/website/ts/local_storage/tracked_token_storage.ts b/packages/website/ts/local_storage/tracked_token_storage.ts index 051a78ae1..086b06af5 100644 --- a/packages/website/ts/local_storage/tracked_token_storage.ts +++ b/packages/website/ts/local_storage/tracked_token_storage.ts @@ -1,10 +1,21 @@ import * as _ from 'lodash'; import {localStorage} from 'ts/local_storage/local_storage'; import {Token, TrackedTokensByNetworkId} from 'ts/types'; +import {configs} from 'ts/utils/configs'; const TRACKED_TOKENS_KEY = 'trackedTokens'; +const TRACKED_TOKENS_CLEAR_KEY = 'lastClearTrackedTokensDate'; export const trackedTokenStorage = { + // Clear trackedTokens localStorage if we've updated the config variable in an update + // that introduced a backward incompatible change requiring the tracked tokens to be re-set + clearIfRequired() { + const lastClearFillDate = localStorage.getItemIfExists(TRACKED_TOKENS_CLEAR_KEY); + if (lastClearFillDate !== configs.lastLocalStorageTrackedTokenClearanceDate) { + localStorage.removeItem(TRACKED_TOKENS_KEY); + } + localStorage.setItem(TRACKED_TOKENS_CLEAR_KEY, configs.lastLocalStorageTrackedTokenClearanceDate); + }, addTrackedTokenToUser(userAddress: string, networkId: number, token: Token) { const trackedTokensByUserAddress = this.getTrackedTokensByUserAddress(); let trackedTokensByNetworkId = trackedTokensByUserAddress[userAddress]; diff --git a/packages/website/ts/utils/configs.ts b/packages/website/ts/utils/configs.ts index e84dbd38f..c887d176f 100644 --- a/packages/website/ts/utils/configs.ts +++ b/packages/website/ts/utils/configs.ts @@ -14,6 +14,7 @@ export const configs = { // WARNING: ZRX & WETH MUST always be default trackedTokens defaultTrackedTokenSymbols: ['WETH', 'ZRX'], lastLocalStorageFillClearanceDate: '2017-11-22', + lastLocalStorageTrackedTokenClearanceDate: '2017-12-13', isMainnetEnabled: true, outdatedWrappedEthers: [ { -- cgit v1.2.3 From 7ce1021798ac2d459f80d1827a3259e781b4b201 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Thu, 14 Dec 2017 10:41:33 -0600 Subject: Refactor the WETH conversion dialog/button to be either wrap or unwrap specific and not both --- .../dialogs/eth_weth_conversion_dialog.tsx | 130 ++++++++++++--------- .../ts/components/eth_weth_conversion_button.tsx | 38 ++++-- 2 files changed, 109 insertions(+), 59 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx b/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx index aba5b9faf..4904ee9e2 100644 --- a/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx +++ b/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx @@ -1,14 +1,15 @@ import BigNumber from 'bignumber.js'; import Dialog from 'material-ui/Dialog'; import FlatButton from 'material-ui/FlatButton'; -import RadioButton from 'material-ui/RadioButton'; -import RadioButtonGroup from 'material-ui/RadioButton/RadioButtonGroup'; import * as React from 'react'; import {EthAmountInput} from 'ts/components/inputs/eth_amount_input'; import {TokenAmountInput} from 'ts/components/inputs/token_amount_input'; import {Side, Token, TokenState} from 'ts/types'; +const DARK_BLUE = '#4D5481'; + interface EthWethConversionDialogProps { + direction: Side; onComplete: (direction: Side, value: BigNumber) => void; onCancelled: () => void; isOpen: boolean; @@ -19,7 +20,6 @@ interface EthWethConversionDialogProps { interface EthWethConversionDialogState { value?: BigNumber; - direction: Side; shouldShowIncompleteErrs: boolean; hasErrors: boolean; } @@ -29,7 +29,6 @@ export class EthWethConversionDialog extends constructor() { super(); this.state = { - direction: Side.deposit, shouldShowIncompleteErrs: false, hasErrors: true, }; @@ -48,11 +47,13 @@ export class EthWethConversionDialog extends onTouchTap={this.onConvertClick.bind(this)} />, ]; + const title = this.props.direction === Side.deposit ? 'Wrap ETH' : 'Unwrap WETH'; return ( {this.renderConversionDialogBody()} @@ -60,56 +61,81 @@ export class EthWethConversionDialog extends ); } private renderConversionDialogBody() { + const explanation = this.props.direction === Side.deposit ? + 'Convert your Ether into a tokenized, tradable form.' : + 'Convert your Wrapped Ether back into it\'s native form.'; + const isWrappedVersion = this.props.direction === Side.receive; return ( -
- - - - - {this.state.direction === Side.receive ? - : - - } +
+
+ {explanation} +
+
+
+ {this.renderCurrency(isWrappedVersion)} +
+ +
+ {this.renderCurrency(!isWrappedVersion)} +
+
+ {this.props.direction === Side.receive ? + : + + } +
+ 1 ETH = 1 WETH +
+
+
); } - private onConversionDirectionChange(e: any, direction: Side) { - this.setState({ - value: undefined, - shouldShowIncompleteErrs: false, - direction, - hasErrors: true, - }); + private renderCurrency(isWrappedVersion: boolean) { + const name = isWrappedVersion ? 'Wrapped Ether' : 'Ether'; + const iconUrl = isWrappedVersion ? '/images/token_icons/ether_erc20.png' : '/images/ether.png'; + const symbol = isWrappedVersion ? 'WETH' : 'ETH'; + return ( +
+
+ {name} +
+
+ +
+
+ ({symbol}) +
+
+ ); } private onValueChange(isValid: boolean, amount?: BigNumber) { this.setState({ @@ -127,7 +153,7 @@ export class EthWethConversionDialog extends this.setState({ value: undefined, }); - this.props.onComplete(this.state.direction, value); + this.props.onComplete(this.props.direction, value); } } private onCancel() { diff --git a/packages/website/ts/components/eth_weth_conversion_button.tsx b/packages/website/ts/components/eth_weth_conversion_button.tsx index a83b1543f..bf686d44b 100644 --- a/packages/website/ts/components/eth_weth_conversion_button.tsx +++ b/packages/website/ts/components/eth_weth_conversion_button.tsx @@ -12,12 +12,15 @@ import {errorReporter} from 'ts/utils/error_reporter'; import {utils} from 'ts/utils/utils'; interface EthWethConversionButtonProps { + direction: Side; ethToken: Token; ethTokenState: TokenState; dispatcher: Dispatcher; blockchain: Blockchain; userEtherBalance: BigNumber; - onError: () => void; + isOutdatedWrappedEther: boolean; + onConversionSuccessful?: () => void; + isDisabled?: boolean; } interface EthWethConversionButtonState { @@ -27,6 +30,9 @@ interface EthWethConversionButtonState { export class EthWethConversionButton extends React.Component { + public static defaultProps: Partial = { + isDisabled: false, + }; public constructor(props: EthWethConversionButtonProps) { super(props); this.state = { @@ -36,16 +42,26 @@ export class EthWethConversionButton extends } public render() { const labelStyle = this.state.isEthConversionHappening ? {fontSize: 10} : {}; + let callToActionLabel; + let inProgressLabel; + if (this.props.direction === Side.deposit) { + callToActionLabel = 'Wrap'; + inProgressLabel = 'Wrapping...'; + } else { + callToActionLabel = 'Unwrap'; + inProgressLabel = 'Unwrapping...'; + } return (
Date: Thu, 14 Dec 2017 10:43:20 -0600 Subject: Use new wrap/unwrap buttons, fetch outdated WETH balances and re-fetch after a successful unwrap. --- packages/website/ts/components/eth_wrappers.tsx | 249 ++++++++++++++++++------ packages/website/ts/types.ts | 8 +- packages/website/ts/utils/configs.ts | 23 ++- 3 files changed, 208 insertions(+), 72 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx index 277929870..c2f9b7b45 100644 --- a/packages/website/ts/components/eth_wrappers.tsx +++ b/packages/website/ts/components/eth_wrappers.tsx @@ -16,12 +16,16 @@ import { import * as moment from 'moment'; import * as React from 'react'; import {Blockchain} from 'ts/blockchain'; +import {EthWethConversionButton} from 'ts/components/eth_weth_conversion_button'; import {LifeCycleRaisedButton} from 'ts/components/ui/lifecycle_raised_button'; import {trackedTokenStorage} from 'ts/local_storage/tracked_token_storage'; import {Dispatcher} from 'ts/redux/dispatcher'; import { - OutdatedWrappedEther, + OutdatedWrappedEtherByNetworkId, + Side, + Token, TokenByAddress, + TokenState, TokenStateByAddress, } from 'ts/types'; import {configs} from 'ts/utils/configs'; @@ -31,11 +35,19 @@ import {utils} from 'ts/utils/utils'; const PRECISION = 5; const DATE_FORMAT = 'D/M/YY'; +const LIGHT_GRAY = '#A5A5A5'; const ICON_DIMENSION = 40; const ETHER_ICON_PATH = '/images/ether.png'; const OUTDATED_WETH_ICON_PATH = '/images/wrapped_eth_gray.png'; const ETHER_TOKEN_SYMBOL = 'WETH'; +interface OutdatedWETHAddressToIsStateLoaded { + [address: string]: boolean; +} +interface OutdatedWETHStateByAddress { + [address: string]: TokenState; +} + interface EthWrappersProps { networkId: number; blockchain: Blockchain; @@ -46,24 +58,58 @@ interface EthWrappersProps { userEtherBalance: BigNumber; } -interface EthWrappersState {} +interface EthWrappersState { + outdatedWETHAddressToIsStateLoaded: OutdatedWETHAddressToIsStateLoaded; + outdatedWETHStateByAddress: OutdatedWETHStateByAddress; +} export class EthWrappers extends React.Component { constructor(props: EthWrappersProps) { super(props); - this.state = {}; + const outdatedWETHAddresses = this.getOutdatedWETHAddresses(); + const outdatedWETHAddressToIsStateLoaded: OutdatedWETHAddressToIsStateLoaded = {}; + const outdatedWETHStateByAddress: OutdatedWETHStateByAddress = {}; + _.each(outdatedWETHAddresses, outdatedWETHAddress => { + outdatedWETHAddressToIsStateLoaded[outdatedWETHAddress] = false; + outdatedWETHStateByAddress[outdatedWETHAddress] = { + balance: new BigNumber(0), + allowance: new BigNumber(0), + }; + }); + this.state = { + outdatedWETHAddressToIsStateLoaded, + outdatedWETHStateByAddress, + }; } public componentDidMount() { window.scrollTo(0, 0); + // tslint:disable-next-line:no-floating-promises + this.fetchOutdatedWETHStateAsync(); } public render() { const tokens = _.values(this.props.tokenByAddress); - const wethToken = _.find(tokens, {symbol: 'WETH'}); - const wethState = this.props.tokenStateByAddress[wethToken.address]; - const wethBalance = ZeroEx.toUnitAmount(wethState.balance, 18); + const etherToken = _.find(tokens, {symbol: 'WETH'}); + const etherTokenState = this.props.tokenStateByAddress[etherToken.address]; + const wethBalance = ZeroEx.toUnitAmount(etherTokenState.balance, 18); return (
-

ETH Wrapper

+
+

ETH Wrapper

+ +
@@ -100,11 +146,14 @@ export class EthWrappers extends React.Component - @@ -124,11 +173,14 @@ export class EthWrappers extends React.Component - @@ -136,46 +188,66 @@ export class EthWrappers extends React.Component
-

Outdated WETH

- -
- The{' '} - - canonical WETH - contract is updated when necessary. - Unwrap outdated WETH in order to
 retrieve your ETH and move it - to the updated WETH token. -
- - - - WETH Version - Balance - - {'WETH -> ETH'} - - - - - {this.renderOutdatedWeths()} - -
+

Outdated WETH

+ +
+ The{' '} + + canonical WETH + contract is updated when necessary. + Unwrap outdated WETH in order to
 retrieve your ETH and move it + to the updated WETH token. +
+
+ + + + WETH Version + Balance + + {'WETH -> ETH'} + + + + + {this.renderOutdatedWeths(etherToken, etherTokenState)} + +
+
); } - private renderOutdatedWeths() { - const rows = _.map(configs.outdatedWrappedEthers, (outdatedWETH: OutdatedWrappedEther) => { - const timestampMsRange = outdatedWETH.timestampMsRangeByNetworkId[this.props.networkId]; - const startMoment = moment(timestampMsRange.startTimestampMs); - const endMoment = moment(timestampMsRange.endTimestampMs); + private renderOutdatedWeths(etherToken: Token, etherTokenState: TokenState) { + const rows = _.map(configs.outdatedWrappedEthers, + (outdatedWETHByNetworkId: OutdatedWrappedEtherByNetworkId) => { + const outdatedWETH = outdatedWETHByNetworkId[this.props.networkId]; + const timestampMsRange = outdatedWETH.timestampMsRange; + let dateRange: string; + if (!_.isUndefined(timestampMsRange)) { + const startMoment = moment(timestampMsRange.startTimestampMs); + const endMoment = moment(timestampMsRange.endTimestampMs); + dateRange = `${startMoment.format(DATE_FORMAT)}-${endMoment.format(DATE_FORMAT)}`; + } else { + dateRange = '-'; + } + const outdatedEtherToken = { + ...etherToken, + address: outdatedWETH.address, + }; + const isStateLoaded = this.state.outdatedWETHAddressToIsStateLoaded[outdatedWETH.address]; + const outdatedEtherTokenState = this.state.outdatedWETHStateByAddress[outdatedWETH.address]; + const balanceInEthIfExists = isStateLoaded ? + ZeroEx.toUnitAmount(outdatedEtherTokenState.balance, 18).toFixed(PRECISION) : + undefined; + const onConversionSuccessful = this.onOutdatedConversionSuccessfulAsync.bind(this, outdatedWETH.address); return ( @@ -185,19 +257,27 @@ export class EthWrappers extends React.Component
- {startMoment.format(DATE_FORMAT)}-{endMoment.format(DATE_FORMAT)} + {dateRange}
- 0 WETH + {isStateLoaded ? + `${balanceInEthIfExists} WETH` : + + } - @@ -205,10 +285,53 @@ export class EthWrappers extends React.Component { + return outdatedWrappedEther[this.props.networkId].address; + }); + return outdatedWETHAddresses; } } // tslint:disable:max-file-line-count diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index 4caa09025..2005cf265 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -687,9 +687,11 @@ export interface TimestampMsRange { endTimestampMs: number; } -export interface OutdatedWrappedEther { - address: string; - timestampMsRangeByNetworkId: {[networkId: number]: TimestampMsRange}; +export interface OutdatedWrappedEtherByNetworkId { + [networkId: number]: { + address: string; + timestampMsRange: TimestampMsRange; + }; } // tslint:disable:max-file-line-count diff --git a/packages/website/ts/utils/configs.ts b/packages/website/ts/utils/configs.ts index c887d176f..adc51374f 100644 --- a/packages/website/ts/utils/configs.ts +++ b/packages/website/ts/utils/configs.ts @@ -1,5 +1,9 @@ import * as _ from 'lodash'; -import {Environments, OutdatedWrappedEther} from 'ts/types'; +import { + Environments, + OutdatedWrappedEtherByNetworkId, + TimestampMsRange, +} from 'ts/types'; const BASE_URL = window.location.origin; const isDevelopment = _.includes(BASE_URL, 'https://0xproject.dev:3572') || @@ -18,13 +22,20 @@ export const configs = { isMainnetEnabled: true, outdatedWrappedEthers: [ { - address: '0x05d090b51c40b020eab3bfcb6a2dff130df22e9c', - timestampMsRangeByNetworkId: { - 42: { + 42: { + address: '0x05d090b51c40b020eab3bfcb6a2dff130df22e9c', + timestampMsRange: { startTimestampMs: 1501614680000, endTimestampMs: 1513106129000, }, }, - } as OutdatedWrappedEther, - ], + 1: { + address: '0x2956356cd2a2bf3202f771f50d3d14a367b48070', + timestampMsRange: { + startTimestampMs: 1513123415000, + endTimestampMs: 1513106129000, + }, + }, + }, + ] as OutdatedWrappedEtherByNetworkId[], }; -- cgit v1.2.3 From ce242b10e2c4d35bbba3842d198b78373dd609f0 Mon Sep 17 00:00:00 2001 From: Leonid Logvinov Date: Thu, 14 Dec 2017 17:43:42 +0100 Subject: Reuse intervalutils in website --- packages/website/ts/blockchain.ts | 6 +++--- packages/website/ts/web3_wrapper.ts | 6 +++--- 2 files changed, 6 insertions(+), 6 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/blockchain.ts b/packages/website/ts/blockchain.ts index 172ba6b52..321a603ef 100644 --- a/packages/website/ts/blockchain.ts +++ b/packages/website/ts/blockchain.ts @@ -23,7 +23,7 @@ import { LedgerWalletSubprovider, RedundantRPCSubprovider, } from '@0xproject/subproviders'; -import {promisify} from '@0xproject/utils'; +import {intervalUtils, promisify} from '@0xproject/utils'; import BigNumber from 'bignumber.js'; import compareVersions = require('compare-versions'); import ethUtil = require('ethereumjs-util'); @@ -75,7 +75,7 @@ export class Blockchain { private userAddress: string; private cachedProvider: Web3.Provider; private ledgerSubprovider: LedgerWalletSubprovider; - private zrxPollIntervalId: number; + private zrxPollIntervalId: NodeJS.Timer; private static async onPageLoadAsync() { if (document.readyState === 'complete') { return; // Already loaded @@ -359,7 +359,7 @@ export class Blockchain { const [currBalance] = await this.getTokenBalanceAndAllowanceAsync(this.userAddress, token.address); - this.zrxPollIntervalId = window.setInterval(async () => { + this.zrxPollIntervalId = intervalUtils.setAsyncExcludingInterval(async () => { const [balance] = await this.getTokenBalanceAndAllowanceAsync(this.userAddress, token.address); if (!balance.eq(currBalance)) { this.dispatcher.replaceTokenBalanceByAddress(token.address, balance); diff --git a/packages/website/ts/web3_wrapper.ts b/packages/website/ts/web3_wrapper.ts index b713f8a33..1bf7ffed5 100644 --- a/packages/website/ts/web3_wrapper.ts +++ b/packages/website/ts/web3_wrapper.ts @@ -1,4 +1,4 @@ -import {promisify} from '@0xproject/utils'; +import {intervalUtils, promisify} from '@0xproject/utils'; import BigNumber from 'bignumber.js'; import * as _ from 'lodash'; import {Dispatcher} from 'ts/redux/dispatcher'; @@ -9,7 +9,7 @@ export class Web3Wrapper { private web3: Web3; private prevNetworkId: number; private shouldPollUserAddress: boolean; - private watchNetworkAndBalanceIntervalId: number; + private watchNetworkAndBalanceIntervalId: NodeJS.Timer; private prevUserEtherBalanceInEth: BigNumber; private prevUserAddress: string; constructor(dispatcher: Dispatcher, provider: Web3.Provider, networkIdIfExists: number, @@ -98,7 +98,7 @@ export class Web3Wrapper { let prevNodeVersion: string; this.prevUserEtherBalanceInEth = new BigNumber(0); this.dispatcher.updateNetworkId(this.prevNetworkId); - this.watchNetworkAndBalanceIntervalId = window.setInterval(async () => { + this.watchNetworkAndBalanceIntervalId = intervalUtils.setAsyncExcludingInterval(async () => { // Check for network state changes const currentNetworkId = await this.getNetworkIdIfExists(); if (currentNetworkId !== this.prevNetworkId) { -- cgit v1.2.3 From ac1fbeb9623682ce678990d1815fcff63a6c40ae Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Thu, 14 Dec 2017 19:28:49 -0600 Subject: Improve WETH page styling --- .../dialogs/eth_weth_conversion_dialog.tsx | 8 ++--- packages/website/ts/components/eth_wrappers.tsx | 39 +++++++++++++++++----- 2 files changed, 35 insertions(+), 12 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx b/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx index 4904ee9e2..c8bdced9b 100644 --- a/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx +++ b/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx @@ -53,7 +53,7 @@ export class EthWethConversionDialog extends title={title} titleStyle={{fontWeight: 100}} actions={convertDialogActions} - contentStyle={{width: 600}} + contentStyle={{width: 448}} open={this.props.isOpen} > {this.renderConversionDialogBody()} @@ -70,7 +70,7 @@ export class EthWethConversionDialog extends
{explanation}
-
+
{this.renderCurrency(isWrappedVersion)}
@@ -83,7 +83,7 @@ export class EthWethConversionDialog extends
{this.props.direction === Side.receive ?
-
+
({symbol})
diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx index c2f9b7b45..ccbed4188 100644 --- a/packages/website/ts/components/eth_wrappers.tsx +++ b/packages/website/ts/components/eth_wrappers.tsx @@ -91,6 +91,7 @@ export class EthWrappers extends React.Component
@@ -113,7 +114,7 @@ export class EthWrappers extends React.Component
- Wrap ETH into an ERC20-compliant Ether token + Wrap ETH into an ERC20-compliant Ether token. 1 ETH = 1 WETH.
ETH TokenBalance - - {'ETH <-> WETH'} + + {this.renderActionColumnTitle(isBidirectional)} @@ -145,7 +146,7 @@ export class EthWrappers extends React.Component {this.props.userEtherBalance.toFixed(PRECISION)} ETH - + {wethBalance.toFixed(PRECISION)} WETH - + WETH Version Balance - - {'WETH -> ETH'} + + {this.renderActionColumnTitle(!isBidirectional)} @@ -225,6 +226,28 @@ export class EthWrappers extends React.Component ); } + private renderActionColumnTitle(isBidirectional: boolean) { + let iconClass = 'zmdi-long-arrow-right'; + let leftSymbol = 'WETH'; + let rightSymbol = 'ETH'; + if (isBidirectional) { + iconClass = 'zmdi-swap'; + leftSymbol = 'ETH'; + rightSymbol = 'WETH'; + } + return ( +
+
{leftSymbol}
+
+ +
+
{rightSymbol}
+
+ ); + } private renderOutdatedWeths(etherToken: Token, etherTokenState: TokenState) { const rows = _.map(configs.outdatedWrappedEthers, (outdatedWETHByNetworkId: OutdatedWrappedEtherByNetworkId) => { @@ -267,7 +290,7 @@ export class EthWrappers extends React.Component } - + Date: Fri, 15 Dec 2017 15:19:19 +0100 Subject: Fix website unused vars --- packages/website/ts/blockchain.ts | 12 +------- .../dialogs/portal_disclaimer_dialog.tsx | 1 - .../website/ts/components/dialogs/send_dialog.tsx | 5 +--- .../dialogs/track_token_confirmation_dialog.tsx | 2 -- packages/website/ts/components/fill_order.tsx | 10 ------- packages/website/ts/components/footer.tsx | 33 +--------------------- .../ts/components/generate_order/asset_picker.tsx | 21 -------------- .../generate_order/generate_order_form.tsx | 13 ++------- .../components/generate_order/new_token_form.tsx | 1 - .../website/ts/components/inputs/address_input.tsx | 1 - .../components/inputs/identicon_address_input.tsx | 2 -- .../website/ts/components/inputs/token_input.tsx | 2 +- packages/website/ts/components/order_json.tsx | 4 +-- packages/website/ts/components/portal.tsx | 27 ------------------ packages/website/ts/components/portal_menu.tsx | 1 - packages/website/ts/components/send_button.tsx | 2 -- packages/website/ts/components/token_balances.tsx | 1 - packages/website/ts/components/top_bar.tsx | 10 +------ .../website/ts/components/top_bar_menu_item.tsx | 1 - .../ts/components/track_token_confirmation.tsx | 2 -- packages/website/ts/components/ui/badge.tsx | 1 - .../ts/components/ui/drop_down_menu_item.tsx | 6 ---- .../website/ts/components/ui/fake_text_field.tsx | 1 - .../ts/components/ui/lifecycle_raised_button.tsx | 2 -- packages/website/ts/components/ui/menu_item.tsx | 3 -- packages/website/ts/components/ui/party.tsx | 4 --- .../website/ts/components/ui/simple_loading.tsx | 1 - packages/website/ts/components/ui/swap_icon.tsx | 1 - packages/website/ts/components/visual_order.tsx | 1 - .../ts/containers/connect_documentation.tsx | 4 +-- .../website/ts/containers/generate_order_form.tsx | 2 -- packages/website/ts/containers/portal.tsx | 12 ++++---- .../containers/smart_contracts_documentation.tsx | 2 +- .../ts/containers/zero_ex_js_documentation.tsx | 4 +-- packages/website/ts/index.tsx | 2 +- packages/website/ts/pages/about/about.tsx | 6 +--- packages/website/ts/pages/about/profile.tsx | 3 -- .../website/ts/pages/documentation/comment.tsx | 2 ++ .../ts/pages/documentation/documentation.tsx | 8 ------ packages/website/ts/pages/documentation/enum.tsx | 6 +--- .../ts/pages/documentation/event_definition.tsx | 3 -- .../ts/pages/documentation/method_block.tsx | 4 --- .../ts/pages/documentation/method_signature.tsx | 2 ++ .../website/ts/pages/documentation/source_link.tsx | 1 - packages/website/ts/pages/documentation/type.tsx | 3 -- .../ts/pages/documentation/type_definition.tsx | 2 -- packages/website/ts/pages/faq/faq.tsx | 2 -- packages/website/ts/pages/landing/landing.tsx | 26 ++--------------- packages/website/ts/pages/not_found.tsx | 1 - .../ts/pages/shared/nested_sidebar_menu.tsx | 3 +- .../website/ts/pages/shared/version_drop_down.tsx | 2 -- packages/website/ts/redux/dispatcher.ts | 1 - packages/website/ts/utils/constants.ts | 1 - packages/website/ts/utils/doc_utils.ts | 1 - packages/website/ts/utils/typedoc_utils.ts | 4 --- packages/website/ts/utils/utils.ts | 6 ++-- 56 files changed, 28 insertions(+), 256 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/blockchain.ts b/packages/website/ts/blockchain.ts index 321a603ef..331bafa71 100644 --- a/packages/website/ts/blockchain.ts +++ b/packages/website/ts/blockchain.ts @@ -1,7 +1,6 @@ import { BlockParam, DecodedLogEvent, - ExchangeContractErrs, ExchangeContractEventArgs, ExchangeEvents, IndexedFilterValues, @@ -14,7 +13,6 @@ import { Token as ZeroExToken, TransactionReceiptWithDecodedLogs, ZeroEx, - ZeroExError, } from '0x.js'; import { InjectedWeb3Subprovider, @@ -25,9 +23,6 @@ import { } from '@0xproject/subproviders'; import {intervalUtils, promisify} from '@0xproject/utils'; import BigNumber from 'bignumber.js'; -import compareVersions = require('compare-versions'); -import ethUtil = require('ethereumjs-util'); -import findVersions = require('find-versions'); import * as _ from 'lodash'; import * as React from 'react'; import contract = require('truffle-contract'); @@ -40,7 +35,6 @@ import { BlockchainCallErrs, BlockchainErrs, ContractInstance, - ContractResponse, EtherscanLinkSuffixes, ProviderType, Side, @@ -60,7 +54,6 @@ import FilterSubprovider = require('web3-provider-engine/subproviders/filters'); import * as MintableArtifacts from '../contracts/Mintable.json'; -const ALLOWANCE_TO_ZERO_GAS_AMOUNT = 45730; const BLOCK_NUMBER_BACK_TRACK = 50; export class Blockchain { @@ -70,8 +63,6 @@ export class Blockchain { private dispatcher: Dispatcher; private web3Wrapper?: Web3Wrapper; private exchangeAddress: string; - private tokenTransferProxy: ContractInstance; - private tokenRegistry: ContractInstance; private userAddress: string; private cachedProvider: Web3.Provider; private ledgerSubprovider: LedgerWalletSubprovider; @@ -506,8 +497,7 @@ export class Blockchain { await this.fetchHistoricalExchangeLogFillEventsAsync(indexFilterValues); // Start a subscription for new logs - const exchangeAddress = this.getExchangeContractAddressIfExists(); - const subscriptionId = this.zeroEx.exchange.subscribe( + this.zeroEx.exchange.subscribe( ExchangeEvents.LogFill, indexFilterValues, async (err: Error, decodedLogEvent: DecodedLogEvent) => { if (err) { diff --git a/packages/website/ts/components/dialogs/portal_disclaimer_dialog.tsx b/packages/website/ts/components/dialogs/portal_disclaimer_dialog.tsx index 1d90624ee..bfff7fbb5 100644 --- a/packages/website/ts/components/dialogs/portal_disclaimer_dialog.tsx +++ b/packages/website/ts/components/dialogs/portal_disclaimer_dialog.tsx @@ -2,7 +2,6 @@ import Dialog from 'material-ui/Dialog'; import FlatButton from 'material-ui/FlatButton'; import {colors} from 'material-ui/styles'; import * as React from 'react'; -import {constants} from 'ts/utils/constants'; interface PortalDisclaimerDialogProps { isOpen: boolean; diff --git a/packages/website/ts/components/dialogs/send_dialog.tsx b/packages/website/ts/components/dialogs/send_dialog.tsx index 31afc3386..0f3516993 100644 --- a/packages/website/ts/components/dialogs/send_dialog.tsx +++ b/packages/website/ts/components/dialogs/send_dialog.tsx @@ -2,13 +2,10 @@ import BigNumber from 'bignumber.js'; import * as _ from 'lodash'; import Dialog from 'material-ui/Dialog'; import FlatButton from 'material-ui/FlatButton'; -import RadioButton from 'material-ui/RadioButton'; -import RadioButtonGroup from 'material-ui/RadioButton/RadioButtonGroup'; import * as React from 'react'; import {AddressInput} from 'ts/components/inputs/address_input'; -import {EthAmountInput} from 'ts/components/inputs/eth_amount_input'; import {TokenAmountInput} from 'ts/components/inputs/token_amount_input'; -import {Side, Token, TokenState} from 'ts/types'; +import {Token, TokenState} from 'ts/types'; interface SendDialogProps { onComplete: (recipient: string, value: BigNumber) => void; diff --git a/packages/website/ts/components/dialogs/track_token_confirmation_dialog.tsx b/packages/website/ts/components/dialogs/track_token_confirmation_dialog.tsx index 70c7d1ab6..2d45009d5 100644 --- a/packages/website/ts/components/dialogs/track_token_confirmation_dialog.tsx +++ b/packages/website/ts/components/dialogs/track_token_confirmation_dialog.tsx @@ -1,14 +1,12 @@ import * as _ from 'lodash'; import Dialog from 'material-ui/Dialog'; import FlatButton from 'material-ui/FlatButton'; -import {colors} from 'material-ui/styles'; import * as React from 'react'; import {Blockchain} from 'ts/blockchain'; import {TrackTokenConfirmation} from 'ts/components/track_token_confirmation'; import {trackedTokenStorage} from 'ts/local_storage/tracked_token_storage'; import {Dispatcher} from 'ts/redux/dispatcher'; import {Token, TokenByAddress} from 'ts/types'; -import {constants} from 'ts/utils/constants'; interface TrackTokenConfirmationDialogProps { tokens: Token[]; diff --git a/packages/website/ts/components/fill_order.tsx b/packages/website/ts/components/fill_order.tsx index 388c72d8e..40a9b87d6 100644 --- a/packages/website/ts/components/fill_order.tsx +++ b/packages/website/ts/components/fill_order.tsx @@ -4,10 +4,7 @@ import BigNumber from 'bignumber.js'; import * as _ from 'lodash'; import {Card, CardHeader, CardText} from 'material-ui/Card'; import Divider from 'material-ui/Divider'; -import Paper from 'material-ui/Paper'; import RaisedButton from 'material-ui/RaisedButton'; -import TextField from 'material-ui/TextField'; -import * as moment from 'moment'; import * as React from 'react'; import {Link} from 'react-router-dom'; import {Blockchain} from 'ts/blockchain'; @@ -19,18 +16,13 @@ import {Alert} from 'ts/components/ui/alert'; import {EthereumAddress} from 'ts/components/ui/ethereum_address'; import {Identicon} from 'ts/components/ui/identicon'; import {VisualOrder} from 'ts/components/visual_order'; -import {trackedTokenStorage} from 'ts/local_storage/tracked_token_storage'; import {Dispatcher} from 'ts/redux/dispatcher'; import {orderSchema} from 'ts/schemas/order_schema'; import {SchemaValidator} from 'ts/schemas/validator'; import { AlertTypes, BlockchainErrs, - ContractResponse, - ExchangeContractErrs, Order, - OrderToken, - Side, Token, TokenByAddress, TokenStateByAddress, @@ -531,8 +523,6 @@ export class FillOrder extends React.Component { }); const parsedOrder = this.state.parsedOrder; - const orderHash = parsedOrder.signature.hash; - const unavailableTakerAmount = await this.props.blockchain.getUnavailableTakerAmountAsync(orderHash); const takerFillAmount = this.props.orderFillAmount; if (_.isUndefined(this.props.userAddress)) { diff --git a/packages/website/ts/components/footer.tsx b/packages/website/ts/components/footer.tsx index 5e3c0479a..b26523094 100644 --- a/packages/website/ts/components/footer.tsx +++ b/packages/website/ts/components/footer.tsx @@ -3,11 +3,7 @@ import * as React from 'react'; import { Link, } from 'react-router-dom'; -import {HashLink} from 'react-router-hash-link'; -import { - Link as ScrollLink, -} from 'react-scroll'; -import {Styles, WebsitePaths} from 'ts/types'; +import {WebsitePaths} from 'ts/types'; import {constants} from 'ts/utils/constants'; interface MenuItemsBySection { @@ -229,31 +225,4 @@ export class Footer extends React.Component { ); } - private renderHomepageLink(title: string) { - const hash = title.toLowerCase(); - if (this.props.location.pathname === WebsitePaths.Home) { - return ( - - {title} - - ); - } else { - return ( - - {title} - - ); - } - } } diff --git a/packages/website/ts/components/generate_order/asset_picker.tsx b/packages/website/ts/components/generate_order/asset_picker.tsx index 633d6a017..08b4a909e 100644 --- a/packages/website/ts/components/generate_order/asset_picker.tsx +++ b/packages/website/ts/components/generate_order/asset_picker.tsx @@ -1,9 +1,6 @@ import * as _ from 'lodash'; import Dialog from 'material-ui/Dialog'; import FlatButton from 'material-ui/FlatButton'; -import GridList from 'material-ui/GridList/GridList'; -import GridTile from 'material-ui/GridList/GridTile'; -import {colors} from 'material-ui/styles'; import * as React from 'react'; import {Blockchain} from 'ts/blockchain'; import {NewTokenForm} from 'ts/components/generate_order/new_token_form'; @@ -12,15 +9,12 @@ import {TokenIcon} from 'ts/components/ui/token_icon'; import {trackedTokenStorage} from 'ts/local_storage/tracked_token_storage'; import {Dispatcher} from 'ts/redux/dispatcher'; import { - AssetToken, DialogConfigs, - Styles, Token, TokenByAddress, TokenState, TokenVisibility, } from 'ts/types'; -import {utils} from 'ts/utils/utils'; const TOKEN_ICON_DIMENSION = 100; const TILE_DIMENSION = 146; @@ -219,21 +213,6 @@ export class AssetPicker extends React.Component { +export class GenerateOrderForm extends React.Component { private validator: SchemaValidator; constructor(props: GenerateOrderFormProps) { super(props); @@ -287,7 +278,7 @@ export class GenerateOrderForm extends React.Component { private blockchain: Blockchain; private sharedOrderIfExists: Order; diff --git a/packages/website/ts/components/portal_menu.tsx b/packages/website/ts/components/portal_menu.tsx index 869df3e71..7b9a31a15 100644 --- a/packages/website/ts/components/portal_menu.tsx +++ b/packages/website/ts/components/portal_menu.tsx @@ -1,6 +1,5 @@ import * as _ from 'lodash'; import * as React from 'react'; -import {Link} from 'react-router-dom'; import {MenuItem} from 'ts/components/ui/menu_item'; import {WebsitePaths} from 'ts/types'; diff --git a/packages/website/ts/components/send_button.tsx b/packages/website/ts/components/send_button.tsx index da8dd2a9b..b3fd2aeba 100644 --- a/packages/website/ts/components/send_button.tsx +++ b/packages/website/ts/components/send_button.tsx @@ -1,4 +1,3 @@ -import {ZeroEx} from '0x.js'; import BigNumber from 'bignumber.js'; import * as _ from 'lodash'; import RaisedButton from 'material-ui/RaisedButton'; @@ -7,7 +6,6 @@ import {Blockchain} from 'ts/blockchain'; import {SendDialog} from 'ts/components/dialogs/send_dialog'; import {Dispatcher} from 'ts/redux/dispatcher'; import {BlockchainCallErrs, Token, TokenState} from 'ts/types'; -import {constants} from 'ts/utils/constants'; import {errorReporter} from 'ts/utils/error_reporter'; import {utils} from 'ts/utils/utils'; diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx index ae5ef9222..478114516 100644 --- a/packages/website/ts/components/token_balances.tsx +++ b/packages/website/ts/components/token_balances.tsx @@ -18,7 +18,6 @@ import { TableRow, TableRowColumn, } from 'material-ui/Table'; -import QueryString = require('query-string'); import * as React from 'react'; import ReactTooltip = require('react-tooltip'); import firstBy = require('thenby'); diff --git a/packages/website/ts/components/top_bar.tsx b/packages/website/ts/components/top_bar.tsx index 4398fe667..488eef914 100644 --- a/packages/website/ts/components/top_bar.tsx +++ b/packages/website/ts/components/top_bar.tsx @@ -1,15 +1,9 @@ import * as _ from 'lodash'; -import AppBar from 'material-ui/AppBar'; import Drawer from 'material-ui/Drawer'; import MenuItem from 'material-ui/MenuItem'; import {colors} from 'material-ui/styles'; import * as React from 'react'; import {Link} from 'react-router-dom'; -import {HashLink} from 'react-router-hash-link'; -import { - animateScroll, - Link as ScrollLink, -} from 'react-scroll'; import ReactTooltip = require('react-tooltip'); import {PortalMenu} from 'ts/components/portal_menu'; import {TopBarMenuItem} from 'ts/components/top_bar_menu_item'; @@ -17,10 +11,8 @@ import {DropDownMenuItem} from 'ts/components/ui/drop_down_menu_item'; import {Identicon} from 'ts/components/ui/identicon'; import {DocsInfo} from 'ts/pages/documentation/docs_info'; import {NestedSidebarMenu} from 'ts/pages/shared/nested_sidebar_menu'; -import {DocsMenu, MenuSubsectionsBySection, Styles, TypeDocNode, WebsitePaths} from 'ts/types'; -import {configs} from 'ts/utils/configs'; +import {DocsMenu, MenuSubsectionsBySection, Styles, WebsitePaths} from 'ts/types'; import {constants} from 'ts/utils/constants'; -import {typeDocUtils} from 'ts/utils/typedoc_utils'; const CUSTOM_DARK_GRAY = '#231F20'; const SECTION_HEADER_COLOR = 'rgb(234, 234, 234)'; diff --git a/packages/website/ts/components/top_bar_menu_item.tsx b/packages/website/ts/components/top_bar_menu_item.tsx index de429fba6..38dc91194 100644 --- a/packages/website/ts/components/top_bar_menu_item.tsx +++ b/packages/website/ts/components/top_bar_menu_item.tsx @@ -1,7 +1,6 @@ import * as _ from 'lodash'; import * as React from 'react'; import {Link} from 'react-router-dom'; -import {Styles} from 'ts/types'; const CUSTOM_DARK_GRAY = '#231F20'; const DEFAULT_STYLE = { diff --git a/packages/website/ts/components/track_token_confirmation.tsx b/packages/website/ts/components/track_token_confirmation.tsx index b9b2ef18a..cd588f239 100644 --- a/packages/website/ts/components/track_token_confirmation.tsx +++ b/packages/website/ts/components/track_token_confirmation.tsx @@ -1,6 +1,4 @@ import * as _ from 'lodash'; -import Dialog from 'material-ui/Dialog'; -import FlatButton from 'material-ui/FlatButton'; import {colors} from 'material-ui/styles'; import * as React from 'react'; import {Party} from 'ts/components/ui/party'; diff --git a/packages/website/ts/components/ui/badge.tsx b/packages/website/ts/components/ui/badge.tsx index 15d5ea227..cf4396047 100644 --- a/packages/website/ts/components/ui/badge.tsx +++ b/packages/website/ts/components/ui/badge.tsx @@ -1,5 +1,4 @@ import * as _ from 'lodash'; -import {colors} from 'material-ui/styles'; import * as React from 'react'; import {Styles} from 'ts/types'; diff --git a/packages/website/ts/components/ui/drop_down_menu_item.tsx b/packages/website/ts/components/ui/drop_down_menu_item.tsx index 05b88f7ce..041688a9d 100644 --- a/packages/website/ts/components/ui/drop_down_menu_item.tsx +++ b/packages/website/ts/components/ui/drop_down_menu_item.tsx @@ -1,13 +1,7 @@ import * as _ from 'lodash'; import Menu from 'material-ui/Menu'; -import MenuItem from 'material-ui/MenuItem'; import Popover from 'material-ui/Popover'; import * as React from 'react'; -import {Link} from 'react-router-dom'; -import { - Link as ScrollLink, -} from 'react-scroll'; -import {Styles, WebsitePaths} from 'ts/types'; const CHECK_CLOSE_POPOVER_INTERVAL_MS = 300; const CUSTOM_LIGHT_GRAY = '#848484'; diff --git a/packages/website/ts/components/ui/fake_text_field.tsx b/packages/website/ts/components/ui/fake_text_field.tsx index 90bc47f01..8ee4349a2 100644 --- a/packages/website/ts/components/ui/fake_text_field.tsx +++ b/packages/website/ts/components/ui/fake_text_field.tsx @@ -1,4 +1,3 @@ -import {colors} from 'material-ui/styles'; import * as React from 'react'; import {InputLabel} from 'ts/components/ui/input_label'; import {Styles} from 'ts/types'; diff --git a/packages/website/ts/components/ui/lifecycle_raised_button.tsx b/packages/website/ts/components/ui/lifecycle_raised_button.tsx index cba94ca8c..2d668fb82 100644 --- a/packages/website/ts/components/ui/lifecycle_raised_button.tsx +++ b/packages/website/ts/components/ui/lifecycle_raised_button.tsx @@ -1,8 +1,6 @@ import * as _ from 'lodash'; import RaisedButton from 'material-ui/RaisedButton'; import * as React from 'react'; -import {Blockchain} from 'ts/blockchain'; -import {Token} from 'ts/types'; import {utils} from 'ts/utils/utils'; const COMPLETE_STATE_SHOW_LENGTH_MS = 2000; diff --git a/packages/website/ts/components/ui/menu_item.tsx b/packages/website/ts/components/ui/menu_item.tsx index 862f28457..c7ce7439f 100644 --- a/packages/website/ts/components/ui/menu_item.tsx +++ b/packages/website/ts/components/ui/menu_item.tsx @@ -1,9 +1,6 @@ import * as _ from 'lodash'; -import {colors} from 'material-ui/styles'; import * as React from 'react'; import {Link} from 'react-router-dom'; -import {Styles} from 'ts/types'; -import {constants} from 'ts/utils/constants'; interface MenuItemProps { to: string; diff --git a/packages/website/ts/components/ui/party.tsx b/packages/website/ts/components/ui/party.tsx index 5bafa6071..e6b6ea9e2 100644 --- a/packages/website/ts/components/ui/party.tsx +++ b/packages/website/ts/components/ui/party.tsx @@ -7,7 +7,6 @@ import {Identicon} from 'ts/components/ui/identicon'; import {EtherscanLinkSuffixes} from 'ts/types'; import {utils} from 'ts/utils/utils'; -const MIN_ADDRESS_WIDTH = 60; const IMAGE_DIMENSION = 100; const IDENTICON_DIAMETER = 95; const CHECK_MARK_GREEN = 'rgb(0, 195, 62)'; @@ -33,10 +32,7 @@ export class Party extends React.Component { public render() { const label = this.props.label; const address = this.props.address; - const tooltipId = `${label}-${address}-tooltip`; const identiconDiameter = this.props.identiconDiameter; - const addressWidth = identiconDiameter > MIN_ADDRESS_WIDTH ? - identiconDiameter : MIN_ADDRESS_WIDTH; const emptyIdenticonStyles = { width: identiconDiameter, height: identiconDiameter, diff --git a/packages/website/ts/components/ui/simple_loading.tsx b/packages/website/ts/components/ui/simple_loading.tsx index d55d7851d..fa548f996 100644 --- a/packages/website/ts/components/ui/simple_loading.tsx +++ b/packages/website/ts/components/ui/simple_loading.tsx @@ -1,5 +1,4 @@ import CircularProgress from 'material-ui/CircularProgress'; -import {colors} from 'material-ui/styles'; import * as React from 'react'; export interface SimpleLoadingProps { diff --git a/packages/website/ts/components/ui/swap_icon.tsx b/packages/website/ts/components/ui/swap_icon.tsx index 2e6ae89bb..b5d4b0caa 100644 --- a/packages/website/ts/components/ui/swap_icon.tsx +++ b/packages/website/ts/components/ui/swap_icon.tsx @@ -1,7 +1,6 @@ import * as _ from 'lodash'; import {colors} from 'material-ui/styles'; import * as React from 'react'; -import {constants} from 'ts/utils/constants'; interface SwapIconProps { swapTokensFn: () => void; diff --git a/packages/website/ts/components/visual_order.tsx b/packages/website/ts/components/visual_order.tsx index 037a321ff..a7be6f780 100644 --- a/packages/website/ts/components/visual_order.tsx +++ b/packages/website/ts/components/visual_order.tsx @@ -3,7 +3,6 @@ import * as _ from 'lodash'; import * as React from 'react'; import {Party} from 'ts/components/ui/party'; import {AssetToken, Token, TokenByAddress} from 'ts/types'; -import {constants} from 'ts/utils/constants'; import {utils} from 'ts/utils/utils'; const PRECISION = 5; diff --git a/packages/website/ts/containers/connect_documentation.tsx b/packages/website/ts/containers/connect_documentation.tsx index 8ecc1e37c..3b181a814 100644 --- a/packages/website/ts/containers/connect_documentation.tsx +++ b/packages/website/ts/containers/connect_documentation.tsx @@ -1,9 +1,7 @@ -import BigNumber from 'bignumber.js'; import * as _ from 'lodash'; import * as React from 'react'; import {connect} from 'react-redux'; -import {Dispatch, Store as ReduxStore} from 'redux'; -import {Blockchain} from 'ts/blockchain'; +import {Dispatch} from 'redux'; import {DocsInfo} from 'ts/pages/documentation/docs_info'; import { Documentation as DocumentationComponent, diff --git a/packages/website/ts/containers/generate_order_form.tsx b/packages/website/ts/containers/generate_order_form.tsx index 864d2702e..134c84859 100644 --- a/packages/website/ts/containers/generate_order_form.tsx +++ b/packages/website/ts/containers/generate_order_form.tsx @@ -1,8 +1,6 @@ -import BigNumber from 'bignumber.js'; import * as _ from 'lodash'; import * as React from 'react'; import {connect} from 'react-redux'; -import {Dispatch, Store as ReduxStore} from 'redux'; import {Blockchain} from 'ts/blockchain'; import {GenerateOrderForm as GenerateOrderFormComponent} from 'ts/components/generate_order/generate_order_form'; import {Dispatcher} from 'ts/redux/dispatcher'; diff --git a/packages/website/ts/containers/portal.tsx b/packages/website/ts/containers/portal.tsx index 2987764f4..7588a1535 100644 --- a/packages/website/ts/containers/portal.tsx +++ b/packages/website/ts/containers/portal.tsx @@ -2,7 +2,7 @@ import BigNumber from 'bignumber.js'; import * as _ from 'lodash'; import * as React from 'react'; import {connect} from 'react-redux'; -import {Dispatch, Store as ReduxStore} from 'redux'; +import {Dispatch} from 'redux'; import { Portal as PortalComponent, PortalAllProps as PortalComponentAllProps, @@ -12,7 +12,6 @@ import {Dispatcher} from 'ts/redux/dispatcher'; import {State} from 'ts/redux/reducer'; import { BlockchainErrs, - Fill, HashData, Order, ScreenWidths, @@ -22,24 +21,23 @@ import { } from 'ts/types'; import {constants} from 'ts/utils/constants'; -interface MapStateToProps { +interface ConnectedState { blockchainErr: BlockchainErrs; blockchainIsLoaded: boolean; hashData: HashData; networkId: number; nodeVersion: string; - orderFillAmount: number; + orderFillAmount: BigNumber; tokenByAddress: TokenByAddress; tokenStateByAddress: TokenStateByAddress; - userEtherBalance: number; + userEtherBalance: BigNumber; screenWidth: ScreenWidths; shouldBlockchainErrDialogBeOpen: boolean; userAddress: string; userSuppliedOrderCache: Order; + flashMessage?: string|React.ReactNode; } -interface ConnectedState {} - interface ConnectedDispatch { dispatcher: Dispatcher; } diff --git a/packages/website/ts/containers/smart_contracts_documentation.tsx b/packages/website/ts/containers/smart_contracts_documentation.tsx index ea2b19b8c..1f82bda0f 100644 --- a/packages/website/ts/containers/smart_contracts_documentation.tsx +++ b/packages/website/ts/containers/smart_contracts_documentation.tsx @@ -1,7 +1,7 @@ import * as _ from 'lodash'; import * as React from 'react'; import {connect} from 'react-redux'; -import {Dispatch, Store as ReduxStore} from 'redux'; +import {Dispatch} from 'redux'; import {DocsInfo} from 'ts/pages/documentation/docs_info'; import { Documentation as DocumentationComponent, diff --git a/packages/website/ts/containers/zero_ex_js_documentation.tsx b/packages/website/ts/containers/zero_ex_js_documentation.tsx index 58c0ee186..1ce9ba139 100644 --- a/packages/website/ts/containers/zero_ex_js_documentation.tsx +++ b/packages/website/ts/containers/zero_ex_js_documentation.tsx @@ -1,9 +1,7 @@ -import BigNumber from 'bignumber.js'; import * as _ from 'lodash'; import * as React from 'react'; import {connect} from 'react-redux'; -import {Dispatch, Store as ReduxStore} from 'redux'; -import {Blockchain} from 'ts/blockchain'; +import {Dispatch} from 'redux'; import {DocsInfo} from 'ts/pages/documentation/docs_info'; import { Documentation as DocumentationComponent, diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx index 922102d96..cbefac8bd 100644 --- a/packages/website/ts/index.tsx +++ b/packages/website/ts/index.tsx @@ -6,7 +6,7 @@ import {colors, getMuiTheme, MuiThemeProvider} from 'material-ui/styles'; import * as React from 'react'; import {render} from 'react-dom'; import {Provider} from 'react-redux'; -import {BrowserRouter as Router, Link, Redirect, Route, Switch} from 'react-router-dom'; +import {BrowserRouter as Router, Redirect, Route, Switch} from 'react-router-dom'; import * as injectTapEventPlugin from 'react-tap-event-plugin'; import {createStore, Store as ReduxStore} from 'redux'; import {createLazyComponent} from 'ts/lazy_component'; diff --git a/packages/website/ts/pages/about/about.tsx b/packages/website/ts/pages/about/about.tsx index 3af05e8a4..011bbb9d9 100644 --- a/packages/website/ts/pages/about/about.tsx +++ b/packages/website/ts/pages/about/about.tsx @@ -1,15 +1,11 @@ import * as _ from 'lodash'; -import RaisedButton from 'material-ui/RaisedButton'; import {colors} from 'material-ui/styles'; import * as React from 'react'; import * as DocumentTitle from 'react-document-title'; -import {Link} from 'react-router-dom'; import {Footer} from 'ts/components/footer'; import {TopBar} from 'ts/components/top_bar'; import {Profile} from 'ts/pages/about/profile'; -import {Question} from 'ts/pages/faq/question'; import {ProfileInfo, Styles} from 'ts/types'; -import {configs} from 'ts/utils/configs'; import {constants} from 'ts/utils/constants'; import {utils} from 'ts/utils/utils'; @@ -236,7 +232,7 @@ export class About extends React.Component { } private renderProfiles(profiles: ProfileInfo[]) { const numIndiv = profiles.length; - const colSize = utils.getColSize(profiles.length); + const colSize = utils.getColSize(numIndiv); return _.map(profiles, profile => { return (
= (props: CommentProps) => {
); }; + +Comment.defaultProps = defaultProps; diff --git a/packages/website/ts/pages/documentation/documentation.tsx b/packages/website/ts/pages/documentation/documentation.tsx index be99e77a2..0ca8ae9d3 100644 --- a/packages/website/ts/pages/documentation/documentation.tsx +++ b/packages/website/ts/pages/documentation/documentation.tsx @@ -17,35 +17,27 @@ import {MethodBlock} from 'ts/pages/documentation/method_block'; import {SourceLink} from 'ts/pages/documentation/source_link'; import {Type} from 'ts/pages/documentation/type'; import {TypeDefinition} from 'ts/pages/documentation/type_definition'; -import {AnchorTitle} from 'ts/pages/shared/anchor_title'; import {MarkdownSection} from 'ts/pages/shared/markdown_section'; import {NestedSidebarMenu} from 'ts/pages/shared/nested_sidebar_menu'; import {SectionHeader} from 'ts/pages/shared/section_header'; import {Dispatcher} from 'ts/redux/dispatcher'; import { AddressByContractName, - CustomType, DocAgnosticFormat, - Docs, - DocsInfoConfig, DoxityDocObj, EtherscanLinkSuffixes, Event, - MenuSubsectionsBySection, Networks, Property, SolidityMethod, Styles, TypeDefinitionByName, - TypeDocNode, TypescriptMethod, - WebsitePaths, } from 'ts/types'; import {constants} from 'ts/utils/constants'; import {docUtils} from 'ts/utils/doc_utils'; import {utils} from 'ts/utils/utils'; -const SCROLL_TO_TIMEOUT = 500; const SCROLL_TOP_ID = 'docsScrollTop'; const CUSTOM_PURPLE = '#690596'; const CUSTOM_RED = '#e91751'; diff --git a/packages/website/ts/pages/documentation/enum.tsx b/packages/website/ts/pages/documentation/enum.tsx index 8fcd2c252..b5fbc4bd2 100644 --- a/packages/website/ts/pages/documentation/enum.tsx +++ b/packages/website/ts/pages/documentation/enum.tsx @@ -1,9 +1,6 @@ import * as _ from 'lodash'; import * as React from 'react'; -import {EnumValue, TypeDocNode} from 'ts/types'; -import {utils} from 'ts/utils/utils'; - -const STRING_ENUM_CODE_PREFIX = ' strEnum('; +import {EnumValue} from 'ts/types'; interface EnumProps { values: EnumValue[]; @@ -11,7 +8,6 @@ interface EnumProps { export function Enum(props: EnumProps) { const values = _.map(props.values, (value, i) => { - const isLast = i === props.values.length - 1; const defaultValueIfAny = !_.isUndefined(value.defaultValue) ? ` = ${value.defaultValue}` : ''; return `\n\t${value.name}${defaultValueIfAny},`; }); diff --git a/packages/website/ts/pages/documentation/event_definition.tsx b/packages/website/ts/pages/documentation/event_definition.tsx index 469e6bb37..3c57666e7 100644 --- a/packages/website/ts/pages/documentation/event_definition.tsx +++ b/packages/website/ts/pages/documentation/event_definition.tsx @@ -4,10 +4,7 @@ import {DocsInfo} from 'ts/pages/documentation/docs_info'; import {Type} from 'ts/pages/documentation/type'; import {AnchorTitle} from 'ts/pages/shared/anchor_title'; import {Event, EventArg, HeaderSizes} from 'ts/types'; -import {constants} from 'ts/utils/constants'; -import {utils} from 'ts/utils/utils'; -const KEYWORD_COLOR = '#a81ca6'; const CUSTOM_GREEN = 'rgb(77, 162, 75)'; interface EventDefinitionProps { diff --git a/packages/website/ts/pages/documentation/method_block.tsx b/packages/website/ts/pages/documentation/method_block.tsx index 44e549211..9505f2aa4 100644 --- a/packages/website/ts/pages/documentation/method_block.tsx +++ b/packages/website/ts/pages/documentation/method_block.tsx @@ -1,8 +1,6 @@ import * as _ from 'lodash'; -import {Chip} from 'material-ui/Chip'; import {colors} from 'material-ui/styles'; import * as React from 'react'; -import * as ReactMarkdown from 'react-markdown'; import {Comment} from 'ts/pages/documentation/comment'; import {DocsInfo} from 'ts/pages/documentation/docs_info'; import {MethodSignature} from 'ts/pages/documentation/method_signature'; @@ -14,11 +12,9 @@ import { SolidityMethod, Styles, TypeDefinitionByName, - TypeDocNode, TypescriptMethod, } from 'ts/types'; import {typeDocUtils} from 'ts/utils/typedoc_utils'; -import {utils} from 'ts/utils/utils'; interface MethodBlockProps { method: SolidityMethod|TypescriptMethod; diff --git a/packages/website/ts/pages/documentation/method_signature.tsx b/packages/website/ts/pages/documentation/method_signature.tsx index 846c9fa4f..df3b61814 100644 --- a/packages/website/ts/pages/documentation/method_signature.tsx +++ b/packages/website/ts/pages/documentation/method_signature.tsx @@ -42,6 +42,8 @@ export const MethodSignature: React.SFC = (props: MethodSi ); }; +MethodSignature.defaultProps = defaultProps; + function renderParameters( method: TypescriptMethod|SolidityMethod, docsInfo: DocsInfo, typeDefinitionByName?: TypeDefinitionByName, ) { diff --git a/packages/website/ts/pages/documentation/source_link.tsx b/packages/website/ts/pages/documentation/source_link.tsx index 74fc6d4d5..9abf01706 100644 --- a/packages/website/ts/pages/documentation/source_link.tsx +++ b/packages/website/ts/pages/documentation/source_link.tsx @@ -2,7 +2,6 @@ import * as _ from 'lodash'; import {colors} from 'material-ui/styles'; import * as React from 'react'; import {Source} from 'ts/types'; -import {constants} from 'ts/utils/constants'; interface SourceLinkProps { source: Source; diff --git a/packages/website/ts/pages/documentation/type.tsx b/packages/website/ts/pages/documentation/type.tsx index c564429d0..74b146d91 100644 --- a/packages/website/ts/pages/documentation/type.tsx +++ b/packages/website/ts/pages/documentation/type.tsx @@ -7,7 +7,6 @@ import {DocsInfo} from 'ts/pages/documentation/docs_info'; import {TypeDefinition} from 'ts/pages/documentation/type_definition'; import {Type as TypeDef, TypeDefinitionByName, TypeDocTypes} from 'ts/types'; import {constants} from 'ts/utils/constants'; -import {typeDocUtils} from 'ts/utils/typedoc_utils'; import {utils} from 'ts/utils/utils'; const BUILT_IN_TYPE_COLOR = '#e69d00'; @@ -48,10 +47,8 @@ interface TypeProps { // components (e.g when rendering the union type). export function Type(props: TypeProps): any { const type = props.type; - const isIntrinsic = type.typeDocType === TypeDocTypes.Intrinsic; const isReference = type.typeDocType === TypeDocTypes.Reference; const isArray = type.typeDocType === TypeDocTypes.Array; - const isStringLiteral = type.typeDocType === TypeDocTypes.StringLiteral; let typeNameColor = 'inherit'; let typeName: string|React.ReactNode; let typeArgs: React.ReactNode[] = []; diff --git a/packages/website/ts/pages/documentation/type_definition.tsx b/packages/website/ts/pages/documentation/type_definition.tsx index 17b182c70..edcf7bf47 100644 --- a/packages/website/ts/pages/documentation/type_definition.tsx +++ b/packages/website/ts/pages/documentation/type_definition.tsx @@ -9,8 +9,6 @@ import {MethodSignature} from 'ts/pages/documentation/method_signature'; import {Type} from 'ts/pages/documentation/type'; import {AnchorTitle} from 'ts/pages/shared/anchor_title'; import {CustomType, CustomTypeChild, HeaderSizes, KindString, TypeDocTypes} from 'ts/types'; -import {constants} from 'ts/utils/constants'; -import {typeDocUtils} from 'ts/utils/typedoc_utils'; import {utils} from 'ts/utils/utils'; const KEYWORD_COLOR = '#a81ca6'; diff --git a/packages/website/ts/pages/faq/faq.tsx b/packages/website/ts/pages/faq/faq.tsx index c53ed28b8..b3fe21da7 100644 --- a/packages/website/ts/pages/faq/faq.tsx +++ b/packages/website/ts/pages/faq/faq.tsx @@ -1,9 +1,7 @@ import * as _ from 'lodash'; -import RaisedButton from 'material-ui/RaisedButton'; import {colors} from 'material-ui/styles'; import * as React from 'react'; import * as DocumentTitle from 'react-document-title'; -import {Link} from 'react-router-dom'; import {Footer} from 'ts/components/footer'; import {TopBar} from 'ts/components/top_bar'; import {Question} from 'ts/pages/faq/question'; diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index f3c46b8c7..7992c7a6c 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -6,8 +6,7 @@ import DocumentTitle = require('react-document-title'); import {Link} from 'react-router-dom'; import {Footer} from 'ts/components/footer'; import {TopBar} from 'ts/components/top_bar'; -import {ScreenWidths, Styles, WebsitePaths} from 'ts/types'; -import {configs} from 'ts/utils/configs'; +import {ScreenWidths, WebsitePaths} from 'ts/types'; import {constants} from 'ts/utils/constants'; import {utils} from 'ts/utils/utils'; @@ -269,7 +268,7 @@ export class Landing extends React.Component { const isSmallScreen = this.state.screenWidth === ScreenWidths.SM; const isMediumScreen = this.state.screenWidth === ScreenWidths.MD; const projectList = _.map(projects, (project: Project, i: number) => { - const colWidth = isSmallScreen ? 3 : isMediumScreen ? 4 : 2 - (i % 2); + const colWidth = isSmallScreen ? 3 : (isMediumScreen ? 4 : 2 - (i % 2)); return (
{ } private renderBuildingBlocksSection() { const isSmallScreen = this.state.screenWidth === ScreenWidths.SM; - const underlineStyle: React.CSSProperties = { - height: isSmallScreen ? 18 : 23, - lineHeight: 'none', - borderBottom: '2px solid #979797', - }; const descriptionStyle: React.CSSProperties = { fontFamily: 'Roboto Mono', lineHeight: isSmallScreen ? 1.5 : 2, @@ -606,21 +600,6 @@ export class Landing extends React.Component { }); return assets; } - private renderLink(label: string, path: string, color: string, style?: React.CSSProperties) { - return ( -
- - {label} - -
- ); - } private renderInfoBoxes() { const isSmallScreen = this.state.screenWidth === ScreenWidths.SM; const boxStyle: React.CSSProperties = { @@ -676,7 +655,6 @@ export class Landing extends React.Component { } private renderUseCases() { const isSmallScreen = this.state.screenWidth === ScreenWidths.SM; - const isMediumScreen = this.state.screenWidth === ScreenWidths.MD; const useCases: UseCase[] = [ { diff --git a/packages/website/ts/pages/not_found.tsx b/packages/website/ts/pages/not_found.tsx index 075bcf91e..df505792d 100644 --- a/packages/website/ts/pages/not_found.tsx +++ b/packages/website/ts/pages/not_found.tsx @@ -1,6 +1,5 @@ import * as _ from 'lodash'; import * as React from 'react'; -import {Link} from 'react-router-dom'; import {Footer} from 'ts/components/footer'; import {TopBar} from 'ts/components/top_bar'; import {Styles} from 'ts/types'; diff --git a/packages/website/ts/pages/shared/nested_sidebar_menu.tsx b/packages/website/ts/pages/shared/nested_sidebar_menu.tsx index cbb863f3e..15ec44399 100644 --- a/packages/website/ts/pages/shared/nested_sidebar_menu.tsx +++ b/packages/website/ts/pages/shared/nested_sidebar_menu.tsx @@ -4,9 +4,8 @@ import {colors} from 'material-ui/styles'; import * as React from 'react'; import {Link as ScrollLink} from 'react-scroll'; import {VersionDropDown} from 'ts/pages/shared/version_drop_down'; -import {Docs, MenuSubsectionsBySection, Styles} from 'ts/types'; +import {MenuSubsectionsBySection, Styles} from 'ts/types'; import {constants} from 'ts/utils/constants'; -import {typeDocUtils} from 'ts/utils/typedoc_utils'; import {utils} from 'ts/utils/utils'; interface NestedSidebarMenuProps { diff --git a/packages/website/ts/pages/shared/version_drop_down.tsx b/packages/website/ts/pages/shared/version_drop_down.tsx index 4af9a834f..e63ad19cd 100644 --- a/packages/website/ts/pages/shared/version_drop_down.tsx +++ b/packages/website/ts/pages/shared/version_drop_down.tsx @@ -2,8 +2,6 @@ import * as _ from 'lodash'; import DropDownMenu from 'material-ui/DropDownMenu'; import MenuItem from 'material-ui/MenuItem'; import * as React from 'react'; -import {Docs} from 'ts/types'; -import {constants} from 'ts/utils/constants'; interface VersionDropDownProps { selectedVersion: string; diff --git a/packages/website/ts/redux/dispatcher.ts b/packages/website/ts/redux/dispatcher.ts index a0a1da21b..cbcee6599 100644 --- a/packages/website/ts/redux/dispatcher.ts +++ b/packages/website/ts/redux/dispatcher.ts @@ -6,7 +6,6 @@ import { AssetToken, BlockchainErrs, Direction, - Fill, Order, ProviderType, ScreenWidths, diff --git a/packages/website/ts/utils/constants.ts b/packages/website/ts/utils/constants.ts index cae59af5f..fb81dd9a9 100644 --- a/packages/website/ts/utils/constants.ts +++ b/packages/website/ts/utils/constants.ts @@ -2,7 +2,6 @@ import BigNumber from 'bignumber.js'; import { ContractAddresses, Docs, - ExchangeContractErrs, Networks, PublicNodeUrlsByNetworkId, WebsitePaths, diff --git a/packages/website/ts/utils/doc_utils.ts b/packages/website/ts/utils/doc_utils.ts index 594e3bae6..ea210a3fa 100644 --- a/packages/website/ts/utils/doc_utils.ts +++ b/packages/website/ts/utils/doc_utils.ts @@ -1,7 +1,6 @@ import findVersions = require('find-versions'); import * as _ from 'lodash'; import {DoxityDocObj, S3FileObject, TypeDocNode, VersionToFileName} from 'ts/types'; -import {constants} from 'ts/utils/constants'; import {utils} from 'ts/utils/utils'; import convert = require('xml-js'); diff --git a/packages/website/ts/utils/typedoc_utils.ts b/packages/website/ts/utils/typedoc_utils.ts index ff8060781..9d3b9f8d7 100644 --- a/packages/website/ts/utils/typedoc_utils.ts +++ b/packages/website/ts/utils/typedoc_utils.ts @@ -5,21 +5,17 @@ import { CustomTypeChild, DocAgnosticFormat, DocSection, - DocsMenu, IndexSignature, KindString, - MenuSubsectionsBySection, Parameter, Property, SectionsMap, Type, TypeDocNode, TypeDocType, - TypeDocTypes, TypeParameter, TypescriptMethod, } from 'ts/types'; -import {constants} from 'ts/utils/constants'; import {utils} from 'ts/utils/utils'; export const typeDocUtils = { diff --git a/packages/website/ts/utils/utils.ts b/packages/website/ts/utils/utils.ts index 8b23b6a40..abc2fb2d4 100644 --- a/packages/website/ts/utils/utils.ts +++ b/packages/website/ts/utils/utils.ts @@ -1,7 +1,6 @@ import {ExchangeContractErrs, ZeroExError} from '0x.js'; import BigNumber from 'bignumber.js'; import deepEqual = require('deep-equal'); -import ethUtil = require('ethereumjs-util'); import isMobile = require('is-mobile'); import * as _ from 'lodash'; import * as moment from 'moment'; @@ -9,7 +8,6 @@ import { EtherscanLinkSuffixes, Networks, Order, - OrderParty, ScreenWidths, Side, SideToAssetToken, @@ -110,9 +108,9 @@ export const utils = { }, getColSize(items: number) { const bassCssGridSize = 12; // Source: http://basscss.com/#basscss-grid - const colSize = 12 / items; + const colSize = bassCssGridSize / items; if (!_.isInteger(colSize)) { - throw new Error('Number of cols must be divisible by 12'); + throw new Error(`Number of cols must be divisible by ${bassCssGridSize}`); } return colSize; }, -- cgit v1.2.3 From 94f40a54b42d467d9588862e11b2be45eb8f232c Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Fri, 15 Dec 2017 11:05:53 -0600 Subject: Add default value for onConversionSuccessful --- packages/website/ts/components/eth_weth_conversion_button.tsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/eth_weth_conversion_button.tsx b/packages/website/ts/components/eth_weth_conversion_button.tsx index bf686d44b..b017de27b 100644 --- a/packages/website/ts/components/eth_weth_conversion_button.tsx +++ b/packages/website/ts/components/eth_weth_conversion_button.tsx @@ -32,6 +32,7 @@ export class EthWethConversionButton extends React.Component { public static defaultProps: Partial = { isDisabled: false, + onConversionSuccessful: _.noop, }; public constructor(props: EthWethConversionButtonProps) { super(props); @@ -100,9 +101,7 @@ export class EthWethConversionButton extends if (!this.props.isOutdatedWrappedEther) { this.props.dispatcher.replaceTokenBalanceByAddress(token.address, balance); } - if (!_.isUndefined(this.props.onConversionSuccessful)) { - this.props.onConversionSuccessful(); - } + this.props.onConversionSuccessful(); } catch (err) { const errMsg = '' + err; if (_.includes(errMsg, BlockchainCallErrs.USER_HAS_NO_ASSOCIATED_ADDRESSES)) { -- cgit v1.2.3 From 484dd4c33aa5786def1f0b159f5b51f99a585aa8 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Fri, 15 Dec 2017 11:06:18 -0600 Subject: Update name to be a call to action --- packages/website/ts/components/portal_menu.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/portal_menu.tsx b/packages/website/ts/components/portal_menu.tsx index e00fbd40c..db8e3a9f1 100644 --- a/packages/website/ts/components/portal_menu.tsx +++ b/packages/website/ts/components/portal_menu.tsx @@ -56,7 +56,7 @@ export class PortalMenu extends React.Component - {this.renderMenuItemWithIcon('ETH wrapper', 'zmdi-circle-o')} + {this.renderMenuItemWithIcon('Wrap ETH', 'zmdi-circle-o')}
); -- cgit v1.2.3 From c8e52882ca556ea06696a56e312f69284f99aa29 Mon Sep 17 00:00:00 2001 From: Leonid Logvinov Date: Fri, 15 Dec 2017 18:26:45 +0100 Subject: Fix redundant spaces --- packages/website/ts/components/token_balances.tsx | 2 +- packages/website/ts/components/top_bar.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx index 478114516..b68081c37 100644 --- a/packages/website/ts/components/token_balances.tsx +++ b/packages/website/ts/components/token_balances.tsx @@ -576,7 +576,7 @@ export class TokenBalances extends React.Component +

We apologize -- Dharma loan requests are not available on mobile yet. Please try again through your desktop browser.

diff --git a/packages/website/ts/components/top_bar.tsx b/packages/website/ts/components/top_bar.tsx index 488eef914..27de49620 100644 --- a/packages/website/ts/components/top_bar.tsx +++ b/packages/website/ts/components/top_bar.tsx @@ -124,7 +124,7 @@ export class TopBar extends React.Component { className="text-decoration-none" href={constants.GITHUB_URL} > - + , Date: Fri, 15 Dec 2017 12:47:16 -0600 Subject: Fix linter errors --- packages/website/ts/components/eth_wrappers.tsx | 7 ------- packages/website/ts/components/token_balances.tsx | 5 ----- packages/website/ts/utils/configs.ts | 1 - 3 files changed, 13 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx index ccbed4188..58b73b11c 100644 --- a/packages/website/ts/components/eth_wrappers.tsx +++ b/packages/website/ts/components/eth_wrappers.tsx @@ -2,8 +2,6 @@ import {ZeroEx} from '0x.js'; import BigNumber from 'bignumber.js'; import * as _ from 'lodash'; import Divider from 'material-ui/Divider'; -import Paper from 'material-ui/Paper'; -import RaisedButton from 'material-ui/RaisedButton'; import {colors} from 'material-ui/styles'; import { Table, @@ -17,8 +15,6 @@ import * as moment from 'moment'; import * as React from 'react'; import {Blockchain} from 'ts/blockchain'; import {EthWethConversionButton} from 'ts/components/eth_weth_conversion_button'; -import {LifeCycleRaisedButton} from 'ts/components/ui/lifecycle_raised_button'; -import {trackedTokenStorage} from 'ts/local_storage/tracked_token_storage'; import {Dispatcher} from 'ts/redux/dispatcher'; import { OutdatedWrappedEtherByNetworkId, @@ -30,8 +26,6 @@ import { } from 'ts/types'; import {configs} from 'ts/utils/configs'; import {constants} from 'ts/utils/constants'; -import {errorReporter} from 'ts/utils/error_reporter'; -import {utils} from 'ts/utils/utils'; const PRECISION = 5; const DATE_FORMAT = 'D/M/YY'; @@ -39,7 +33,6 @@ const LIGHT_GRAY = '#A5A5A5'; const ICON_DIMENSION = 40; const ETHER_ICON_PATH = '/images/ether.png'; const OUTDATED_WETH_ICON_PATH = '/images/wrapped_eth_gray.png'; -const ETHER_TOKEN_SYMBOL = 'WETH'; interface OutdatedWETHAddressToIsStateLoaded { [address: string]: boolean; diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx index ab232326a..db4a35062 100644 --- a/packages/website/ts/components/token_balances.tsx +++ b/packages/website/ts/components/token_balances.tsx @@ -655,11 +655,6 @@ export class TokenBalances extends React.Component Date: Fri, 15 Dec 2017 13:01:45 -0600 Subject: Two mysteriously missing imports --- packages/website/ts/components/order_json.tsx | 1 + packages/website/ts/containers/generate_order_form.tsx | 1 + 2 files changed, 2 insertions(+) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/order_json.tsx b/packages/website/ts/components/order_json.tsx index c499ee9c2..83f25fd5a 100644 --- a/packages/website/ts/components/order_json.tsx +++ b/packages/website/ts/components/order_json.tsx @@ -1,5 +1,6 @@ import BigNumber from 'bignumber.js'; import * as _ from 'lodash'; +import {Paper} from 'material-ui/Paper'; import TextField from 'material-ui/TextField'; import * as React from 'react'; import {CopyIcon} from 'ts/components/ui/copy_icon'; diff --git a/packages/website/ts/containers/generate_order_form.tsx b/packages/website/ts/containers/generate_order_form.tsx index 134c84859..a47895d94 100644 --- a/packages/website/ts/containers/generate_order_form.tsx +++ b/packages/website/ts/containers/generate_order_form.tsx @@ -1,3 +1,4 @@ +import BigNumber from 'bignumber.js'; import * as _ from 'lodash'; import * as React from 'react'; import {connect} from 'react-redux'; -- cgit v1.2.3 From fe8f2d87c79cb25a7879c2e737dbdd64b7c40f60 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Fri, 15 Dec 2017 14:07:14 -0600 Subject: Temporary hack to alleviate issues with updating tokenRegistry with new WETH address --- packages/website/ts/blockchain.ts | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/blockchain.ts b/packages/website/ts/blockchain.ts index 331bafa71..6877a301a 100644 --- a/packages/website/ts/blockchain.ts +++ b/packages/website/ts/blockchain.ts @@ -592,9 +592,22 @@ export class Blockchain { // HACK: For now we have a hard-coded list of iconUrls for the dummyTokens // TODO: Refactor this out and pull the iconUrl directly from the TokenRegistry const iconUrl = constants.iconUrlBySymbol[t.symbol]; + // HACK: Temporarily we hijack the WETH addresses fetched from the tokenRegistry + // so that we can take our time with actually updating it. This ensures that when + // we deploy the new WETH page, everyone will re-fill their trackedTokens with the + // new canonical WETH. + // TODO: Remove this hack once we've updated the TokenRegistries + let address = t.address; + if (t.symbol === 'WETH') { + if (this.networkId === 1) { + address = '0xe495bcacaf29a0eb00fb67b86e9cd2a994dd55d8'; + } else if (this.networkId === 42) { + address = '0x739e78d6bebbdf24105a5145fa04436589d1cbd9'; + } + } const token: Token = { iconUrl, - address: t.address, + address, name: t.name, symbol: t.symbol, decimals: t.decimals, -- cgit v1.2.3 From 5664333490474d1d9a793e887864f125869bf6fa Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 17 Dec 2017 00:44:34 -0600 Subject: Since sending the error report could take some time, we first trigger `onError` so that the user gets notified immediately --- packages/website/ts/components/send_button.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/send_button.tsx b/packages/website/ts/components/send_button.tsx index b3fd2aeba..d8d3c7f56 100644 --- a/packages/website/ts/components/send_button.tsx +++ b/packages/website/ts/components/send_button.tsx @@ -76,8 +76,8 @@ export class SendButton extends React.Component Date: Sun, 17 Dec 2017 12:36:50 -0600 Subject: Update to passing etherTokenAddress into withdraw and deposit calls --- packages/website/ts/blockchain.ts | 8 ++++---- packages/website/ts/components/eth_weth_conversion_button.tsx | 4 ++-- 2 files changed, 6 insertions(+), 6 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/blockchain.ts b/packages/website/ts/blockchain.ts index 6877a301a..a42b19cff 100644 --- a/packages/website/ts/blockchain.ts +++ b/packages/website/ts/blockchain.ts @@ -388,18 +388,18 @@ export class Blockchain { const balance = await this.web3Wrapper.getBalanceInEthAsync(owner); return balance; } - public async convertEthToWrappedEthTokensAsync(amount: BigNumber): Promise { + public async convertEthToWrappedEthTokensAsync(etherTokenAddress: string, amount: BigNumber): Promise { utils.assert(!_.isUndefined(this.zeroEx), 'ZeroEx must be instantiated.'); utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.USER_HAS_NO_ASSOCIATED_ADDRESSES); - const txHash = await this.zeroEx.etherToken.depositAsync(amount, this.userAddress); + const txHash = await this.zeroEx.etherToken.depositAsync(etherTokenAddress, amount, this.userAddress); await this.showEtherScanLinkAndAwaitTransactionMinedAsync(txHash); } - public async convertWrappedEthTokensToEthAsync(amount: BigNumber): Promise { + public async convertWrappedEthTokensToEthAsync(etherTokenAddress: string, amount: BigNumber): Promise { utils.assert(!_.isUndefined(this.zeroEx), 'ZeroEx must be instantiated.'); utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.USER_HAS_NO_ASSOCIATED_ADDRESSES); - const txHash = await this.zeroEx.etherToken.withdrawAsync(amount, this.userAddress); + const txHash = await this.zeroEx.etherToken.withdrawAsync(etherTokenAddress, amount, this.userAddress); await this.showEtherScanLinkAndAwaitTransactionMinedAsync(txHash); } public async doesContractExistAtAddressAsync(address: string) { diff --git a/packages/website/ts/components/eth_weth_conversion_button.tsx b/packages/website/ts/components/eth_weth_conversion_button.tsx index b017de27b..c8a279de9 100644 --- a/packages/website/ts/components/eth_weth_conversion_button.tsx +++ b/packages/website/ts/components/eth_weth_conversion_button.tsx @@ -88,12 +88,12 @@ export class EthWethConversionButton extends let balance = tokenState.balance; try { if (direction === Side.deposit) { - await this.props.blockchain.convertEthToWrappedEthTokensAsync(value); + await this.props.blockchain.convertEthToWrappedEthTokensAsync(token.address, value); const ethAmount = ZeroEx.toUnitAmount(value, constants.ETH_DECIMAL_PLACES); this.props.dispatcher.showFlashMessage(`Successfully wrapped ${ethAmount.toString()} ETH to WETH`); balance = balance.plus(value); } else { - await this.props.blockchain.convertWrappedEthTokensToEthAsync(value); + await this.props.blockchain.convertWrappedEthTokensToEthAsync(token.address, value); const tokenAmount = ZeroEx.toUnitAmount(value, token.decimals); this.props.dispatcher.showFlashMessage(`Successfully unwrapped ${tokenAmount.toString()} WETH to ETH`); balance = balance.minus(value); -- cgit v1.2.3 From b640e2cc4990e83511e1f796a06cdc890ceec396 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 17 Dec 2017 12:40:04 -0600 Subject: Update website calls to deposit/withdraw --- packages/website/ts/blockchain.ts | 8 ++++---- packages/website/ts/components/eth_weth_conversion_button.tsx | 4 ++-- 2 files changed, 6 insertions(+), 6 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/blockchain.ts b/packages/website/ts/blockchain.ts index 6877a301a..a42b19cff 100644 --- a/packages/website/ts/blockchain.ts +++ b/packages/website/ts/blockchain.ts @@ -388,18 +388,18 @@ export class Blockchain { const balance = await this.web3Wrapper.getBalanceInEthAsync(owner); return balance; } - public async convertEthToWrappedEthTokensAsync(amount: BigNumber): Promise { + public async convertEthToWrappedEthTokensAsync(etherTokenAddress: string, amount: BigNumber): Promise { utils.assert(!_.isUndefined(this.zeroEx), 'ZeroEx must be instantiated.'); utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.USER_HAS_NO_ASSOCIATED_ADDRESSES); - const txHash = await this.zeroEx.etherToken.depositAsync(amount, this.userAddress); + const txHash = await this.zeroEx.etherToken.depositAsync(etherTokenAddress, amount, this.userAddress); await this.showEtherScanLinkAndAwaitTransactionMinedAsync(txHash); } - public async convertWrappedEthTokensToEthAsync(amount: BigNumber): Promise { + public async convertWrappedEthTokensToEthAsync(etherTokenAddress: string, amount: BigNumber): Promise { utils.assert(!_.isUndefined(this.zeroEx), 'ZeroEx must be instantiated.'); utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.USER_HAS_NO_ASSOCIATED_ADDRESSES); - const txHash = await this.zeroEx.etherToken.withdrawAsync(amount, this.userAddress); + const txHash = await this.zeroEx.etherToken.withdrawAsync(etherTokenAddress, amount, this.userAddress); await this.showEtherScanLinkAndAwaitTransactionMinedAsync(txHash); } public async doesContractExistAtAddressAsync(address: string) { diff --git a/packages/website/ts/components/eth_weth_conversion_button.tsx b/packages/website/ts/components/eth_weth_conversion_button.tsx index b017de27b..c8a279de9 100644 --- a/packages/website/ts/components/eth_weth_conversion_button.tsx +++ b/packages/website/ts/components/eth_weth_conversion_button.tsx @@ -88,12 +88,12 @@ export class EthWethConversionButton extends let balance = tokenState.balance; try { if (direction === Side.deposit) { - await this.props.blockchain.convertEthToWrappedEthTokensAsync(value); + await this.props.blockchain.convertEthToWrappedEthTokensAsync(token.address, value); const ethAmount = ZeroEx.toUnitAmount(value, constants.ETH_DECIMAL_PLACES); this.props.dispatcher.showFlashMessage(`Successfully wrapped ${ethAmount.toString()} ETH to WETH`); balance = balance.plus(value); } else { - await this.props.blockchain.convertWrappedEthTokensToEthAsync(value); + await this.props.blockchain.convertWrappedEthTokensToEthAsync(token.address, value); const tokenAmount = ZeroEx.toUnitAmount(value, token.decimals); this.props.dispatcher.showFlashMessage(`Successfully unwrapped ${tokenAmount.toString()} WETH to ETH`); balance = balance.minus(value); -- cgit v1.2.3 From edbe6915e07a516f5fad2a38eb8ffe96a7b28318 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 17 Dec 2017 13:22:54 -0600 Subject: Fixed https://github.com/0xProject/wiki/issues/19 by disabling re-rendering of markdownCodeBlock renderer if props haven't updated --- .../ts/pages/shared/markdown_code_block.tsx | 29 ++++++++++++++-------- 1 file changed, 19 insertions(+), 10 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/pages/shared/markdown_code_block.tsx b/packages/website/ts/pages/shared/markdown_code_block.tsx index 621e5b606..aded15f0c 100644 --- a/packages/website/ts/pages/shared/markdown_code_block.tsx +++ b/packages/website/ts/pages/shared/markdown_code_block.tsx @@ -7,14 +7,23 @@ interface MarkdownCodeBlockProps { language: string; } -export function MarkdownCodeBlock(props: MarkdownCodeBlockProps) { - return ( - - - {props.literal} - - - ); +interface MarkdownCodeBlockState {} + +export class MarkdownCodeBlock extends React.Component { + // Re-rendering a codeblock causes any use selection to become de-selected. This is annoying when trying + // to copy-paste code examples. We therefore noop re-renders on this component if it's props haven't changed. + public shouldComponentUpdate(nextProps: MarkdownCodeBlockProps, nextState: MarkdownCodeBlockState) { + return nextProps.literal !== this.props.literal || nextProps.language !== this.props.language; + } + public render() { + return ( + + + {this.props.literal} + + + ); + } } -- cgit v1.2.3 From 9e914be975e20771e0f442eb4b4b025d44eb1994 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 17 Dec 2017 14:14:23 -0600 Subject: Link all EtherTokens to Etherscan and add address tooltip --- packages/website/ts/components/eth_wrappers.tsx | 73 ++++++++++++++++++------- 1 file changed, 53 insertions(+), 20 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx index 58b73b11c..a6a1df751 100644 --- a/packages/website/ts/components/eth_wrappers.tsx +++ b/packages/website/ts/components/eth_wrappers.tsx @@ -13,10 +13,12 @@ import { } from 'material-ui/Table'; import * as moment from 'moment'; import * as React from 'react'; +import ReactTooltip = require('react-tooltip'); import {Blockchain} from 'ts/blockchain'; import {EthWethConversionButton} from 'ts/components/eth_weth_conversion_button'; import {Dispatcher} from 'ts/redux/dispatcher'; import { + EtherscanLinkSuffixes, OutdatedWrappedEtherByNetworkId, Side, Token, @@ -26,6 +28,7 @@ import { } from 'ts/types'; import {configs} from 'ts/utils/configs'; import {constants} from 'ts/utils/constants'; +import {utils} from 'ts/utils/utils'; const PRECISION = 5; const DATE_FORMAT = 'D/M/YY'; @@ -85,6 +88,10 @@ export class EthWrappers extends React.Component
@@ -131,8 +138,11 @@ export class EthWrappers extends React.Component -
- Ether +
+ ETH
@@ -153,15 +163,7 @@ export class EthWrappers extends React.Component -
- -
- Wrapped Ether -
-
+ {this.renderTokenLink(tokenLabel, etherscanUrl)} {wethBalance.toFixed(PRECISION)} WETH @@ -264,18 +266,14 @@ export class EthWrappers extends React.Component -
- -
- {dateRange} -
-
+ {this.renderTokenLink(tokenLabel, etherscanUrl)} {isStateLoaded ? @@ -301,6 +299,41 @@ export class EthWrappers extends React.Component + {_.isUndefined(etherscanUrl) ? + tokenLabel : + + {tokenLabel} + + } + + ); + } + private renderToken(name: string, address: string, imgPath: string) { + const tooltipId = `tooltip-${address}`; + return ( +
+ +
+ + {name} + + {address} +
+
+ ); + } private async onOutdatedConversionSuccessfulAsync(outdatedWETHAddress: string) { this.setState({ outdatedWETHAddressToIsStateLoaded: { -- cgit v1.2.3 From b2256679bef6c39ee5889f12838d1c2e9d4dd832 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 17 Dec 2017 15:41:24 -0500 Subject: Add `Max` convenience button in unwrap WETH dialog --- .../ts/components/dialogs/eth_weth_conversion_dialog.tsx | 16 +++++++++++++++- 1 file changed, 15 insertions(+), 1 deletion(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx b/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx index c8bdced9b..230ac5183 100644 --- a/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx +++ b/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx @@ -109,7 +109,16 @@ export class EthWethConversionDialog extends className="pt1" style={{fontSize: 12}} > - 1 ETH = 1 WETH +
1 ETH = 1 WETH
+ {this.props.direction === Side.receive && +
+ Max +
+ }
@@ -137,6 +146,11 @@ export class EthWethConversionDialog extends ); } + private onMaxClick() { + this.setState({ + value: this.props.tokenState.balance, + }); + } private onValueChange(isValid: boolean, amount?: BigNumber) { this.setState({ value: amount, -- cgit v1.2.3 From 95dfac6f9bbf8cf0de2038cfbd4eabb53b979fcd Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 17 Dec 2017 17:09:16 -0500 Subject: Make it such that Wrapped Ether page works on networks without any outdated WETH tokens --- packages/website/ts/components/eth_wrappers.tsx | 30 ++++++++++++++++--------- 1 file changed, 19 insertions(+), 11 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx index a6a1df751..3ffb05ce0 100644 --- a/packages/website/ts/components/eth_wrappers.tsx +++ b/packages/website/ts/components/eth_wrappers.tsx @@ -246,8 +246,11 @@ export class EthWrappers extends React.Component { - const outdatedWETH = outdatedWETHByNetworkId[this.props.networkId]; - const timestampMsRange = outdatedWETH.timestampMsRange; + const outdatedWETHIfExists = outdatedWETHByNetworkId[this.props.networkId]; + if (_.isUndefined(outdatedWETHIfExists)) { + return null; // noop + } + const timestampMsRange = outdatedWETHIfExists.timestampMsRange; let dateRange: string; if (!_.isUndefined(timestampMsRange)) { const startMoment = moment(timestampMsRange.startTimestampMs); @@ -258,20 +261,20 @@ export class EthWrappers extends React.Component + {this.renderTokenLink(tokenLabel, etherscanUrl)} @@ -378,9 +381,14 @@ export class EthWrappers extends React.Component { - return outdatedWrappedEther[this.props.networkId].address; - }); + const outdatedWETHAddresses = _.compact(_.map(configs.outdatedWrappedEthers, outdatedWrappedEtherByNetwork => { + const outdatedWrappedEtherIfExists = outdatedWrappedEtherByNetwork[this.props.networkId]; + if (_.isUndefined(outdatedWrappedEtherIfExists)) { + return undefined + } + const address = outdatedWrappedEtherIfExists.address; + return address; + })); return outdatedWETHAddresses; } } // tslint:disable:max-file-line-count -- cgit v1.2.3 From 681617480ab8323cc81e1fc1e7a4f31a84b8b548 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 17 Dec 2017 17:10:51 -0500 Subject: Move weth.io url to constants --- packages/website/ts/components/eth_wrappers.tsx | 2 +- packages/website/ts/utils/constants.ts | 1 + 2 files changed, 2 insertions(+), 1 deletion(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx index 3ffb05ce0..1a223a05e 100644 --- a/packages/website/ts/components/eth_wrappers.tsx +++ b/packages/website/ts/components/eth_wrappers.tsx @@ -99,7 +99,7 @@ export class EthWrappers extends React.Component
diff --git a/packages/website/ts/utils/constants.ts b/packages/website/ts/utils/constants.ts index fb81dd9a9..8f645c770 100644 --- a/packages/website/ts/utils/constants.ts +++ b/packages/website/ts/utils/constants.ts @@ -83,6 +83,7 @@ export const constants = { WEB3_DECODED_LOG_ENTRY_EVENT_URL: 'https://github.com/0xProject/web3-typescript-typings/blob/f5bcb96/index.d.ts#L123', WEB3_LOG_ENTRY_EVENT_URL: 'https://github.com/0xProject/web3-typescript-typings/blob/f5bcb96/index.d.ts#L127', + WETH_IO_URL: 'https://weth.io/', ZEROEX_CHAT_URL: 'https://chat.0xproject.com', // Projects ETHFINEX_URL: 'https://www.bitfinex.com/ethfinex', -- cgit v1.2.3 From 672c8acaca76851306276d0d03c5df0c75aa8bc6 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 17 Dec 2017 17:21:33 -0500 Subject: Fix linter errors --- packages/website/ts/components/eth_wrappers.tsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx index 1a223a05e..a10313597 100644 --- a/packages/website/ts/components/eth_wrappers.tsx +++ b/packages/website/ts/components/eth_wrappers.tsx @@ -268,7 +268,9 @@ export class EthWrappers extends React.Component { const outdatedWrappedEtherIfExists = outdatedWrappedEtherByNetwork[this.props.networkId]; if (_.isUndefined(outdatedWrappedEtherIfExists)) { - return undefined + return undefined; } const address = outdatedWrappedEtherIfExists.address; return address; -- cgit v1.2.3 From 89f368a8b8b2419f9f347ad20da94199d533fa26 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 17 Dec 2017 18:58:12 -0500 Subject: Add notice dialog to balances page about updating the WETH contract. We also draw attention to the new dedicated section for unwrapping from outdated WETH tokens --- .../dialogs/wrapped_eth_section_notice_dialog.tsx | 38 ++++++++++++++++ packages/website/ts/components/portal.tsx | 50 +++++++++++++++++----- packages/website/ts/utils/constants.ts | 1 + 3 files changed, 79 insertions(+), 10 deletions(-) create mode 100644 packages/website/ts/components/dialogs/wrapped_eth_section_notice_dialog.tsx (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/dialogs/wrapped_eth_section_notice_dialog.tsx b/packages/website/ts/components/dialogs/wrapped_eth_section_notice_dialog.tsx new file mode 100644 index 000000000..d13b2e8ce --- /dev/null +++ b/packages/website/ts/components/dialogs/wrapped_eth_section_notice_dialog.tsx @@ -0,0 +1,38 @@ +import Dialog from 'material-ui/Dialog'; +import FlatButton from 'material-ui/FlatButton'; +import {colors} from 'material-ui/styles'; +import * as React from 'react'; + +interface WrappedEthSectionNoticeDialogProps { + isOpen: boolean; + onToggleDialog: () => void; +} + +export function WrappedEthSectionNoticeDialog(props: WrappedEthSectionNoticeDialogProps) { + return ( + , + ]} + open={props.isOpen} + onRequestClose={props.onToggleDialog.bind(this)} + autoScrollBodyContent={true} + modal={true} + > +
+
+ We have recently updated the Wrapped Ether token used by 0x Portal. + Don't worry, unwrapping Ether tied to the old Wrapped Ether token can + be done at any time by clicking on the "Wrap ETH" section in the menu + to the left. +
+
+ + ); +} diff --git a/packages/website/ts/components/portal.tsx b/packages/website/ts/components/portal.tsx index 74b1bdec6..69a7c1e7f 100644 --- a/packages/website/ts/components/portal.tsx +++ b/packages/website/ts/components/portal.tsx @@ -8,6 +8,7 @@ import {Route, Switch} from 'react-router-dom'; import {Blockchain} from 'ts/blockchain'; import {BlockchainErrDialog} from 'ts/components/dialogs/blockchain_err_dialog'; import {PortalDisclaimerDialog} from 'ts/components/dialogs/portal_disclaimer_dialog'; +import {WrappedEthSectionNoticeDialog} from 'ts/components/dialogs/wrapped_eth_section_notice_dialog'; import {EthWrappers} from 'ts/components/eth_wrappers'; import {FillOrder} from 'ts/components/fill_order'; import {Footer} from 'ts/components/footer'; @@ -63,22 +64,39 @@ interface PortalAllState { prevNetworkId: number; prevNodeVersion: string; prevUserAddress: string; - hasAcceptedDisclaimer: boolean; + prevPathname: string; + isDisclaimerDialogOpen: boolean; + isWethNoticeDialogOpen: boolean; } export class Portal extends React.Component { private blockchain: Blockchain; private sharedOrderIfExists: Order; private throttledScreenWidthUpdate: () => void; + public static hasAlreadyDismissedWethNotice() { + const didDismissWethNotice = localStorage.getItemIfExists(constants.DISMISS_WETH_NOTICE_LOCAL_STORAGE_KEY); + const hasAlreadyDismissedWethNotice = !_.isUndefined(didDismissWethNotice) && + !_.isEmpty(didDismissWethNotice); + return hasAlreadyDismissedWethNotice; + } constructor(props: PortalAllProps) { super(props); this.sharedOrderIfExists = this.getSharedOrderIfExists(); this.throttledScreenWidthUpdate = _.throttle(this.updateScreenWidth.bind(this), THROTTLE_TIMEOUT); + + const isViewingBalances = _.includes(props.location.pathname, `${WebsitePaths.Portal}/balances`); + const hasAlreadyDismissedWethNotice = Portal.hasAlreadyDismissedWethNotice(); + + const didAcceptPortalDisclaimer = localStorage.getItemIfExists(constants.ACCEPT_DISCLAIMER_LOCAL_STORAGE_KEY); + const hasAcceptedDisclaimer = !_.isUndefined(didAcceptPortalDisclaimer) && + !_.isEmpty(didAcceptPortalDisclaimer); this.state = { prevNetworkId: this.props.networkId, prevNodeVersion: this.props.nodeVersion, prevUserAddress: this.props.userAddress, - hasAcceptedDisclaimer: false, + prevPathname: this.props.location.pathname, + isDisclaimerDialogOpen: !hasAcceptedDisclaimer, + isWethNoticeDialogOpen: !hasAlreadyDismissedWethNotice && isViewingBalances, }; } public componentDidMount() { @@ -87,12 +105,6 @@ export class Portal extends React.Component { } public componentWillMount() { this.blockchain = new Blockchain(this.props.dispatcher); - const didAcceptPortalDisclaimer = localStorage.getItemIfExists(constants.ACCEPT_DISCLAIMER_LOCAL_STORAGE_KEY); - const hasAcceptedDisclaimer = !_.isUndefined(didAcceptPortalDisclaimer) && - !_.isEmpty(didAcceptPortalDisclaimer); - this.setState({ - hasAcceptedDisclaimer, - }); } public componentWillUnmount() { this.blockchain.destroy(); @@ -128,6 +140,14 @@ export class Portal extends React.Component { // tslint:disable-next-line:no-floating-promises this.blockchain.nodeVersionUpdatedFireAndForgetAsync(nextProps.nodeVersion); } + if (nextProps.location.pathname !== this.state.prevPathname) { + const isViewingBalances = _.includes(nextProps.location.pathname, `${WebsitePaths.Portal}/balances`); + const hasAlreadyDismissedWethNotice = Portal.hasAlreadyDismissedWethNotice(); + this.setState({ + prevPathname: nextProps.location.pathname, + isWethNoticeDialogOpen: !hasAlreadyDismissedWethNotice && isViewingBalances, + }); + } } public render() { const updateShouldBlockchainErrDialogBeOpen = this.props.dispatcher @@ -215,8 +235,12 @@ export class Portal extends React.Component { toggleDialogFn={updateShouldBlockchainErrDialogBeOpen} networkId={this.props.networkId} /> + { private onPortalDisclaimerAccepted() { localStorage.setItem(constants.ACCEPT_DISCLAIMER_LOCAL_STORAGE_KEY, 'set'); this.setState({ - hasAcceptedDisclaimer: true, + isDisclaimerDialogOpen: false, + }); + } + private onWethNoticeAccepted() { + localStorage.setItem(constants.DISMISS_WETH_NOTICE_LOCAL_STORAGE_KEY, 'set'); + this.setState({ + isWethNoticeDialogOpen: false, }); } private getSharedOrderIfExists(): Order { diff --git a/packages/website/ts/utils/constants.ts b/packages/website/ts/utils/constants.ts index 8f645c770..cb2dbef88 100644 --- a/packages/website/ts/utils/constants.ts +++ b/packages/website/ts/utils/constants.ts @@ -34,6 +34,7 @@ export const constants = { GITHUB_URL: 'https://github.com/0xProject', GITHUB_WIKI_URL: 'https://github.com/0xProject/wiki', HTTP_NO_CONTENT_STATUS_CODE: 204, + DISMISS_WETH_NOTICE_LOCAL_STORAGE_KEY: 'hasDismissedWethNotice', ACCEPT_DISCLAIMER_LOCAL_STORAGE_KEY: 'didAcceptPortalDisclaimer', LINKEDIN_0X_URL: 'https://www.linkedin.com/company/0x', LEDGER_PROVIDER_NAME: 'Ledger', -- cgit v1.2.3 From 951fbc9b76faf6b0f9f44fd2b729bcb54cf9d565 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 17 Dec 2017 19:18:33 -0500 Subject: Temporarily pretend as if new WETH contracts are already whitelisted by tokenRegistry and put hacks behind the shouldDeprecateOldWethToken flag --- packages/website/ts/blockchain.ts | 17 +++++++++++------ packages/website/ts/utils/configs.ts | 7 +++++++ 2 files changed, 18 insertions(+), 6 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/blockchain.ts b/packages/website/ts/blockchain.ts index a42b19cff..7a0d546b4 100644 --- a/packages/website/ts/blockchain.ts +++ b/packages/website/ts/blockchain.ts @@ -158,6 +158,12 @@ export class Blockchain { } public async isAddressInTokenRegistryAsync(tokenAddress: string): Promise { utils.assert(!_.isUndefined(this.zeroEx), 'ZeroEx must be instantiated.'); + // HACK: temporarily whitelist the new WETH token address `as if` they were + // already in the tokenRegistry. + if (configs.shouldDeprecateOldWethToken && + tokenAddress === configs.newWrappedEthers[this.networkId]) { + return true; + } const tokenIfExists = await this.zeroEx.tokenRegistry.getTokenIfExistsAsync(tokenAddress); return !_.isUndefined(tokenIfExists); } @@ -598,12 +604,11 @@ export class Blockchain { // new canonical WETH. // TODO: Remove this hack once we've updated the TokenRegistries let address = t.address; - if (t.symbol === 'WETH') { - if (this.networkId === 1) { - address = '0xe495bcacaf29a0eb00fb67b86e9cd2a994dd55d8'; - } else if (this.networkId === 42) { - address = '0x739e78d6bebbdf24105a5145fa04436589d1cbd9'; - } + if (configs.shouldDeprecateOldWethToken && t.symbol === 'WETH') { + const newEtherTokenAddressIfExists = configs.newWrappedEthers[this.networkId]; + if (!_.isUndefined(newEtherTokenAddressIfExists)) { + address = newEtherTokenAddressIfExists; + } } const token: Token = { iconUrl, diff --git a/packages/website/ts/utils/configs.ts b/packages/website/ts/utils/configs.ts index 4a08929cf..20efc66be 100644 --- a/packages/website/ts/utils/configs.ts +++ b/packages/website/ts/utils/configs.ts @@ -19,6 +19,13 @@ export const configs = { lastLocalStorageFillClearanceDate: '2017-11-22', lastLocalStorageTrackedTokenClearanceDate: '2017-12-13', isMainnetEnabled: true, + shouldDeprecateOldWethToken: true, + // newWrappedEthers is temporary until we remove the shouldDeprecateOldWethToken flag + // and add the new WETHs to the tokenRegistry + newWrappedEthers: { + 1: '0xe495bcacaf29a0eb00fb67b86e9cd2a994dd55d8', + 42: '0x739e78d6bebbdf24105a5145fa04436589d1cbd9', + } as {[networkId: string]: string}, outdatedWrappedEthers: [ { 42: { -- cgit v1.2.3 From 22c4ee6ef709610155191c4b0629ba0c41ce908f Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 17 Dec 2017 19:35:24 -0500 Subject: Update first two string enums to native type --- packages/website/ts/blockchain.ts | 8 +++---- .../components/dialogs/blockchain_err_dialog.tsx | 8 +++---- .../dialogs/eth_weth_conversion_dialog.tsx | 8 +++---- .../ts/components/eth_weth_conversion_button.tsx | 6 ++--- packages/website/ts/components/eth_wrappers.tsx | 6 ++--- packages/website/ts/components/fill_order_json.tsx | 4 ++-- .../generate_order/generate_order_form.tsx | 26 +++++++++++----------- .../website/ts/components/inputs/token_input.tsx | 2 +- packages/website/ts/components/token_balances.tsx | 2 +- packages/website/ts/containers/portal.tsx | 4 ++-- packages/website/ts/redux/reducer.ts | 10 ++++----- packages/website/ts/types.ts | 22 +++++++++--------- packages/website/ts/utils/utils.ts | 8 +++---- 13 files changed, 56 insertions(+), 58 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/blockchain.ts b/packages/website/ts/blockchain.ts index 6877a301a..336397f7f 100644 --- a/packages/website/ts/blockchain.ts +++ b/packages/website/ts/blockchain.ts @@ -135,11 +135,11 @@ export class Blockchain { const isConnected = !_.isUndefined(newNetworkId); if (!isConnected) { this.networkId = newNetworkId; - this.dispatcher.encounteredBlockchainError(BlockchainErrs.DISCONNECTED_FROM_ETHEREUM_NODE); + this.dispatcher.encounteredBlockchainError(BlockchainErrs.DisconnectedFromEthereumNode); this.dispatcher.updateShouldBlockchainErrDialogBeOpen(true); } else if (this.networkId !== newNetworkId) { this.networkId = newNetworkId; - this.dispatcher.encounteredBlockchainError(''); + this.dispatcher.encounteredBlockchainError(BlockchainErrs.NoError); await this.fetchTokenInformationAsync(); await this.rehydrateStoreWithContractEvents(); } @@ -712,8 +712,8 @@ export class Blockchain { _.find(allTokens, {symbol: configs.defaultTrackedTokenSymbols[0]}), _.find(allTokens, {symbol: configs.defaultTrackedTokenSymbols[1]}), ]; - this.dispatcher.updateChosenAssetTokenAddress(Side.deposit, mostPopularTradingPairTokens[0].address); - this.dispatcher.updateChosenAssetTokenAddress(Side.receive, mostPopularTradingPairTokens[1].address); + this.dispatcher.updateChosenAssetTokenAddress(Side.Deposit, mostPopularTradingPairTokens[0].address); + this.dispatcher.updateChosenAssetTokenAddress(Side.Receive, mostPopularTradingPairTokens[1].address); this.dispatcher.updateBlockchainIsLoaded(true); } private async instantiateContractIfExistsAsync(artifact: any, address?: string): Promise { diff --git a/packages/website/ts/components/dialogs/blockchain_err_dialog.tsx b/packages/website/ts/components/dialogs/blockchain_err_dialog.tsx index 963bd4388..afc89be1a 100644 --- a/packages/website/ts/components/dialogs/blockchain_err_dialog.tsx +++ b/packages/website/ts/components/dialogs/blockchain_err_dialog.tsx @@ -46,22 +46,22 @@ export class BlockchainErrDialog extends React.Component, ]; - const title = this.props.direction === Side.deposit ? 'Wrap ETH' : 'Unwrap WETH'; + const title = this.props.direction === Side.Deposit ? 'Wrap ETH' : 'Unwrap WETH'; return (
@@ -85,7 +85,7 @@ export class EthWethConversionDialog extends className="pt2 mx-auto" style={{width: 245}} > - {this.props.direction === Side.receive ? + {this.props.direction === Side.Receive ? { - const receiveAssetToken = state.sideToAssetToken[Side.receive]; - const depositAssetToken = state.sideToAssetToken[Side.deposit]; + const receiveAssetToken = state.sideToAssetToken[Side.Receive]; + const depositAssetToken = state.sideToAssetToken[Side.Deposit]; const receiveAddress = !_.isUndefined(receiveAssetToken.address) ? receiveAssetToken.address : constants.NULL_ADDRESS; const depositAddress = !_.isUndefined(depositAssetToken.address) ? diff --git a/packages/website/ts/redux/reducer.ts b/packages/website/ts/redux/reducer.ts index da69a9d00..9bd8899ad 100644 --- a/packages/website/ts/redux/reducer.ts +++ b/packages/website/ts/redux/reducer.ts @@ -58,7 +58,7 @@ export interface State { const INITIAL_STATE: State = { // Portal - blockchainErr: '', + blockchainErr: BlockchainErrs.NoError, blockchainIsLoaded: false, generateOrderStep: GenerateOrderSteps.ChooseAssets, networkId: undefined, @@ -76,8 +76,8 @@ const INITIAL_STATE: State = { screenWidth: utils.getScreenWidth(), shouldBlockchainErrDialogBeOpen: false, sideToAssetToken: { - [Side.deposit]: {}, - [Side.receive]: {}, + [Side.Deposit]: {}, + [Side.Receive]: {}, }, tokenByAddress: {}, tokenStateByAddress: {}, @@ -294,8 +294,8 @@ export function reducer(state: State = INITIAL_STATE, action: Action) { case ActionTypes.SWAP_ASSET_TOKENS: { const newSideToAssetToken = _.assign({}, state.sideToAssetToken, { - [Side.deposit]: state.sideToAssetToken[Side.receive], - [Side.receive]: state.sideToAssetToken[Side.deposit], + [Side.Deposit]: state.sideToAssetToken[Side.Receive], + [Side.Receive]: state.sideToAssetToken[Side.Deposit], }); return _.assign({}, state, { sideToAssetToken: newSideToAssetToken, diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index 2005cf265..085b46789 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -18,18 +18,10 @@ export enum GenerateOrderSteps { CopyAndShare, } -export const Side = strEnum([ - 'receive', - 'deposit', -]); -export type Side = keyof typeof Side; - -export const BlockchainErrs = strEnum([ - 'A_CONTRACT_NOT_DEPLOYED_ON_NETWORK', - 'DISCONNECTED_FROM_ETHEREUM_NODE', - 'UNHANDLED_ERROR', -]); -export type BlockchainErrs = keyof typeof BlockchainErrs; +export enum Side { + Receive = 'RECEIVE', + Deposit = 'DEPOSIT', +} export const Direction = strEnum([ 'forward', @@ -271,6 +263,12 @@ export const EtherscanLinkSuffixes = strEnum([ ]); export type EtherscanLinkSuffixes = keyof typeof EtherscanLinkSuffixes; +export enum BlockchainErrs { + AContractNotDeployedOnNetwork = 'A_CONTRACT_NOT_DEPLOYED_ON_NETWORK', + DisconnectedFromEthereumNode = 'DISCONNECTED_FROM_ETHEREUM_NODE', + NoError = 'NO_ERROR', +} + export const BlockchainCallErrs = strEnum([ 'CONTRACT_DOES_NOT_EXIST', 'USER_HAS_NO_ASSOCIATED_ADDRESSES', diff --git a/packages/website/ts/utils/utils.ts b/packages/website/ts/utils/utils.ts index abc2fb2d4..a6f80c2ab 100644 --- a/packages/website/ts/utils/utils.ts +++ b/packages/website/ts/utils/utils.ts @@ -61,8 +61,8 @@ export const utils = { orderExpiryTimestamp: BigNumber, orderTakerAddress: string, orderMakerAddress: string, makerFee: BigNumber, takerFee: BigNumber, feeRecipient: string, signatureData: SignatureData, tokenByAddress: TokenByAddress, orderSalt: BigNumber): Order { - const makerToken = tokenByAddress[sideToAssetToken[Side.deposit].address]; - const takerToken = tokenByAddress[sideToAssetToken[Side.receive].address]; + const makerToken = tokenByAddress[sideToAssetToken[Side.Deposit].address]; + const takerToken = tokenByAddress[sideToAssetToken[Side.Receive].address]; const order = { maker: { address: orderMakerAddress, @@ -72,7 +72,7 @@ export const utils = { decimals: makerToken.decimals, address: makerToken.address, }, - amount: sideToAssetToken[Side.deposit].amount.toString(), + amount: sideToAssetToken[Side.Deposit].amount.toString(), feeAmount: makerFee.toString(), }, taker: { @@ -83,7 +83,7 @@ export const utils = { decimals: takerToken.decimals, address: takerToken.address, }, - amount: sideToAssetToken[Side.receive].amount.toString(), + amount: sideToAssetToken[Side.Receive].amount.toString(), feeAmount: takerFee.toString(), }, expiration: orderExpiryTimestamp.toString(), -- cgit v1.2.3 From 449fd9f0242b031c7427ae9a95430008c3171d1c Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 17 Dec 2017 19:38:59 -0500 Subject: Remove unused enums --- packages/website/ts/redux/dispatcher.ts | 7 ------- packages/website/ts/redux/reducer.ts | 17 ----------------- packages/website/ts/types.ts | 15 --------------- 3 files changed, 39 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/redux/dispatcher.ts b/packages/website/ts/redux/dispatcher.ts index cbcee6599..e37e1fa6c 100644 --- a/packages/website/ts/redux/dispatcher.ts +++ b/packages/website/ts/redux/dispatcher.ts @@ -5,7 +5,6 @@ import { ActionTypes, AssetToken, BlockchainErrs, - Direction, Order, ProviderType, ScreenWidths, @@ -43,12 +42,6 @@ export class Dispatcher { type: ActionTypes.SWAP_ASSET_TOKENS, }); } - public updateGenerateOrderStep(direction: Direction) { - this.dispatch({ - data: direction, - type: ActionTypes.UPDATE_GENERATE_ORDER_STEP, - }); - } public updateOrderSalt(salt: BigNumber) { this.dispatch({ data: salt, diff --git a/packages/website/ts/redux/reducer.ts b/packages/website/ts/redux/reducer.ts index 9bd8899ad..361e5f8c6 100644 --- a/packages/website/ts/redux/reducer.ts +++ b/packages/website/ts/redux/reducer.ts @@ -5,8 +5,6 @@ import { Action, ActionTypes, BlockchainErrs, - Direction, - GenerateOrderSteps, Order, ProviderType, ScreenWidths, @@ -28,7 +26,6 @@ export interface State { // Portal blockchainErr: BlockchainErrs; blockchainIsLoaded: boolean; - generateOrderStep: GenerateOrderSteps; networkId: number; orderExpiryTimestamp: BigNumber; orderFillAmount: BigNumber; @@ -60,7 +57,6 @@ const INITIAL_STATE: State = { // Portal blockchainErr: BlockchainErrs.NoError, blockchainIsLoaded: false, - generateOrderStep: GenerateOrderSteps.ChooseAssets, networkId: undefined, orderExpiryTimestamp: utils.initialOrderExpiryUnixTimestampSec(), orderFillAmount: undefined, @@ -259,19 +255,6 @@ export function reducer(state: State = INITIAL_STATE, action: Action) { }); } - case ActionTypes.UPDATE_GENERATE_ORDER_STEP: { - const direction = action.data; - let nextGenerateOrderStep = state.generateOrderStep; - if (direction === Direction.forward) { - nextGenerateOrderStep += 1; - } else if (state.generateOrderStep !== 0) { - nextGenerateOrderStep -= 1; - } - return _.assign({}, state, { - generateOrderStep: nextGenerateOrderStep, - }); - } - case ActionTypes.UPDATE_CHOSEN_ASSET_TOKEN: { const newSideToAssetToken = _.assign({}, state.sideToAssetToken, { [action.data.side]: action.data.token, diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index 085b46789..52d30ae35 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -10,25 +10,11 @@ function strEnum(values: string[]): {[key: string]: string} { }, Object.create(null)); } -export enum GenerateOrderSteps { - ChooseAssets, - GrantAllowance, - RemainingConfigs, - SignTransaction, - CopyAndShare, -} - export enum Side { Receive = 'RECEIVE', Deposit = 'DEPOSIT', } -export const Direction = strEnum([ - 'forward', - 'backward', -]); -export type Direction = keyof typeof Direction; - export interface Token { iconUrl?: string; name: string; @@ -141,7 +127,6 @@ export const ActionTypes = strEnum([ 'CLEAR_TOKEN_BY_ADDRESS', 'UPDATE_BLOCKCHAIN_IS_LOADED', 'UPDATE_NETWORK_ID', - 'UPDATE_GENERATE_ORDER_STEP', 'UPDATE_CHOSEN_ASSET_TOKEN', 'UPDATE_CHOSEN_ASSET_TOKEN_ADDRESS', 'UPDATE_ORDER_TAKER_ADDRESS', -- cgit v1.2.3 From 90d274ffc4cce36c1ff572fad10bd7896e255ada Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 17 Dec 2017 20:06:49 -0500 Subject: Update ActionType enum and move from using _.assign in reducer --- packages/website/ts/redux/dispatcher.ts | 66 ++++---- packages/website/ts/redux/reducer.ts | 265 +++++++++++++++++++------------- packages/website/ts/types.ts | 71 +++++---- 3 files changed, 222 insertions(+), 180 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/redux/dispatcher.ts b/packages/website/ts/redux/dispatcher.ts index e37e1fa6c..ad5553c58 100644 --- a/packages/website/ts/redux/dispatcher.ts +++ b/packages/website/ts/redux/dispatcher.ts @@ -22,42 +22,42 @@ export class Dispatcher { // Portal public resetState() { this.dispatch({ - type: ActionTypes.RESET_STATE, + type: ActionTypes.ResetState, }); } public updateNodeVersion(nodeVersion: string) { this.dispatch({ data: nodeVersion, - type: ActionTypes.UPDATE_NODE_VERSION, + type: ActionTypes.UpdateNodeVersion, }); } public updateScreenWidth(screenWidth: ScreenWidths) { this.dispatch({ data: screenWidth, - type: ActionTypes.UPDATE_SCREEN_WIDTH, + type: ActionTypes.UpdateScreenWidth, }); } public swapAssetTokenSymbols() { this.dispatch({ - type: ActionTypes.SWAP_ASSET_TOKENS, + type: ActionTypes.SwapAssetTokens, }); } public updateOrderSalt(salt: BigNumber) { this.dispatch({ data: salt, - type: ActionTypes.UPDATE_ORDER_SALT, + type: ActionTypes.UpdateOrderSalt, }); } public updateUserSuppliedOrderCache(order: Order) { this.dispatch({ data: order, - type: ActionTypes.UPDATE_USER_SUPPLIED_ORDER_CACHE, + type: ActionTypes.UpdateUserSuppliedOrderCache, }); } public updateShouldBlockchainErrDialogBeOpen(shouldBeOpen: boolean) { this.dispatch({ data: shouldBeOpen, - type: ActionTypes.UPDATE_SHOULD_BLOCKCHAIN_ERR_DIALOG_BE_OPEN, + type: ActionTypes.UpdateShouldBlockchainErrDialogBeOpen, }); } public updateChosenAssetToken(side: Side, token: AssetToken) { @@ -66,7 +66,7 @@ export class Dispatcher { side, token, }, - type: ActionTypes.UPDATE_CHOSEN_ASSET_TOKEN, + type: ActionTypes.UpdateChosenAssetToken, }); } public updateChosenAssetTokenAddress(side: Side, address: string) { @@ -75,72 +75,72 @@ export class Dispatcher { address, side, }, - type: ActionTypes.UPDATE_CHOSEN_ASSET_TOKEN_ADDRESS, + type: ActionTypes.UpdateChosenAssetTokenAddress, }); } public updateOrderTakerAddress(address: string) { this.dispatch({ data: address, - type: ActionTypes.UPDATE_ORDER_TAKER_ADDRESS, + type: ActionTypes.UpdateOrderTakerAddress, }); } public updateUserAddress(address: string) { this.dispatch({ data: address, - type: ActionTypes.UPDATE_USER_ADDRESS, + type: ActionTypes.UpdateUserAddress, }); } public updateOrderExpiry(unixTimestampSec: BigNumber) { this.dispatch({ data: unixTimestampSec, - type: ActionTypes.UPDATE_ORDER_EXPIRY, + type: ActionTypes.UpdateOrderExpiry, }); } public encounteredBlockchainError(err: BlockchainErrs) { this.dispatch({ data: err, - type: ActionTypes.BLOCKCHAIN_ERR_ENCOUNTERED, + type: ActionTypes.BlockchainErrEncountered, }); } public updateBlockchainIsLoaded(isLoaded: boolean) { this.dispatch({ data: isLoaded, - type: ActionTypes.UPDATE_BLOCKCHAIN_IS_LOADED, + type: ActionTypes.UpdateBlockchainIsLoaded, }); } public addTokenToTokenByAddress(token: Token) { this.dispatch({ data: token, - type: ActionTypes.ADD_TOKEN_TO_TOKEN_BY_ADDRESS, + type: ActionTypes.AddTokenToTokenByAddress, }); } public removeTokenToTokenByAddress(token: Token) { this.dispatch({ data: token, - type: ActionTypes.REMOVE_TOKEN_TO_TOKEN_BY_ADDRESS, + type: ActionTypes.RemoveTokenFromTokenByAddress, }); } public clearTokenByAddress() { this.dispatch({ - type: ActionTypes.CLEAR_TOKEN_BY_ADDRESS, + type: ActionTypes.ClearTokenByAddress, }); } public updateTokenByAddress(tokens: Token[]) { this.dispatch({ data: tokens, - type: ActionTypes.UPDATE_TOKEN_BY_ADDRESS, + type: ActionTypes.UpdateTokenByAddress, }); } public updateTokenStateByAddress(tokenStateByAddress: TokenStateByAddress) { this.dispatch({ data: tokenStateByAddress, - type: ActionTypes.UPDATE_TOKEN_STATE_BY_ADDRESS, + type: ActionTypes.UpdateTokenStateByAddress, }); } public removeFromTokenStateByAddress(tokenAddress: string) { this.dispatch({ data: tokenAddress, - type: ActionTypes.REMOVE_FROM_TOKEN_STATE_BY_ADDRESS, + type: ActionTypes.RemoveFromTokenStateByAddress, }); } public replaceTokenAllowanceByAddress(address: string, allowance: BigNumber) { @@ -149,7 +149,7 @@ export class Dispatcher { address, allowance, }, - type: ActionTypes.REPLACE_TOKEN_ALLOWANCE_BY_ADDRESS, + type: ActionTypes.ReplaceTokenAllowanceByAddress, }); } public replaceTokenBalanceByAddress(address: string, balance: BigNumber) { @@ -158,7 +158,7 @@ export class Dispatcher { address, balance, }, - type: ActionTypes.REPLACE_TOKEN_BALANCE_BY_ADDRESS, + type: ActionTypes.ReplaceTokenBalanceByAddress, }); } public updateTokenBalanceByAddress(address: string, balanceDelta: BigNumber) { @@ -167,31 +167,31 @@ export class Dispatcher { address, balanceDelta, }, - type: ActionTypes.UPDATE_TOKEN_BALANCE_BY_ADDRESS, + type: ActionTypes.UpdateTokenBalanceByAddress, }); } public updateSignatureData(signatureData: SignatureData) { this.dispatch({ data: signatureData, - type: ActionTypes.UPDATE_ORDER_SIGNATURE_DATA, + type: ActionTypes.UpdateOrderSignatureData, }); } public updateUserEtherBalance(balance: BigNumber) { this.dispatch({ data: balance, - type: ActionTypes.UPDATE_USER_ETHER_BALANCE, + type: ActionTypes.UpdateUserEtherBalance, }); } public updateNetworkId(networkId: number) { this.dispatch({ data: networkId, - type: ActionTypes.UPDATE_NETWORK_ID, + type: ActionTypes.UpdateNetworkId, }); } public updateOrderFillAmount(amount: BigNumber) { this.dispatch({ data: amount, - type: ActionTypes.UPDATE_ORDER_FILL_AMOUNT, + type: ActionTypes.UpdateOrderFillAmount, }); } @@ -199,13 +199,13 @@ export class Dispatcher { public updateCurrentDocsVersion(version: string) { this.dispatch({ data: version, - type: ActionTypes.UPDATE_LIBRARY_VERSION, + type: ActionTypes.UpdateLibraryVersion, }); } public updateAvailableDocVersions(versions: string[]) { this.dispatch({ data: versions, - type: ActionTypes.UPDATE_AVAILABLE_LIBRARY_VERSIONS, + type: ActionTypes.UpdateAvailableLibraryVersions, }); } @@ -213,23 +213,23 @@ export class Dispatcher { public showFlashMessage(msg: string|React.ReactNode) { this.dispatch({ data: msg, - type: ActionTypes.SHOW_FLASH_MESSAGE, + type: ActionTypes.ShowFlashMessage, }); } public hideFlashMessage() { this.dispatch({ - type: ActionTypes.HIDE_FLASH_MESSAGE, + type: ActionTypes.HideFlashMessage, }); } public updateProviderType(providerType: ProviderType) { this.dispatch({ - type: ActionTypes.UPDATE_PROVIDER_TYPE, + type: ActionTypes.UpdateProviderType, data: providerType, }); } public updateInjectedProviderName(injectedProviderName: string) { this.dispatch({ - type: ActionTypes.UPDATE_INJECTED_PROVIDER_NAME, + type: ActionTypes.UpdateInjectedProviderName, data: injectedProviderName, }); } diff --git a/packages/website/ts/redux/reducer.ts b/packages/website/ts/redux/reducer.ts index 361e5f8c6..43bdeaa83 100644 --- a/packages/website/ts/redux/reducer.ts +++ b/packages/website/ts/redux/reducer.ts @@ -94,250 +94,293 @@ const INITIAL_STATE: State = { export function reducer(state: State = INITIAL_STATE, action: Action) { switch (action.type) { // Portal - case ActionTypes.RESET_STATE: + case ActionTypes.ResetState: return INITIAL_STATE; - case ActionTypes.UPDATE_ORDER_SALT: { - return _.assign({}, state, { + case ActionTypes.UpdateOrderSalt: { + return { + ...state, orderSalt: action.data, - }); + }; } - case ActionTypes.UPDATE_NODE_VERSION: { - return _.assign({}, state, { + case ActionTypes.UpdateNodeVersion: { + return { + ...state, nodeVersion: action.data, - }); + }; } - case ActionTypes.UPDATE_ORDER_FILL_AMOUNT: { - return _.assign({}, state, { + case ActionTypes.UpdateOrderFillAmount: { + return { + ...state, orderFillAmount: action.data, - }); + }; } - case ActionTypes.UPDATE_SHOULD_BLOCKCHAIN_ERR_DIALOG_BE_OPEN: { - return _.assign({}, state, { + case ActionTypes.UpdateShouldBlockchainErrDialogBeOpen: { + return { + ...state, shouldBlockchainErrDialogBeOpen: action.data, - }); + }; } - case ActionTypes.UPDATE_USER_ETHER_BALANCE: { - return _.assign({}, state, { + case ActionTypes.UpdateUserEtherBalance: { + return { + ...state, userEtherBalance: action.data, - }); + }; } - case ActionTypes.UPDATE_USER_SUPPLIED_ORDER_CACHE: { - return _.assign({}, state, { + case ActionTypes.UpdateUserSuppliedOrderCache: { + return { + ...state, userSuppliedOrderCache: action.data, - }); + }; } - case ActionTypes.CLEAR_TOKEN_BY_ADDRESS: { - return _.assign({}, state, { + case ActionTypes.ClearTokenByAddress: { + return { + ...state, tokenByAddress: {}, - }); + }; } - case ActionTypes.ADD_TOKEN_TO_TOKEN_BY_ADDRESS: { + case ActionTypes.AddTokenToTokenByAddress: { const newTokenByAddress = state.tokenByAddress; newTokenByAddress[action.data.address] = action.data; - return _.assign({}, state, { + return { + ...state, tokenByAddress: newTokenByAddress, - }); + }; } - case ActionTypes.REMOVE_TOKEN_TO_TOKEN_BY_ADDRESS: { + case ActionTypes.RemoveTokenFromTokenByAddress: { const newTokenByAddress = state.tokenByAddress; delete newTokenByAddress[action.data.address]; - return _.assign({}, state, { + return { + ...state, tokenByAddress: newTokenByAddress, - }); + }; } - case ActionTypes.UPDATE_TOKEN_BY_ADDRESS: { + case ActionTypes.UpdateTokenByAddress: { const tokenByAddress = state.tokenByAddress; const tokens = action.data; _.each(tokens, token => { - const updatedToken = _.assign({}, tokenByAddress[token.address], token); + const updatedToken = { + ...tokenByAddress[token.address], + ...token, + }; tokenByAddress[token.address] = updatedToken; }); - return _.assign({}, state, { + return { + ...state, tokenByAddress, - }); + }; } - case ActionTypes.UPDATE_TOKEN_STATE_BY_ADDRESS: { + case ActionTypes.UpdateTokenStateByAddress: { const tokenStateByAddress = state.tokenStateByAddress; const updatedTokenStateByAddress = action.data; _.each(updatedTokenStateByAddress, (tokenState: TokenState, address: string) => { - const updatedTokenState = _.assign({}, tokenStateByAddress[address], tokenState); + const updatedTokenState = { + ...tokenStateByAddress[address], + ...tokenState, + }; tokenStateByAddress[address] = updatedTokenState; }); - return _.assign({}, state, { + return { + ...state, tokenStateByAddress, - }); + }; } - case ActionTypes.REMOVE_FROM_TOKEN_STATE_BY_ADDRESS: { + case ActionTypes.RemoveFromTokenStateByAddress: { const tokenStateByAddress = state.tokenStateByAddress; const tokenAddress = action.data; delete tokenStateByAddress[tokenAddress]; - return _.assign({}, state, { + return { + ...state, tokenStateByAddress, - }); + }; } - case ActionTypes.REPLACE_TOKEN_ALLOWANCE_BY_ADDRESS: { + case ActionTypes.ReplaceTokenAllowanceByAddress: { const tokenStateByAddress = state.tokenStateByAddress; const allowance = action.data.allowance; const tokenAddress = action.data.address; - tokenStateByAddress[tokenAddress] = _.assign({}, tokenStateByAddress[tokenAddress], { + tokenStateByAddress[tokenAddress] = { + ...tokenStateByAddress[tokenAddress], allowance, - }); - return _.assign({}, state, { + }; + return { + ...state, tokenStateByAddress, - }); + }; } - case ActionTypes.REPLACE_TOKEN_BALANCE_BY_ADDRESS: { + case ActionTypes.ReplaceTokenBalanceByAddress: { const tokenStateByAddress = state.tokenStateByAddress; const balance = action.data.balance; const tokenAddress = action.data.address; - tokenStateByAddress[tokenAddress] = _.assign({}, tokenStateByAddress[tokenAddress], { + tokenStateByAddress[tokenAddress] = { + ...tokenStateByAddress[tokenAddress], balance, - }); - return _.assign({}, state, { + }; + return { + ...state, tokenStateByAddress, - }); + }; } - case ActionTypes.UPDATE_TOKEN_BALANCE_BY_ADDRESS: { + case ActionTypes.UpdateTokenBalanceByAddress: { const tokenStateByAddress = state.tokenStateByAddress; const balanceDelta = action.data.balanceDelta; const tokenAddress = action.data.address; const currBalance = tokenStateByAddress[tokenAddress].balance; - tokenStateByAddress[tokenAddress] = _.assign({}, tokenStateByAddress[tokenAddress], { + tokenStateByAddress[tokenAddress] = { + ...tokenStateByAddress[tokenAddress], balance: currBalance.plus(balanceDelta), - }); - return _.assign({}, state, { + }; + return { + ...state, tokenStateByAddress, - }); + }; } - case ActionTypes.UPDATE_ORDER_SIGNATURE_DATA: { - return _.assign({}, state, { + case ActionTypes.UpdateOrderSignatureData: { + return { + ...state, orderSignatureData: action.data, - }); + }; } - case ActionTypes.UPDATE_SCREEN_WIDTH: { - return _.assign({}, state, { + case ActionTypes.UpdateScreenWidth: { + return { + ...state, screenWidth: action.data, - }); + }; } - case ActionTypes.UPDATE_BLOCKCHAIN_IS_LOADED: { - return _.assign({}, state, { + case ActionTypes.UpdateBlockchainIsLoaded: { + return { + ...state, blockchainIsLoaded: action.data, - }); + }; } - case ActionTypes.BLOCKCHAIN_ERR_ENCOUNTERED: { - return _.assign({}, state, { + case ActionTypes.BlockchainErrEncountered: { + return { + ...state, blockchainErr: action.data, - }); + }; } - case ActionTypes.UPDATE_NETWORK_ID: { - return _.assign({}, state, { + case ActionTypes.UpdateNetworkId: { + return { + ...state, networkId: action.data, - }); + }; } - case ActionTypes.UPDATE_CHOSEN_ASSET_TOKEN: { - const newSideToAssetToken = _.assign({}, state.sideToAssetToken, { + case ActionTypes.UpdateChosenAssetToken: { + const newSideToAssetToken = { + ...state.sideToAssetToken, [action.data.side]: action.data.token, - }); - return _.assign({}, state, { + }; + return { + ...state, sideToAssetToken: newSideToAssetToken, - }); + }; } - case ActionTypes.UPDATE_CHOSEN_ASSET_TOKEN_ADDRESS: { + case ActionTypes.UpdateChosenAssetTokenAddress: { const newAssetToken = state.sideToAssetToken[action.data.side]; newAssetToken.address = action.data.address; - const newSideToAssetToken = _.assign({}, state.sideToAssetToken, { + const newSideToAssetToken = { + ...state.sideToAssetToken, [action.data.side]: newAssetToken, - }); - return _.assign({}, state, { + }; + return { + ...state, sideToAssetToken: newSideToAssetToken, - }); + }; } - case ActionTypes.SWAP_ASSET_TOKENS: { - const newSideToAssetToken = _.assign({}, state.sideToAssetToken, { + case ActionTypes.SwapAssetTokens: { + const newSideToAssetToken = { [Side.Deposit]: state.sideToAssetToken[Side.Receive], [Side.Receive]: state.sideToAssetToken[Side.Deposit], - }); - return _.assign({}, state, { + }; + return { + ...state, sideToAssetToken: newSideToAssetToken, - }); + }; } - case ActionTypes.UPDATE_ORDER_EXPIRY: { - return _.assign({}, state, { + case ActionTypes.UpdateOrderExpiry: { + return { + ...state, orderExpiryTimestamp: action.data, - }); + }; } - case ActionTypes.UPDATE_ORDER_TAKER_ADDRESS: { - return _.assign({}, state, { + case ActionTypes.UpdateOrderTakerAddress: { + return { + ...state, orderTakerAddress: action.data, - }); + }; } - case ActionTypes.UPDATE_USER_ADDRESS: { - return _.assign({}, state, { + case ActionTypes.UpdateUserAddress: { + return { + ...state, userAddress: action.data, - }); + }; } // Docs - case ActionTypes.UPDATE_LIBRARY_VERSION: { - return _.assign({}, state, { + case ActionTypes.UpdateLibraryVersion: { + return { + ...state, docsVersion: action.data, - }); + }; } - case ActionTypes.UPDATE_AVAILABLE_LIBRARY_VERSIONS: { - return _.assign({}, state, { + case ActionTypes.UpdateAvailableLibraryVersions: { + return { + ...state, availableDocVersions: action.data, - }); + }; } // Shared - case ActionTypes.SHOW_FLASH_MESSAGE: { - return _.assign({}, state, { + case ActionTypes.ShowFlashMessage: { + return { + ...state, flashMessage: action.data, - }); + }; } - case ActionTypes.HIDE_FLASH_MESSAGE: { - return _.assign({}, state, { + case ActionTypes.HideFlashMessage: { + return { + ...state, flashMessage: undefined, - }); + }; } - case ActionTypes.UPDATE_PROVIDER_TYPE: { - return _.assign({}, state, { + case ActionTypes.UpdateProviderType: { + return { + ...state, providerType: action.data, - }); + }; } - case ActionTypes.UPDATE_INJECTED_PROVIDER_NAME: { - return _.assign({}, state, { + case ActionTypes.UpdateInjectedProviderName: { + return { + ...state, injectedProviderName: action.data, - }); + }; } default: diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index 52d30ae35..58f44dd45 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -117,47 +117,46 @@ export enum BalanceErrs { allowanceSettingFailed, } -export const ActionTypes = strEnum([ +export enum ActionTypes { // Portal - 'UPDATE_SCREEN_WIDTH', - 'UPDATE_NODE_VERSION', - 'RESET_STATE', - 'ADD_TOKEN_TO_TOKEN_BY_ADDRESS', - 'BLOCKCHAIN_ERR_ENCOUNTERED', - 'CLEAR_TOKEN_BY_ADDRESS', - 'UPDATE_BLOCKCHAIN_IS_LOADED', - 'UPDATE_NETWORK_ID', - 'UPDATE_CHOSEN_ASSET_TOKEN', - 'UPDATE_CHOSEN_ASSET_TOKEN_ADDRESS', - 'UPDATE_ORDER_TAKER_ADDRESS', - 'UPDATE_ORDER_SALT', - 'UPDATE_ORDER_SIGNATURE_DATA', - 'UPDATE_TOKEN_BY_ADDRESS', - 'REMOVE_TOKEN_TO_TOKEN_BY_ADDRESS', - 'UPDATE_TOKEN_STATE_BY_ADDRESS', - 'REMOVE_FROM_TOKEN_STATE_BY_ADDRESS', - 'REPLACE_TOKEN_ALLOWANCE_BY_ADDRESS', - 'REPLACE_TOKEN_BALANCE_BY_ADDRESS', - 'UPDATE_TOKEN_BALANCE_BY_ADDRESS', - 'UPDATE_ORDER_EXPIRY', - 'SWAP_ASSET_TOKENS', - 'UPDATE_USER_ADDRESS', - 'UPDATE_USER_ETHER_BALANCE', - 'UPDATE_USER_SUPPLIED_ORDER_CACHE', - 'UPDATE_ORDER_FILL_AMOUNT', - 'UPDATE_SHOULD_BLOCKCHAIN_ERR_DIALOG_BE_OPEN', + UpdateScreenWidth = 'UPDATE_SCREEN_WIDTH', + UpdateNodeVersion = 'UPDATE_NODE_VERSION', + ResetState = 'RESET_STATE', + AddTokenToTokenByAddress = 'ADD_TOKEN_TO_TOKEN_BY_ADDRESS', + BlockchainErrEncountered = 'BLOCKCHAIN_ERR_ENCOUNTERED', + ClearTokenByAddress = 'CLEAR_TOKEN_BY_ADDRESS', + UpdateBlockchainIsLoaded = 'UPDATE_BLOCKCHAIN_IS_LOADED', + UpdateNetworkId = 'UPDATE_NETWORK_ID', + UpdateChosenAssetToken = 'UPDATE_CHOSEN_ASSET_TOKEN', + UpdateChosenAssetTokenAddress = 'UPDATE_CHOSEN_ASSET_TOKEN_ADDRESS', + UpdateOrderTakerAddress = 'UPDATE_ORDER_TAKER_ADDRESS', + UpdateOrderSalt = 'UPDATE_ORDER_SALT', + UpdateOrderSignatureData = 'UPDATE_ORDER_SIGNATURE_DATA', + UpdateTokenByAddress = 'UPDATE_TOKEN_BY_ADDRESS', + RemoveTokenFromTokenByAddress = 'REMOVE_TOKEN_FROM_TOKEN_BY_ADDRESS', + UpdateTokenStateByAddress = 'UPDATE_TOKEN_STATE_BY_ADDRESS', + RemoveFromTokenStateByAddress = 'REMOVE_FROM_TOKEN_STATE_BY_ADDRESS', + ReplaceTokenAllowanceByAddress = 'REPLACE_TOKEN_ALLOWANCE_BY_ADDRESS', + ReplaceTokenBalanceByAddress = 'REPLACE_TOKEN_BALANCE_BY_ADDRESS', + UpdateTokenBalanceByAddress = 'UPDATE_TOKEN_BALANCE_BY_ADDRESS', + UpdateOrderExpiry = 'UPDATE_ORDER_EXPIRY', + SwapAssetTokens = 'SWAP_ASSET_TOKENS', + UpdateUserAddress = 'UPDATE_USER_ADDRESS', + UpdateUserEtherBalance = 'UPDATE_USER_ETHER_BALANCE', + UpdateUserSuppliedOrderCache = 'UPDATE_USER_SUPPLIED_ORDER_CACHE', + UpdateOrderFillAmount = 'UPDATE_ORDER_FILL_AMOUNT', + UpdateShouldBlockchainErrDialogBeOpen = 'UPDATE_SHOULD_BLOCKCHAIN_ERR_DIALOG_BE_OPEN', // Docs - 'UPDATE_LIBRARY_VERSION', - 'UPDATE_AVAILABLE_LIBRARY_VERSIONS', + UpdateLibraryVersion = 'UPDATE_LIBRARY_VERSION', + UpdateAvailableLibraryVersions = 'UPDATE_AVAILABLE_LIBRARY_VERSIONS', // Shared - 'SHOW_FLASH_MESSAGE', - 'HIDE_FLASH_MESSAGE', - 'UPDATE_PROVIDER_TYPE', - 'UPDATE_INJECTED_PROVIDER_NAME', -]); -export type ActionTypes = keyof typeof ActionTypes; + ShowFlashMessage = 'SHOW_FLASH_MESSAGE', + HideFlashMessage = 'HIDE_FLASH_MESSAGE', + UpdateProviderType = 'UPDATE_PROVIDER_TYPE', + UpdateInjectedProviderName = 'UPDATE_INJECTED_PROVIDER_NAME', +} export interface Action { type: ActionTypes; -- cgit v1.2.3 From abbad68eb838ec4611d2236a7b0036a4a4d3058e Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 17 Dec 2017 20:48:23 -0500 Subject: Replace remaining strEnums with property TS string enums --- packages/website/ts/blockchain.ts | 30 ++++----- .../ts/components/eth_weth_conversion_button.tsx | 2 +- packages/website/ts/components/send_button.tsx | 2 +- packages/website/ts/components/token_balances.tsx | 12 ++-- .../trade_history/trade_history_item.tsx | 2 +- .../website/ts/components/ui/ethereum_address.tsx | 2 +- .../website/ts/components/ui/etherscan_icon.tsx | 2 +- packages/website/ts/components/ui/party.tsx | 2 +- .../ts/pages/documentation/documentation.tsx | 2 +- .../ts/pages/documentation/type_definition.tsx | 2 +- packages/website/ts/pages/landing/landing.tsx | 24 +++---- packages/website/ts/redux/reducer.ts | 2 +- packages/website/ts/types.ts | 77 +++++++++------------- packages/website/ts/utils/typedoc_utils.ts | 4 +- packages/website/ts/utils/utils.ts | 6 +- 15 files changed, 79 insertions(+), 92 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/blockchain.ts b/packages/website/ts/blockchain.ts index 336397f7f..c8ebd6b93 100644 --- a/packages/website/ts/blockchain.ts +++ b/packages/website/ts/blockchain.ts @@ -186,7 +186,7 @@ export class Blockchain { // later on in the logic. let provider; switch (providerType) { - case ProviderType.LEDGER: { + case ProviderType.Ledger: { const isU2FSupported = await utils.isU2FSupportedAsync(); if (!isU2FSupported) { throw new Error('Cannot update providerType to LEDGER without U2F support'); @@ -220,7 +220,7 @@ export class Blockchain { break; } - case ProviderType.INJECTED: { + case ProviderType.Injected: { if (_.isUndefined(this.cachedProvider)) { return; // Going from injected to injected, so we noop } @@ -241,8 +241,8 @@ export class Blockchain { await this.fetchTokenInformationAsync(); } public async setProxyAllowanceAsync(token: Token, amountInBaseUnits: BigNumber): Promise { - utils.assert(this.isValidAddress(token.address), BlockchainCallErrs.TOKEN_ADDRESS_IS_INVALID); - utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.USER_HAS_NO_ASSOCIATED_ADDRESSES); + utils.assert(this.isValidAddress(token.address), BlockchainCallErrs.TokenAddressIsInvalid); + utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.UserHasNoAssociatedAddresses); utils.assert(!_.isUndefined(this.zeroEx), 'ZeroEx must be instantiated.'); const txHash = await this.zeroEx.token.setProxyAllowanceAsync( @@ -258,7 +258,7 @@ export class Blockchain { token.address, this.userAddress, toAddress, amountInBaseUnits, ); await this.showEtherScanLinkAndAwaitTransactionMinedAsync(txHash); - const etherScanLinkIfExists = utils.getEtherScanLinkIfExists(txHash, this.networkId, EtherscanLinkSuffixes.tx); + const etherScanLinkIfExists = utils.getEtherScanLinkIfExists(txHash, this.networkId, EtherscanLinkSuffixes.Tx); this.dispatcher.showFlashMessage(React.createElement(TokenSendCompleted, { etherScanLinkIfExists, token, @@ -294,7 +294,7 @@ export class Blockchain { } public async fillOrderAsync(signedOrder: SignedOrder, fillTakerTokenAmount: BigNumber): Promise { - utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.USER_HAS_NO_ASSOCIATED_ADDRESSES); + utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.UserHasNoAssociatedAddresses); const shouldThrowOnInsufficientBalanceOrAllowance = true; @@ -346,7 +346,7 @@ export class Blockchain { return this.web3Wrapper.isAddress(lowercaseAddress); } public async pollTokenBalanceAsync(token: Token) { - utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.USER_HAS_NO_ASSOCIATED_ADDRESSES); + utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.UserHasNoAssociatedAddresses); const [currBalance] = await this.getTokenBalanceAndAllowanceAsync(this.userAddress, token.address); @@ -375,7 +375,7 @@ export class Blockchain { return signatureData; } public async mintTestTokensAsync(token: Token) { - utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.USER_HAS_NO_ASSOCIATED_ADDRESSES); + utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.UserHasNoAssociatedAddresses); const mintableContract = await this.instantiateContractIfExistsAsync(MintableArtifacts, token.address); await mintableContract.mint(constants.MINT_AMOUNT, { @@ -390,14 +390,14 @@ export class Blockchain { } public async convertEthToWrappedEthTokensAsync(amount: BigNumber): Promise { utils.assert(!_.isUndefined(this.zeroEx), 'ZeroEx must be instantiated.'); - utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.USER_HAS_NO_ASSOCIATED_ADDRESSES); + utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.UserHasNoAssociatedAddresses); const txHash = await this.zeroEx.etherToken.depositAsync(amount, this.userAddress); await this.showEtherScanLinkAndAwaitTransactionMinedAsync(txHash); } public async convertWrappedEthTokensToEthAsync(amount: BigNumber): Promise { utils.assert(!_.isUndefined(this.zeroEx), 'ZeroEx must be instantiated.'); - utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.USER_HAS_NO_ASSOCIATED_ADDRESSES); + utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.UserHasNoAssociatedAddresses); const txHash = await this.zeroEx.etherToken.withdrawAsync(amount, this.userAddress); await this.showEtherScanLinkAndAwaitTransactionMinedAsync(txHash); @@ -463,7 +463,7 @@ export class Blockchain { } private async showEtherScanLinkAndAwaitTransactionMinedAsync( txHash: string): Promise { - const etherScanLinkIfExists = utils.getEtherScanLinkIfExists(txHash, this.networkId, EtherscanLinkSuffixes.tx); + const etherScanLinkIfExists = utils.getEtherScanLinkIfExists(txHash, this.networkId, EtherscanLinkSuffixes.Tx); this.dispatcher.showFlashMessage(React.createElement(TransactionSubmitted, { etherScanLinkIfExists, })); @@ -491,7 +491,7 @@ export class Blockchain { } private async startListeningForExchangeLogFillEventsAsync(indexFilterValues: IndexedFilterValues): Promise { utils.assert(!_.isUndefined(this.zeroEx), 'ZeroEx must be instantiated.'); - utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.USER_HAS_NO_ASSOCIATED_ADDRESSES); + utils.assert(this.doesUserAddressExist(), BlockchainCallErrs.UserHasNoAssociatedAddresses); // Fetch historical logs await this.fetchHistoricalExchangeLogFillEventsAsync(indexFilterValues); @@ -733,7 +733,7 @@ export class Blockchain { const doesContractExist = await this.doesContractExistAtAddressAsync(contractAddress); if (!doesContractExist) { utils.consoleLog(`Contract does not exist: ${artifact.contract_name} at ${contractAddress}`); - throw new Error(BlockchainCallErrs.CONTRACT_DOES_NOT_EXIST); + throw new Error(BlockchainCallErrs.ContractDoesNotExist); } } @@ -746,10 +746,10 @@ export class Blockchain { const errMsg = `${err}`; utils.consoleLog(`Notice: Error encountered: ${err} ${err.stack}`); if (_.includes(errMsg, 'not been deployed to detected network')) { - throw new Error(BlockchainCallErrs.CONTRACT_DOES_NOT_EXIST); + throw new Error(BlockchainCallErrs.ContractDoesNotExist); } else { await errorReporter.reportAsync(err); - throw new Error(BlockchainCallErrs.UNHANDLED_ERROR); + throw new Error(BlockchainCallErrs.UnhandledError); } } } diff --git a/packages/website/ts/components/eth_weth_conversion_button.tsx b/packages/website/ts/components/eth_weth_conversion_button.tsx index ae919921d..5464f8df0 100644 --- a/packages/website/ts/components/eth_weth_conversion_button.tsx +++ b/packages/website/ts/components/eth_weth_conversion_button.tsx @@ -104,7 +104,7 @@ export class EthWethConversionButton extends this.props.onConversionSuccessful(); } catch (err) { const errMsg = '' + err; - if (_.includes(errMsg, BlockchainCallErrs.USER_HAS_NO_ASSOCIATED_ADDRESSES)) { + if (_.includes(errMsg, BlockchainCallErrs.UserHasNoAssociatedAddresses)) { this.props.dispatcher.updateShouldBlockchainErrDialogBeOpen(true); } else if (!_.includes(errMsg, 'User denied transaction')) { utils.consoleLog(`Unexpected error encountered: ${err}`); diff --git a/packages/website/ts/components/send_button.tsx b/packages/website/ts/components/send_button.tsx index b3fd2aeba..1fc300964 100644 --- a/packages/website/ts/components/send_button.tsx +++ b/packages/website/ts/components/send_button.tsx @@ -70,7 +70,7 @@ export class SendButton extends React.Component } - {this.props.screenWidth !== ScreenWidths.SM && + {this.props.screenWidth !== ScreenWidths.Sm && @@ -580,7 +580,7 @@ export class TokenBalances extends React.Component
diff --git a/packages/website/ts/components/ui/ethereum_address.tsx b/packages/website/ts/components/ui/ethereum_address.tsx index b3bc0bc59..d56840689 100644 --- a/packages/website/ts/components/ui/ethereum_address.tsx +++ b/packages/website/ts/components/ui/ethereum_address.tsx @@ -26,7 +26,7 @@ export const EthereumAddress = (props: EthereumAddressProps) => { {props.address} diff --git a/packages/website/ts/components/ui/etherscan_icon.tsx b/packages/website/ts/components/ui/etherscan_icon.tsx index 9b4d172f1..3ccbf0bd9 100644 --- a/packages/website/ts/components/ui/etherscan_icon.tsx +++ b/packages/website/ts/components/ui/etherscan_icon.tsx @@ -13,7 +13,7 @@ interface EtherScanIconProps { export const EtherScanIcon = (props: EtherScanIconProps) => { const etherscanLinkIfExists = utils.getEtherScanLinkIfExists( - props.addressOrTxHash, props.networkId, EtherscanLinkSuffixes.address, + props.addressOrTxHash, props.networkId, EtherscanLinkSuffixes.Address, ); const transactionTooltipId = `${props.addressOrTxHash}-etherscan-icon-tooltip`; return ( diff --git a/packages/website/ts/components/ui/party.tsx b/packages/website/ts/components/ui/party.tsx index e6b6ea9e2..2ff5b155e 100644 --- a/packages/website/ts/components/ui/party.tsx +++ b/packages/website/ts/components/ui/party.tsx @@ -45,7 +45,7 @@ export class Party extends React.Component { height: IMAGE_DIMENSION, }; const etherscanLinkIfExists = utils.getEtherScanLinkIfExists( - this.props.address, this.props.networkId, EtherscanLinkSuffixes.address, + this.props.address, this.props.networkId, EtherscanLinkSuffixes.Address, ); const isRegistered = this.props.isInTokenRegistry; const registeredTooltipId = `${this.props.address}-${isRegistered}-registeredTooltip`; diff --git a/packages/website/ts/pages/documentation/documentation.tsx b/packages/website/ts/pages/documentation/documentation.tsx index 0ca8ae9d3..687ba0fcc 100644 --- a/packages/website/ts/pages/documentation/documentation.tsx +++ b/packages/website/ts/pages/documentation/documentation.tsx @@ -281,7 +281,7 @@ export class Documentation extends return null; } const linkIfExists = utils.getEtherScanLinkIfExists( - contractAddress, constants.networkIdByName[networkName], EtherscanLinkSuffixes.address, + contractAddress, constants.networkIdByName[networkName], EtherscanLinkSuffixes.Address, ); return ( diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index 7992c7a6c..b8041ece4 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -181,7 +181,7 @@ export class Landing extends React.Component { ); } private renderHero() { - const isSmallScreen = this.state.screenWidth === ScreenWidths.SM; + const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; const buttonLabelStyle: React.CSSProperties = { textTransform: 'none', fontSize: isSmallScreen ? 12 : 14, @@ -265,8 +265,8 @@ export class Landing extends React.Component { ); } private renderProjects() { - const isSmallScreen = this.state.screenWidth === ScreenWidths.SM; - const isMediumScreen = this.state.screenWidth === ScreenWidths.MD; + const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; + const isMediumScreen = this.state.screenWidth === ScreenWidths.Md; const projectList = _.map(projects, (project: Project, i: number) => { const colWidth = isSmallScreen ? 3 : (isMediumScreen ? 4 : 2 - (i % 2)); return ( @@ -329,7 +329,7 @@ export class Landing extends React.Component { ); } private renderTokenizationSection() { - const isSmallScreen = this.state.screenWidth === ScreenWidths.SM; + const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; return (
{ ); } private renderProtocolSection() { - const isSmallScreen = this.state.screenWidth === ScreenWidths.SM; + const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; return (
{ ); } private renderBuildingBlocksSection() { - const isSmallScreen = this.state.screenWidth === ScreenWidths.SM; + const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; const descriptionStyle: React.CSSProperties = { fontFamily: 'Roboto Mono', lineHeight: isSmallScreen ? 1.5 : 2, @@ -540,7 +540,7 @@ export class Landing extends React.Component { ); } private renderBlockChipImage() { - const isSmallScreen = this.state.screenWidth === ScreenWidths.SM; + const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; return (
{ ); } private renderTokenCloud() { - const isSmallScreen = this.state.screenWidth === ScreenWidths.SM; + const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; return (
{ ); } private renderAssetTypes() { - const isSmallScreen = this.state.screenWidth === ScreenWidths.SM; + const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; const assetTypes: AssetType[] = [ { title: 'Currency', @@ -601,7 +601,7 @@ export class Landing extends React.Component { return assets; } private renderInfoBoxes() { - const isSmallScreen = this.state.screenWidth === ScreenWidths.SM; + const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; const boxStyle: React.CSSProperties = { maxWidth: 252, height: 386, @@ -654,7 +654,7 @@ export class Landing extends React.Component { ); } private renderUseCases() { - const isSmallScreen = this.state.screenWidth === ScreenWidths.SM; + const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; const useCases: UseCase[] = [ { @@ -765,7 +765,7 @@ export class Landing extends React.Component { ); } private renderCallToAction() { - const isSmallScreen = this.state.screenWidth === ScreenWidths.SM; + const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; const buttonLabelStyle: React.CSSProperties = { textTransform: 'none', fontSize: 15, diff --git a/packages/website/ts/redux/reducer.ts b/packages/website/ts/redux/reducer.ts index 43bdeaa83..ccf87ae18 100644 --- a/packages/website/ts/redux/reducer.ts +++ b/packages/website/ts/redux/reducer.ts @@ -87,7 +87,7 @@ const INITIAL_STATE: State = { // Shared flashMessage: undefined, - providerType: ProviderType.INJECTED, + providerType: ProviderType.Injected, injectedProviderName: '', }; diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index 58f44dd45..736aa866c 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -1,15 +1,6 @@ import BigNumber from 'bignumber.js'; import * as _ from 'lodash'; -// Utility function to create a K:V from a list of strings -// Adapted from: https://basarat.gitbooks.io/typescript/content/docs/types/literal-types.html -function strEnum(values: string[]): {[key: string]: string} { - return _.reduce(values, (result, key) => { - result[key] = key; - return result; - }, Object.create(null)); -} - export enum Side { Receive = 'RECEIVE', Deposit = 'DEPOSIT', @@ -229,23 +220,21 @@ export interface ContractEvent { export type InputErrMsg = React.ReactNode | string | undefined; export type ValidatedBigNumberCallback = (isValid: boolean, amount?: BigNumber) => void; -export const ScreenWidths = strEnum([ - 'SM', - 'MD', - 'LG', -]); -export type ScreenWidths = keyof typeof ScreenWidths; +export enum ScreenWidths { + Sm = 'SM', + Md = 'MD', + Lg = 'LG', +} export enum AlertTypes { ERROR, SUCCESS, } -export const EtherscanLinkSuffixes = strEnum([ - 'address', - 'tx', -]); -export type EtherscanLinkSuffixes = keyof typeof EtherscanLinkSuffixes; +export enum EtherscanLinkSuffixes { + Address = 'address', + Tx = 'tx', +} export enum BlockchainErrs { AContractNotDeployedOnNetwork = 'A_CONTRACT_NOT_DEPLOYED_ON_NETWORK', @@ -253,26 +242,25 @@ export enum BlockchainErrs { NoError = 'NO_ERROR', } -export const BlockchainCallErrs = strEnum([ - 'CONTRACT_DOES_NOT_EXIST', - 'USER_HAS_NO_ASSOCIATED_ADDRESSES', - 'UNHANDLED_ERROR', - 'TOKEN_ADDRESS_IS_INVALID', - 'INVALID_SIGNATURE', -]); -export type BlockchainCallErrs = keyof typeof BlockchainCallErrs; - -export const KindString = strEnum([ - 'Constructor', - 'Property', - 'Method', - 'Interface', - 'Type alias', - 'Variable', - 'Function', - 'Enumeration', -]); -export type KindString = keyof typeof KindString; +export enum BlockchainCallErrs { + ContractDoesNotExist = 'CONTRACT_DOES_NOT_EXIST', + UserHasNoAssociatedAddresses = 'USER_HAS_NO_ASSOCIATED_ADDRESSES', + UnhandledError = 'UNHANDLED_ERROR', + TokenAddressIsInvalid = 'TOKEN_ADDRESS_IS_INVALID', +} + +// Exception: We don't make the values uppercase because these KindString's need to +// match up those returned by TypeDoc +export enum KindString { + Constructor = 'Constructor', + Property = 'Property', + Method = 'Method', + Interface = 'Interface', + TypeAlias = 'Type alias', + Variable = 'Variable', + Function = 'Function', + Enumeration = 'Enumeration', +} export interface EnumValue { name: string; @@ -468,11 +456,10 @@ export interface MenuSubsectionsBySection { [section: string]: string[]; } -export const ProviderType = strEnum([ - 'INJECTED', - 'LEDGER', -]); -export type ProviderType = keyof typeof ProviderType; +export enum ProviderType { + Injected = 'INJECTED', + Ledger = 'LEDGER', +} export interface Fact { title: string; diff --git a/packages/website/ts/utils/typedoc_utils.ts b/packages/website/ts/utils/typedoc_utils.ts index 9d3b9f8d7..ed8834a87 100644 --- a/packages/website/ts/utils/typedoc_utils.ts +++ b/packages/website/ts/utils/typedoc_utils.ts @@ -22,7 +22,7 @@ export const typeDocUtils = { isType(entity: TypeDocNode): boolean { return entity.kindString === KindString.Interface || entity.kindString === KindString.Function || - entity.kindString === KindString['Type alias'] || + entity.kindString === KindString.TypeAlias || entity.kindString === KindString.Variable || entity.kindString === KindString.Enumeration; }, @@ -126,7 +126,7 @@ export const typeDocUtils = { case KindString.Function: case KindString.Variable: case KindString.Enumeration: - case KindString['Type alias']: + case KindString.TypeAlias: if (docsInfo.isPublicType(entity.name)) { const customType = typeDocUtils._convertCustomType( entity, docsInfo.sections, sectionName, docsInfo.subPackageName); diff --git a/packages/website/ts/utils/utils.ts b/packages/website/ts/utils/utils.ts index a6f80c2ab..211a56d45 100644 --- a/packages/website/ts/utils/utils.ts +++ b/packages/website/ts/utils/utils.ts @@ -124,11 +124,11 @@ export const utils = { // This logic mirrors the CSS media queries in BassCSS for the `lg-`, `md-` and `sm-` CSS // class prefixes. Do not edit these. if (widthInEm > LG_MIN_EM) { - return ScreenWidths.LG; + return ScreenWidths.Lg; } else if (widthInEm > MD_MIN_EM) { - return ScreenWidths.MD; + return ScreenWidths.Md; } else { - return ScreenWidths.SM; + return ScreenWidths.Sm; } }, isUserOnMobile(): boolean { -- cgit v1.2.3 From 0578116f1dbe89a5b3c0c7e5f45948a1434b07b3 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 17 Dec 2017 20:51:54 -0500 Subject: Fix unhoverable help tooltip by renaming `Trade Permissions` to `Allowance` --- packages/website/ts/components/token_balances.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx index 5338e9609..b111e1ec6 100644 --- a/packages/website/ts/components/token_balances.tsx +++ b/packages/website/ts/components/token_balances.tsx @@ -164,7 +164,7 @@ export class TokenBalances extends React.Component @@ -302,7 +302,7 @@ export class TokenBalances extends React.Component Balance -
{!isSmallScreen && 'Trade '}Permissions
+
Allowance
Date: Sun, 17 Dec 2017 20:55:50 -0500 Subject: Use bigNumberConfigs from @0xproject/utils in website repo --- packages/website/ts/index.tsx | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx index 71565fa4d..69bb03dce 100644 --- a/packages/website/ts/index.tsx +++ b/packages/website/ts/index.tsx @@ -1,6 +1,7 @@ // Polyfills import 'whatwg-fetch'; +import {bigNumberConfigs} from '@0xproject/utils'; import BigNumber from 'bignumber.js'; import {colors, getMuiTheme, MuiThemeProvider} from 'material-ui/styles'; import * as React from 'react'; @@ -22,11 +23,7 @@ import {WebsitePaths} from 'ts/types'; import {constants} from 'ts/utils/constants'; injectTapEventPlugin(); -// By default BigNumber's `toString` method converts to exponential notation if the value has -// more then 20 digits. We want to avoid this behavior, so we set EXPONENTIAL_AT to a high number -BigNumber.config({ - EXPONENTIAL_AT: 1000, -}); +bigNumberConfigs.configure(); // Check if we've introduced an update that requires us to clear the tradeHistory local storage entries tradeHistoryStorage.clearIfRequired(); -- cgit v1.2.3 From 98c01c2f8097c849c53d87a4946edfd4fba94495 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 17 Dec 2017 20:57:39 -0500 Subject: Remove unused `location` prop --- packages/website/ts/components/footer.tsx | 4 +--- packages/website/ts/components/portal.tsx | 2 +- packages/website/ts/pages/about/about.tsx | 2 +- packages/website/ts/pages/faq/faq.tsx | 2 +- packages/website/ts/pages/landing/landing.tsx | 2 +- packages/website/ts/pages/not_found.tsx | 2 +- 6 files changed, 6 insertions(+), 8 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/footer.tsx b/packages/website/ts/components/footer.tsx index b26523094..7cd9128df 100644 --- a/packages/website/ts/components/footer.tsx +++ b/packages/website/ts/components/footer.tsx @@ -111,9 +111,7 @@ const titleToIcon: {[title: string]: string} = { 'Reddit': 'reddit.png', }; -export interface FooterProps { - location: Location; -} +export interface FooterProps {} interface FooterState {} diff --git a/packages/website/ts/components/portal.tsx b/packages/website/ts/components/portal.tsx index 74b1bdec6..439772288 100644 --- a/packages/website/ts/components/portal.tsx +++ b/packages/website/ts/components/portal.tsx @@ -224,7 +224,7 @@ export class Portal extends React.Component { flashMessage={this.props.flashMessage} />
-
+
); } diff --git a/packages/website/ts/pages/about/about.tsx b/packages/website/ts/pages/about/about.tsx index 011bbb9d9..6aeb4ae2d 100644 --- a/packages/website/ts/pages/about/about.tsx +++ b/packages/website/ts/pages/about/about.tsx @@ -226,7 +226,7 @@ export class About extends React.Component {
-
@@ -139,7 +139,7 @@ export class LedgerConfigDialog extends React.Component - {this.renderAddressTableRows()} + {this._renderAddressTableRows()}
@@ -151,7 +151,7 @@ export class LedgerConfigDialog extends React.Component
@@ -159,14 +159,14 @@ export class LedgerConfigDialog extends React.Component
); } - private renderAddressTableRows() { + private _renderAddressTableRows() { const rows = _.map(this.state.userAddresses, (userAddress: string, i: number) => { const balance = this.state.addressBalances[i]; const addressTooltipId = `address-${userAddress}`; @@ -201,14 +201,14 @@ export class LedgerConfigDialog extends React.Component { + private async _getUserAddressesAsync(): Promise { let userAddresses: string[]; userAddresses = await this.props.blockchain.getUserAccountsAsync(); diff --git a/packages/website/ts/components/dialogs/send_dialog.tsx b/packages/website/ts/components/dialogs/send_dialog.tsx index 0f3516993..9a85ea8b1 100644 --- a/packages/website/ts/components/dialogs/send_dialog.tsx +++ b/packages/website/ts/components/dialogs/send_dialog.tsx @@ -36,14 +36,14 @@ export class SendDialog extends React.Component, , ]; return ( @@ -53,17 +53,17 @@ export class SendDialog extends React.Component - {this.renderSendDialogBody()} + {this._renderSendDialogBody()}
); } - private renderSendDialogBody() { + private _renderSendDialogBody() { return (
); } - private onRecipientChange(recipient?: string) { + private _onRecipientChange(recipient?: string) { this.setState({ shouldShowIncompleteErrs: false, recipient, }); } - private onValueChange(isValid: boolean, amount?: BigNumber) { + private _onValueChange(isValid: boolean, amount?: BigNumber) { this.setState({ isAmountValid: isValid, value: amount, }); } - private onSendClick() { - if (this.hasErrors()) { + private _onSendClick() { + if (this._hasErrors()) { this.setState({ shouldShowIncompleteErrs: true, }); @@ -109,13 +109,13 @@ export class SendDialog extends React.Component, , ]} open={this.props.isOpen} @@ -64,7 +64,7 @@ export class TrackTokenConfirmationDialog extends ); } - private async onTrackConfirmationRespondedAsync(didUserAcceptTracking: boolean) { + private async _onTrackConfirmationRespondedAsync(didUserAcceptTracking: boolean) { if (!didUserAcceptTracking) { this.props.onToggleDialog(didUserAcceptTracking); return; diff --git a/packages/website/ts/components/eth_weth_conversion_button.tsx b/packages/website/ts/components/eth_weth_conversion_button.tsx index e802b8782..e94f46f22 100644 --- a/packages/website/ts/components/eth_weth_conversion_button.tsx +++ b/packages/website/ts/components/eth_weth_conversion_button.tsx @@ -59,13 +59,13 @@ export class EthWethConversionButton extends labelStyle={labelStyle} disabled={this.props.isDisabled || this.state.isEthConversionHappening} label={this.state.isEthConversionHappening ? inProgressLabel : callToActionLabel} - onClick={this.toggleConversionDialog.bind(this)} + onClick={this._toggleConversionDialog.bind(this)} /> ); } - private toggleConversionDialog() { + private _toggleConversionDialog() { this.setState({ isEthConversionDialogVisible: !this.state.isEthConversionDialogVisible, }); } - private async onConversionAmountSelectedAsync(direction: Side, value: BigNumber) { + private async _onConversionAmountSelectedAsync(direction: Side, value: BigNumber) { this.setState({ isEthConversionHappening: true, }); - this.toggleConversionDialog(); + this._toggleConversionDialog(); const token = this.props.ethToken; const tokenState = this.props.ethTokenState; let balance = tokenState.balance; diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx index bdd4664e8..934df9176 100644 --- a/packages/website/ts/components/eth_wrappers.tsx +++ b/packages/website/ts/components/eth_wrappers.tsx @@ -61,7 +61,7 @@ interface EthWrappersState { export class EthWrappers extends React.Component { constructor(props: EthWrappersProps) { super(props); - const outdatedWETHAddresses = this.getOutdatedWETHAddresses(); + const outdatedWETHAddresses = this._getOutdatedWETHAddresses(); const outdatedWETHAddressToIsStateLoaded: OutdatedWETHAddressToIsStateLoaded = {}; const outdatedWETHStateByAddress: OutdatedWETHStateByAddress = {}; _.each(outdatedWETHAddresses, outdatedWETHAddress => { @@ -79,7 +79,7 @@ export class EthWrappers extends React.Component
@@ -125,7 +125,7 @@ export class EthWrappers extends React.ComponentETH Token Balance - {this.renderActionColumnTitle(isBidirectional)} + {this._renderActionColumnTitle(isBidirectional)} @@ -162,7 +162,7 @@ export class EthWrappers extends React.Component - {this.renderTokenLink(tokenLabel, etherscanUrl)} + {this._renderTokenLink(tokenLabel, etherscanUrl)} {wethBalance.toFixed(PRECISION)} WETH @@ -207,12 +207,12 @@ export class EthWrappers extends React.ComponentWETH Version Balance - {this.renderActionColumnTitle(!isBidirectional)} + {this._renderActionColumnTitle(!isBidirectional)} - {this.renderOutdatedWeths(etherToken, etherTokenState)} + {this._renderOutdatedWeths(etherToken, etherTokenState)}
@@ -220,7 +220,7 @@ export class EthWrappers extends React.Component ); } - private renderActionColumnTitle(isBidirectional: boolean) { + private _renderActionColumnTitle(isBidirectional: boolean) { let iconClass = 'zmdi-long-arrow-right'; let leftSymbol = 'WETH'; let rightSymbol = 'ETH'; @@ -242,7 +242,7 @@ export class EthWrappers extends React.Component ); } - private renderOutdatedWeths(etherToken: Token, etherTokenState: TokenState) { + private _renderOutdatedWeths(etherToken: Token, etherTokenState: TokenState) { const rows = _.map(configs.OUTDATED_WRAPPED_ETHERS, (outdatedWETHByNetworkId: OutdatedWrappedEtherByNetworkId) => { const outdatedWETHIfExists = outdatedWETHByNetworkId[this.props.networkId]; @@ -269,17 +269,17 @@ export class EthWrappers extends React.Component - {this.renderTokenLink(tokenLabel, etherscanUrl)} + {this._renderTokenLink(tokenLabel, etherscanUrl)} {isStateLoaded ? @@ -305,7 +305,7 @@ export class EthWrappers extends React.Component {_.isUndefined(etherscanUrl) ? @@ -317,7 +317,7 @@ export class EthWrappers extends React.Component ); } - private renderToken(name: string, address: string, imgPath: string) { + private _renderToken(name: string, address: string, imgPath: string) { const tooltipId = `tooltip-${address}`; return (
@@ -340,7 +340,7 @@ export class EthWrappers extends React.Component ); } - private async onOutdatedConversionSuccessfulAsync(outdatedWETHAddress: string) { + private async _onOutdatedConversionSuccessfulAsync(outdatedWETHAddress: string) { this.setState({ outdatedWETHAddressToIsStateLoaded: { ...this.state.outdatedWETHAddressToIsStateLoaded, @@ -364,8 +364,8 @@ export class EthWrappers extends React.Component { const outdatedWrappedEtherIfExists = outdatedWrappedEtherByNetwork[this.props.networkId]; diff --git a/packages/website/ts/components/fill_order.tsx b/packages/website/ts/components/fill_order.tsx index ac826fdf6..c8c9cc0d8 100644 --- a/packages/website/ts/components/fill_order.tsx +++ b/packages/website/ts/components/fill_order.tsx @@ -66,7 +66,7 @@ interface FillOrderState { } export class FillOrder extends React.Component { - private validator: SchemaValidator; + private _validator: SchemaValidator; constructor(props: FillOrderProps) { super(props); this.state = { @@ -87,12 +87,12 @@ export class FillOrder extends React.Component { isConfirmingTokenTracking: false, tokensToTrack: [], }; - this.validator = new SchemaValidator(); + this._validator = new SchemaValidator(); } public componentWillMount() { if (!_.isEmpty(this.state.orderJSON)) { // tslint:disable-next-line:no-floating-promises - this.validateFillOrderFireAndForgetAsync(this.state.orderJSON); + this._validateFillOrderFireAndForgetAsync(this.state.orderJSON); } } public componentDidMount() { @@ -115,15 +115,15 @@ export class FillOrder extends React.Component { tokenByAddress={this.props.tokenByAddress} networkId={this.props.networkId} orderJSON={this.state.orderJSON} - onFillOrderJSONChanged={this.onFillOrderJSONChanged.bind(this)} + onFillOrderJSONChanged={this._onFillOrderJSONChanged.bind(this)} /> - {this.renderOrderJsonNotices()} + {this._renderOrderJsonNotices()}
}
{!_.isUndefined(this.state.parsedOrder) && this.state.didOrderValidationRun && this.state.areAllInvolvedTokensTracked && - this.renderVisualOrder() + this._renderVisualOrder() }
{this.props.isOrderInUrl && @@ -140,17 +140,17 @@ export class FillOrder extends React.Component { tokenByAddress={this.props.tokenByAddress} networkId={this.props.networkId} orderJSON={this.state.orderJSON} - onFillOrderJSONChanged={this.onFillOrderJSONChanged.bind(this)} + onFillOrderJSONChanged={this._onFillOrderJSONChanged.bind(this)} /> - {this.renderOrderJsonNotices()} + {this._renderOrderJsonNotices()}
}
{ dispatcher={this.props.dispatcher} tokens={this.state.tokensToTrack} isOpen={this.state.isConfirmingTokenTracking} - onToggleDialog={this.onToggleTrackConfirmDialog.bind(this)} + onToggleDialog={this._onToggleTrackConfirmDialog.bind(this)} />
); } - private renderOrderJsonNotices() { + private _renderOrderJsonNotices() { return (
{!_.isUndefined(this.props.initialOrder) && !this.state.didOrderValidationRun && @@ -182,7 +182,7 @@ export class FillOrder extends React.Component {
); } - private renderVisualOrder() { + private _renderVisualOrder() { const takerTokenAddress = this.state.parsedOrder.taker.token.address; const takerToken = this.props.tokenByAddress[takerTokenAddress]; const orderTakerAmount = new BigNumber(this.state.parsedOrder.taker.amount); @@ -211,7 +211,7 @@ export class FillOrder extends React.Component { let orderReceiveAmount = 0; if (!_.isUndefined(this.props.orderFillAmount)) { const orderReceiveAmountBigNumber = exchangeRate.mul(this.props.orderFillAmount); - orderReceiveAmount = this.formatCurrencyAmount(orderReceiveAmountBigNumber, makerToken.decimals); + orderReceiveAmount = this._formatCurrencyAmount(orderReceiveAmountBigNumber, makerToken.decimals); } const isUserMaker = !_.isUndefined(this.state.parsedOrder) && this.state.parsedOrder.maker.address === this.props.userAddress; @@ -261,7 +261,7 @@ export class FillOrder extends React.Component {
{ style={{width: '100%'}} disabled={this.state.isCancelling} label={this.state.isCancelling ? 'Cancelling order...' : 'Cancel order'} - onClick={this.onCancelOrderClickFireAndForgetAsync.bind(this)} + onClick={this._onCancelOrderClickFireAndForgetAsync.bind(this)} /> {this.state.didCancelOrderSucceed && }
: @@ -298,7 +298,7 @@ export class FillOrder extends React.Component { style={{width: '100%'}} disabled={this.state.isFilling} label={this.state.isFilling ? 'Filling order...' : 'Fill order'} - onClick={this.onFillOrderClick.bind(this)} + onClick={this._onFillOrderClick.bind(this)} /> {!_.isEmpty(this.state.globalErrMsg) && @@ -306,7 +306,7 @@ export class FillOrder extends React.Component { {this.state.didFillOrderSucceed && } @@ -315,7 +315,7 @@ export class FillOrder extends React.Component { ); } - private renderFillSuccessMsg() { + private _renderFillSuccessMsg() { return (
Order successfully filled. See the trade details in your{' '} @@ -328,45 +328,45 @@ export class FillOrder extends React.Component {
); } - private renderCancelSuccessMsg() { + private _renderCancelSuccessMsg() { return (
Order successfully cancelled.
); } - private onFillOrderClick() { + private _onFillOrderClick() { if (!this.state.isMakerTokenAddressInRegistry || !this.state.isTakerTokenAddressInRegistry) { this.setState({ isFillWarningDialogOpen: true, }); } else { // tslint:disable-next-line:no-floating-promises - this.onFillOrderClickFireAndForgetAsync(); + this._onFillOrderClickFireAndForgetAsync(); } } - private onFillWarningClosed(didUserCancel: boolean) { + private _onFillWarningClosed(didUserCancel: boolean) { this.setState({ isFillWarningDialogOpen: false, }); if (!didUserCancel) { // tslint:disable-next-line:no-floating-promises - this.onFillOrderClickFireAndForgetAsync(); + this._onFillOrderClickFireAndForgetAsync(); } } - private onFillAmountChange(isValid: boolean, amount?: BigNumber) { + private _onFillAmountChange(isValid: boolean, amount?: BigNumber) { this.props.dispatcher.updateOrderFillAmount(amount); } - private onFillOrderJSONChanged(event: any) { + private _onFillOrderJSONChanged(event: any) { const orderJSON = event.target.value; this.setState({ didOrderValidationRun: _.isEmpty(orderJSON) && _.isEmpty(this.state.orderJSONErrMsg), didFillOrderSucceed: false, }); // tslint:disable-next-line:no-floating-promises - this.validateFillOrderFireAndForgetAsync(orderJSON); + this._validateFillOrderFireAndForgetAsync(orderJSON); } - private async checkForUntrackedTokensAndAskToAdd() { + private async _checkForUntrackedTokensAndAskToAdd() { if (!_.isEmpty(this.state.orderJSONErrMsg)) { return; } @@ -410,12 +410,12 @@ export class FillOrder extends React.Component { }); } } - private async validateFillOrderFireAndForgetAsync(orderJSON: string) { + private async _validateFillOrderFireAndForgetAsync(orderJSON: string) { let orderJSONErrMsg = ''; let parsedOrder: Order; try { const order = JSON.parse(orderJSON); - const validationResult = this.validator.validate(order, orderSchema); + const validationResult = this._validator.validate(order, orderSchema); if (validationResult.errors.length > 0) { orderJSONErrMsg = 'Submitted order JSON is not a valid order'; utils.consoleLog(`Unexpected order JSON validation error: ${validationResult.errors.join(', ')}`); @@ -508,9 +508,9 @@ export class FillOrder extends React.Component { unavailableTakerAmount, }); - await this.checkForUntrackedTokensAndAskToAdd(); + await this._checkForUntrackedTokensAndAskToAdd(); } - private async onFillOrderClickFireAndForgetAsync(): Promise { + private async _onFillOrderClickFireAndForgetAsync(): Promise { if (!_.isEmpty(this.props.blockchainErr) || _.isEmpty(this.props.userAddress)) { this.props.dispatcher.updateShouldBlockchainErrDialogBeOpen(true); return; @@ -601,7 +601,7 @@ export class FillOrder extends React.Component { return; } } - private async onCancelOrderClickFireAndForgetAsync(): Promise { + private async _onCancelOrderClickFireAndForgetAsync(): Promise { if (!_.isEmpty(this.props.blockchainErr) || _.isEmpty(this.props.userAddress)) { this.props.dispatcher.updateShouldBlockchainErrDialogBeOpen(true); return; @@ -684,12 +684,12 @@ export class FillOrder extends React.Component { return; } } - private formatCurrencyAmount(amount: BigNumber, decimals: number): number { + private _formatCurrencyAmount(amount: BigNumber, decimals: number): number { const unitAmount = ZeroEx.toUnitAmount(amount, decimals); const roundedUnitAmount = Math.round(unitAmount.toNumber() * 100000) / 100000; return roundedUnitAmount; } - private onToggleTrackConfirmDialog(didConfirmTokenTracking: boolean) { + private _onToggleTrackConfirmDialog(didConfirmTokenTracking: boolean) { if (!didConfirmTokenTracking) { this.setState({ orderJSON: '', diff --git a/packages/website/ts/components/footer.tsx b/packages/website/ts/components/footer.tsx index 0f65405d9..4b9942276 100644 --- a/packages/website/ts/components/footer.tsx +++ b/packages/website/ts/components/footer.tsx @@ -133,20 +133,20 @@ export class Footer extends React.Component {
- {this.renderHeader(Sections.Documentation)} - {_.map(menuItemsBySection[Sections.Documentation], this.renderMenuItem.bind(this))} + {this._renderHeader(Sections.Documentation)} + {_.map(menuItemsBySection[Sections.Documentation], this._renderMenuItem.bind(this))}
- {this.renderHeader(Sections.Community)} - {_.map(menuItemsBySection[Sections.Community], this.renderMenuItem.bind(this))} + {this._renderHeader(Sections.Community)} + {_.map(menuItemsBySection[Sections.Community], this._renderMenuItem.bind(this))}
- {this.renderHeader(Sections.Organization)} - {_.map(menuItemsBySection[Sections.Organization], this.renderMenuItem.bind(this))} + {this._renderHeader(Sections.Organization)} + {_.map(menuItemsBySection[Sections.Organization], this._renderMenuItem.bind(this))}
@@ -154,14 +154,14 @@ export class Footer extends React.Component { ); } - private renderIcon(fileName: string) { + private _renderIcon(fileName: string) { return (
); } - private renderMenuItem(item: FooterMenuItem) { + private _renderMenuItem(item: FooterMenuItem) { const iconIfExists = titleToIcon[item.title]; return (
{
- {this.renderIcon(iconIfExists)} + {this._renderIcon(iconIfExists)}
{item.title}
@@ -196,7 +196,7 @@ export class Footer extends React.Component {
{!_.isUndefined(iconIfExists) &&
- {this.renderIcon(iconIfExists)} + {this._renderIcon(iconIfExists)}
} {item.title} @@ -206,7 +206,7 @@ export class Footer extends React.Component {
); } - private renderHeader(title: string) { + private _renderHeader(title: string) { const headerStyle = { textTransform: 'uppercase', color: colors.grey400, diff --git a/packages/website/ts/components/generate_order/asset_picker.tsx b/packages/website/ts/components/generate_order/asset_picker.tsx index 51edd2308..407070607 100644 --- a/packages/website/ts/components/generate_order/asset_picker.tsx +++ b/packages/website/ts/components/generate_order/asset_picker.tsx @@ -47,7 +47,7 @@ export class AssetPicker extends React.Component = { tokenVisibility: TokenVisibility.ALL, }; - private dialogConfigsByAssetView: {[assetView: string]: DialogConfigs}; + private _dialogConfigsByAssetView: {[assetView: string]: DialogConfigs}; constructor(props: AssetPickerProps) { super(props); this.state = { @@ -56,7 +56,7 @@ export class AssetPicker extends React.Component, , ], }, }; } public render() { - const dialogConfigs: DialogConfigs = this.dialogConfigsByAssetView[this.state.assetView]; + const dialogConfigs: DialogConfigs = this._dialogConfigsByAssetView[this.state.assetView]; return ( {this.state.assetView === AssetViews.ASSET_PICKER && - this.renderAssetPicker() + this._renderAssetPicker() } {this.state.assetView === AssetViews.NEW_TOKEN_FORM && } {this.state.assetView === AssetViews.CONFIRM_TRACK_TOKEN && - this.renderConfirmTrackToken() + this._renderConfirmTrackToken() } ); } - private renderConfirmTrackToken() { + private _renderConfirmTrackToken() { const token = this.props.tokenByAddress[this.state.chosenTrackTokenAddress]; return ( ); } - private renderAssetPicker() { + private _renderAssetPicker() { return (
- {this.renderGridTiles()} + {this._renderGridTiles()}
); } - private renderGridTiles() { + private _renderGridTiles() { let isHovered; let tileStyles; const gridTiles = _.map(this.props.tokenByAddress, (token: Token, address: string) => { @@ -151,9 +151,9 @@ export class AssetPicker extends React.Component
@@ -174,9 +174,9 @@ export class AssetPicker extends React.Component
{ - private validator: SchemaValidator; + private _validator: SchemaValidator; constructor(props: GenerateOrderFormProps) { super(props); this.state = { @@ -71,7 +71,7 @@ export class GenerateOrderForm extends React.Component
@@ -189,7 +189,7 @@ export class GenerateOrderForm extends React.Component
{this.state.globalErrMsg !== '' && @@ -202,7 +202,7 @@ export class GenerateOrderForm extends React.Component ); } - private onTokenAmountChange(token: Token, side: Side, isValid: boolean, amount?: BigNumber) { + private _onTokenAmountChange(token: Token, side: Side, isValid: boolean, amount?: BigNumber) { this.props.dispatcher.updateChosenAssetToken(side, {address: token.address, amount}); } - private onCloseOrderJSONDialog() { + private _onCloseOrderJSONDialog() { // Upon closing the order JSON dialog, we update the orderSalt stored in the Redux store // with a new value so that if a user signs the identical order again, the newly signed // orderHash will not collide with the previously generated orderHash. @@ -234,7 +234,7 @@ export class GenerateOrderForm extends React.Component { + private async _onSignClickedAsync(): Promise { if (this.props.blockchainErr !== BlockchainErrs.NoError) { this.props.dispatcher.updateShouldBlockchainErrDialogBeOpen(true); return false; @@ -249,7 +249,7 @@ export class GenerateOrderForm extends React.Component { + private async _signTransactionAsync(): Promise { this.setState({ signingState: SigningState.SIGNING, }); @@ -308,7 +308,7 @@ export class GenerateOrderForm extends React.Component 0) { globalErrMsg = 'Order signing failed. Please refresh and try again'; utils.consoleLog(`Unexpected error occured: Order validation failed: @@ -331,7 +331,7 @@ export class GenerateOrderForm extends React.Component} value={this.state.name} errorText={this.state.nameErrText} - onChange={this.onTokenNameChanged.bind(this)} + onChange={this._onTokenNameChanged.bind(this)} />
@@ -63,7 +63,7 @@ export class NewTokenForm extends React.Component} value={this.state.symbol} errorText={this.state.symbolErrText} - onChange={this.onTokenSymbolChanged.bind(this)} + onChange={this._onTokenSymbolChanged.bind(this)} />
@@ -72,7 +72,7 @@ export class NewTokenForm extends React.Component
@@ -82,7 +82,7 @@ export class NewTokenForm extends React.Component} value={this.state.decimals} errorText={this.state.decimalsErrText} - onChange={this.onTokenDecimalsChanged.bind(this)} + onChange={this._onTokenDecimalsChanged.bind(this)} />
@@ -90,7 +90,7 @@ export class NewTokenForm extends React.Component
{this.state.globalErrMsg !== '' && @@ -99,11 +99,11 @@ export class NewTokenForm extends React.Component ); } - private async onAddNewTokenClickAsync() { + private async _onAddNewTokenClickAsync() { // Trigger validation of name and symbol - this.onTokenNameChanged(undefined, this.state.name); - this.onTokenSymbolChanged(undefined, this.state.symbol); - this.onTokenDecimalsChanged(undefined, this.state.decimals); + this._onTokenNameChanged(undefined, this.state.name); + this._onTokenSymbolChanged(undefined, this.state.symbol); + this._onTokenDecimalsChanged(undefined, this.state.decimals); const isAddressIncomplete = this.state.address === ''; let doesContractExist = false; @@ -160,7 +160,7 @@ export class NewTokenForm extends React.Component maxLength) { nameErrText = `Max length is ${maxLength}`; @@ -181,14 +181,14 @@ export class NewTokenForm extends React.Component maxLength) { symbolErrText = `Max length is ${maxLength}`; @@ -201,12 +201,12 @@ export class NewTokenForm extends React.Component maxLength) { decimalsErrText = `Max length is ${maxLength}`; @@ -217,20 +217,20 @@ export class NewTokenForm extends React.Component
); } - private onOrderTakerAddressUpdated(e: any) { + private _onOrderTakerAddressUpdated(e: any) { const address = e.target.value.toLowerCase(); const isValidAddress = addressUtils.isAddress(address) || address === ''; const errMsg = isValidAddress ? '' : 'Invalid ethereum address'; diff --git a/packages/website/ts/components/inputs/allowance_toggle.tsx b/packages/website/ts/components/inputs/allowance_toggle.tsx index 4c15ed4a0..9bd015d04 100644 --- a/packages/website/ts/components/inputs/allowance_toggle.tsx +++ b/packages/website/ts/components/inputs/allowance_toggle.tsx @@ -46,8 +46,8 @@ export class AllowanceToggle extends React.Component
{this.state.isSpinnerVisible && @@ -58,7 +58,7 @@ export class AllowanceToggle extends React.Component ); } - private async onToggleAllowanceAsync() { + private async _onToggleAllowanceAsync() { if (this.props.userAddress === '') { this.props.dispatcher.updateShouldBlockchainErrDialogBeOpen(true); return false; @@ -69,7 +69,7 @@ export class AllowanceToggle extends React.Componentamount} - onChange={this.onValueChange.bind(this)} + onChange={this._onValueChange.bind(this)} underlineStyle={{width: 'calc(100% + 50px)'}} /> ); } - private onValueChange(e: any, amountString: string) { - const errMsg = this.validate(amountString, this.props.balance); + private _onValueChange(e: any, amountString: string) { + const errMsg = this._validate(amountString, this.props.balance); this.setState({ amountString, errMsg, @@ -106,7 +106,7 @@ export class BalanceBoundedInput extends } }); } - private validate(amountString: string, balance: BigNumber): InputErrMsg { + private _validate(amountString: string, balance: BigNumber): InputErrMsg { if (!utils.isNumeric(amountString)) { return amountString !== '' ? 'Must be a number' : ''; } @@ -118,14 +118,14 @@ export class BalanceBoundedInput extends return ( Insufficient balance.{' '} - {this.renderIncreaseBalanceLink()} + {this._renderIncreaseBalanceLink()} ); } const errMsg = _.isUndefined(this.props.validate) ? undefined : this.props.validate(amount); return errMsg; } - private renderIncreaseBalanceLink() { + private _renderIncreaseBalanceLink() { if (this.props.shouldHideVisitBalancesLink) { return null; } diff --git a/packages/website/ts/components/inputs/eth_amount_input.tsx b/packages/website/ts/components/inputs/eth_amount_input.tsx index 3dcd2b4f3..da5bc9805 100644 --- a/packages/website/ts/components/inputs/eth_amount_input.tsx +++ b/packages/website/ts/components/inputs/eth_amount_input.tsx @@ -30,7 +30,7 @@ export class EthAmountInput extends React.Component ); } - private onChange(isValid: boolean, amount?: BigNumber) { + private _onChange(isValid: boolean, amount?: BigNumber) { const baseUnitAmountIfExists = _.isUndefined(amount) ? undefined : ZeroEx.toBaseUnitAmount(amount, constants.DECIMAL_PLACES_ETH); diff --git a/packages/website/ts/components/inputs/expiration_input.tsx b/packages/website/ts/components/inputs/expiration_input.tsx index d3d3d258d..fe471e39b 100644 --- a/packages/website/ts/components/inputs/expiration_input.tsx +++ b/packages/website/ts/components/inputs/expiration_input.tsx @@ -17,11 +17,11 @@ interface ExpirationInputState { } export class ExpirationInput extends React.Component { - private earliestPickableMoment: moment.Moment; + private _earliestPickableMoment: moment.Moment; constructor(props: ExpirationInputProps) { super(props); // Set the earliest pickable date to today at 00:00, so users can only pick the current or later dates - this.earliestPickableMoment = moment().startOf('day'); + this._earliestPickableMoment = moment().startOf('day'); const expirationMoment = utils.convertToMomentFromUnixTimestamp(props.orderExpiryTimestamp); const initialOrderExpiryTimestamp = utils.initialOrderExpiryUnixTimestampSec(); const didUserSetExpiry = !initialOrderExpiryTimestamp.eq(props.orderExpiryTimestamp); @@ -42,8 +42,8 @@ export class ExpirationInput extends React.Component
@@ -77,10 +77,10 @@ export class ExpirationInput extends React.Component ); } - private shouldDisableDate(date: Date): boolean { - return moment(date).startOf('day').isBefore(this.earliestPickableMoment); + private _shouldDisableDate(date: Date): boolean { + return moment(date).startOf('day').isBefore(this._earliestPickableMoment); } - private clearDates() { + private _clearDates() { this.setState({ dateMoment: undefined, timeMoment: undefined, @@ -88,7 +88,7 @@ export class ExpirationInput extends React.Component { public render() { - const msgHashHex = this.props.blockchainIsLoaded ? this.generateMessageHashHex() : ''; + const msgHashHex = this.props.blockchainIsLoaded ? this._generateMessageHashHex() : ''; return (
@@ -43,7 +43,7 @@ export class HashInput extends React.Component {
); } - private generateMessageHashHex() { + private _generateMessageHashHex() { const exchangeContractAddress = this.props.blockchain.getExchangeContractAddressIfExists(); const hashData = this.props.hashData; const order: Order = { diff --git a/packages/website/ts/components/inputs/identicon_address_input.tsx b/packages/website/ts/components/inputs/identicon_address_input.tsx index 9e4bc58ea..0f220f955 100644 --- a/packages/website/ts/components/inputs/identicon_address_input.tsx +++ b/packages/website/ts/components/inputs/identicon_address_input.tsx @@ -38,14 +38,14 @@ export class IdenticonAddressInput extends React.Component
); } - private updateAddress(address?: string): void { + private _updateAddress(address?: string): void { this.setState({ address, }); diff --git a/packages/website/ts/components/inputs/token_amount_input.tsx b/packages/website/ts/components/inputs/token_amount_input.tsx index c9728dc5f..84117e843 100644 --- a/packages/website/ts/components/inputs/token_amount_input.tsx +++ b/packages/website/ts/components/inputs/token_amount_input.tsx @@ -33,8 +33,8 @@ export class TokenAmountInput extends React.Component ); } - private onChange(isValid: boolean, amount?: BigNumber) { + private _onChange(isValid: boolean, amount?: BigNumber) { let baseUnitAmount; if (!_.isUndefined(amount)) { baseUnitAmount = ZeroEx.toBaseUnitAmount(amount, this.props.token.decimals); } this.props.onChange(isValid, baseUnitAmount); } - private validate(amount: BigNumber): InputErrMsg { + private _validate(amount: BigNumber): InputErrMsg { if (this.props.shouldCheckAllowance && amount.gt(this.props.tokenState.allowance)) { return ( diff --git a/packages/website/ts/components/inputs/token_input.tsx b/packages/website/ts/components/inputs/token_input.tsx index 7008da12f..ba348dade 100644 --- a/packages/website/ts/components/inputs/token_input.tsx +++ b/packages/website/ts/components/inputs/token_input.tsx @@ -52,9 +52,9 @@ export class TokenInput extends React.Component
); } - private onTokenChosen(tokenAddress: string) { + private _onTokenChosen(tokenAddress: string) { const assetToken: AssetToken = { address: tokenAddress, amount: this.props.assetToken.amount, @@ -89,12 +89,12 @@ export class TokenInput extends React.Component { shareLink: '', }; // tslint:disable-next-line:no-floating-promises - this.setShareLinkAsync(); + this._setShareLinkAsync(); } public render() { const order = utils.generateOrder(this.props.networkId, this.props.exchangeContractIfExists, @@ -88,21 +88,21 @@ export class OrderJSON extends React.Component {
@@ -111,32 +111,32 @@ export class OrderJSON extends React.Component {
); } - private async shareViaTwitterAsync() { + private async _shareViaTwitterAsync() { const tweetText = encodeURIComponent(`Fill my order using the 0x protocol: ${this.state.shareLink}`); window.open(`https://twitter.com/intent/tweet?text=${tweetText}`, 'Share your order', 'width=500,height=400'); } - private async shareViaFacebook() { + private async _shareViaFacebook() { (window as any).FB.ui({ display: 'popup', href: this.state.shareLink, method: 'share', }, _.noop); } - private async shareViaEmailAsync() { + private async _shareViaEmailAsync() { const encodedSubject = encodeURIComponent('Let\'s trade using the 0x protocol'); const encodedBody = encodeURIComponent(`I generated an order with the 0x protocol. You can see and fill it here: ${this.state.shareLink}`); const mailToLink = `mailto:mail@example.org?subject=${encodedSubject}&body=${encodedBody}`; window.open(mailToLink, '_blank'); } - private async setShareLinkAsync() { - const shareLink = await this.generateShareLinkAsync(); + private async _setShareLinkAsync() { + const shareLink = await this._generateShareLinkAsync(); this.setState({ shareLink, }); } - private async generateShareLinkAsync(): Promise { - const longUrl = encodeURIComponent(this.getOrderUrl()); + private async _generateShareLinkAsync(): Promise { + const longUrl = encodeURIComponent(this._getOrderUrl()); const bitlyRequestUrl = `${constants.URL_BITLY_API}/v3/shorten?access_token=${configs.BITLY_ACCESS_TOKEN}&longUrl=${longUrl}`; const response = await fetch(bitlyRequestUrl); @@ -150,7 +150,7 @@ You can see and fill it here: ${this.state.shareLink}`); } return (bodyObj).data.url; } - private getOrderUrl() { + private _getOrderUrl() { const order = utils.generateOrder(this.props.networkId, this.props.exchangeContractIfExists, this.props.sideToAssetToken, this.props.orderExpiryTimestamp, this.props.orderTakerAddress, this.props.orderMakerAddress, this.props.orderMakerFee, this.props.orderTakerFee, diff --git a/packages/website/ts/components/portal.tsx b/packages/website/ts/components/portal.tsx index 939dae6f7..574862dfc 100644 --- a/packages/website/ts/components/portal.tsx +++ b/packages/website/ts/components/portal.tsx @@ -70,9 +70,9 @@ interface PortalAllState { } export class Portal extends React.Component { - private blockchain: Blockchain; - private sharedOrderIfExists: Order; - private throttledScreenWidthUpdate: () => void; + private _blockchain: Blockchain; + private _sharedOrderIfExists: Order; + private _throttledScreenWidthUpdate: () => void; public static hasAlreadyDismissedWethNotice() { const didDismissWethNotice = localStorage.getItemIfExists(constants.LOCAL_STORAGE_KEY_DISMISS_WETH_NOTICE); const hasAlreadyDismissedWethNotice = !_.isUndefined(didDismissWethNotice) && @@ -81,8 +81,8 @@ export class Portal extends React.Component { } constructor(props: PortalAllProps) { super(props); - this.sharedOrderIfExists = this.getSharedOrderIfExists(); - this.throttledScreenWidthUpdate = _.throttle(this.updateScreenWidth.bind(this), THROTTLE_TIMEOUT); + this._sharedOrderIfExists = this._getSharedOrderIfExists(); + this._throttledScreenWidthUpdate = _.throttle(this._updateScreenWidth.bind(this), THROTTLE_TIMEOUT); const isViewingBalances = _.includes(props.location.pathname, `${WebsitePaths.Portal}/balances`); const hasAlreadyDismissedWethNotice = Portal.hasAlreadyDismissedWethNotice(); @@ -100,15 +100,15 @@ export class Portal extends React.Component { }; } public componentDidMount() { - window.addEventListener('resize', this.throttledScreenWidthUpdate); + window.addEventListener('resize', this._throttledScreenWidthUpdate); window.scrollTo(0, 0); } public componentWillMount() { - this.blockchain = new Blockchain(this.props.dispatcher); + this._blockchain = new Blockchain(this.props.dispatcher); } public componentWillUnmount() { - this.blockchain.destroy(); - window.removeEventListener('resize', this.throttledScreenWidthUpdate); + this._blockchain.destroy(); + window.removeEventListener('resize', this._throttledScreenWidthUpdate); // 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 @@ -118,19 +118,19 @@ export class Portal extends React.Component { public componentWillReceiveProps(nextProps: PortalAllProps) { if (nextProps.networkId !== this.state.prevNetworkId) { // tslint:disable-next-line:no-floating-promises - this.blockchain.networkIdUpdatedFireAndForgetAsync(nextProps.networkId); + this._blockchain.networkIdUpdatedFireAndForgetAsync(nextProps.networkId); this.setState({ prevNetworkId: nextProps.networkId, }); } if (nextProps.userAddress !== this.state.prevUserAddress) { // tslint:disable-next-line:no-floating-promises - this.blockchain.userAddressUpdatedFireAndForgetAsync(nextProps.userAddress); + this._blockchain.userAddressUpdatedFireAndForgetAsync(nextProps.userAddress); if (!_.isEmpty(nextProps.userAddress) && nextProps.blockchainIsLoaded) { const tokens = _.values(nextProps.tokenByAddress); // tslint:disable-next-line:no-floating-promises - this.updateBalanceAndAllowanceWithLoadingScreenAsync(tokens); + this._updateBalanceAndAllowanceWithLoadingScreenAsync(tokens); } this.setState({ prevUserAddress: nextProps.userAddress, @@ -138,7 +138,7 @@ export class Portal extends React.Component { } if (nextProps.nodeVersion !== this.state.prevNodeVersion) { // tslint:disable-next-line:no-floating-promises - this.blockchain.nodeVersionUpdatedFireAndForgetAsync(nextProps.nodeVersion); + this._blockchain.nodeVersionUpdatedFireAndForgetAsync(nextProps.nodeVersion); } if (nextProps.location.pathname !== this.state.prevPathname) { const isViewingBalances = _.includes(nextProps.location.pathname, `${WebsitePaths.Portal}/balances`); @@ -206,23 +206,23 @@ export class Portal extends React.Component { : @@ -233,7 +233,7 @@ export class Portal extends React.Component { } { /> { ); } - private renderEthWrapper() { + private _renderEthWrapper() { return ( { /> ); } - private renderTradeHistory() { + private _renderTradeHistory() { return ( { /> ); } - private renderTokenBalances() { + private _renderTokenBalances() { return ( { /> ); } - private renderFillOrder(match: any, location: Location, history: History) { + private _renderFillOrder(match: any, location: Location, history: History) { const initialFillOrder = !_.isUndefined(this.props.userSuppliedOrderCache) ? this.props.userSuppliedOrderCache : - this.sharedOrderIfExists; + this._sharedOrderIfExists; return ( { /> ); } - private renderGenerateOrderForm(match: any, location: Location, history: History) { + private _renderGenerateOrderForm(match: any, location: Location, history: History) { return ( ); } - private onPortalDisclaimerAccepted() { + private _onPortalDisclaimerAccepted() { localStorage.setItem(constants.LOCAL_STORAGE_KEY_ACCEPT_DISCLAIMER, 'set'); this.setState({ isDisclaimerDialogOpen: false, }); } - private onWethNoticeAccepted() { + private _onWethNoticeAccepted() { localStorage.setItem(constants.LOCAL_STORAGE_KEY_DISMISS_WETH_NOTICE, 'set'); this.setState({ isWethNoticeDialogOpen: false, }); } - private getSharedOrderIfExists(): Order { + private _getSharedOrderIfExists(): Order { const queryString = window.location.search; if (queryString.length === 0) { return; @@ -362,13 +362,13 @@ export class Portal extends React.Component { } return order; } - private updateScreenWidth() { + private _updateScreenWidth() { const newScreenWidth = utils.getScreenWidth(); this.props.dispatcher.updateScreenWidth(newScreenWidth); } - private async updateBalanceAndAllowanceWithLoadingScreenAsync(tokens: Token[]) { + private async _updateBalanceAndAllowanceWithLoadingScreenAsync(tokens: Token[]) { this.props.dispatcher.updateBlockchainIsLoaded(false); - await this.blockchain.updateTokenBalancesAndAllowancesAsync(tokens); + await this._blockchain.updateTokenBalancesAndAllowancesAsync(tokens); this.props.dispatcher.updateBlockchainIsLoaded(true); } } diff --git a/packages/website/ts/components/portal_menu.tsx b/packages/website/ts/components/portal_menu.tsx index 822c4d0d7..a6125d842 100644 --- a/packages/website/ts/components/portal_menu.tsx +++ b/packages/website/ts/components/portal_menu.tsx @@ -23,7 +23,7 @@ export class PortalMenu extends React.Component - {this.renderMenuItemWithIcon('Generate order', 'zmdi-arrow-right-top')} + {this._renderMenuItemWithIcon('Generate order', 'zmdi-arrow-right-top')} - {this.renderMenuItemWithIcon('Fill order', 'zmdi-arrow-left-bottom')} + {this._renderMenuItemWithIcon('Fill order', 'zmdi-arrow-left-bottom')} - {this.renderMenuItemWithIcon('Balances', 'zmdi-balance-wallet')} + {this._renderMenuItemWithIcon('Balances', 'zmdi-balance-wallet')} - {this.renderMenuItemWithIcon('Trade history', 'zmdi-format-list-bulleted')} + {this._renderMenuItemWithIcon('Trade history', 'zmdi-format-list-bulleted')} - {this.renderMenuItemWithIcon('Wrap ETH', 'zmdi-circle-o')} + {this._renderMenuItemWithIcon('Wrap ETH', 'zmdi-circle-o')} ); } - private renderMenuItemWithIcon(title: string, iconName: string) { + private _renderMenuItemWithIcon(title: string, iconName: string) { return (
diff --git a/packages/website/ts/components/send_button.tsx b/packages/website/ts/components/send_button.tsx index 23e61e77e..30395c08e 100644 --- a/packages/website/ts/components/send_button.tsx +++ b/packages/website/ts/components/send_button.tsx @@ -39,28 +39,28 @@ export class SendButton extends React.Component
); } - private toggleSendDialog() { + private _toggleSendDialog() { this.setState({ isSendDialogVisible: !this.state.isSendDialogVisible, }); } - private async onSendAmountSelectedAsync(recipient: string, value: BigNumber) { + private async _onSendAmountSelectedAsync(recipient: string, value: BigNumber) { this.setState({ isSending: true, }); - this.toggleSendDialog(); + this._toggleSendDialog(); const token = this.props.token; const tokenState = this.props.tokenState; let balance = tokenState.balance; diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx index ab4b04868..695cb05d8 100644 --- a/packages/website/ts/components/token_balances.tsx +++ b/packages/website/ts/components/token_balances.tsx @@ -133,7 +133,7 @@ export class TokenBalances extends React.Component, ]; const dharmaDialogActions = [ @@ -141,7 +141,7 @@ export class TokenBalances extends React.Component, ]; const isTestNetwork = this.props.networkId === constants.NETWORK_ID_TESTNET; @@ -239,7 +239,7 @@ export class TokenBalances extends React.Component } @@ -249,7 +249,7 @@ export class TokenBalances extends React.Component } @@ -266,7 +266,7 @@ export class TokenBalances extends React.Component @@ -275,7 +275,7 @@ export class TokenBalances extends React.Component @@ -319,7 +319,7 @@ export class TokenBalances extends React.Component - {this.renderTokenTableRows()} + {this._renderTokenTableRows()} - {this.renderErrorDialogBody()} + {this._renderErrorDialogBody()} - {this.renderDharmaLoanFrame()} + {this._renderDharmaLoanFrame()}
); } - private renderTokenTableRows() { + private _renderTokenTableRows() { if (!this.props.blockchainIsLoaded || this.props.blockchainErr !== BlockchainErrs.NoError) { return ''; } @@ -372,11 +372,11 @@ export class TokenBalances extends React.Component {_.isUndefined(tokenLink) ? - this.renderTokenName(token) : + this._renderTokenName(token) : - {this.renderTokenName(token)} + {this._renderTokenName(token)} } - {this.renderAmount(tokenState.balance, token.decimals)} {token.symbol} + {this._renderAmount(tokenState.balance, token.decimals)} {token.symbol} {this.state.isZRXSpinnerVisible && token.symbol === ZRX_TOKEN_SYMBOL && @@ -408,7 +408,7 @@ export class TokenBalances extends React.Component @@ -420,7 +420,7 @@ export class TokenBalances extends React.ComponentMinting...} labelComplete="Minted!" - onClickAsyncFn={this.onMintTestTokensAsync.bind(this, token)} + onClickAsyncFn={this._onMintTestTokensAsync.bind(this, token)} /> } {token.symbol === ZRX_TOKEN_SYMBOL && this.props.networkId === constants.NETWORK_ID_TESTNET && @@ -428,7 +428,7 @@ export class TokenBalances extends React.Component } @@ -441,14 +441,14 @@ export class TokenBalances extends React.Component } ); } - private onAssetTokenPicked(tokenAddress: string) { + private _onAssetTokenPicked(tokenAddress: string) { if (_.isEmpty(tokenAddress)) { this.setState({ isTokenPickerOpen: false, @@ -477,16 +477,16 @@ export class TokenBalances extends React.Component @@ -502,7 +502,7 @@ export class TokenBalances extends React.Component ); } - private renderErrorDialogBody() { + private _renderErrorDialogBody() { switch (this.state.errorType) { case BalanceErrs.incorrectNetworkForFaucet: return ( @@ -550,7 +550,7 @@ export class TokenBalances extends React.Component @@ -568,12 +568,12 @@ export class TokenBalances extends React.Component { + private async _onMintTestTokensAsync(token: Token): Promise { try { await this.props.blockchain.mintTestTokensAsync(token); const amount = ZeroEx.toUnitAmount(constants.MINT_AMOUNT, token.decimals); @@ -597,7 +597,7 @@ export class TokenBalances extends React.Component { + private async _faucetRequestAsync(isEtherRequest: boolean): Promise { if (this.props.userAddress === '') { this.props.dispatcher.updateShouldBlockchainErrDialogBeOpen(true); return false; @@ -646,23 +646,23 @@ export class TokenBalances extends React.Component { , ]; - const bottomBorderStyle = this.shouldDisplayBottomBar() ? styles.bottomBar : {}; + const bottomBorderStyle = this._shouldDisplayBottomBar() ? styles.bottomBar : {}; const fullWidthClasses = isFullWidthPage ? 'pr4' : ''; const logoUrl = isNightVersion ? '/images/protocol_logo_white.png' : '/images/protocol_logo_black.png'; const menuClasses = `col col-${isFullWidthPage ? '4' : '5'} ${fullWidthClasses} lg-pr0 md-pr2 sm-hide xs-hide`; @@ -147,7 +147,7 @@ export class TopBar extends React.Component {
- {!this.isViewingPortal() && + {!this._isViewingPortal() &&
@@ -183,37 +183,37 @@ export class TopBar extends React.Component { } {this.props.blockchainIsLoaded && !_.isEmpty(this.props.userAddress) &&
- {this.renderUser()} + {this._renderUser()}
} - {!this.isViewingPortal() && + {!this._isViewingPortal() &&
}
- {this.renderDrawer()} + {this._renderDrawer()}
); } - private renderDrawer() { + private _renderDrawer() { return ( - {this.renderPortalMenu()} - {this.renderDocsMenu()} - {this.renderWiki()} + {this._renderPortalMenu()} + {this._renderDocsMenu()} + {this._renderWiki()}
Website
Home @@ -221,22 +221,22 @@ export class TopBar extends React.Component { Wiki - {!this.isViewing0xjsDocs() && + {!this._isViewing0xjsDocs() && 0x.js Docs } - {!this.isViewingConnectDocs() && + {!this._isViewingConnectDocs() && 0x Connect Docs } - {!this.isViewingSmartContractsDocs() && + {!this._isViewingSmartContractsDocs() && Smart Contract Docs } - {!this.isViewingPortal() && + {!this._isViewingPortal() && Portal DApp @@ -261,7 +261,7 @@ export class TopBar extends React.Component { FAQ @@ -269,8 +269,8 @@ export class TopBar extends React.Component { ); } - private renderDocsMenu() { - if (!this.isViewing0xjsDocs() && !this.isViewingSmartContractsDocs() && !this.isViewingConnectDocs() + private _renderDocsMenu() { + if (!this._isViewing0xjsDocs() && !this._isViewingSmartContractsDocs() && !this._isViewingConnectDocs() || _.isUndefined(this.props.menu)) { return; } @@ -283,7 +283,7 @@ export class TopBar extends React.Component { topLevelMenu={this.props.menu} menuSubsectionsBySection={this.props.menuSubsectionsBySection} shouldDisplaySectionHeaders={false} - onMenuItemClick={this.onMenuButtonClick.bind(this)} + onMenuItemClick={this._onMenuButtonClick.bind(this)} selectedVersion={this.props.docsVersion} docPath={this.props.docsInfo.websitePath} versions={this.props.availableDocVersions} @@ -291,8 +291,8 @@ export class TopBar extends React.Component {
); } - private renderWiki() { - if (!this.isViewingWiki()) { + private _renderWiki() { + if (!this._isViewingWiki()) { return; } @@ -303,13 +303,13 @@ export class TopBar extends React.Component { topLevelMenu={this.props.menuSubsectionsBySection} menuSubsectionsBySection={this.props.menuSubsectionsBySection} shouldDisplaySectionHeaders={false} - onMenuItemClick={this.onMenuButtonClick.bind(this)} + onMenuItemClick={this._onMenuButtonClick.bind(this)} /> ); } - private renderPortalMenu() { - if (!this.isViewingPortal()) { + private _renderPortalMenu() { + if (!this._isViewingPortal()) { return; } @@ -318,12 +318,12 @@ export class TopBar extends React.Component {
Portal DApp
); } - private renderUser() { + private _renderUser() { const userAddress = this.props.userAddress; const identiconDiameter = 26; return ( @@ -345,31 +345,31 @@ export class TopBar extends React.Component { ); } - private onMenuButtonClick() { + private _onMenuButtonClick() { this.setState({ isDrawerOpen: !this.state.isDrawerOpen, }); } - private isViewingPortal() { + private _isViewingPortal() { return _.includes(this.props.location.pathname, WebsitePaths.Portal); } - private isViewingFAQ() { + private _isViewingFAQ() { return _.includes(this.props.location.pathname, WebsitePaths.FAQ); } - private isViewing0xjsDocs() { + private _isViewing0xjsDocs() { return _.includes(this.props.location.pathname, WebsitePaths.ZeroExJs); } - private isViewingConnectDocs() { + private _isViewingConnectDocs() { return _.includes(this.props.location.pathname, WebsitePaths.Connect); } - private isViewingSmartContractsDocs() { + private _isViewingSmartContractsDocs() { return _.includes(this.props.location.pathname, WebsitePaths.SmartContracts); } - private isViewingWiki() { + private _isViewingWiki() { return _.includes(this.props.location.pathname, WebsitePaths.Wiki); } - private shouldDisplayBottomBar() { - return this.isViewingWiki() || this.isViewing0xjsDocs() || this.isViewingFAQ() || - this.isViewingSmartContractsDocs() || this.isViewingConnectDocs(); + private _shouldDisplayBottomBar() { + return this._isViewingWiki() || this._isViewing0xjsDocs() || this._isViewingFAQ() || + this._isViewingSmartContractsDocs() || this._isViewingConnectDocs(); } } diff --git a/packages/website/ts/components/trade_history/trade_history.tsx b/packages/website/ts/components/trade_history/trade_history.tsx index 59f85a03d..aa41b9392 100644 --- a/packages/website/ts/components/trade_history/trade_history.tsx +++ b/packages/website/ts/components/trade_history/trade_history.tsx @@ -20,19 +20,19 @@ interface TradeHistoryState { } export class TradeHistory extends React.Component { - private fillPollingIntervalId: number; + private _fillPollingIntervalId: number; public constructor(props: TradeHistoryProps) { super(props); - const sortedFills = this.getSortedFills(); + const sortedFills = this._getSortedFills(); this.state = { sortedFills, }; } public componentWillMount() { - this.startPollingForFills(); + this._startPollingForFills(); } public componentWillUnmount() { - this.stopPollingForFills(); + this._stopPollingForFills(); } public componentDidMount() { window.scrollTo(0, 0); @@ -43,15 +43,15 @@ export class TradeHistory extends React.ComponentTrade history
- {this.renderTrades()} + {this._renderTrades()}
); } - private renderTrades() { - const numNonCustomFills = this.numFillsWithoutCustomERC20Tokens(); + private _renderTrades() { + const numNonCustomFills = this._numFillsWithoutCustomERC20Tokens(); if (numNonCustomFills === 0) { - return this.renderEmptyNotice(); + return this._renderEmptyNotice(); } return _.map(this.state.sortedFills, (fill, index) => { @@ -66,14 +66,14 @@ export class TradeHistory extends React.Component No filled orders yet. ); } - private numFillsWithoutCustomERC20Tokens() { + private _numFillsWithoutCustomERC20Tokens() { let numNonCustomFills = 0; const tokens = _.values(this.props.tokenByAddress); _.each(this.state.sortedFills, fill => { @@ -93,9 +93,9 @@ export class TradeHistory extends React.Component { - const sortedFills = this.getSortedFills(); + private _startPollingForFills() { + this._fillPollingIntervalId = window.setInterval(() => { + const sortedFills = this._getSortedFills(); if (!utils.deepEqual(sortedFills, this.state.sortedFills)) { this.setState({ sortedFills, @@ -103,10 +103,10 @@ export class TradeHistory extends React.Component fill.blockTimestamp * -1]); diff --git a/packages/website/ts/components/trade_history/trade_history_item.tsx b/packages/website/ts/components/trade_history/trade_history_item.tsx index d2a334df9..3586a96a5 100644 --- a/packages/website/ts/components/trade_history/trade_history_item.tsx +++ b/packages/website/ts/components/trade_history/trade_history_item.tsx @@ -54,7 +54,7 @@ export class TradeHistoryItem extends React.Component ); } - private renderNetworkBadgesIfExists(sectionName: string) { + private _renderNetworkBadgesIfExists(sectionName: string) { const networkToAddressByContractName = configs.CONTRACT_ADDRESS[this.props.docsVersion]; const badges = _.map(networkToAddressByContractName, (addressByContractName: AddressByContractName, networkName: string) => { @@ -297,11 +297,11 @@ export class Documentation extends }); return badges; } - private renderConstructors(constructors: SolidityMethod[]|TypescriptMethod[], - sectionName: string, - typeDefinitionByName: TypeDefinitionByName): React.ReactNode { + private _renderConstructors(constructors: SolidityMethod[]|TypescriptMethod[], + sectionName: string, + typeDefinitionByName: TypeDefinitionByName): React.ReactNode { const constructorDefs = _.map(constructors, constructor => { - return this.renderMethodBlocks( + return this._renderMethodBlocks( constructor, sectionName, constructor.isConstructor, typeDefinitionByName, ); }); @@ -311,7 +311,7 @@ export class Documentation extends ); } - private renderProperty(property: Property): React.ReactNode { + private _renderProperty(property: Property): React.ReactNode { return (
); } - private renderMethodBlocks(method: SolidityMethod|TypescriptMethod, sectionName: string, - isConstructor: boolean, typeDefinitionByName: TypeDefinitionByName): React.ReactNode { + private _renderMethodBlocks(method: SolidityMethod|TypescriptMethod, sectionName: string, + isConstructor: boolean, typeDefinitionByName: TypeDefinitionByName): React.ReactNode { return ( ); } - private scrollToHash(): void { + private _scrollToHash(): void { const hashWithPrefix = this.props.location.hash; let hash = hashWithPrefix.slice(1); if (_.isEmpty(hash)) { @@ -358,7 +358,7 @@ export class Documentation extends scroller.scrollTo(hash, {duration: 0, offset: 0, containerId: 'documentation'}); } - private async fetchJSONDocsFireAndForgetAsync(preferredVersionIfExists?: string): Promise { + private async _fetchJSONDocsFireAndForgetAsync(preferredVersionIfExists?: string): Promise { const versionToFileName = await docUtils.getVersionToFileNameAsync(this.props.docsInfo.docsJsonRoot); const versions = _.keys(versionToFileName); this.props.dispatcher.updateAvailableDocVersions(versions); @@ -383,7 +383,7 @@ export class Documentation extends this.setState({ docAgnosticFormat, }, () => { - this.scrollToHash(); + this._scrollToHash(); }); } } diff --git a/packages/website/ts/pages/documentation/event_definition.tsx b/packages/website/ts/pages/documentation/event_definition.tsx index 695debf5b..3d1cc703a 100644 --- a/packages/website/ts/pages/documentation/event_definition.tsx +++ b/packages/website/ts/pages/documentation/event_definition.tsx @@ -29,8 +29,8 @@ export class EventDefinition extends React.Component 
                         
-                            {this.renderEventCode()}
+                            {this._renderEventCode()}
); } - private renderEventCode() { + private _renderEventCode() { const indexed = indexed; const eventArgs = _.map(this.props.event.eventArgs, (eventArg: EventArg) => { const type = ( @@ -76,7 +76,7 @@ export class EventDefinition extends React.Component ); } - private setAnchorVisibility(shouldShowAnchor: boolean) { + private _setAnchorVisibility(shouldShowAnchor: boolean) { this.setState({ shouldShowAnchor, }); diff --git a/packages/website/ts/pages/documentation/method_block.tsx b/packages/website/ts/pages/documentation/method_block.tsx index 5163e03ac..0eeb30a69 100644 --- a/packages/website/ts/pages/documentation/method_block.tsx +++ b/packages/website/ts/pages/documentation/method_block.tsx @@ -57,19 +57,19 @@ export class MethodBlock extends React.Component {!method.isConstructor &&
{(method as TypescriptMethod).isStatic && - this.renderChip('Static') + this._renderChip('Static') } {(method as SolidityMethod).isConstant && - this.renderChip('Constant') + this._renderChip('Constant') } {(method as SolidityMethod).isPayable && - this.renderChip('Payable') + this._renderChip('Payable') } ARGUMENTS - {this.renderParameterDescriptions(method.parameters)} + {this._renderParameterDescriptions(method.parameters)}
} {method.returnComment && @@ -127,7 +127,7 @@ export class MethodBlock extends React.Component ); } - private renderChip(text: string) { + private _renderChip(text: string) { return (
); } - private renderParameterDescriptions(parameters: Parameter[]) { + private _renderParameterDescriptions(parameters: Parameter[]) { const descriptions = _.map(parameters, parameter => { const isOptional = parameter.isOptional; return ( @@ -166,7 +166,7 @@ export class MethodBlock extends React.Component ); } - private setAnchorVisibility(shouldShowAnchor: boolean) { + private _setAnchorVisibility(shouldShowAnchor: boolean) { this.setState({ shouldShowAnchor, }); diff --git a/packages/website/ts/pages/faq/faq.tsx b/packages/website/ts/pages/faq/faq.tsx index 296e63f1d..c5afcb79f 100644 --- a/packages/website/ts/pages/faq/faq.tsx +++ b/packages/website/ts/pages/faq/faq.tsx @@ -459,26 +459,26 @@ export class FAQ extends React.Component { >

0x FAQ

- {this.renderSections()} + {this._renderSections()}
- {this.renderDate()} + {this._renderDate()}
- {this.renderAmounts(makerToken, takerToken)} + {this._renderAmounts(makerToken, takerToken)}
@@ -95,7 +95,7 @@ export class TradeHistoryItem extends React.Component ); } - private renderAmounts(makerToken: Token, takerToken: Token) { + private _renderAmounts(makerToken: Token, takerToken: Token) { const fill = this.props.fill; const filledTakerTokenAmountInUnits = ZeroEx.toUnitAmount(fill.filledTakerTokenAmount, takerToken.decimals); const filledMakerTokenAmountInUnits = ZeroEx.toUnitAmount(fill.filledMakerTokenAmount, takerToken.decimals); @@ -133,14 +133,14 @@ export class TradeHistoryItem extends React.Component +{' '} - {this.renderAmount(receiveAmount, receiveToken.symbol, receiveToken.decimals)} + {this._renderAmount(receiveAmount, receiveToken.symbol, receiveToken.decimals)}
-{' '} - {this.renderAmount(givenAmount, givenToken.symbol, givenToken.decimals)} + {this._renderAmount(givenAmount, givenToken.symbol, givenToken.decimals)}
{exchangeRate.toFixed(PRECISION)} {givenToken.symbol}/{receiveToken.symbol} @@ -148,7 +148,7 @@ export class TradeHistoryItem extends React.Component ); } - private renderDate() { + private _renderDate() { const blockMoment = moment.unix(this.props.fill.blockTimestamp); if (!blockMoment.isValid()) { return null; @@ -170,7 +170,7 @@ export class TradeHistoryItem extends React.Component ); } - private renderAmount(amount: BigNumber, symbol: string, decimals: number) { + private _renderAmount(amount: BigNumber, symbol: string, decimals: number) { const unitAmount = ZeroEx.toUnitAmount(amount, decimals); return ( diff --git a/packages/website/ts/components/ui/badge.tsx b/packages/website/ts/components/ui/badge.tsx index cf4396047..fae51860e 100644 --- a/packages/website/ts/components/ui/badge.tsx +++ b/packages/website/ts/components/ui/badge.tsx @@ -42,14 +42,14 @@ export class Badge extends React.Component {
{this.props.title}
); } - private setHoverState(isHovering: boolean) { + private _setHoverState(isHovering: boolean) { this.setState({ isHovering, }); diff --git a/packages/website/ts/components/ui/copy_icon.tsx b/packages/website/ts/components/ui/copy_icon.tsx index 3c50430df..754f5d456 100644 --- a/packages/website/ts/components/ui/copy_icon.tsx +++ b/packages/website/ts/components/ui/copy_icon.tsx @@ -15,8 +15,8 @@ interface CopyIconState { } export class CopyIcon extends React.Component { - private copyTooltipTimeoutId: number; - private copyable: HTMLInputElement; + private _copyTooltipTimeoutId: number; + private _copyable: HTMLInputElement; constructor(props: CopyIconProps) { super(props); this.state = { @@ -25,25 +25,25 @@ export class CopyIcon extends React.Component { } public componentDidUpdate() { // Remove tooltip if hover away - if (!this.state.isHovering && this.copyTooltipTimeoutId) { - clearInterval(this.copyTooltipTimeoutId); - this.hideTooltip(); + if (!this.state.isHovering && this._copyTooltipTimeoutId) { + clearInterval(this._copyTooltipTimeoutId); + this._hideTooltip(); } } public render() { return (
- +
@@ -57,25 +57,25 @@ export class CopyIcon extends React.Component {
); } - private setRefToProperty(el: HTMLInputElement) { - this.copyable = el; + private _setRefToProperty(el: HTMLInputElement) { + this._copyable = el; } - private setHoverState(isHovering: boolean) { + private _setHoverState(isHovering: boolean) { this.setState({ isHovering, }); } - private onCopy() { - if (this.copyTooltipTimeoutId) { - clearInterval(this.copyTooltipTimeoutId); + private _onCopy() { + if (this._copyTooltipTimeoutId) { + clearInterval(this._copyTooltipTimeoutId); } const tooltipLifespanMs = 1000; - this.copyTooltipTimeoutId = window.setTimeout(() => { - this.hideTooltip(); + this._copyTooltipTimeoutId = window.setTimeout(() => { + this._hideTooltip(); }, tooltipLifespanMs); } - private hideTooltip() { - ReactTooltip.hide(ReactDOM.findDOMNode(this.copyable)); + private _hideTooltip() { + ReactTooltip.hide(ReactDOM.findDOMNode(this._copyable)); } } diff --git a/packages/website/ts/components/ui/drop_down_menu_item.tsx b/packages/website/ts/components/ui/drop_down_menu_item.tsx index 55347cb98..ee26e004e 100644 --- a/packages/website/ts/components/ui/drop_down_menu_item.tsx +++ b/packages/website/ts/components/ui/drop_down_menu_item.tsx @@ -28,8 +28,8 @@ export class DropDownMenuItem extends React.Component { - this.checkIfShouldClosePopover(); + this._popoverCloseCheckIntervalId = window.setInterval(() => { + this._checkIfShouldClosePopover(); }, CHECK_CLOSE_POPOVER_INTERVAL_MS); } public componentWillUnmount() { - window.clearInterval(this.popoverCloseCheckIntervalId); + window.clearInterval(this._popoverCloseCheckIntervalId); } public render() { const colorStyle = this.props.isNightVersion ? 'white' : this.props.style.color; return (
@@ -65,12 +65,12 @@ export class DropDownMenuItem extends React.Component
{this.props.subMenuItems} @@ -80,11 +80,11 @@ export class DropDownMenuItem extends React.Component ); } - private onHover(event: React.FormEvent) { - this.isHovering = true; - this.checkIfShouldOpenPopover(event); + private _onHover(event: React.FormEvent) { + this._isHovering = true; + this._checkIfShouldOpenPopover(event); } - private checkIfShouldOpenPopover(event: React.FormEvent) { + private _checkIfShouldOpenPopover(event: React.FormEvent) { if (this.state.isDropDownOpen) { return; // noop } @@ -94,16 +94,16 @@ export class DropDownMenuItem extends React.Component) { - this.isHovering = false; + private _onHoverOff(event: React.FormEvent) { + this._isHovering = false; } - private checkIfShouldClosePopover() { - if (!this.state.isDropDownOpen || this.isHovering) { + private _checkIfShouldClosePopover() { + if (!this.state.isDropDownOpen || this._isHovering) { return; // noop } - this.closePopover(); + this._closePopover(); } - private closePopover() { + private _closePopover() { this.setState({ isDropDownOpen: false, }); diff --git a/packages/website/ts/components/ui/flash_message.tsx b/packages/website/ts/components/ui/flash_message.tsx index ab4edbbb0..c0c00463e 100644 --- a/packages/website/ts/components/ui/flash_message.tsx +++ b/packages/website/ts/components/ui/flash_message.tsx @@ -26,7 +26,7 @@ export class FlashMessage extends React.Component ); @@ -34,7 +34,7 @@ export class FlashMessage extends React.Component { + this._buttonTimeoutId = window.setTimeout(() => { this.setState({ buttonState: ButtonState.READY, }); diff --git a/packages/website/ts/components/ui/menu_item.tsx b/packages/website/ts/components/ui/menu_item.tsx index c7ce7439f..3ec993476 100644 --- a/packages/website/ts/components/ui/menu_item.tsx +++ b/packages/website/ts/components/ui/menu_item.tsx @@ -35,15 +35,15 @@ export class MenuItem extends React.Component { onClick={this.props.onClick.bind(this)} className={`mx-auto ${this.props.className}`} style={menuItemStyles} - onMouseEnter={this.onToggleHover.bind(this, true)} - onMouseLeave={this.onToggleHover.bind(this, false)} + onMouseEnter={this._onToggleHover.bind(this, true)} + onMouseLeave={this._onToggleHover.bind(this, false)} > {this.props.children}
); } - private onToggleHover(isHovering: boolean) { + private _onToggleHover(isHovering: boolean) { this.setState({ isHovering, }); diff --git a/packages/website/ts/components/ui/swap_icon.tsx b/packages/website/ts/components/ui/swap_icon.tsx index 124e7018c..2adefbda3 100644 --- a/packages/website/ts/components/ui/swap_icon.tsx +++ b/packages/website/ts/components/ui/swap_icon.tsx @@ -27,8 +27,8 @@ export class SwapIcon extends React.Component { className="mx-auto pt4" style={{cursor: 'pointer', height: 50, width: 37.5}} onClick={this.props.swapTokensFn} - onMouseEnter={this.onToggleHover.bind(this, true)} - onMouseLeave={this.onToggleHover.bind(this, false)} + onMouseEnter={this._onToggleHover.bind(this, true)} + onMouseLeave={this._onToggleHover.bind(this, false)} > {
); } - private onToggleHover(isHovering: boolean) { + private _onToggleHover(isHovering: boolean) { this.setState({ isHovering, }); diff --git a/packages/website/ts/components/visual_order.tsx b/packages/website/ts/components/visual_order.tsx index a7be6f780..708317be6 100644 --- a/packages/website/ts/components/visual_order.tsx +++ b/packages/website/ts/components/visual_order.tsx @@ -42,13 +42,13 @@ export class VisualOrder extends React.Component
- {this.renderAmount(this.props.takerAssetToken, this.props.takerToken)} + {this._renderAmount(this.props.takerAssetToken, this.props.takerToken)}
- {this.renderAmount(this.props.makerAssetToken, this.props.makerToken)} + {this._renderAmount(this.props.makerAssetToken, this.props.makerToken)}
@@ -65,7 +65,7 @@ export class VisualOrder extends React.Component ); } - private renderAmount(assetToken: AssetToken, token: Token) { + private _renderAmount(assetToken: AssetToken, token: Token) { const unitAmount = ZeroEx.toUnitAmount(assetToken.amount, token.decimals); return (
diff --git a/packages/website/ts/lazy_component.tsx b/packages/website/ts/lazy_component.tsx index 359a1fe65..fa5f0ff8f 100644 --- a/packages/website/ts/lazy_component.tsx +++ b/packages/website/ts/lazy_component.tsx @@ -23,12 +23,12 @@ export class LazyComponent extends React.Component {
- {this.renderProfiles(teamRow1)} + {this._renderProfiles(teamRow1)}
- {this.renderProfiles(teamRow2)} + {this._renderProfiles(teamRow2)}
@@ -202,7 +202,7 @@ export class About extends React.Component { Advisors:
- {this.renderProfiles(advisors)} + {this._renderProfiles(advisors)}
@@ -232,7 +232,7 @@ export class About extends React.Component {
); } - private renderProfiles(profiles: ProfileInfo[]) { + private _renderProfiles(profiles: ProfileInfo[]) { const numIndiv = profiles.length; const colSize = utils.getColSize(numIndiv); return _.map(profiles, profile => { diff --git a/packages/website/ts/pages/documentation/docs_info.ts b/packages/website/ts/pages/documentation/docs_info.ts index 1afcf8aaf..b88b247e8 100644 --- a/packages/website/ts/pages/documentation/docs_info.ts +++ b/packages/website/ts/pages/documentation/docs_info.ts @@ -19,7 +19,7 @@ export class DocsInfo { public menu: DocsMenu; public sections: SectionsMap; public sectionNameToMarkdown: {[sectionName: string]: string}; - private docsInfo: DocsInfoConfig; + private _docsInfo: DocsInfoConfig; constructor(config: DocsInfoConfig) { this.displayName = config.displayName; this.packageUrl = config.packageUrl; @@ -28,32 +28,32 @@ export class DocsInfo { this.docsJsonRoot = config.docsJsonRoot; this.sections = config.sections; this.sectionNameToMarkdown = config.sectionNameToMarkdown; - this.docsInfo = config; + this._docsInfo = config; } public isPublicType(typeName: string): boolean { - if (_.isUndefined(this.docsInfo.publicTypes)) { + if (_.isUndefined(this._docsInfo.publicTypes)) { return false; } - const isPublic = _.includes(this.docsInfo.publicTypes, typeName); + const isPublic = _.includes(this._docsInfo.publicTypes, typeName); return isPublic; } public getModulePathsIfExists(sectionName: string): string[] { - const modulePathsIfExists = this.docsInfo.sectionNameToModulePath[sectionName]; + const modulePathsIfExists = this._docsInfo.sectionNameToModulePath[sectionName]; return modulePathsIfExists; } public getMenu(selectedVersion?: string): {[section: string]: string[]} { - if (_.isUndefined(selectedVersion) || _.isUndefined(this.docsInfo.menuSubsectionToVersionWhenIntroduced)) { - return this.docsInfo.menu; + if (_.isUndefined(selectedVersion) || _.isUndefined(this._docsInfo.menuSubsectionToVersionWhenIntroduced)) { + return this._docsInfo.menu; } - const finalMenu = _.cloneDeep(this.docsInfo.menu); + const finalMenu = _.cloneDeep(this._docsInfo.menu); if (_.isUndefined(finalMenu.contracts)) { return finalMenu; } // TODO: refactor to include more sections then simply the `contracts` section finalMenu.contracts = _.filter(finalMenu.contracts, (contractName: string) => { - const versionIntroducedIfExists = this.docsInfo.menuSubsectionToVersionWhenIntroduced[contractName]; + const versionIntroducedIfExists = this._docsInfo.menuSubsectionToVersionWhenIntroduced[contractName]; if (!_.isUndefined(versionIntroducedIfExists)) { const existsInSelectedVersion = compareVersions(selectedVersion, versionIntroducedIfExists) >= 0; @@ -104,9 +104,9 @@ export class DocsInfo { return typeDefinitionByName; } public isVisibleConstructor(sectionName: string): boolean { - return _.includes(this.docsInfo.visibleConstructors, sectionName); + return _.includes(this._docsInfo.visibleConstructors, sectionName); } public convertToDocAgnosticFormat(docObj: DoxityDocObj|TypeDocNode): DocAgnosticFormat { - return this.docsInfo.convertToDocAgnosticFormatFn(docObj, this); + return this._docsInfo.convertToDocAgnosticFormatFn(docObj, this); } } diff --git a/packages/website/ts/pages/documentation/documentation.tsx b/packages/website/ts/pages/documentation/documentation.tsx index aab14a52c..ad244ef1f 100644 --- a/packages/website/ts/pages/documentation/documentation.tsx +++ b/packages/website/ts/pages/documentation/documentation.tsx @@ -93,7 +93,7 @@ export class Documentation extends const versions = findVersions(lastSegment); const preferredVersionIfExists = versions.length > 0 ? versions[0] : undefined; // tslint:disable-next-line:no-floating-promises - this.fetchJSONDocsFireAndForgetAsync(preferredVersionIfExists); + this._fetchJSONDocsFireAndForgetAsync(preferredVersionIfExists); } public render() { const menuSubsectionsBySection = _.isUndefined(this.state.docAgnosticFormat) ? @@ -157,7 +157,7 @@ export class Documentation extends {this.props.docsInfo.displayName} - {this.renderDocumentation()} + {this._renderDocumentation()}
@@ -165,16 +165,16 @@ export class Documentation extends
); } - private renderDocumentation(): React.ReactNode { + private _renderDocumentation(): React.ReactNode { const subMenus = _.values(this.props.docsInfo.getMenu()); const orderedSectionNames = _.flatten(subMenus); const typeDefinitionByName = this.props.docsInfo.getTypeDefinitionsByName(this.state.docAgnosticFormat); - const renderedSections = _.map(orderedSectionNames, this.renderSection.bind(this, typeDefinitionByName)); + const renderedSections = _.map(orderedSectionNames, this._renderSection.bind(this, typeDefinitionByName)); return renderedSections; } - private renderSection(typeDefinitionByName: TypeDefinitionByName, sectionName: string): React.ReactNode { + private _renderSection(typeDefinitionByName: TypeDefinitionByName, sectionName: string): React.ReactNode { const markdownFileIfExists = this.props.docsInfo.sectionNameToMarkdown[sectionName]; if (!_.isUndefined(markdownFileIfExists)) { return ( @@ -203,12 +203,12 @@ export class Documentation extends }); const sortedProperties = _.sortBy(docSection.properties, 'name'); - const propertyDefs = _.map(sortedProperties, this.renderProperty.bind(this)); + const propertyDefs = _.map(sortedProperties, this._renderProperty.bind(this)); const sortedMethods = _.sortBy(docSection.methods, 'name'); const methodDefs = _.map(sortedMethods, method => { const isConstructor = false; - return this.renderMethodBlocks(method, sectionName, isConstructor, typeDefinitionByName); + return this._renderMethodBlocks(method, sectionName, isConstructor, typeDefinitionByName); }); const sortedEvents = _.sortBy(docSection.events, 'name'); @@ -230,7 +230,7 @@ export class Documentation extends
- {this.renderNetworkBadgesIfExists(sectionName)} + {this._renderNetworkBadgesIfExists(sectionName)}
{docSection.comment &&

Constructor

- {this.renderConstructors(docSection.constructors, sectionName, typeDefinitionByName)} + {this._renderConstructors(docSection.constructors, sectionName, typeDefinitionByName)}
} {docSection.properties.length > 0 && @@ -270,7 +270,7 @@ export class Documentation extends