Merge branch 'development' into createWethPage
* development: (27 commits) Remove re-assignment Fix scrolling topBar on Portal Fix overflow issue on calculated fillAmount Fix faulty import Introduce an identityCommandBuilder Define types for methodID Define types for ethereumjs-abi Install types for yargs Fix comments Fix linter issues Fix linter error Rename SubscriptionOpts to BlockRange Refactor remaining _.assign to spread operator Move muiTheme into it's own module Refactor configs and constants, standardize on uppercase/snakecase, alphebetize, rename for logical grouping Sort colors into color spectrum remove unused style standarize on `grey` over `gray` spelling and other color related fixes Standardize colors to always be in uppercase hex and consolidate material-ui greys Consolidate all custom colors and material-ui colors into a colors module ... # Conflicts: # packages/website/ts/components/eth_wrappers.tsx # packages/website/ts/components/portal.tsx # packages/website/ts/utils/configs.ts # packages/website/ts/utils/constants.ts
This commit is contained in:
@@ -1,10 +1,10 @@
|
||||
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 {BlockchainErrs} from 'ts/types';
|
||||
import {colors} from 'ts/utils/colors';
|
||||
import {configs} from 'ts/utils/configs';
|
||||
import {constants} from 'ts/utils/constants';
|
||||
|
||||
@@ -46,22 +46,22 @@ export class BlockchainErrDialog extends React.Component<BlockchainErrDialogProp
|
||||
);
|
||||
}
|
||||
private getTitle(hasWalletAddress: boolean) {
|
||||
if (this.props.blockchainErr === BlockchainErrs.A_CONTRACT_NOT_DEPLOYED_ON_NETWORK) {
|
||||
if (this.props.blockchainErr === BlockchainErrs.AContractNotDeployedOnNetwork) {
|
||||
return '0x smart contracts not found';
|
||||
} else if (!hasWalletAddress) {
|
||||
return 'Enable wallet communication';
|
||||
} else if (this.props.blockchainErr === BlockchainErrs.DISCONNECTED_FROM_ETHEREUM_NODE) {
|
||||
} else if (this.props.blockchainErr === BlockchainErrs.DisconnectedFromEthereumNode) {
|
||||
return 'Disconnected from Ethereum network';
|
||||
} else {
|
||||
return 'Unexpected error';
|
||||
}
|
||||
}
|
||||
private renderExplanation(hasWalletAddress: boolean) {
|
||||
if (this.props.blockchainErr === BlockchainErrs.A_CONTRACT_NOT_DEPLOYED_ON_NETWORK) {
|
||||
if (this.props.blockchainErr === BlockchainErrs.AContractNotDeployedOnNetwork) {
|
||||
return this.renderContractsNotDeployedExplanation();
|
||||
} else if (!hasWalletAddress) {
|
||||
return this.renderNoWalletFoundExplanation();
|
||||
} else if (this.props.blockchainErr === BlockchainErrs.DISCONNECTED_FROM_ETHEREUM_NODE) {
|
||||
} else if (this.props.blockchainErr === BlockchainErrs.DisconnectedFromEthereumNode) {
|
||||
return this.renderDisconnectedFromNode();
|
||||
} else {
|
||||
return this.renderUnexpectedErrorExplanation();
|
||||
@@ -71,9 +71,9 @@ export class BlockchainErrDialog extends React.Component<BlockchainErrDialogProp
|
||||
return (
|
||||
<div>
|
||||
You were disconnected from the backing Ethereum node.
|
||||
{' '}If using <a href={constants.METAMASK_CHROME_STORE_URL} target="_blank">
|
||||
{' '}If using <a href={constants.URL_METAMASK_CHROME_STORE} target="_blank">
|
||||
Metamask
|
||||
</a> or <a href={constants.MIST_DOWNLOAD_URL} target="_blank">Mist</a> try refreshing
|
||||
</a> or <a href={constants.URL_MIST_DOWNLOAD} target="_blank">Mist</a> try refreshing
|
||||
{' '}the page. If using a locally hosted Ethereum node, make sure it's still running.
|
||||
</div>
|
||||
);
|
||||
@@ -97,7 +97,7 @@ export class BlockchainErrDialog extends React.Component<BlockchainErrDialogProp
|
||||
<h4>1. Metamask chrome extension</h4>
|
||||
<div>
|
||||
You can install the{' '}
|
||||
<a href={constants.METAMASK_CHROME_STORE_URL} target="_blank">
|
||||
<a href={constants.URL_METAMASK_CHROME_STORE} target="_blank">
|
||||
Metamask
|
||||
</a> Chrome extension Ethereum wallet. Once installed and set up, refresh this page.
|
||||
<div className="pt1">
|
||||
@@ -107,11 +107,11 @@ export class BlockchainErrDialog extends React.Component<BlockchainErrDialogProp
|
||||
</div>
|
||||
<h4>Parity Signer</h4>
|
||||
<div>
|
||||
The <a href={constants.PARITY_CHROME_STORE_URL} target="_blank">Parity Signer
|
||||
The <a href={constants.URL_PARITY_CHROME_STORE} target="_blank">Parity Signer
|
||||
Chrome extension</a>{' '}lets you connect to a locally running Parity node.
|
||||
Make sure you have started your local Parity node with{' '}
|
||||
{configs.isMainnetEnabled && '`parity ui` or'} `parity --chain kovan ui`{' '}
|
||||
in order to connect to {configs.isMainnetEnabled ? 'mainnet or Kovan respectively.' : 'Kovan.'}
|
||||
{configs.IS_MAINNET_ENABLED && '`parity ui` or'} `parity --chain kovan ui`{' '}
|
||||
in order to connect to {configs.IS_MAINNET_ENABLED ? 'mainnet or Kovan respectively.' : 'Kovan.'}
|
||||
</div>
|
||||
<div className="pt2">
|
||||
<span className="bold">Note:</span>
|
||||
@@ -130,24 +130,24 @@ export class BlockchainErrDialog extends React.Component<BlockchainErrDialogProp
|
||||
{' '}currently connected to (network Id: {this.props.networkId}).
|
||||
{' '}In order to use the 0x portal dApp,
|
||||
{' '}please connect to the
|
||||
{' '}{constants.TESTNET_NAME} testnet (network Id: {constants.TESTNET_NETWORK_ID})
|
||||
{configs.isMainnetEnabled ?
|
||||
` or ${constants.MAINNET_NAME} (network Id: ${constants.MAINNET_NETWORK_ID}).` :
|
||||
{' '}{constants.TESTNET_NAME} testnet (network Id: {constants.NETWORK_ID_TESTNET})
|
||||
{configs.IS_MAINNET_ENABLED ?
|
||||
` or ${constants.MAINNET_NAME} (network Id: ${constants.NETWORK_ID_MAINNET}).` :
|
||||
`.`
|
||||
}
|
||||
</div>
|
||||
<h4>Metamask</h4>
|
||||
<div>
|
||||
If you are using{' '}
|
||||
<a href={constants.METAMASK_CHROME_STORE_URL} target="_blank">
|
||||
<a href={constants.URL_METAMASK_CHROME_STORE} target="_blank">
|
||||
Metamask
|
||||
</a>, you can switch networks in the top left corner of the extension popover.
|
||||
</div>
|
||||
<h4>Parity Signer</h4>
|
||||
<div>
|
||||
If using the <a href={constants.PARITY_CHROME_STORE_URL} target="_blank">Parity Signer
|
||||
If using the <a href={constants.URL_PARITY_CHROME_STORE} target="_blank">Parity Signer
|
||||
Chrome extension</a>, make sure to start your local Parity node with{' '}
|
||||
{configs.isMainnetEnabled ?
|
||||
{configs.IS_MAINNET_ENABLED ?
|
||||
'`parity ui` or `parity --chain Kovan ui` in order to connect to mainnet \
|
||||
or Kovan respectively.' :
|
||||
'`parity --chain kovan ui` in order to connect to Kovan.'
|
||||
|
@@ -5,8 +5,7 @@ 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';
|
||||
import {colors} from 'ts/utils/colors';
|
||||
|
||||
interface EthWethConversionDialogProps {
|
||||
direction: Side;
|
||||
@@ -47,7 +46,7 @@ export class EthWethConversionDialog extends
|
||||
onTouchTap={this.onConvertClick.bind(this)}
|
||||
/>,
|
||||
];
|
||||
const title = this.props.direction === Side.deposit ? 'Wrap ETH' : 'Unwrap WETH';
|
||||
const title = this.props.direction === Side.Deposit ? 'Wrap ETH' : 'Unwrap WETH';
|
||||
return (
|
||||
<Dialog
|
||||
title={title}
|
||||
@@ -61,10 +60,10 @@ export class EthWethConversionDialog extends
|
||||
);
|
||||
}
|
||||
private renderConversionDialogBody() {
|
||||
const explanation = this.props.direction === Side.deposit ?
|
||||
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;
|
||||
const isWrappedVersion = this.props.direction === Side.Receive;
|
||||
return (
|
||||
<div>
|
||||
<div className="pb2">
|
||||
@@ -75,7 +74,7 @@ export class EthWethConversionDialog extends
|
||||
{this.renderCurrency(isWrappedVersion)}
|
||||
<div style={{paddingTop: 68}}>
|
||||
<i
|
||||
style={{fontSize: 28, color: DARK_BLUE}}
|
||||
style={{fontSize: 28, color: colors.darkBlue}}
|
||||
className="zmdi zmdi-arrow-right"
|
||||
/>
|
||||
</div>
|
||||
@@ -85,7 +84,7 @@ export class EthWethConversionDialog extends
|
||||
className="pt2 mx-auto"
|
||||
style={{width: 245}}
|
||||
>
|
||||
{this.props.direction === Side.receive ?
|
||||
{this.props.direction === Side.Receive ?
|
||||
<TokenAmountInput
|
||||
token={this.props.token}
|
||||
tokenState={this.props.tokenState}
|
||||
@@ -133,7 +132,7 @@ export class EthWethConversionDialog extends
|
||||
<div className="mx-auto pt2">
|
||||
<div
|
||||
className="center"
|
||||
style={{color: DARK_BLUE}}
|
||||
style={{color: colors.darkBlue}}
|
||||
>
|
||||
{name}
|
||||
</div>
|
||||
|
@@ -2,7 +2,6 @@ import BigNumber from 'bignumber.js';
|
||||
import * as _ from 'lodash';
|
||||
import Dialog from 'material-ui/Dialog';
|
||||
import FlatButton from 'material-ui/FlatButton';
|
||||
import {colors} from 'material-ui/styles';
|
||||
import {
|
||||
Table,
|
||||
TableBody,
|
||||
@@ -17,6 +16,8 @@ import ReactTooltip = require('react-tooltip');
|
||||
import {Blockchain} from 'ts/blockchain';
|
||||
import {LifeCycleRaisedButton} from 'ts/components/ui/lifecycle_raised_button';
|
||||
import {Dispatcher} from 'ts/redux/dispatcher';
|
||||
import {colors} from 'ts/utils/colors';
|
||||
import {configs} from 'ts/utils/configs';
|
||||
import {constants} from 'ts/utils/constants';
|
||||
import {utils} from 'ts/utils/utils';
|
||||
|
||||
@@ -52,7 +53,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
|
||||
stepIndex: LedgerSteps.CONNECT,
|
||||
userAddresses: [],
|
||||
addressBalances: [],
|
||||
derivationPath: constants.DEFAULT_DERIVATION_PATH,
|
||||
derivationPath: configs.DEFAULT_DERIVATION_PATH,
|
||||
derivationErrMsg: '',
|
||||
};
|
||||
}
|
||||
@@ -146,7 +147,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
|
||||
<div className="overflow-hidden" style={{width: 180}}>
|
||||
<TextField
|
||||
floatingLabelFixed={true}
|
||||
floatingLabelStyle={{color: colors.grey500}}
|
||||
floatingLabelStyle={{color: colors.grey}}
|
||||
floatingLabelText="Update path derivation (advanced)"
|
||||
value={this.state.derivationPath}
|
||||
errorText={this.state.derivationErrMsg}
|
||||
@@ -170,7 +171,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
|
||||
const balance = this.state.addressBalances[i];
|
||||
const addressTooltipId = `address-${userAddress}`;
|
||||
const balanceTooltipId = `balance-${userAddress}`;
|
||||
const networkName = constants.networkNameById[this.props.networkId];
|
||||
const networkName = constants.NETWORK_NAME_BY_ID[this.props.networkId];
|
||||
// We specifically prefix kovan ETH.
|
||||
// TODO: We should probably add prefixes for all networks
|
||||
const isKovanNetwork = networkName === 'Kovan';
|
||||
|
@@ -1,7 +1,7 @@
|
||||
import Dialog from 'material-ui/Dialog';
|
||||
import FlatButton from 'material-ui/FlatButton';
|
||||
import {colors} from 'material-ui/styles';
|
||||
import * as React from 'react';
|
||||
import {colors} from 'ts/utils/colors';
|
||||
|
||||
interface PortalDisclaimerDialogProps {
|
||||
isOpen: boolean;
|
||||
|
@@ -73,7 +73,9 @@ export class TrackTokenConfirmationDialog extends
|
||||
isAddingTokenToTracked: true,
|
||||
});
|
||||
for (const token of this.props.tokens) {
|
||||
const newTokenEntry = _.assign({}, token);
|
||||
const newTokenEntry = {
|
||||
...token,
|
||||
};
|
||||
|
||||
newTokenEntry.isTracked = true;
|
||||
trackedTokenStorage.addTrackedTokenToUser(this.props.userAddress, this.props.networkId, newTokenEntry);
|
||||
|
@@ -1,7 +1,7 @@
|
||||
import Dialog from 'material-ui/Dialog';
|
||||
import FlatButton from 'material-ui/FlatButton';
|
||||
import {colors} from 'material-ui/styles';
|
||||
import * as React from 'react';
|
||||
import {colors} from 'ts/utils/colors';
|
||||
import {constants} from 'ts/utils/constants';
|
||||
|
||||
interface U2fNotSupportedDialogProps {
|
||||
@@ -39,7 +39,7 @@ export function U2fNotSupportedDialog(props: U2fNotSupportedDialogProps) {
|
||||
<li>
|
||||
Firefox with{' '}
|
||||
<a
|
||||
href={constants.FIREFOX_U2F_ADDON}
|
||||
href={constants.URL_FIREFOX_U2F_ADDON}
|
||||
target="_blank"
|
||||
style={{textDecoration: 'underline'}}
|
||||
>
|
||||
|
Reference in New Issue
Block a user