aboutsummaryrefslogtreecommitdiffstats
path: root/packages/instant/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'packages/instant/src/components')
-rw-r--r--packages/instant/src/components/erc20_asset_amount_input.tsx12
-rw-r--r--packages/instant/src/components/zero_ex_instant_container.tsx13
-rw-r--r--packages/instant/src/components/zero_ex_instant_provider.tsx17
3 files changed, 35 insertions, 7 deletions
diff --git a/packages/instant/src/components/erc20_asset_amount_input.tsx b/packages/instant/src/components/erc20_asset_amount_input.tsx
index 520ac33d5..b825255c4 100644
--- a/packages/instant/src/components/erc20_asset_amount_input.tsx
+++ b/packages/instant/src/components/erc20_asset_amount_input.tsx
@@ -22,7 +22,8 @@ export interface ERC20AssetAmountInputProps {
onSelectAssetClick?: (asset?: ERC20Asset) => void;
startingFontSizePx: number;
fontColor?: ColorOption;
- isDisabled: boolean;
+ isInputDisabled: boolean;
+ canSelectOtherAsset: boolean;
numberOfAssetsAvailable?: number;
}
@@ -50,14 +51,15 @@ export class ERC20AssetAmountInput extends React.Component<ERC20AssetAmountInput
);
}
private readonly _renderContentForAsset = (asset: ERC20Asset): React.ReactNode => {
- const { onChange, ...rest } = this.props;
- const amountBorderBottom = this.props.isDisabled ? '' : `1px solid ${transparentWhite}`;
+ const { onChange, isInputDisabled, ...rest } = this.props;
+ const amountBorderBottom = isInputDisabled ? '' : `1px solid ${transparentWhite}`;
const onSymbolClick = this._generateSelectAssetClickHandler();
return (
<React.Fragment>
<Container borderBottom={amountBorderBottom} display="inline-block">
<ScalingAmountInput
{...rest}
+ isDisabled={isInputDisabled}
textLengthThreshold={this._textLengthThresholdForAsset(asset)}
maxFontSizePx={this.props.startingFontSizePx}
onAmountChange={this._handleChange}
@@ -74,11 +76,11 @@ export class ERC20AssetAmountInput extends React.Component<ERC20AssetAmountInput
fontSize={`${this.state.currentFontSizePx}px`}
fontColor={ColorOption.white}
textTransform="uppercase"
- onClick={onSymbolClick}
+ onClick={this.props.canSelectOtherAsset ? onSymbolClick : undefined}
>
{assetUtils.formattedSymbolForAsset(asset)}
</Text>
- {this._renderChevronIcon()}
+ {this.props.canSelectOtherAsset && this._renderChevronIcon()}
</Flex>
</Container>
</React.Fragment>
diff --git a/packages/instant/src/components/zero_ex_instant_container.tsx b/packages/instant/src/components/zero_ex_instant_container.tsx
index 698bfef17..47c938472 100644
--- a/packages/instant/src/components/zero_ex_instant_container.tsx
+++ b/packages/instant/src/components/zero_ex_instant_container.tsx
@@ -1,5 +1,7 @@
import * as React from 'react';
+import PoweredByLogo from '../assets/powered_by_0x.svg';
+import { ZERO_EX_SITE_URL } from '../constants';
import { AvailableERC20TokenSelector } from '../containers/available_erc20_token_selector';
import { ConnectedBuyOrderProgressOrPaymentMethod } from '../containers/connected_buy_order_progress_or_payment_method';
import { CurrentStandardSlidingPanel } from '../containers/current_standard_sliding_panel';
@@ -64,6 +66,17 @@ export class ZeroExInstantContainer extends React.Component<{}, ZeroExInstantCon
</SlidingPanel>
<CurrentStandardSlidingPanel />
</Container>
+ <Container
+ display={{ sm: 'none', default: 'block' }}
+ marginTop="10px"
+ marginLeft="auto"
+ marginRight="auto"
+ width="140px"
+ >
+ <a href={ZERO_EX_SITE_URL} target="_blank">
+ <PoweredByLogo />
+ </a>
+ </Container>
</Container>
</React.Fragment>
);
diff --git a/packages/instant/src/components/zero_ex_instant_provider.tsx b/packages/instant/src/components/zero_ex_instant_provider.tsx
index 8be53ee20..9814aabf8 100644
--- a/packages/instant/src/components/zero_ex_instant_provider.tsx
+++ b/packages/instant/src/components/zero_ex_instant_provider.tsx
@@ -12,6 +12,7 @@ import { DEFAULT_STATE, DefaultState, State } from '../redux/reducer';
import { store, Store } from '../redux/store';
import { fonts } from '../style/fonts';
import { AccountState, AffiliateInfo, AssetMetaData, Network, OrderSource } from '../types';
+import { analytics, disableAnalytics } from '../util/analytics';
import { assetUtils } from '../util/asset';
import { errorFlasher } from '../util/error_flasher';
import { gasPriceEstimator } from '../util/gas_price_estimator';
@@ -19,8 +20,6 @@ import { Heartbeater } from '../util/heartbeater';
import { generateAccountHeartbeater, generateBuyQuoteHeartbeater } from '../util/heartbeater_factory';
import { providerStateFactory } from '../util/provider_state_factory';
-fonts.include();
-
export type ZeroExInstantProviderProps = ZeroExInstantProviderRequiredProps &
Partial<ZeroExInstantProviderOptionalProps>;
@@ -36,6 +35,7 @@ export interface ZeroExInstantProviderOptionalProps {
additionalAssetMetaDataMap: ObjectMap<AssetMetaData>;
networkId: Network;
affiliateInfo: AffiliateInfo;
+ shouldDisableAnalyticsTracking: boolean;
}
export class ZeroExInstantProvider extends React.Component<ZeroExInstantProviderProps> {
@@ -86,6 +86,7 @@ export class ZeroExInstantProvider extends React.Component<ZeroExInstantProvider
}
constructor(props: ZeroExInstantProviderProps) {
super(props);
+ fonts.include();
const initialAppState = ZeroExInstantProvider._mergeDefaultStateWithProps(this.props);
this._store = store.create(initialAppState);
}
@@ -121,6 +122,18 @@ export class ZeroExInstantProvider extends React.Component<ZeroExInstantProvider
gasPriceEstimator.getGasInfoAsync();
// tslint:disable-next-line:no-floating-promises
this._flashErrorIfWrongNetwork();
+
+ // Analytics
+ disableAnalytics(this.props.shouldDisableAnalyticsTracking || false);
+ analytics.addEventProperties({
+ embeddedHost: window.location.host,
+ embeddedUrl: window.location.href,
+ networkId: state.network,
+ providerName: state.providerState.name,
+ gitSha: process.env.GIT_SHA,
+ npmVersion: process.env.NPM_PACKAGE_VERSION,
+ });
+ analytics.trackInstantOpened();
}
public componentWillUnmount(): void {
if (this._accountUpdateHeartbeat) {