aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website/ts')
-rw-r--r--packages/website/ts/components/portal/portal.tsx8
-rw-r--r--packages/website/ts/components/relayer_index/relayer_grid_tile.tsx41
-rw-r--r--packages/website/ts/components/relayer_index/relayer_index.tsx2
-rw-r--r--packages/website/ts/components/top_bar/top_bar.tsx8
-rw-r--r--packages/website/ts/components/ui/input_label.tsx2
-rw-r--r--packages/website/ts/components/wallet/wallet.tsx31
-rw-r--r--packages/website/ts/containers/order_utils_documentation.ts99
-rw-r--r--packages/website/ts/index.tsx7
-rw-r--r--packages/website/ts/pages/about/about.tsx24
-rw-r--r--packages/website/ts/pages/documentation/doc_page.tsx1
-rw-r--r--packages/website/ts/pages/landing/landing.tsx25
-rw-r--r--packages/website/ts/pages/wiki/wiki.tsx2
-rw-r--r--packages/website/ts/types.ts11
-rw-r--r--packages/website/ts/utils/backend_client.ts56
-rw-r--r--packages/website/ts/utils/fetch_utils.ts33
-rw-r--r--packages/website/ts/utils/utils.ts3
16 files changed, 271 insertions, 82 deletions
diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx
index bf12c924f..88003a94e 100644
--- a/packages/website/ts/components/portal/portal.tsx
+++ b/packages/website/ts/components/portal/portal.tsx
@@ -9,7 +9,11 @@ import { BlockchainErrDialog } from 'ts/components/dialogs/blockchain_err_dialog
import { LedgerConfigDialog } from 'ts/components/dialogs/ledger_config_dialog';
import { PortalDisclaimerDialog } from 'ts/components/dialogs/portal_disclaimer_dialog';
import { RelayerIndex } from 'ts/components/relayer_index/relayer_index';
+<<<<<<< HEAD
import { TopBar, TopBarDisplayType } from 'ts/components/top_bar/top_bar';
+=======
+import { TopBar } from 'ts/components/top_bar/top_bar';
+>>>>>>> development
import { FlashMessage } from 'ts/components/ui/flash_message';
import { Wallet } from 'ts/components/wallet/wallet';
import { localStorage } from 'ts/local_storage/local_storage';
@@ -51,7 +55,11 @@ interface PortalState {
}
const THROTTLE_TIMEOUT = 100;
+<<<<<<< HEAD
const TOP_BAR_HEIGHT = TopBar.heightForDisplayType(TopBarDisplayType.Expanded);
+=======
+const TOP_BAR_HEIGHT = 60;
+>>>>>>> development
const styles: Styles = {
root: {
diff --git a/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx b/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx
index 0c4b2841c..0b9b8165e 100644
--- a/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx
+++ b/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx
@@ -12,8 +12,7 @@ export interface RelayerGridTileProps {
networkId: number;
}
-// TODO: Get top tokens and headerurl from remote
-const headerUrl = '/images/og_image.png';
+// TODO: Get top tokens from remote
const topTokens = [
{
address: '0x1dad4783cf3fe3085c1426157ab175a6119a04ba',
@@ -68,6 +67,9 @@ const styles: Styles = {
borderBottomLeftRadius: 4,
borderTopRightRadius: 4,
borderTopLeftRadius: 4,
+ borderWidth: 1,
+ borderStyle: 'solid',
+ borderColor: colors.walletBorder,
},
body: {
paddingLeft: 6,
@@ -92,24 +94,27 @@ const styles: Styles = {
};
export const RelayerGridTile: React.StatelessComponent<RelayerGridTileProps> = (props: RelayerGridTileProps) => {
+ const link = props.relayerInfo.appUrl || props.relayerInfo.url;
return (
- <GridTile style={styles.root}>
- <div style={styles.innerDiv}>
- <img src={headerUrl} style={styles.header} />
- <div style={styles.body}>
- <div className="py1" style={styles.relayerNameLabel}>
- {props.relayerInfo.name}
- </div>
- <div style={styles.dailyTradeVolumeLabel}>{props.relayerInfo.dailyTxnVolume}</div>
- <div className="py1" style={styles.subLabel}>
- Daily Trade Volume
- </div>
- <TopTokens tokens={topTokens} networkId={props.networkId} />
- <div className="py1" style={styles.subLabel}>
- Top tokens
+ <a href={link} target="_blank" style={{ textDecoration: 'none' }}>
+ <GridTile style={styles.root}>
+ <div style={styles.innerDiv}>
+ <img src={props.relayerInfo.headerImgUrl} style={styles.header} />
+ <div style={styles.body}>
+ <div className="py1" style={styles.relayerNameLabel}>
+ {props.relayerInfo.name}
+ </div>
+ <div style={styles.dailyTradeVolumeLabel}>{props.relayerInfo.dailyTxnVolume}</div>
+ <div className="py1" style={styles.subLabel}>
+ Daily Trade Volume
+ </div>
+ <TopTokens tokens={topTokens} networkId={props.networkId} />
+ <div className="py1" style={styles.subLabel}>
+ Top tokens
+ </div>
</div>
</div>
- </div>
- </GridTile>
+ </GridTile>
+ </a>
);
};
diff --git a/packages/website/ts/components/relayer_index/relayer_index.tsx b/packages/website/ts/components/relayer_index/relayer_index.tsx
index 1e92dba85..bc84cf9e8 100644
--- a/packages/website/ts/components/relayer_index/relayer_index.tsx
+++ b/packages/website/ts/components/relayer_index/relayer_index.tsx
@@ -66,7 +66,7 @@ export class RelayerIndex extends React.Component<RelayerIndexProps, RelayerInde
>
{this.state.relayerInfos.map((relayerInfo: WebsiteBackendRelayerInfo) => (
<RelayerGridTile
- key={relayerInfo.id}
+ key={relayerInfo.name}
relayerInfo={relayerInfo}
networkId={this.props.networkId}
/>
diff --git a/packages/website/ts/components/top_bar/top_bar.tsx b/packages/website/ts/components/top_bar/top_bar.tsx
index 8c842d2a5..2502bea6d 100644
--- a/packages/website/ts/components/top_bar/top_bar.tsx
+++ b/packages/website/ts/components/top_bar/top_bar.tsx
@@ -143,6 +143,12 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> {
primaryText={this.props.translate.get(Key.Web3Wrapper, Deco.CapWords)}
/>
</Link>,
+ <Link key="subMenuItem-order-utils" to={WebsitePaths.OrderUtils} className="text-decoration-none">
+ <MenuItem
+ style={{ fontSize: styles.menuItem.fontSize }}
+ primaryText={this.props.translate.get(Key.OrderUtils, Deco.CapWords)}
+ />
+ </Link>,
<Link key="subMenuItem-deployer" to={WebsitePaths.Deployer} className="text-decoration-none">
<MenuItem
style={{ fontSize: styles.menuItem.fontSize }}
@@ -199,7 +205,7 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> {
return (
<div style={{ ...styles.topBar, ...bottomBorderStyle, ...this.props.style, ...{ height } }} className="pb1">
<div className={parentClassNames}>
- <div className="col col-2 sm-pl2 md-pl2 lg-pl0" style={{ paddingTop: 15 }}>
+ <div className="col col-2 sm-pl1 md-pl2 lg-pl0" style={{ paddingTop: 15 }}>
<Link to={`${WebsitePaths.Home}`} className="text-decoration-none">
<img src={logoUrl} height="30" />
</Link>
diff --git a/packages/website/ts/components/ui/input_label.tsx b/packages/website/ts/components/ui/input_label.tsx
index 6a3f26155..8137c0db6 100644
--- a/packages/website/ts/components/ui/input_label.tsx
+++ b/packages/website/ts/components/ui/input_label.tsx
@@ -17,7 +17,7 @@ const styles = {
userSelect: 'none',
width: 240,
zIndex: 1,
- },
+ } as React.CSSProperties,
};
export const InputLabel = (props: InputLabelProps) => {
diff --git a/packages/website/ts/components/wallet/wallet.tsx b/packages/website/ts/components/wallet/wallet.tsx
index d1ae38550..057c712e5 100644
--- a/packages/website/ts/components/wallet/wallet.tsx
+++ b/packages/website/ts/components/wallet/wallet.tsx
@@ -461,16 +461,16 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
);
balanceAndAllowanceTupleByAddress[tokenAddress] = balanceAndAllowanceTuple;
}
- const pricesByAddress = await this._getPricesByAddressAsync(tokenAddresses);
+ const priceByAddress = await this._getPriceByAddressAsync(tokenAddresses);
const trackedTokenStateByAddress = _.reduce(
tokenAddresses,
(acc, address) => {
const [balance, allowance] = balanceAndAllowanceTupleByAddress[address];
- const price = pricesByAddress[address];
+ const priceIfExists = _.get(priceByAddress, address);
acc[address] = {
balance,
allowance,
- price,
+ price: priceIfExists,
isLoaded: true,
};
return acc;
@@ -487,16 +487,29 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
private async _refetchTokenStateAsync(tokenAddress: string) {
await this._fetchBalancesAndAllowancesAsync([tokenAddress]);
}
- private async _getPricesByAddressAsync(tokenAddresses: string[]): Promise<ItemByAddress<BigNumber>> {
+ private async _getPriceByAddressAsync(tokenAddresses: string[]): Promise<ItemByAddress<BigNumber>> {
if (_.isEmpty(tokenAddresses)) {
return {};
}
+ // for each input token address, search for the corresponding symbol in this.props.tokenByAddress, if it exists
+ // create a mapping from existing symbols -> address
+ const tokenAddressBySymbol: { [symbol: string]: string } = {};
+ _.each(tokenAddresses, address => {
+ const tokenIfExists = _.get(this.props.tokenByAddress, address);
+ if (!_.isUndefined(tokenIfExists)) {
+ const symbol = tokenIfExists.symbol;
+ tokenAddressBySymbol[symbol] = address;
+ }
+ });
+ const tokenSymbols = _.keys(tokenAddressBySymbol);
try {
- const websiteBackendPriceInfos = await backendClient.getPriceInfosAsync(tokenAddresses);
- const addresses = _.map(websiteBackendPriceInfos, info => info.address);
- const prices = _.map(websiteBackendPriceInfos, info => new BigNumber(info.price));
- const pricesByAddress = _.zipObject(addresses, prices);
- return pricesByAddress;
+ const priceBySymbol = await backendClient.getPriceInfoAsync(tokenSymbols);
+ const priceByAddress = _.mapKeys(priceBySymbol, (value, symbol) => _.get(tokenAddressBySymbol, symbol));
+ const result = _.mapValues(priceByAddress, price => {
+ const priceBigNumber = new BigNumber(price);
+ return priceBigNumber;
+ });
+ return result;
} catch (err) {
return {};
}
diff --git a/packages/website/ts/containers/order_utils_documentation.ts b/packages/website/ts/containers/order_utils_documentation.ts
new file mode 100644
index 000000000..64aa7300f
--- /dev/null
+++ b/packages/website/ts/containers/order_utils_documentation.ts
@@ -0,0 +1,99 @@
+import { constants as docConstants, DocsInfo, DocsInfoConfig, SupportedDocJson } from '@0xproject/react-docs';
+import * as _ from 'lodash';
+import * as React from 'react';
+import { connect } from 'react-redux';
+import { Dispatch } from 'redux';
+import { DocPage as DocPageComponent, DocPageProps } from 'ts/pages/documentation/doc_page';
+import { Dispatcher } from 'ts/redux/dispatcher';
+import { State } from 'ts/redux/reducer';
+import { DocPackages, Environments, WebsitePaths } from 'ts/types';
+import { configs } from 'ts/utils/configs';
+import { constants } from 'ts/utils/constants';
+import { Translate } from 'ts/utils/translate';
+
+/* tslint:disable:no-var-requires */
+const IntroMarkdown = require('md/docs/order_utils/introduction');
+const InstallationMarkdown = require('md/docs/order_utils/installation');
+/* tslint:enable:no-var-requires */
+
+const docSections = {
+ introduction: 'introduction',
+ installation: 'installation',
+ usage: 'usage',
+ types: 'types',
+};
+
+const docsInfoConfig: DocsInfoConfig = {
+ id: DocPackages.OrderUtils,
+ type: SupportedDocJson.TypeDoc,
+ displayName: 'Order utils',
+ packageUrl: 'https://github.com/0xProject/0x-monorepo',
+ menu: {
+ introduction: [docSections.introduction],
+ install: [docSections.installation],
+ usage: [docSections.usage],
+ types: [docSections.types],
+ },
+ sectionNameToMarkdown: {
+ [docSections.introduction]: IntroMarkdown,
+ [docSections.installation]: InstallationMarkdown,
+ },
+ sectionNameToModulePath: {
+ [docSections.usage]: [
+ '"order-utils/src/order_hash"',
+ '"order-utils/src/signature_utils"',
+ '"order-utils/src/order_factory"',
+ '"order-utils/src/salt"',
+ '"order-utils/src/assert"',
+ '"order-utils/src/constants"',
+ ],
+ [docSections.types]: ['"order-utils/src/types"', '"types/src/index"'],
+ },
+ menuSubsectionToVersionWhenIntroduced: {},
+ sections: docSections,
+ visibleConstructors: [],
+ typeConfigs: {
+ // Note: This needs to be kept in sync with the types exported in index.ts. Unfortunately there is
+ // currently no way to extract the re-exported types from index.ts via TypeDoc :(
+ publicTypes: [
+ 'OrderError',
+ 'Order',
+ 'SignedOrder',
+ 'ECSignature',
+ 'Provider',
+ 'JSONRPCRequestPayload',
+ 'JSONRPCResponsePayload',
+ 'JSONRPCErrorCallback',
+ ],
+ typeNameToExternalLink: {
+ BigNumber: constants.URL_BIGNUMBERJS_GITHUB,
+ },
+ },
+};
+const docsInfo = new DocsInfo(docsInfoConfig);
+
+interface ConnectedState {
+ docsVersion: string;
+ availableDocVersions: string[];
+ docsInfo: DocsInfo;
+ translate: Translate;
+}
+
+interface ConnectedDispatch {
+ dispatcher: Dispatcher;
+}
+
+const mapStateToProps = (state: State, ownProps: DocPageProps): ConnectedState => ({
+ docsVersion: state.docsVersion,
+ availableDocVersions: state.availableDocVersions,
+ translate: state.translate,
+ docsInfo,
+});
+
+const mapDispatchToProps = (dispatch: Dispatch<State>): ConnectedDispatch => ({
+ dispatcher: new Dispatcher(dispatch),
+});
+
+export const Documentation: React.ComponentClass<DocPageProps> = connect(mapStateToProps, mapDispatchToProps)(
+ DocPageComponent,
+);
diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx
index 7b7a7eb2e..1b1255214 100644
--- a/packages/website/ts/index.tsx
+++ b/packages/website/ts/index.tsx
@@ -66,6 +66,9 @@ const LazySolCovDocumentation = createLazyComponent('Documentation', async () =>
const LazySubprovidersDocumentation = createLazyComponent('Documentation', async () =>
System.import<any>(/* webpackChunkName: "subproviderDocs" */ 'ts/containers/subproviders_documentation'),
);
+const LazyOrderUtilsDocumentation = createLazyComponent('Documentation', async () =>
+ System.import<any>(/* webpackChunkName: "orderUtilsDocs" */ 'ts/containers/order_utils_documentation'),
+);
analytics.init();
// tslint:disable-next-line:no-floating-promises
@@ -99,6 +102,10 @@ render(
component={LazySubprovidersDocumentation}
/>
<Route
+ path={`${WebsitePaths.OrderUtils}/:version?`}
+ component={LazyOrderUtilsDocumentation}
+ />
+ <Route
path={`${WebsitePaths.Web3Wrapper}/:version?`}
component={LazyWeb3WrapperDocumentation}
/>
diff --git a/packages/website/ts/pages/about/about.tsx b/packages/website/ts/pages/about/about.tsx
index 97be59526..d78cca703 100644
--- a/packages/website/ts/pages/about/about.tsx
+++ b/packages/website/ts/pages/about/about.tsx
@@ -113,7 +113,7 @@ const teamRow4: ProfileInfo[] = [
{
name: 'Blake Henderson',
title: 'Operations Associate',
- description: `Operations and Analytics. Previously analytics at LinkedIn. Economics at UC San Diego. `,
+ description: `Operations and Analytics. Previously analytics at LinkedIn. Economics at UC San Diego.`,
image: '/images/team/blake.jpg',
linkedIn: 'https://www.linkedin.com/in/blakerhenderson/',
github: '',
@@ -130,6 +130,27 @@ const teamRow4: ProfileInfo[] = [
},
];
+const teamRow5: ProfileInfo[] = [
+ {
+ name: 'Greg Hysen',
+ title: 'Blockchain Engineer',
+ description: `Smart contract R&D. Previously lead distributed systems engineer at Hivemapper. Computer Science at University of Waterloo.`,
+ image: '/images/team/greg.jpeg',
+ linkedIn: 'https://www.linkedin.com/in/gregory-hysen-71741463/',
+ github: 'https://github.com/hysz',
+ medium: '',
+ },
+ {
+ name: 'Remco Bloemen',
+ title: 'Technical Fellow',
+ description: `Previously cofounder at Neufund and Coblue. Part III at Cambridge. PhD dropout at Twente Business School.`,
+ image: '/images/team/remco.jpeg',
+ linkedIn: 'https://www.linkedin.com/in/remcobloemen/',
+ github: 'http://github.com/recmo',
+ medium: '',
+ },
+];
+
const advisors: ProfileInfo[] = [
{
name: 'Fred Ehrsam',
@@ -223,6 +244,7 @@ export class About extends React.Component<AboutProps, AboutState> {
<div className="clearfix">{this._renderProfiles(teamRow2)}</div>
<div className="clearfix">{this._renderProfiles(teamRow3)}</div>
<div className="clearfix">{this._renderProfiles(teamRow4)}</div>
+ <div className="clearfix">{this._renderProfiles(teamRow5)}</div>
</div>
<div className="pt3 pb2">
<div
diff --git a/packages/website/ts/pages/documentation/doc_page.tsx b/packages/website/ts/pages/documentation/doc_page.tsx
index aca20447b..9feb27dac 100644
--- a/packages/website/ts/pages/documentation/doc_page.tsx
+++ b/packages/website/ts/pages/documentation/doc_page.tsx
@@ -34,6 +34,7 @@ const docIdToSubpackageName: { [id: string]: string } = {
[DocPackages.JSONSchemas]: 'json-schemas',
[DocPackages.SolCov]: 'sol-cov',
[DocPackages.Subproviders]: 'subproviders',
+ [DocPackages.OrderUtils]: 'order-utils',
};
export interface DocPageProps {
diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx
index f961220fd..a63c24fb7 100644
--- a/packages/website/ts/pages/landing/landing.tsx
+++ b/packages/website/ts/pages/landing/landing.tsx
@@ -37,6 +37,8 @@ interface Project {
}
const THROTTLE_TIMEOUT = 100;
+const WHATS_NEW_TITLE = '18 ideas for 0x relayers in 2018';
+const WHATS_NEW_URL = 'https://blog.0xproject.com/18-ideas-for-0x-relayers-in-2018-80a1498b955f';
const relayersAndDappProjects: Project[] = [
{
@@ -233,6 +235,7 @@ export class Landing extends React.Component<LandingProps, LandingState> {
return (
<div className="clearfix py4" style={{ backgroundColor: colors.heroGrey }}>
<div className="mx-auto max-width-4 clearfix">
+ {this._renderWhatsNew()}
<div className="lg-pt4 md-pt4 sm-pt2 lg-pb4 md-pb4 lg-my4 md-my4 sm-mt2 sm-mb4 clearfix">
<div className="col lg-col-5 md-col-5 col-12 sm-center">
<img src="/images/landing/hero_chip_image.png" height={isSmallScreen ? 300 : 395} />
@@ -302,6 +305,28 @@ export class Landing extends React.Component<LandingProps, LandingState> {
</div>
);
}
+ private _renderWhatsNew() {
+ return (
+ <div className="sm-center sm-px1">
+ <a href={WHATS_NEW_URL} target="_blank" className="inline-block text-decoration-none">
+ <div className="flex sm-pl0 md-pl2 lg-pl0" style={{ fontFamily: 'Roboto Mono', fontWeight: 600 }}>
+ <div
+ className="mr1 px1"
+ style={{
+ backgroundColor: colors.lightTurquois,
+ borderRadius: 3,
+ color: colors.heroGrey,
+ height: 23,
+ }}
+ >
+ New
+ </div>
+ <div style={{ color: colors.darkGrey }}>{WHATS_NEW_TITLE}</div>
+ </div>
+ </a>
+ </div>
+ );
+ }
private _renderProjects(projects: Project[], title: string, backgroundColor: string, isTitleCenter: boolean) {
const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm;
const projectList = _.map(projects, (project: Project, i: number) => {
diff --git a/packages/website/ts/pages/wiki/wiki.tsx b/packages/website/ts/pages/wiki/wiki.tsx
index 7ed2b750d..edca5834d 100644
--- a/packages/website/ts/pages/wiki/wiki.tsx
+++ b/packages/website/ts/pages/wiki/wiki.tsx
@@ -47,7 +47,7 @@ const styles: Styles = {
left: 0,
bottom: 0,
right: 0,
- overflowZ: 'hidden',
+ overflow: 'hidden',
height: `calc(100vh - ${TOP_BAR_HEIGHT}px)`,
WebkitOverflowScrolling: 'touch',
},
diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts
index 2544e6735..2754075a7 100644
--- a/packages/website/ts/types.ts
+++ b/packages/website/ts/types.ts
@@ -361,6 +361,7 @@ export enum WebsitePaths {
JSONSchemas = '/docs/json-schemas',
SolCov = '/docs/sol-cov',
Subproviders = '/docs/subproviders',
+ OrderUtils = '/docs/order-utils',
Jobs = '/jobs',
}
@@ -373,6 +374,7 @@ export enum DocPackages {
JSONSchemas = 'JSON_SCHEMAS',
SolCov = 'SOL_COV',
Subproviders = 'SUBPROVIDERS',
+ OrderUtils = 'ORDER_UTILS',
}
export enum Key {
@@ -431,6 +433,7 @@ export enum Key {
Whitepaper = 'WHITEPAPER',
Wiki = 'WIKI',
Web3Wrapper = 'WEB3_WRAPPER',
+ OrderUtils = 'ORDER_UTILS',
And = 'AND',
Faq = 'FAQ',
SmartContracts = 'SMART_CONTRACTS',
@@ -500,17 +503,17 @@ export interface TokenState {
price?: BigNumber;
}
-// TODO: Add topTokens and headerUrl properties once available from backend
+// TODO: Add topTokens property once available from backend
export interface WebsiteBackendRelayerInfo {
- id: string;
name: string;
dailyTxnVolume: string;
url: string;
+ appUrl?: string;
+ headerImgUrl: string;
}
export interface WebsiteBackendPriceInfo {
- price: string;
- address: string;
+ [symbol: string]: string;
}
export interface WebsiteBackendGasInfo {
diff --git a/packages/website/ts/utils/backend_client.ts b/packages/website/ts/utils/backend_client.ts
index fdbb3e03a..63e06fda7 100644
--- a/packages/website/ts/utils/backend_client.ts
+++ b/packages/website/ts/utils/backend_client.ts
@@ -1,16 +1,8 @@
-import { BigNumber, logUtils } from '@0xproject/utils';
import * as _ from 'lodash';
-import * as queryString from 'query-string';
-import {
- ArticlesBySection,
- ItemByAddress,
- WebsiteBackendGasInfo,
- WebsiteBackendPriceInfo,
- WebsiteBackendRelayerInfo,
-} from 'ts/types';
+import { ArticlesBySection, WebsiteBackendGasInfo, WebsiteBackendPriceInfo, WebsiteBackendRelayerInfo } from 'ts/types';
import { configs } from 'ts/utils/configs';
-import { errorReporter } from 'ts/utils/error_reporter';
+import { fetchUtils } from 'ts/utils/fetch_utils';
const ETH_GAS_STATION_ENDPOINT = '/eth_gas_station';
const PRICES_ENDPOINT = '/prices';
@@ -19,52 +11,26 @@ const WIKI_ENDPOINT = '/wiki';
export const backendClient = {
async getGasInfoAsync(): Promise<WebsiteBackendGasInfo> {
- const result = await requestAsync(ETH_GAS_STATION_ENDPOINT);
+ const result = await fetchUtils.requestAsync(configs.BACKEND_BASE_URL, ETH_GAS_STATION_ENDPOINT);
return result;
},
- async getPriceInfosAsync(tokenAddresses: string[]): Promise<WebsiteBackendPriceInfo[]> {
- if (_.isEmpty(tokenAddresses)) {
- return [];
+ async getPriceInfoAsync(tokenSymbols: string[]): Promise<WebsiteBackendPriceInfo> {
+ if (_.isEmpty(tokenSymbols)) {
+ return {};
}
- const joinedTokenAddresses = tokenAddresses.join(',');
+ const joinedTokenSymbols = tokenSymbols.join(',');
const queryParams = {
- tokens: joinedTokenAddresses,
+ tokens: joinedTokenSymbols,
};
- const result = await requestAsync(PRICES_ENDPOINT, queryParams);
+ const result = await fetchUtils.requestAsync(configs.BACKEND_BASE_URL, PRICES_ENDPOINT, queryParams);
return result;
},
async getRelayerInfosAsync(): Promise<WebsiteBackendRelayerInfo[]> {
- const result = await requestAsync(RELAYERS_ENDPOINT);
+ const result = await fetchUtils.requestAsync(configs.BACKEND_BASE_URL, RELAYERS_ENDPOINT);
return result;
},
async getWikiArticlesBySectionAsync(): Promise<ArticlesBySection> {
- const result = await requestAsync(WIKI_ENDPOINT);
+ const result = await fetchUtils.requestAsync(configs.BACKEND_BASE_URL, WIKI_ENDPOINT);
return result;
},
};
-
-async function requestAsync(endpoint: string, queryParams?: object): Promise<any> {
- const query = queryStringFromQueryParams(queryParams);
- const url = `${configs.BACKEND_BASE_URL}${endpoint}${query}`;
- const response = await fetch(url);
- if (response.status !== 200) {
- const errorText = `Error requesting url: ${url}, ${response.status}: ${response.statusText}`;
- logUtils.log(errorText);
- const error = Error(errorText);
- // tslint:disable-next-line:no-floating-promises
- errorReporter.reportAsync(error);
- throw error;
- }
- const result = await response.json();
- return result;
-}
-
-function queryStringFromQueryParams(queryParams?: object): string {
- // if params are undefined or empty, return an empty string
- if (_.isUndefined(queryParams) || _.isEmpty(queryParams)) {
- return '';
- }
- // stringify the formatted object
- const stringifiedParams = queryString.stringify(queryParams);
- return `?${stringifiedParams}`;
-}
diff --git a/packages/website/ts/utils/fetch_utils.ts b/packages/website/ts/utils/fetch_utils.ts
new file mode 100644
index 000000000..d2e902db5
--- /dev/null
+++ b/packages/website/ts/utils/fetch_utils.ts
@@ -0,0 +1,33 @@
+import { logUtils } from '@0xproject/utils';
+import * as _ from 'lodash';
+import * as queryString from 'query-string';
+
+import { errorReporter } from 'ts/utils/error_reporter';
+
+export const fetchUtils = {
+ async requestAsync(baseUrl: string, path: string, queryParams?: object): Promise<any> {
+ const query = queryStringFromQueryParams(queryParams);
+ const url = `${baseUrl}${path}${query}`;
+ const response = await fetch(url);
+ if (response.status !== 200) {
+ const errorText = `Error requesting url: ${url}, ${response.status}: ${response.statusText}`;
+ logUtils.log(errorText);
+ const error = Error(errorText);
+ // tslint:disable-next-line:no-floating-promises
+ errorReporter.reportAsync(error);
+ throw error;
+ }
+ const result = await response.json();
+ return result;
+ },
+};
+
+function queryStringFromQueryParams(queryParams?: object): string {
+ // if params are undefined or empty, return an empty string
+ if (_.isUndefined(queryParams) || _.isEmpty(queryParams)) {
+ return '';
+ }
+ // stringify the formatted object
+ const stringifiedParams = queryString.stringify(queryParams);
+ return `?${stringifiedParams}`;
+}
diff --git a/packages/website/ts/utils/utils.ts b/packages/website/ts/utils/utils.ts
index 53d60b3ce..0d77b9e72 100644
--- a/packages/website/ts/utils/utils.ts
+++ b/packages/website/ts/utils/utils.ts
@@ -1,4 +1,5 @@
import { ECSignature, ExchangeContractErrs, ZeroEx, ZeroExError } from '0x.js';
+import { OrderError } from '@0xproject/order-utils';
import { constants as sharedConstants, EtherscanLinkSuffixes, Networks } from '@0xproject/react-shared';
import { Provider } from '@0xproject/types';
import { BigNumber } from '@0xproject/utils';
@@ -202,7 +203,7 @@ export const utils = {
[ZeroExError.ZRXContractDoesNotExist]: 'ZRX contract does not exist',
[ZeroExError.UnhandledError]: 'Unhandled error occured',
[ZeroExError.UserHasNoAssociatedAddress]: 'User has no addresses available',
- [ZeroExError.InvalidSignature]: 'Order signature is not valid',
+ [OrderError.InvalidSignature]: 'Order signature is not valid',
[ZeroExError.ContractNotDeployedOnNetwork]: 'Contract is not deployed on the detected network',
[ZeroExError.InvalidJump]: 'Invalid jump occured while executing the transaction',
[ZeroExError.OutOfGas]: 'Transaction ran out of gas',