diff --git a/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx b/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx
index bf52684d7e..086cddc52e 100644
--- a/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx
+++ b/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx
@@ -1,12 +1,15 @@
+import { constants as sharedConstants } from '@0xproject/react-shared';
import * as _ from 'lodash';
import * as React from 'react';
import { BigNumber } from '@0xproject/utils';
+import { analytics } from 'ts/utils/analytics';
import { OnboardingFlow, Step } from 'ts/components/onboarding/onboarding_flow';
import { ProviderType, TokenByAddress, TokenStateByAddress } from 'ts/types';
import { utils } from 'ts/utils/utils';
export interface PortalOnboardingFlowProps {
+ networkId: number;
stepIndex: number;
isRunning: boolean;
userAddress: string;
@@ -34,8 +37,8 @@ export class PortalOnboardingFlow extends React.Component
);
}
@@ -122,7 +125,19 @@ export class PortalOnboardingFlow extends React.Component {
}
private _startOnboarding(): void {
+ const networkName = sharedConstants.NETWORK_NAME_BY_ID[this.props.networkId];
+ analytics.logEvent('Portal', 'Onboarding Started - Manual', networkName, this.props.portalOnboardingStep);
this.props.dispatcher.updatePortalOnboardingShowing(true);
}
private _renderWalletSection(): React.ReactNode {
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 fbb6341642..7ff8208b09 100644
--- a/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx
+++ b/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx
@@ -1,7 +1,8 @@
-import { Styles } from '@0xproject/react-shared';
+import { constants as sharedConstants, Styles } from '@0xproject/react-shared';
import * as _ from 'lodash';
import { GridTile } from 'material-ui/GridList';
import * as React from 'react';
+import { analytics } from 'ts/utils/analytics';
import { TopTokens } from 'ts/components/relayer_index/relayer_top_tokens';
import { Container } from 'ts/components/ui/container';
@@ -64,10 +65,14 @@ export const RelayerGridTile: React.StatelessComponent = (
const link = props.relayerInfo.appUrl || props.relayerInfo.url;
const topTokens = props.relayerInfo.topTokens;
const weeklyTxnVolume = props.relayerInfo.weeklyTxnVolume;
+ let trackRelayerClick = (): void => undefined;
+ const networkName = sharedConstants.NETWORK_NAME_BY_ID[props.networkId];
+ const eventLabel = `${props.relayerInfo.name}-${networkName}`;
+ trackRelayerClick = () => analytics.logEvent('Portal', 'Relayer Click', eventLabel);
return (
-
+
{
cursor: 'pointer',
opacity: this.state.isHovering ? 0.5 : 1,
};
+ const networkName = sharedConstants.NETWORK_NAME_BY_ID[this.props.networkId];
+ const eventLabel = `${this.props.tokenInfo.symbol}-${networkName}`;
+ const trackTokenClick = () => analytics.logEvent('Portal', 'Token Click', eventLabel);
return (
{
style={style}
onMouseEnter={this._onToggleHover.bind(this, true)}
onMouseLeave={this._onToggleHover.bind(this, false)}
+ onClick={trackTokenClick}
>
{this.props.tokenInfo.symbol}
diff --git a/packages/website/ts/components/wallet/wallet.tsx b/packages/website/ts/components/wallet/wallet.tsx
index f80be6313d..237e863063 100644
--- a/packages/website/ts/components/wallet/wallet.tsx
+++ b/packages/website/ts/components/wallet/wallet.tsx
@@ -1,9 +1,10 @@
-import { EtherscanLinkSuffixes, Styles, utils as sharedUtils } from '@0xproject/react-shared';
+import { constants as sharedConstants, EtherscanLinkSuffixes, Styles, utils as sharedUtils } from '@0xproject/react-shared';
import { BigNumber, errorUtils } from '@0xproject/utils';
import { Web3Wrapper } from '@0xproject/web3-wrapper';
import * as _ from 'lodash';
import CircularProgress from 'material-ui/CircularProgress';
import FloatingActionButton from 'material-ui/FloatingActionButton';
+
import { ListItem } from 'material-ui/List';
import ActionAccountBalanceWallet from 'material-ui/svg-icons/action/account-balance-wallet';
import ContentAdd from 'material-ui/svg-icons/content/add';
@@ -12,6 +13,7 @@ import * as React from 'react';
import { Link } from 'react-router-dom';
import firstBy = require('thenby');
+import { analytics } from 'ts/utils/analytics';
import { Blockchain } from 'ts/blockchain';
import { AllowanceToggle } from 'ts/components/inputs/allowance_toggle';
import { Container } from 'ts/components/ui/container';
@@ -495,18 +497,24 @@ export class Wallet extends React.Component {
}
}
const onClick = isWrappedEtherDirectionOpen
- ? this._closeWrappedEtherActionRow.bind(this)
+ ? this._closeWrappedEtherActionRow.bind(this, wrappedEtherDirection)
: this._openWrappedEtherActionRow.bind(this, wrappedEtherDirection);
return (
);
}
private _openWrappedEtherActionRow(wrappedEtherDirection: Side): void {
+ const networkName = sharedConstants.NETWORK_NAME_BY_ID[this.props.networkId];
+ const action = wrappedEtherDirection === Side.Deposit ? 'Wallet - Wrap ETH Opened' : 'Wallet - Unwrap WETH Opened';
+ analytics.logEvent('Portal', action, networkName);
this.setState({
wrappedEtherDirection,
});
}
- private _closeWrappedEtherActionRow(): void {
+ private _closeWrappedEtherActionRow(wrappedEtherDirection: Side): void {
+ const networkName = sharedConstants.NETWORK_NAME_BY_ID[this.props.networkId];
+ const action = wrappedEtherDirection === Side.Deposit ? 'Wallet - Wrap ETH Closed' : 'Wallet - Unwrap WETH Closed';
+ analytics.logEvent('Portal', action, networkName);
this.setState({
wrappedEtherDirection: undefined,
});
diff --git a/packages/website/ts/components/wallet/wrap_ether_item.tsx b/packages/website/ts/components/wallet/wrap_ether_item.tsx
index f652571423..1651595caf 100644
--- a/packages/website/ts/components/wallet/wrap_ether_item.tsx
+++ b/packages/website/ts/components/wallet/wrap_ether_item.tsx
@@ -1,4 +1,4 @@
-import { Styles } from '@0xproject/react-shared';
+import { constants as sharedConstants, Styles } from '@0xproject/react-shared';
import { BigNumber, logUtils } from '@0xproject/utils';
import { Web3Wrapper } from '@0xproject/web3-wrapper';
import * as _ from 'lodash';
@@ -6,6 +6,7 @@ import FlatButton from 'material-ui/FlatButton';
import * as React from 'react';
import { Blockchain } from 'ts/blockchain';
+import { analytics } from 'ts/utils/analytics';
import { EthAmountInput } from 'ts/components/inputs/eth_amount_input';
import { TokenAmountInput } from 'ts/components/inputs/token_amount_input';
import { Dispatcher } from 'ts/redux/dispatcher';
@@ -186,6 +187,7 @@ export class WrapEtherItem extends React.Component ({
+ networkId: state.networkId,
stepIndex: state.portalOnboardingStep,
isRunning: state.isPortalOnboardingShowing,
userAddress: state.userAddress,