crowetic/protocol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor common fetch logic into fetch_utils

Browse Source
This commit is contained in:
Brandon Millman
2018-04-22 13:27:16 -04:00
parent e51f9b3593
commit fb31c49317
3 changed files with 62 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
packages/website/ts/components/wallet/wallet.tsx
View File

@@ -40,6 +40,7 @@ import { backendClient } from 'ts/utils/backend_client';
import { configs } from 'ts/utils/configs';
import { constants } from 'ts/utils/constants';
import { errorReporter } from 'ts/utils/error_reporter';
import { fetchUtils } from 'ts/utils/fetch_utils';
import { utils } from 'ts/utils/utils';
import { styles as walletItemStyles } from 'ts/utils/wallet_item_styles';
@@ -130,6 +131,7 @@ const FOOTER_ITEM_KEY = 'FOOTER';
const DISCONNECTED_ITEM_KEY = 'DISCONNECTED';
const ETHER_ITEM_KEY = 'ETHER';
const USD_DECIMAL_PLACES = 2;
const CRYPTO_COMPARE_MULTI_ENDPOINT = '/pricemulti';
export class Wallet extends React.Component<WalletProps, WalletState> {
private _isUnmounted: boolean;
@@ -511,24 +513,29 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
),
);
const joinedTokenSymbols = _.keys(tokenAddressBySymbol).join(',');
const url = `${configs.CRYPTO_COMPARE_BASE_URL}/pricemulti?fsyms=${joinedTokenSymbols}&tsyms=USD`;
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);
const baseCurrency = 'USD';
const queryParams = {
fsyms: joinedTokenSymbols,
tsyms: baseCurrency,
};
try {
const priceInfoBySymbol = await fetchUtils.requestAsync(
configs.CRYPTO_COMPARE_BASE_URL,
CRYPTO_COMPARE_MULTI_ENDPOINT,
queryParams,
);
const priceInfoByAddress = _.mapKeys(priceInfoBySymbol, (value, symbol) =>
_.get(tokenAddressBySymbol, symbol),
);
const result = _.mapValues(priceInfoByAddress, priceInfo => {
const price = _.get(priceInfo, baseCurrency);
const priceBigNumber = new BigNumber(price);
return priceBigNumber;
});
return result;
} catch (err) {
return {};
}
const priceInfoBySymbol = await response.json();
const priceInfoByAddress = _.mapKeys(priceInfoBySymbol, (value, symbol) => _.get(tokenAddressBySymbol, symbol));
const result = _.mapValues(priceInfoByAddress, priceInfo => {
const price = _.get(priceInfo, 'USD');
const priceBigNumber = new BigNumber(price);
return priceBigNumber;
});
return result;
}
private _openWrappedEtherActionRow(wrappedEtherDirection: Side) {
this.setState({

46
packages/website/ts/utils/backend_client.ts
View File

@@ -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,7 +11,7 @@ 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[]> {
@@ -30,41 +22,15 @@ export const backendClient = {
const queryParams = {
tokens: joinedTokenAddresses,
};
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}`;
}

33
packages/website/ts/utils/fetch_utils.ts Normal file
View File

@@ -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}`;
}