aboutsummaryrefslogtreecommitdiffstats
path: root/packages/instant
diff options
context:
space:
mode:
authorBrandon Millman <brandon@0xproject.com>2018-11-03 06:17:04 +0800
committerGitHub <noreply@github.com>2018-11-03 06:17:04 +0800
commit18fef7ade493798426417c7095d0458219423d14 (patch)
tree76b7ce89cc377078bc93ab39c19192601936617d /packages/instant
parent6a57a7b5be151114bb06c171560976b09a8c4aa1 (diff)
parent5fc2483be776cab90e7ff868b27536a85d6764c9 (diff)
downloaddexon-0x-contracts-18fef7ade493798426417c7095d0458219423d14.tar
dexon-0x-contracts-18fef7ade493798426417c7095d0458219423d14.tar.gz
dexon-0x-contracts-18fef7ade493798426417c7095d0458219423d14.tar.bz2
dexon-0x-contracts-18fef7ade493798426417c7095d0458219423d14.tar.lz
dexon-0x-contracts-18fef7ade493798426417c7095d0458219423d14.tar.xz
dexon-0x-contracts-18fef7ade493798426417c7095d0458219423d14.tar.zst
dexon-0x-contracts-18fef7ade493798426417c7095d0458219423d14.zip
Merge pull request #1209 from 0xProject/feature/instant/optional-provider
[instant] Provide optional provider API, fallback to injected provider
Diffstat (limited to 'packages/instant')
-rw-r--r--packages/instant/src/components/buy_button.tsx5
-rw-r--r--packages/instant/src/components/zero_ex_instant_provider.tsx30
-rw-r--r--packages/instant/src/index.umd.ts6
-rw-r--r--packages/instant/src/util/address.ts4
-rw-r--r--packages/instant/src/util/assert.ts2
-rw-r--r--packages/instant/src/util/injected_provider.ts16
-rw-r--r--packages/instant/src/util/provider.ts12
-rw-r--r--packages/instant/src/util/web3_wrapper.ts5
8 files changed, 46 insertions, 34 deletions
diff --git a/packages/instant/src/components/buy_button.tsx b/packages/instant/src/components/buy_button.tsx
index 12ac62601..9d9a8540c 100644
--- a/packages/instant/src/components/buy_button.tsx
+++ b/packages/instant/src/components/buy_button.tsx
@@ -1,4 +1,5 @@
import { AssetBuyer, AssetBuyerError, BuyQuote } from '@0x/asset-buyer';
+import { Web3Wrapper } from '@0x/web3-wrapper';
import * as _ from 'lodash';
import * as React from 'react';
import { oc } from 'ts-optchain';
@@ -10,7 +11,6 @@ import { getBestAddress } from '../util/address';
import { balanceUtil } from '../util/balance';
import { gasPriceEstimator } from '../util/gas_price_estimator';
import { util } from '../util/util';
-import { web3Wrapper } from '../util/web3_wrapper';
import { Button, Text } from './ui';
@@ -50,7 +50,8 @@ export class BuyButton extends React.Component<BuyButtonProps> {
}
this.props.onValidationPending(buyQuote);
- const takerAddress = await getBestAddress();
+ const web3Wrapper = new Web3Wrapper(assetBuyer.provider);
+ const takerAddress = await getBestAddress(web3Wrapper);
const hasSufficientEth = await balanceUtil.hasSufficientEth(takerAddress, buyQuote, web3Wrapper);
if (!hasSufficientEth) {
diff --git a/packages/instant/src/components/zero_ex_instant_provider.tsx b/packages/instant/src/components/zero_ex_instant_provider.tsx
index fce03a280..4bc840862 100644
--- a/packages/instant/src/components/zero_ex_instant_provider.tsx
+++ b/packages/instant/src/components/zero_ex_instant_provider.tsx
@@ -1,8 +1,11 @@
import { AssetBuyer } from '@0x/asset-buyer';
import { ObjectMap, SignedOrder } from '@0x/types';
+import { Web3Wrapper } from '@0x/web3-wrapper';
+import { Provider } from 'ethereum-types';
import * as _ from 'lodash';
import * as React from 'react';
-import { Provider } from 'react-redux';
+import { Provider as ReduxProvider } from 'react-redux';
+import { oc } from 'ts-optchain';
import { SelectedAssetThemeProvider } from '../containers/selected_asset_theme_provider';
import { asyncData } from '../redux/async_data';
@@ -14,8 +17,7 @@ import { assetUtils } from '../util/asset';
import { BigNumberInput } from '../util/big_number_input';
import { errorFlasher } from '../util/error_flasher';
import { gasPriceEstimator } from '../util/gas_price_estimator';
-import { getProvider } from '../util/provider';
-import { web3Wrapper } from '../util/web3_wrapper';
+import { getInjectedProvider } from '../util/injected_provider';
fonts.include();
@@ -29,6 +31,7 @@ export interface ZeroExInstantProviderRequiredProps {
}
export interface ZeroExInstantProviderOptionalProps {
+ provider: Provider;
defaultAssetBuyAmount: number;
additionalAssetMetaDataMap: ObjectMap<AssetMetaData>;
networkId: Network;
@@ -39,8 +42,8 @@ export class ZeroExInstantProvider extends React.Component<ZeroExInstantProvider
private readonly _store: Store;
private static _mergeInitialStateWithProps(props: ZeroExInstantProviderProps, state: State = INITIAL_STATE): State {
const networkId = props.networkId || state.network;
- // TODO: Provider needs to not be hard-coded to injected web3.
- const provider = getProvider();
+ // TODO: Proper wallet connect flow
+ const provider = props.provider || getInjectedProvider();
const assetBuyerOptions = {
networkId,
};
@@ -92,19 +95,24 @@ export class ZeroExInstantProvider extends React.Component<ZeroExInstantProvider
public render(): React.ReactNode {
return (
- <Provider store={this._store}>
+ <ReduxProvider store={this._store}>
<SelectedAssetThemeProvider>{this.props.children}</SelectedAssetThemeProvider>
- </Provider>
+ </ReduxProvider>
);
}
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]}.`;
- errorFlasher.flashNewErrorMessage(this._store.dispatch, errorMessage, msToShowError);
+ const assetBuyerIfExists = this._store.getState().assetBuyer;
+ const providerIfExists = oc(assetBuyerIfExists).provider();
+ if (!_.isUndefined(providerIfExists)) {
+ const web3Wrapper = new Web3Wrapper(providerIfExists);
+ const networkOfProvider = await web3Wrapper.getNetworkIdAsync();
+ if (network !== networkOfProvider) {
+ const errorMessage = `Wrong network detected. Try switching to ${Network[network]}.`;
+ errorFlasher.flashNewErrorMessage(this._store.dispatch, errorMessage, msToShowError);
+ }
}
};
}
diff --git a/packages/instant/src/index.umd.ts b/packages/instant/src/index.umd.ts
index 806187a16..b269ad741 100644
--- a/packages/instant/src/index.umd.ts
+++ b/packages/instant/src/index.umd.ts
@@ -25,8 +25,12 @@ export const render = (props: ZeroExInstantOverlayProps, selector: string = DEFA
assert.isNumber('props.zIndex', props.zIndex);
}
if (!_.isUndefined(props.affiliateInfo)) {
- assert.isValidaffiliateInfo('props.affiliateInfo', props.affiliateInfo);
+ assert.isValidAffiliateInfo('props.affiliateInfo', props.affiliateInfo);
}
+ if (!_.isUndefined(props.provider)) {
+ assert.isWeb3Provider('props.provider', props.provider);
+ }
+ assert.isString('selector', selector);
const appendToIfExists = document.querySelector(selector);
assert.assert(!_.isNull(appendToIfExists), `Could not find div with selector: ${selector}`);
const appendTo = appendToIfExists as Element;
diff --git a/packages/instant/src/util/address.ts b/packages/instant/src/util/address.ts
index 14d42d8c0..b21863a8e 100644
--- a/packages/instant/src/util/address.ts
+++ b/packages/instant/src/util/address.ts
@@ -1,6 +1,6 @@
-import { web3Wrapper } from '../util/web3_wrapper';
+import { Web3Wrapper } from '@0x/web3-wrapper';
-export const getBestAddress = async (): Promise<string | undefined> => {
+export const getBestAddress = async (web3Wrapper: Web3Wrapper): Promise<string | undefined> => {
const addresses = await web3Wrapper.getAvailableAddressesAsync();
return addresses[0];
};
diff --git a/packages/instant/src/util/assert.ts b/packages/instant/src/util/assert.ts
index 20f8ddaee..99e177993 100644
--- a/packages/instant/src/util/assert.ts
+++ b/packages/instant/src/util/assert.ts
@@ -41,7 +41,7 @@ export const assert = {
assert.isUri(`${variableName}.imageUrl`, metaData.imageUrl);
}
},
- isValidaffiliateInfo(variableName: string, affiliateInfo: AffiliateInfo): void {
+ isValidAffiliateInfo(variableName: string, affiliateInfo: AffiliateInfo): void {
assert.isETHAddressHex(`${variableName}.recipientAddress`, affiliateInfo.feeRecipient);
assert.isNumber(`${variableName}.percentage`, affiliateInfo.feePercentage);
assert.assert(
diff --git a/packages/instant/src/util/injected_provider.ts b/packages/instant/src/util/injected_provider.ts
new file mode 100644
index 000000000..40f9e2da5
--- /dev/null
+++ b/packages/instant/src/util/injected_provider.ts
@@ -0,0 +1,16 @@
+import { Provider } from 'ethereum-types';
+import * as _ from 'lodash';
+
+export const getInjectedProvider = (): Provider => {
+ const injectedProviderIfExists = (window as any).ethereum;
+ if (!_.isUndefined(injectedProviderIfExists)) {
+ // TODO: call enable here when implementing wallet connection flow
+ return injectedProviderIfExists;
+ }
+ const injectedWeb3IfExists = (window as any).web3;
+ if (!_.isUndefined(injectedWeb3IfExists.currentProvider)) {
+ return injectedWeb3IfExists.currentProvider;
+ } else {
+ throw new Error(`No injected web3 found`);
+ }
+};
diff --git a/packages/instant/src/util/provider.ts b/packages/instant/src/util/provider.ts
deleted file mode 100644
index 49705fd11..000000000
--- a/packages/instant/src/util/provider.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { Provider } from 'ethereum-types';
-
-export const getProvider = (): Provider => {
- const injectedWeb3 = (window as any).web3 || undefined;
- try {
- // Use MetaMask/Mist provider
- return injectedWeb3.currentProvider;
- } catch (err) {
- // Throws when user doesn't have MetaMask/Mist running
- throw new Error(`No injected web3 found: ${err}`);
- }
-};
diff --git a/packages/instant/src/util/web3_wrapper.ts b/packages/instant/src/util/web3_wrapper.ts
deleted file mode 100644
index 24dcd9076..000000000
--- a/packages/instant/src/util/web3_wrapper.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import { Web3Wrapper } from '@0x/web3-wrapper';
-
-import { getProvider } from './provider';
-
-export const web3Wrapper = new Web3Wrapper(getProvider());