aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--packages/asset-buyer/CHANGELOG.json9
-rw-r--r--packages/asset-buyer/src/asset_buyer.ts5
-rw-r--r--packages/instant/public/index.html43
-rw-r--r--packages/instant/src/components/sliding_error.tsx16
-rw-r--r--packages/instant/src/components/zero_ex_instant.tsx61
-rw-r--r--packages/instant/src/util/asset.ts5
-rw-r--r--packages/instant/src/util/error.ts5
-rw-r--r--yarn.lock9
8 files changed, 114 insertions, 39 deletions
diff --git a/packages/asset-buyer/CHANGELOG.json b/packages/asset-buyer/CHANGELOG.json
index 7ebcd8c2f..5d6604ea9 100644
--- a/packages/asset-buyer/CHANGELOG.json
+++ b/packages/asset-buyer/CHANGELOG.json
@@ -1,5 +1,14 @@
[
{
+ "version": "2.2.0",
+ "changes": [
+ {
+ "note": "`getAssetBuyerForProvidedOrders` factory function now takes 3 args instead of 4",
+ "pr": 1187
+ }
+ ]
+ },
+ {
"version": "2.1.0",
"changes": [
{
diff --git a/packages/asset-buyer/src/asset_buyer.ts b/packages/asset-buyer/src/asset_buyer.ts
index 74f3cb471..34e2d9639 100644
--- a/packages/asset-buyer/src/asset_buyer.ts
+++ b/packages/asset-buyer/src/asset_buyer.ts
@@ -52,16 +52,13 @@ export class AssetBuyer {
public static getAssetBuyerForProvidedOrders(
provider: Provider,
orders: SignedOrder[],
- feeOrders: SignedOrder[] = [],
options: Partial<AssetBuyerOpts> = {},
): AssetBuyer {
assert.isWeb3Provider('provider', provider);
assert.doesConformToSchema('orders', orders, schemas.signedOrdersSchema);
- assert.doesConformToSchema('feeOrders', feeOrders, schemas.signedOrdersSchema);
assert.areValidProvidedOrders('orders', orders);
- assert.areValidProvidedOrders('feeOrders', feeOrders);
assert.assert(orders.length !== 0, `Expected orders to contain at least one order`);
- const orderProvider = new BasicOrderProvider(_.concat(orders, feeOrders));
+ const orderProvider = new BasicOrderProvider(orders);
const assetBuyer = new AssetBuyer(provider, orderProvider, options);
return assetBuyer;
}
diff --git a/packages/instant/public/index.html b/packages/instant/public/index.html
index 14555fc64..9f1dfdb64 100644
--- a/packages/instant/public/index.html
+++ b/packages/instant/public/index.html
@@ -6,6 +6,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>0x Instant Dev Environment</title>
<script type="text/javascript" src="/main.bundle.js" charset="utf-8"></script>
+ <script type="text/javascript" src="https://unpkg.com/jsuri@1.3.1/Uri.js" charset="utf-8"></script>
+ <script type="text/javascript" src="https://unpkg.com/bignumber.js@4.1.0/bignumber.js" charset="utf-8"></script>
<style>
#zeroExInstantContainer {
display: flex;
@@ -24,10 +26,47 @@
<body>
<div id="zeroExInstantContainer"></div>
<script>
- zeroExInstant.render({
+ const removeUndefined = (obj) => {
+ for (let k in obj) if (obj[k] === undefined) delete obj[k];
+ return obj;
+ }
+ BigNumber.config({
+ EXPONENTIAL_AT: 1000,
+ DECIMAL_PLACES: 78,
+ });
+ const providedOrder = {
+ senderAddress: '0x0000000000000000000000000000000000000000',
+ makerAddress: '0x14e2f1f157e7dd4057d02817436d628a37120fd1',
+ takerAddress: '0x0000000000000000000000000000000000000000',
+ makerFee: new BigNumber('0'),
+ takerFee: new BigNumber('0'),
+ makerAssetAmount: new BigNumber('100000000000000000000'),
+ takerAssetAmount: new BigNumber('10000000000000000'),
+ makerAssetData: '0xf47261b00000000000000000000000002002d3812f58e35f0ea1ffbf80a75a38c32175fa',
+ takerAssetData: '0xf47261b0000000000000000000000000d0a1e359811322d97991e03f863a0c30c2cf029c',
+ expirationTimeSeconds: new BigNumber('1591858800'),
+ feeRecipientAddress: '0x0000000000000000000000000000000000000000',
+ salt: new BigNumber(
+ '54983920541892966634674340965984367456810207583416050222519063020710969340046',
+ ),
+ signature:
+ '0x1b949656218421c845995457303569a656764afa2b979d41dcefff0009d57ce15001490268bc7caa4269894fd83b741465fc5a7a53eda6ece17eb91fb32655d83703',
+ exchangeAddress: '0x35dd2932454449b14cee11a94d3674a936d5d7b2',
+ };
+ const queryParams = new Uri(window.location.search);
+ const renderOptionsDefaults = {
liquiditySource: 'https://api.radarrelay.com/0x/v2/',
assetData: '0xf47261b0000000000000000000000000e41d2489571d322189246dafa5ebde1f4699f498',
- });
+ }
+ const liquiditySourceOverride = queryParams.getQueryParamValue('liquiditySource');
+ const renderOptionsOverrides = {
+ liquiditySource: liquiditySourceOverride === 'provided' ? [providedOrder] : liquiditySourceOverride,
+ assetData: queryParams.getQueryParamValue('assetData'),
+ networkId: +queryParams.getQueryParamValue('networkId') || undefined,
+ defaultAssetBuyAmount: +queryParams.getQueryParamValue('defaultAssetBuyAmount') || undefined,
+ }
+ const renderOptions = Object.assign({}, renderOptionsDefaults, removeUndefined(renderOptionsOverrides));
+ zeroExInstant.render(renderOptions);
</script>
</body>
diff --git a/packages/instant/src/components/sliding_error.tsx b/packages/instant/src/components/sliding_error.tsx
index 3865a8797..2b55597ec 100644
--- a/packages/instant/src/components/sliding_error.tsx
+++ b/packages/instant/src/components/sliding_error.tsx
@@ -4,7 +4,7 @@ import { ColorOption } from '../style/theme';
import { SlideDownAnimation, SlideUpAnimation } from './animations/slide_animations';
-import { Container, Text } from './ui';
+import { Container, Flex, Text } from './ui';
export interface ErrorProps {
icon: string;
@@ -20,12 +20,14 @@ export const Error: React.StatelessComponent<ErrorProps> = props => (
borderRadius="6px"
marginBottom="10px"
>
- <Container marginRight="5px" display="inline" top="3px" position="relative">
- <Text fontSize="20px">{props.icon}</Text>
- </Container>
- <Text fontWeight="500" fontColor={ColorOption.darkOrange}>
- {props.message}
- </Text>
+ <Flex>
+ <Container marginRight="5px" display="inline" top="3px" position="relative">
+ <Text fontSize="20px">{props.icon}</Text>
+ </Container>
+ <Text fontWeight="500" fontColor={ColorOption.darkOrange}>
+ {props.message}
+ </Text>
+ </Flex>
</Container>
);
diff --git a/packages/instant/src/components/zero_ex_instant.tsx b/packages/instant/src/components/zero_ex_instant.tsx
index ffa5a8250..8454de43c 100644
--- a/packages/instant/src/components/zero_ex_instant.tsx
+++ b/packages/instant/src/components/zero_ex_instant.tsx
@@ -1,5 +1,7 @@
import { AssetBuyer } from '@0x/asset-buyer';
-import { ObjectMap } from '@0x/types';
+import { ObjectMap, SignedOrder } from '@0x/types';
+import { BigNumber } from '@0x/utils';
+import * as _ from 'lodash';
import * as React from 'react';
import { Provider } from 'react-redux';
@@ -10,7 +12,9 @@ import { store, Store } from '../redux/store';
import { fonts } from '../style/fonts';
import { AssetMetaData, Network } from '../types';
import { assetUtils } from '../util/asset';
+import { errorUtil } from '../util/error';
import { getProvider } from '../util/provider';
+import { web3Wrapper } from '../util/web3_wrapper';
import { ZeroExInstantContainer } from './zero_ex_instant_container';
@@ -21,28 +25,34 @@ export type ZeroExInstantProps = ZeroExInstantRequiredProps & Partial<ZeroExInst
export interface ZeroExInstantRequiredProps {
// TODO: Change API when we allow the selection of different assetDatas
assetData: string;
- // TODO: Allow for a function that returns orders
- liquiditySource: string;
+ liquiditySource: string | SignedOrder[];
}
export interface ZeroExInstantOptionalProps {
+ defaultAssetBuyAmount?: number;
additionalAssetMetaDataMap: ObjectMap<AssetMetaData>;
- network: Network;
+ networkId: Network;
}
export class ZeroExInstant extends React.Component<ZeroExInstantProps> {
private readonly _store: Store;
private static _mergeInitialStateWithProps(props: ZeroExInstantProps, state: State = INITIAL_STATE): State {
- // Create merged object such that properties in props override default settings
- const optionalPropsWithDefaults: ZeroExInstantOptionalProps = {
- additionalAssetMetaDataMap: props.additionalAssetMetaDataMap || {},
- network: props.network || state.network,
- };
- const { network } = optionalPropsWithDefaults;
+ const networkId = props.networkId || state.network;
// TODO: Provider needs to not be hard-coded to injected web3.
- const assetBuyer = AssetBuyer.getAssetBuyerForStandardRelayerAPIUrl(getProvider(), props.liquiditySource, {
- networkId: network,
- });
+ const provider = getProvider();
+ const assetBuyerOptions = {
+ networkId,
+ };
+ let assetBuyer;
+ if (_.isString(props.liquiditySource)) {
+ assetBuyer = AssetBuyer.getAssetBuyerForStandardRelayerAPIUrl(
+ provider,
+ props.liquiditySource,
+ assetBuyerOptions,
+ );
+ } else {
+ assetBuyer = AssetBuyer.getAssetBuyerForProvidedOrders(provider, props.liquiditySource, assetBuyerOptions);
+ }
const completeAssetMetaDataMap = {
...props.additionalAssetMetaDataMap,
...state.assetMetaDataMap,
@@ -50,17 +60,26 @@ export class ZeroExInstant extends React.Component<ZeroExInstantProps> {
const storeStateFromProps: State = {
...state,
assetBuyer,
- network,
- selectedAsset: assetUtils.createAssetFromAssetData(props.assetData, completeAssetMetaDataMap, network),
+ network: networkId,
+ selectedAsset: assetUtils.createAssetFromAssetData(props.assetData, completeAssetMetaDataMap, networkId),
+ selectedAssetAmount: _.isUndefined(props.defaultAssetBuyAmount)
+ ? state.selectedAssetAmount
+ : new BigNumber(props.defaultAssetBuyAmount),
assetMetaDataMap: completeAssetMetaDataMap,
};
return storeStateFromProps;
}
constructor(props: ZeroExInstantProps) {
super(props);
- this._store = store.create(ZeroExInstant._mergeInitialStateWithProps(this.props, INITIAL_STATE));
+ const initialAppState = ZeroExInstant._mergeInitialStateWithProps(this.props, INITIAL_STATE);
+ this._store = store.create(initialAppState);
+ }
+
+ public componentDidMount(): void {
// tslint:disable-next-line:no-floating-promises
asyncData.fetchAndDispatchToStore(this._store);
+ // tslint:disable-next-line:no-floating-promises
+ this._flashErrorIfWrongNetwork();
}
public render(): React.ReactNode {
@@ -72,4 +91,14 @@ export class ZeroExInstant extends React.Component<ZeroExInstantProps> {
</Provider>
);
}
+
+ private readonly _flashErrorIfWrongNetwork = async (): Promise<void> => {
+ const msToShowError = 30000; // 30 seconds
+ const network = this._store.getState().network;
+ const networkOfProvider = await web3Wrapper.getNetworkIdAsync();
+ if (network !== networkOfProvider) {
+ const errorMessage = `Wrong network detected. Try switching to ${Network[network]}.`;
+ errorUtil.errorFlasher.flashNewError(this._store.dispatch, errorMessage, msToShowError);
+ }
+ };
}
diff --git a/packages/instant/src/util/asset.ts b/packages/instant/src/util/asset.ts
index 4e3b2b946..d7e87eebb 100644
--- a/packages/instant/src/util/asset.ts
+++ b/packages/instant/src/util/asset.ts
@@ -18,7 +18,10 @@ export const assetUtils = {
getMetaDataOrThrow: (assetData: string, metaDataMap: ObjectMap<AssetMetaData>, network: Network): AssetMetaData => {
let mainnetAssetData: string | undefined = assetData;
if (network !== Network.Mainnet) {
- mainnetAssetData = assetUtils.getAssociatedAssetDataIfExists(assetData, network);
+ const mainnetAssetDataIfExists = assetUtils.getAssociatedAssetDataIfExists(assetData, network);
+ // Just so we don't fail in the case where we are on a non-mainnet network,
+ // but pass in a valid mainnet assetData.
+ mainnetAssetData = mainnetAssetDataIfExists || assetData;
}
if (_.isUndefined(mainnetAssetData)) {
throw new Error(ZeroExInstantError.AssetMetaDataNotAvailable);
diff --git a/packages/instant/src/util/error.ts b/packages/instant/src/util/error.ts
index 64c1f4885..844a28d8b 100644
--- a/packages/instant/src/util/error.ts
+++ b/packages/instant/src/util/error.ts
@@ -1,4 +1,5 @@
import { AssetBuyerError } from '@0x/asset-buyer';
+import * as _ from 'lodash';
import { Dispatch } from 'redux';
import { Action, actions } from '../redux/actions';
@@ -10,7 +11,6 @@ class ErrorFlasher {
private _timeoutId?: number;
public flashNewError(dispatch: Dispatch<Action>, error: any, delayMs: number = 7000): void {
this._clearTimeout();
-
// dispatch new message
dispatch(actions.setError(error));
@@ -60,6 +60,9 @@ export const errorUtil = {
if (error instanceof Error) {
bestMessage = humanReadableMessageForError(error, asset);
}
+ if (_.isString(error)) {
+ bestMessage = error;
+ }
return {
icon: '😢',
message: bestMessage || 'Something went wrong...',
diff --git a/yarn.lock b/yarn.lock
index 95650a2d7..f0064bff1 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6730,7 +6730,7 @@ ganache-core@0xProject/ganache-core#monorepo-dep:
ethereumjs-tx "0xProject/ethereumjs-tx#fake-tx-include-signature-by-default"
ethereumjs-util "^5.2.0"
ethereumjs-vm "2.3.5"
- ethereumjs-wallet "0.6.0"
+ ethereumjs-wallet "~0.6.0"
fake-merkle-patricia-tree "~1.0.1"
heap "~0.2.6"
js-scrypt "^0.2.0"
@@ -12533,13 +12533,6 @@ react-scroll@0xproject/react-scroll#pr-330-and-replace-state:
lodash.throttle "^4.1.1"
prop-types "^15.5.8"
-react-scroll@0xproject/react-scroll#similar-to-pr-330-but-with-replace-state:
- version "1.7.10"
- resolved "https://codeload.github.com/0xproject/react-scroll/tar.gz/0f625b270d7e966313cac8b811c0ae807b37e170"
- dependencies:
- lodash.throttle "^4.1.1"
- prop-types "^15.5.8"
-
react-side-effect@^1.0.2, react-side-effect@^1.1.0:
version "1.1.5"
resolved "https://registry.yarnpkg.com/react-side-effect/-/react-side-effect-1.1.5.tgz#f26059e50ed9c626d91d661b9f3c8bb38cd0ff2d"
generated by cgit (git 2.34.1) at 2024-10-04 03:24:25 +0800