aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website')
-rw-r--r--packages/website/ts/blockchain.ts7
-rw-r--r--packages/website/ts/components/portal.tsx19
-rw-r--r--packages/website/ts/components/portal_menu.tsx26
-rw-r--r--packages/website/ts/components/relayer_index/relayer_grid_tile.tsx84
-rw-r--r--packages/website/ts/components/relayer_index/relayer_index.tsx118
-rw-r--r--packages/website/ts/components/relayer_index/relayer_top_tokens.tsx46
-rw-r--r--packages/website/ts/components/wallet/wallet.tsx17
-rw-r--r--packages/website/ts/components/wallet/wrap_ether_item.tsx6
-rw-r--r--packages/website/ts/containers/zero_ex_js_documentation.ts1
-rw-r--r--packages/website/ts/globals.d.ts113
-rw-r--r--packages/website/ts/types.ts8
-rw-r--r--packages/website/ts/utils/utils.ts6
12 files changed, 315 insertions, 136 deletions
diff --git a/packages/website/ts/blockchain.ts b/packages/website/ts/blockchain.ts
index 72cb94c02..fd34ab82d 100644
--- a/packages/website/ts/blockchain.ts
+++ b/packages/website/ts/blockchain.ts
@@ -23,6 +23,7 @@ import {
LedgerWalletSubprovider,
RedundantRPCSubprovider,
} from '@0xproject/subproviders';
+import { Provider } from '@0xproject/types';
import { BigNumber, intervalUtils, logUtils, promisify } from '@0xproject/utils';
import { Web3Wrapper } from '@0xproject/web3-wrapper';
import * as _ from 'lodash';
@@ -73,11 +74,11 @@ export class Blockchain {
private _web3Wrapper?: Web3Wrapper;
private _blockchainWatcher?: BlockchainWatcher;
private _userAddressIfExists: string;
- private _cachedProvider: Web3.Provider;
+ private _cachedProvider: Provider;
private _cachedProviderNetworkId: number;
private _ledgerSubprovider: LedgerWalletSubprovider;
private _defaultGasPrice: BigNumber;
- private static _getNameGivenProvider(provider: Web3.Provider): string {
+ private static _getNameGivenProvider(provider: Provider): string {
const providerType = utils.getProviderType(provider);
const providerNameIfExists = providerToName[providerType];
if (_.isUndefined(providerNameIfExists)) {
@@ -377,7 +378,7 @@ export class Blockchain {
}
public isValidAddress(address: string): boolean {
const lowercaseAddress = address.toLowerCase();
- return this._web3Wrapper.isAddress(lowercaseAddress);
+ return Web3Wrapper.isAddress(lowercaseAddress);
}
public async pollTokenBalanceAsync(token: Token) {
utils.assert(this._doesUserAddressExist(), BlockchainCallErrs.UserHasNoAssociatedAddresses);
diff --git a/packages/website/ts/components/portal.tsx b/packages/website/ts/components/portal.tsx
index ceb0ecc72..b79f5e288 100644
--- a/packages/website/ts/components/portal.tsx
+++ b/packages/website/ts/components/portal.tsx
@@ -15,6 +15,7 @@ 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';
+import { RelayerIndex } from 'ts/components/relayer_index/relayer_index';
import { TokenBalances } from 'ts/components/token_balances';
import { TopBar } from 'ts/components/top_bar/top_bar';
import { TradeHistory } from 'ts/components/trade_history/trade_history';
@@ -155,6 +156,7 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
const updateShouldBlockchainErrDialogBeOpen = this.props.dispatcher.updateShouldBlockchainErrDialogBeOpen.bind(
this.props.dispatcher,
);
+ const isDevelopment = configs.ENVIRONMENT === Environments.DEVELOPMENT;
const portalStyle: React.CSSProperties = {
minHeight: '100vh',
display: 'flex',
@@ -204,12 +206,18 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
<div className="py2" style={{ backgroundColor: colors.grey50 }}>
{this.props.blockchainIsLoaded ? (
<Switch>
- {configs.ENVIRONMENT === Environments.DEVELOPMENT && (
+ {isDevelopment && (
<Route
path={`${WebsitePaths.Portal}/wallet`}
render={this._renderWallet.bind(this)}
/>
)}
+ {isDevelopment && (
+ <Route
+ path={`${WebsitePaths.Portal}/relayers`}
+ render={this._renderRelayers.bind(this)}
+ />
+ )}
<Route
path={`${WebsitePaths.Portal}/weth`}
render={this._renderEthWrapper.bind(this)}
@@ -313,6 +321,15 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
</div>
);
}
+ private _renderRelayers() {
+ return (
+ <div className="flex flex-center">
+ <div className="mx-auto" style={{ width: 800 }}>
+ <RelayerIndex networkId={this.props.networkId} />
+ </div>
+ </div>
+ );
+ }
private _renderEthWrapper() {
return (
<EthWrappers
diff --git a/packages/website/ts/components/portal_menu.tsx b/packages/website/ts/components/portal_menu.tsx
index 9ab611556..2b4d7eea2 100644
--- a/packages/website/ts/components/portal_menu.tsx
+++ b/packages/website/ts/components/portal_menu.tsx
@@ -59,14 +59,24 @@ export class PortalMenu extends React.Component<PortalMenuProps, PortalMenuState
{this._renderMenuItemWithIcon('Wrap ETH', 'zmdi-circle-o')}
</MenuItem>
{configs.ENVIRONMENT === Environments.DEVELOPMENT && (
- <MenuItem
- style={this.props.menuItemStyle}
- className="py2"
- to={`${WebsitePaths.Portal}/wallet`}
- onClick={this.props.onClick.bind(this)}
- >
- {this._renderMenuItemWithIcon('Wallet', 'zmdi-balance-wallet')}
- </MenuItem>
+ <div>
+ <MenuItem
+ style={this.props.menuItemStyle}
+ className="py2"
+ to={`${WebsitePaths.Portal}/wallet`}
+ onClick={this.props.onClick.bind(this)}
+ >
+ {this._renderMenuItemWithIcon('Wallet', 'zmdi-balance-wallet')}
+ </MenuItem>
+ <MenuItem
+ style={this.props.menuItemStyle}
+ className="py2"
+ to={`${WebsitePaths.Portal}/relayers`}
+ onClick={this.props.onClick.bind(this)}
+ >
+ {this._renderMenuItemWithIcon('Relayers', 'zmdi-input-antenna')}
+ </MenuItem>
+ </div>
)}
</div>
);
diff --git a/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx b/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx
new file mode 100644
index 000000000..530576828
--- /dev/null
+++ b/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx
@@ -0,0 +1,84 @@
+import { colors, Styles } from '@0xproject/react-shared';
+import * as _ from 'lodash';
+import { GridTile } from 'material-ui/GridList';
+import * as React from 'react';
+
+import { TopTokens } from 'ts/components/relayer_index/relayer_top_tokens';
+import { TokenIcon } from 'ts/components/ui/token_icon';
+import { RelayerInfo, Token } from 'ts/types';
+
+export interface RelayerGridTileProps {
+ relayerInfo: RelayerInfo;
+ networkId: number;
+}
+
+const styles: Styles = {
+ root: {
+ backgroundColor: colors.white,
+ borderBottomRightRadius: 10,
+ borderBottomLeftRadius: 10,
+ borderTopRightRadius: 10,
+ borderTopLeftRadius: 10,
+ boxShadow: `0px 4px 6px ${colors.walletBoxShadow}`,
+ overflow: 'hidden',
+ boxSizing: 'border-box',
+ },
+ innerDiv: {
+ padding: 6,
+ height: '100%',
+ boxSizing: 'border-box',
+ },
+ header: {
+ height: '50%',
+ width: '100%',
+ objectFit: 'cover',
+ borderBottomRightRadius: 4,
+ borderBottomLeftRadius: 4,
+ borderTopRightRadius: 4,
+ borderTopLeftRadius: 4,
+ },
+ body: {
+ paddingLeft: 6,
+ paddingRight: 6,
+ height: '50%',
+ width: '100%',
+ boxSizing: 'border-box',
+ },
+ marketShareBar: {
+ height: 14,
+ width: '100%',
+ backgroundColor: colors.mediumBlue,
+ },
+ subLabel: {
+ fontSize: 12,
+ color: colors.lightGrey,
+ },
+ relayerNameLabel: {
+ fontSize: 16,
+ fontWeight: 'bold',
+ color: colors.black,
+ },
+};
+
+export const RelayerGridTile: React.StatelessComponent<RelayerGridTileProps> = (props: RelayerGridTileProps) => {
+ return (
+ <GridTile style={styles.root}>
+ <div style={styles.innerDiv}>
+ <img src={props.relayerInfo.headerUrl} style={styles.header} />
+ <div style={styles.body}>
+ <div className="py1" style={styles.relayerNameLabel}>
+ {props.relayerInfo.name}
+ </div>
+ <div style={styles.marketShareBar} />
+ <div className="py1" style={styles.subLabel}>
+ Market share
+ </div>
+ <TopTokens tokens={props.relayerInfo.topTokens} networkId={props.networkId} />
+ <div className="py1" style={styles.subLabel}>
+ Top tokens
+ </div>
+ </div>
+ </div>
+ </GridTile>
+ );
+};
diff --git a/packages/website/ts/components/relayer_index/relayer_index.tsx b/packages/website/ts/components/relayer_index/relayer_index.tsx
new file mode 100644
index 000000000..db3cf07b5
--- /dev/null
+++ b/packages/website/ts/components/relayer_index/relayer_index.tsx
@@ -0,0 +1,118 @@
+import { colors, Styles } from '@0xproject/react-shared';
+import { GridList } from 'material-ui/GridList';
+import * as React from 'react';
+
+import { RelayerGridTile } from 'ts/components/relayer_index/relayer_grid_tile';
+import { RelayerInfo } from 'ts/types';
+
+export interface RelayerIndexProps {
+ networkId: number;
+}
+
+const styles: Styles = {
+ root: {
+ width: '100%',
+ },
+ item: {
+ backgroundColor: colors.white,
+ borderBottomRightRadius: 10,
+ borderBottomLeftRadius: 10,
+ borderTopRightRadius: 10,
+ borderTopLeftRadius: 10,
+ boxShadow: `0px 4px 6px ${colors.walletBoxShadow}`,
+ overflow: 'hidden',
+ padding: 4,
+ },
+};
+
+// TODO: replace fake data with real, remote data
+const topTokens = [
+ {
+ address: '0x1dad4783cf3fe3085c1426157ab175a6119a04ba',
+ decimals: 18,
+ iconUrl: '/images/token_icons/makerdao.png',
+ isRegistered: true,
+ isTracked: true,
+ name: 'Maker DAO',
+ symbol: 'MKR',
+ },
+ {
+ address: '0x323b5d4c32345ced77393b3530b1eed0f346429d',
+ decimals: 18,
+ iconUrl: '/images/token_icons/melon.png',
+ isRegistered: true,
+ isTracked: true,
+ name: 'Melon Token',
+ symbol: 'MLN',
+ },
+ {
+ address: '0xb18845c260f680d5b9d84649638813e342e4f8c9',
+ decimals: 18,
+ iconUrl: '/images/token_icons/augur.png',
+ isRegistered: true,
+ isTracked: true,
+ name: 'Augur Reputation Token',
+ symbol: 'REP',
+ },
+];
+
+const relayerInfos: RelayerInfo[] = [
+ {
+ id: '1',
+ headerUrl: '/images/og_image.png',
+ name: 'Radar Relay',
+ marketShare: 0.5,
+ topTokens,
+ },
+ {
+ id: '2',
+ headerUrl: '/images/og_image.png',
+ name: 'Paradex',
+ marketShare: 0.5,
+ topTokens,
+ },
+ {
+ id: '3',
+ headerUrl: '/images/og_image.png',
+ name: 'yo',
+ marketShare: 0.5,
+ topTokens,
+ },
+ {
+ id: '4',
+ headerUrl: '/images/og_image.png',
+ name: 'test',
+ marketShare: 0.5,
+ topTokens,
+ },
+ {
+ id: '5',
+ headerUrl: '/images/og_image.png',
+ name: 'blahg',
+ marketShare: 0.5,
+ topTokens,
+ },
+ {
+ id: '6',
+ headerUrl: '/images/og_image.png',
+ name: 'hello',
+ marketShare: 0.5,
+ topTokens,
+ },
+];
+
+const CELL_HEIGHT = 260;
+const NUMBER_OF_COLUMNS = 4;
+const GRID_PADDING = 16;
+
+export const RelayerIndex: React.StatelessComponent<RelayerIndexProps> = (props: RelayerIndexProps) => {
+ return (
+ <div style={styles.root}>
+ <GridList cellHeight={CELL_HEIGHT} cols={NUMBER_OF_COLUMNS} padding={GRID_PADDING} style={styles.gridList}>
+ {relayerInfos.map((relayerInfo: RelayerInfo) => (
+ <RelayerGridTile key={relayerInfo.id} relayerInfo={relayerInfo} networkId={props.networkId} />
+ ))}
+ </GridList>
+ </div>
+ );
+};
diff --git a/packages/website/ts/components/relayer_index/relayer_top_tokens.tsx b/packages/website/ts/components/relayer_index/relayer_top_tokens.tsx
new file mode 100644
index 000000000..233590b78
--- /dev/null
+++ b/packages/website/ts/components/relayer_index/relayer_top_tokens.tsx
@@ -0,0 +1,46 @@
+import { colors, EtherscanLinkSuffixes, Styles, utils as sharedUtils } from '@0xproject/react-shared';
+import * as _ from 'lodash';
+import * as React from 'react';
+
+import { TokenIcon } from 'ts/components/ui/token_icon';
+import { Token } from 'ts/types';
+
+export interface TopTokensProps {
+ tokens: Token[];
+ networkId: number;
+}
+
+const styles: Styles = {
+ tokenLabel: {
+ textDecoration: 'none',
+ color: colors.mediumBlue,
+ },
+ followingTokenLabel: {
+ paddingLeft: 16,
+ },
+};
+
+export const TopTokens: React.StatelessComponent<TopTokensProps> = (props: TopTokensProps) => {
+ return (
+ <div className="flex">
+ {_.map(props.tokens, (token: Token, index: number) => {
+ const firstItemStyle = { ...styles.tokenLabel, ...styles.followingTokenLabel };
+ const style = index !== 0 ? firstItemStyle : styles.tokenLabel;
+ return (
+ <a
+ key={token.address}
+ href={tokenLinkFromToken(token, props.networkId)}
+ target="_blank"
+ style={style}
+ >
+ {token.symbol}
+ </a>
+ );
+ })}
+ </div>
+ );
+};
+
+function tokenLinkFromToken(token: Token, networkId: number) {
+ return sharedUtils.getEtherScanLinkIfExists(token.address, networkId, EtherscanLinkSuffixes.Address);
+}
diff --git a/packages/website/ts/components/wallet/wallet.tsx b/packages/website/ts/components/wallet/wallet.tsx
index 39c95d31c..d3dc8e3dd 100644
--- a/packages/website/ts/components/wallet/wallet.tsx
+++ b/packages/website/ts/components/wallet/wallet.tsx
@@ -71,7 +71,7 @@ interface AccessoryItemConfig {
}
const styles: Styles = {
- wallet: {
+ root: {
width: 346,
backgroundColor: colors.white,
borderBottomRightRadius: 10,
@@ -121,6 +121,10 @@ const ZRX_TOKEN_SYMBOL = 'ZRX';
const ETHER_SYMBOL = 'ETH';
const ICON_DIMENSION = 24;
const TOKEN_AMOUNT_DISPLAY_PRECISION = 3;
+const HEADER_ITEM_KEY = 'HEADER';
+const FOOTER_ITEM_KEY = 'FOOTER';
+const DISCONNECTED_ITEM_KEY = 'DISCONNECTED';
+const ETHER_ITEM_KEY = 'ETHER';
export class Wallet extends React.Component<WalletProps, WalletState> {
private _isUnmounted: boolean;
@@ -174,7 +178,7 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
}
public render() {
const isReadyToRender = this.props.blockchainIsLoaded && this.props.blockchainErr === BlockchainErrs.NoError;
- return <div style={styles.wallet}>{isReadyToRender && this._renderRows()}</div>;
+ return <div style={styles.root}>{isReadyToRender && this._renderRows()}</div>;
}
private _renderRows() {
const isAddressAvailable = !_.isEmpty(this.props.userAddress);
@@ -196,6 +200,7 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
const primaryText = 'wallet';
return (
<ListItem
+ key={HEADER_ITEM_KEY}
primaryText={primaryText.toUpperCase()}
leftIcon={<ActionAccountBalanceWallet color={colors.mediumBlue} />}
style={styles.paddedItem}
@@ -206,6 +211,7 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
private _renderDisconnectedRows() {
return (
<WalletDisconnectedItem
+ key={DISCONNECTED_ITEM_KEY}
providerType={this.props.providerType}
injectedProviderName={this.props.injectedProviderName}
onToggleLedgerDialog={this.props.onToggleLedgerDialog}
@@ -217,6 +223,7 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
const primaryText = utils.getAddressBeginAndEnd(userAddress);
return (
<ListItem
+ key={HEADER_ITEM_KEY}
primaryText={primaryText}
leftIcon={<Identicon address={userAddress} diameter={ICON_DIMENSION} />}
style={{ ...styles.paddedItem, ...styles.borderedItem }}
@@ -226,7 +233,7 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
}
private _renderFooterRows() {
const primaryText = '+ other tokens';
- return <ListItem primaryText={primaryText} innerDivStyle={styles.footerItemInnerDiv} />;
+ return <ListItem key={FOOTER_ITEM_KEY} primaryText={primaryText} innerDivStyle={styles.footerItemInnerDiv} />;
}
private _renderEthRows() {
const primaryText = this._renderAmount(
@@ -245,7 +252,7 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
: { ...styles.tokenItem, ...styles.borderedItem, ...styles.paddedItem };
const etherToken = this._getEthToken();
return (
- <div>
+ <div key={ETHER_ITEM_KEY}>
<ListItem
primaryText={primaryText}
leftIcon={<img style={{ width: ICON_DIMENSION, height: ICON_DIMENSION }} src={ETHER_ICON_PATH} />}
@@ -304,7 +311,7 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
: { ...styles.tokenItem, ...styles.borderedItem, ...styles.paddedItem };
const etherToken = this._getEthToken();
return (
- <div>
+ <div key={token.address}>
<ListItem
primaryText={amount}
leftIcon={this._renderTokenIcon(token, tokenLink)}
diff --git a/packages/website/ts/components/wallet/wrap_ether_item.tsx b/packages/website/ts/components/wallet/wrap_ether_item.tsx
index 3a876721a..a38163770 100644
--- a/packages/website/ts/components/wallet/wrap_ether_item.tsx
+++ b/packages/website/ts/components/wallet/wrap_ether_item.tsx
@@ -111,7 +111,7 @@ export class WrapEtherItem extends React.Component<WrapEtherItemProps, WrapEther
disableTouchRipple={true}
style={walletItemStyles.focusedItem}
innerDivStyle={styles.innerDiv}
- leftIcon={this.state.isEthConversionHappening && this._renderIsEthConversionHappeningSpinner()}
+ leftIcon={this._renderIsEthConversionHappeningSpinner()}
rightAvatar={this._renderWrapEtherConfirmationButton()}
/>
);
@@ -123,11 +123,11 @@ export class WrapEtherItem extends React.Component<WrapEtherItemProps, WrapEther
});
}
private _renderIsEthConversionHappeningSpinner() {
- return (
+ return this.state.isEthConversionHappening ? (
<div className="pl1" style={{ paddingTop: 10 }}>
<i className="zmdi zmdi-spinner zmdi-hc-spin" />
</div>
- );
+ ) : null;
}
private _renderWrapEtherConfirmationButton() {
const isWrappingEth = this.props.direction === Side.Deposit;
diff --git a/packages/website/ts/containers/zero_ex_js_documentation.ts b/packages/website/ts/containers/zero_ex_js_documentation.ts
index 6e893133f..da8922e79 100644
--- a/packages/website/ts/containers/zero_ex_js_documentation.ts
+++ b/packages/website/ts/containers/zero_ex_js_documentation.ts
@@ -121,6 +121,7 @@ const docsInfoConfig: DocsInfoConfig = {
'ExchangeContractErrs',
'ContractEvent',
'Token',
+ 'Provider',
'ExchangeEvents',
'IndexedFilterValues',
'SubscriptionOpts',
diff --git a/packages/website/ts/globals.d.ts b/packages/website/ts/globals.d.ts
index 2c2140485..719c2708a 100644
--- a/packages/website/ts/globals.d.ts
+++ b/packages/website/ts/globals.d.ts
@@ -1,8 +1,5 @@
-declare module 'react-tooltip';
declare module 'truffle-contract';
-declare module 'keccak';
declare module 'whatwg-fetch';
-declare module 'web3-provider-engine/subproviders/filters';
declare module 'thenby';
declare module 'react-document-title';
declare module 'react-ga';
@@ -14,119 +11,9 @@ declare module '*.json' {
/* tslint:enable */
}
-// tslint:disable:max-classes-per-file
-
-// find-version declarations
-declare function findVersions(version: string): string[];
-declare module 'find-versions' {
- export = findVersions;
-}
-
-// semver-sort declarations
-declare module 'semver-sort' {
- const desc: (versions: string[]) => string[];
-}
-
-// xml-js declarations
-declare interface XML2JSONOpts {
- compact?: boolean;
- spaces?: number;
-}
-declare module 'xml-js' {
- const xml2json: (xml: string, opts: XML2JSONOpts) => string;
-}
-
// This will be defined by default in TS 2.4
// Source: https://github.com/Microsoft/TypeScript/issues/12364
interface System {
import<T>(module: string): Promise<T>;
}
declare var System: System;
-
-// jsonschema declarations
-// Source: https://github.com/tdegrunt/jsonschema/blob/master/lib/index.d.ts
-declare interface Schema {
- id?: string;
- $schema?: string;
- title?: string;
- description?: string;
- multipleOf?: number;
- maximum?: number;
- exclusiveMaximum?: boolean;
- minimum?: number;
- exclusiveMinimum?: boolean;
- maxLength?: number;
- minLength?: number;
- pattern?: string;
- additionalItems?: boolean | Schema;
- items?: Schema | Schema[];
- maxItems?: number;
- minItems?: number;
- uniqueItems?: boolean;
- maxProperties?: number;
- minProperties?: number;
- required?: string[];
- additionalProperties?: boolean | Schema;
- definitions?: {
- [name: string]: Schema;
- };
- properties?: {
- [name: string]: Schema;
- };
- patternProperties?: {
- [name: string]: Schema;
- };
- dependencies?: {
- [name: string]: Schema | string[];
- };
- enum?: any[];
- type?: string | string[];
- allOf?: Schema[];
- anyOf?: Schema[];
- oneOf?: Schema[];
- not?: Schema;
- // This is the only property that's not defined in https://github.com/tdegrunt/jsonschema/blob/master/lib/index.d.ts
- // There is an open issue for that: https://github.com/tdegrunt/jsonschema/issues/194
- // There is also an opened PR: https://github.com/tdegrunt/jsonschema/pull/218/files
- // As soon as it gets merged we should be good to use types from 'jsonschema' package
- $ref?: string;
-}
-
-// blockies declarations
-declare interface BlockiesIcon {
- toDataURL(): string;
-}
-declare interface BlockiesConfig {
- seed: string;
-}
-declare function blockies(config: BlockiesConfig): BlockiesIcon;
-declare module 'blockies' {
- export = blockies;
-}
-
-// web3-provider-engine declarations
-declare class Subprovider {}
-declare module 'web3-provider-engine/subproviders/subprovider' {
- export = Subprovider;
-}
-declare module 'web3-provider-engine/subproviders/rpc' {
- import { JSONRPCRequestPayload } from '@0xproject/types';
- class RpcSubprovider {
- constructor(options: { rpcUrl: string });
- public handleRequest(
- payload: JSONRPCRequestPayload,
- next: () => void,
- end: (err: Error | null, data?: any) => void,
- ): void;
- }
- export = RpcSubprovider;
-}
-
-declare interface Artifact {
- abi: any;
- networks: {
- [networkId: number]: {
- address: string;
- };
- };
-}
diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts
index 901483327..dba59f704 100644
--- a/packages/website/ts/types.ts
+++ b/packages/website/ts/types.ts
@@ -490,4 +490,12 @@ export interface TokenState {
allowance: BigNumber;
isLoaded: boolean;
}
+
+export interface RelayerInfo {
+ headerUrl: string;
+ id: string;
+ name: string;
+ marketShare: number;
+ topTokens: Token[];
+}
// tslint:disable:max-file-line-count
diff --git a/packages/website/ts/utils/utils.ts b/packages/website/ts/utils/utils.ts
index 75597a7e2..afe159beb 100644
--- a/packages/website/ts/utils/utils.ts
+++ b/packages/website/ts/utils/utils.ts
@@ -1,5 +1,6 @@
-import { ECSignature, ExchangeContractErrs, Web3Provider, ZeroEx, ZeroExError } from '0x.js';
+import { ECSignature, ExchangeContractErrs, ZeroEx, ZeroExError } from '0x.js';
import { constants as sharedConstants, EtherscanLinkSuffixes, Networks } from '@0xproject/react-shared';
+import { Provider } from '@0xproject/types';
import { BigNumber } from '@0xproject/utils';
import deepEqual = require('deep-equal');
import * as _ from 'lodash';
@@ -8,7 +9,6 @@ import { Order, Providers, ScreenWidths, Side, SideToAssetToken, Token, TokenByA
import { configs } from 'ts/utils/configs';
import { constants } from 'ts/utils/constants';
import * as u2f from 'ts/vendor/u2f_api';
-import Web3 = require('web3');
const LG_MIN_EM = 64;
const MD_MIN_EM = 52;
@@ -273,7 +273,7 @@ export const utils = {
window.onload = () => resolve();
});
},
- getProviderType(provider: Web3.Provider): Providers | string {
+ getProviderType(provider: Provider): Providers | string {
const constructorName = provider.constructor.name;
let parsedProviderName = constructorName;
switch (constructorName) {