From 1df074b73e05adf669b0cedc4bb1473e9e5631db Mon Sep 17 00:00:00 2001 From: fragosti Date: Thu, 12 Jul 2018 16:57:03 -0700 Subject: Make Analytics API non-async --- packages/website/ts/components/fill_order.tsx | 3 +- .../website/ts/components/forms/subscribe_form.tsx | 3 +- .../generate_order/generate_order_form.tsx | 6 +-- .../ts/components/inputs/allowance_toggle.tsx | 6 +-- .../onboarding/portal_onboarding_flow.tsx | 6 +-- packages/website/ts/components/portal/portal.tsx | 3 +- .../components/relayer_index/relayer_grid_tile.tsx | 3 +- .../relayer_index/relayer_top_tokens.tsx | 3 +- packages/website/ts/components/wallet/wallet.tsx | 6 +-- .../ts/components/wallet/wrap_ether_item.tsx | 12 ++---- packages/website/ts/redux/analyticsMiddleware.ts | 15 +++---- packages/website/ts/utils/analytics.ts | 47 ++++++++++------------ packages/website/ts/utils/utils.ts | 2 +- 13 files changed, 44 insertions(+), 71 deletions(-) (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/fill_order.tsx b/packages/website/ts/components/fill_order.tsx index e4838bc0f..ff63410c3 100644 --- a/packages/website/ts/components/fill_order.tsx +++ b/packages/website/ts/components/fill_order.tsx @@ -508,8 +508,7 @@ export class FillOrder extends React.Component { } private _trackOrderEvent(eventName: string): void { const parsedOrder = this.state.parsedOrder; - // tslint:disable-next-line:no-floating-promises - analytics.trackOrderEventAsync(eventName, parsedOrder); + analytics.trackOrderEvent(eventName, parsedOrder); } private async _onFillOrderClickFireAndForgetAsync(): Promise { if (this.props.blockchainErr !== BlockchainErrs.NoError || _.isEmpty(this.props.userAddress)) { diff --git a/packages/website/ts/components/forms/subscribe_form.tsx b/packages/website/ts/components/forms/subscribe_form.tsx index be0468b6f..ef19af644 100644 --- a/packages/website/ts/components/forms/subscribe_form.tsx +++ b/packages/website/ts/components/forms/subscribe_form.tsx @@ -114,8 +114,7 @@ export class SubscribeForm extends React.Component { ); } private _startOnboarding(): void { - // tslint:disable-next-line:no-floating-promises - analytics.trackAsync('Onboarding Started', { + analytics.track('Onboarding Started', { reason: 'manual', stepIndex: this.props.portalOnboardingStep, }); 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 475b79f8f..193dd237a 100644 --- a/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx +++ b/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx @@ -65,8 +65,7 @@ export const RelayerGridTile: React.StatelessComponent = ( const topTokens = props.relayerInfo.topTokens; const weeklyTxnVolume = props.relayerInfo.weeklyTxnVolume; const onClick = () => { - // tslint:disable-next-line:no-floating-promises - analytics.trackAsync('Relayer Click', { + analytics.track('Relayer Click', { name: props.relayerInfo.name, }); utils.openUrl(link); diff --git a/packages/website/ts/components/relayer_index/relayer_top_tokens.tsx b/packages/website/ts/components/relayer_index/relayer_top_tokens.tsx index 33783b406..f3787bd27 100644 --- a/packages/website/ts/components/relayer_index/relayer_top_tokens.tsx +++ b/packages/website/ts/components/relayer_index/relayer_top_tokens.tsx @@ -43,8 +43,7 @@ class TokenLink extends React.Component { public render(): React.ReactNode { const onClick = (event: React.MouseEvent) => { event.stopPropagation(); - // tslint:disable-next-line:no-floating-promises - analytics.trackAsync('Token Click', { + analytics.track('Token Click', { tokenSymbol: this.props.tokenInfo.symbol, }); const tokenLink = this._tokenLinkFromToken(this.props.tokenInfo, this.props.networkId); diff --git a/packages/website/ts/components/wallet/wallet.tsx b/packages/website/ts/components/wallet/wallet.tsx index 8523b819a..e462ab3e0 100644 --- a/packages/website/ts/components/wallet/wallet.tsx +++ b/packages/website/ts/components/wallet/wallet.tsx @@ -490,8 +490,7 @@ export class Wallet extends React.Component { private _openWrappedEtherActionRow(wrappedEtherDirection: Side): void { const action = wrappedEtherDirection === Side.Deposit ? 'Wallet - Wrap ETH Opened' : 'Wallet - Unwrap WETH Opened'; - // tslint:disable-next-line:no-floating-promises - analytics.trackAsync(action); + analytics.track(action); this.setState({ wrappedEtherDirection, }); @@ -499,8 +498,7 @@ export class Wallet extends React.Component { private _closeWrappedEtherActionRow(wrappedEtherDirection: Side): void { const action = wrappedEtherDirection === Side.Deposit ? 'Wallet - Wrap ETH Closed' : 'Wallet - Unwrap WETH Closed'; - // tslint:disable-next-line:no-floating-promises - analytics.trackAsync(action); + analytics.track(action); 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 9e3d06817..2b85b69be 100644 --- a/packages/website/ts/components/wallet/wrap_ether_item.tsx +++ b/packages/website/ts/components/wallet/wrap_ether_item.tsx @@ -196,15 +196,13 @@ export class WrapEtherItem extends React.Component next => action => { const nextState = (store.getState() as any) as State; switch (action.type) { case ActionTypes.UpdateInjectedProviderName: - // tslint:disable-next-line:no-floating-promises - analytics.addEventPropertiesAsync({ + analytics.addEventProperties({ injectedProviderName: nextState.injectedProviderName, }); break; case ActionTypes.UpdateNetworkId: - // tslint:disable-next-line:no-floating-promises - analytics.addEventPropertiesAsync({ + analytics.addEventProperties({ networkId: nextState.networkId, }); break; case ActionTypes.UpdateUserAddress: - // tslint:disable-next-line:no-floating-promises - analytics.addUserPropertiesAsync({ + analytics.addUserProperties({ ethAddress: nextState.userAddress, }); break; case ActionTypes.UpdateUserEtherBalance: if (nextState.userEtherBalanceInWei) { - // tslint:disable-next-line:no-floating-promises - analytics.addUserPropertiesAsync({ + analytics.addUserProperties({ ethBalance: nextState.userEtherBalanceInWei.toString(), }); } break; case ActionTypes.UpdatePortalOnboardingStep: - // tslint:disable-next-line:no-floating-promises - analytics.trackAsync('Update Onboarding Step', { + analytics.track('Update Onboarding Step', { stepIndex: nextState.portalOnboardingStep, }); break; diff --git a/packages/website/ts/utils/analytics.ts b/packages/website/ts/utils/analytics.ts index 2ff9f8918..e39998d7a 100644 --- a/packages/website/ts/utils/analytics.ts +++ b/packages/website/ts/utils/analytics.ts @@ -12,7 +12,6 @@ export interface HeapAnalytics { removeEventProperty(property: string): void; clearEventProperties(): void; } - export class Analytics { private _heap: HeapAnalytics; public static init(): Analytics { @@ -29,45 +28,39 @@ export class Analytics { constructor(heap: HeapAnalytics) { this._heap = heap; } + // tslint:disable:no-floating-promises // HeapAnalytics Wrappers - public async indentifyAsync(id: string, idType: string): Promise { - await this._heapLoadedGuardAsync(); - this._heap.indentify(id, idType); + public indentify(id: string, idType: string): void { + this._heapLoadedGuardAsync(() => this._heap.indentify(id, idType)); } - public async trackAsync(eventName: string, eventProperties?: ObjectMap): Promise { - await this._heapLoadedGuardAsync(); - this._heap.track(eventName, eventProperties); + public track(eventName: string, eventProperties?: ObjectMap): void { + this._heapLoadedGuardAsync(() => this._heap.track(eventName, eventProperties)); } - public async resetIdentityAsync(): Promise { - await this._heapLoadedGuardAsync(); - this._heap.resetIdentity(); + public resetIdentity(): void { + this._heapLoadedGuardAsync(() => this._heap.resetIdentity()); } - public async addUserPropertiesAsync(properties: ObjectMap): Promise { - await this._heapLoadedGuardAsync(); - this._heap.addUserProperties(properties); + public addUserProperties(properties: ObjectMap): void { + this._heapLoadedGuardAsync(() => this._heap.addUserProperties(properties)); } - public async addEventPropertiesAsync(properties: ObjectMap): Promise { - await this._heapLoadedGuardAsync(); - this._heap.addEventProperties(properties); + public addEventProperties(properties: ObjectMap): void { + this._heapLoadedGuardAsync(() => this._heap.addEventProperties(properties)); } - public async removeEventPropertyAsync(property: string): Promise { - await this._heapLoadedGuardAsync(); - this._heap.removeEventProperty(property); + public removeEventProperty(property: string): void { + this._heapLoadedGuardAsync(() => this._heap.removeEventProperty(property)); } - public async clearEventPropertiesAsync(): Promise { - await this._heapLoadedGuardAsync(); - this._heap.clearEventProperties(); + public clearEventProperties(): void { + this._heapLoadedGuardAsync(() => this._heap.clearEventProperties()); } + // tslint:enable:no-floating-promises // Custom methods - public async trackOrderEventAsync(eventName: string, order: Order): Promise { + public trackOrderEvent(eventName: string, order: Order): void { const orderLoggingData = { takerTokenAmount: order.signedOrder.takerTokenAmount, makeTokenAmount: order.signedOrder.makerTokenAmount, takerToken: order.metadata.takerToken.symbol, makerToken: order.metadata.makerToken.symbol, }; - // tslint:disable-next-line:no-floating-promises - this.trackAsync(eventName, orderLoggingData); + this.track(eventName, orderLoggingData); } /** * Heap is not available as a UMD module, and additionally has the strange property of replacing itself with @@ -75,13 +68,15 @@ export class Analytics { * Instead of having an await call before every analytics use, we opt to have the awaiting logic in here by * guarding every API call with the guard below. */ - private async _heapLoadedGuardAsync(): Promise { + private async _heapLoadedGuardAsync(callback: () => void): Promise { if (this._heap.loaded) { + callback(); return undefined; } await utils.onPageLoadPromise; // HACK: Reset heap to loaded heap this._heap = (window as any).heap; + callback(); } } diff --git a/packages/website/ts/utils/utils.ts b/packages/website/ts/utils/utils.ts index bd6a57eea..9c5e12ec7 100644 --- a/packages/website/ts/utils/utils.ts +++ b/packages/website/ts/utils/utils.ts @@ -318,7 +318,7 @@ export const utils = { resolve(); return; } - window.onload = () => resolve(); + window.onload = resolve; }), getProviderType(provider: Provider): Providers | string { const constructorName = provider.constructor.name; -- cgit v1.2.3