From 37d60dc39ea6476c3185e124175cb02d5e830250 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Fri, 16 Nov 2018 08:51:41 -0800 Subject: Typesafe analytic actions --- .../src/components/zero_ex_instant_provider.tsx | 3 +- packages/instant/src/redux/analytics_middleware.ts | 6 ++- packages/instant/src/util/analytics.ts | 50 +++++++++++----------- packages/instant/src/util/heap.ts | 19 +++++++- 4 files changed, 50 insertions(+), 28 deletions(-) (limited to 'packages') diff --git a/packages/instant/src/components/zero_ex_instant_provider.tsx b/packages/instant/src/components/zero_ex_instant_provider.tsx index cfc542a59..77adca472 100644 --- a/packages/instant/src/components/zero_ex_instant_provider.tsx +++ b/packages/instant/src/components/zero_ex_instant_provider.tsx @@ -19,6 +19,7 @@ import { gasPriceEstimator } from '../util/gas_price_estimator'; import { Heartbeater } from '../util/heartbeater'; import { generateAccountHeartbeater, generateBuyQuoteHeartbeater } from '../util/heartbeater_factory'; import { providerStateFactory } from '../util/provider_state_factory'; +import { analyticsMiddleware } from '../redux/analytics_middleware'; fonts.include(); @@ -129,7 +130,7 @@ export class ZeroExInstantProvider extends React.Component next => middlewareAction switch (nextAction.type) { case ActionTypes.SET_ACCOUNT_STATE_READY: - if (curAccount.state === AccountState.Ready && !_.isEqual(curAccount, prevAccount)) { + if (curAccount.state === AccountState.Ready && prevAccount.state !== AccountState.Ready) { const ethAddress = curAccount.address; analytics.addUserProperties({ ethAddress }); - analytics.track('Wallet - Ready'); + analytics.walletReady({ + numAssetsAvailable: curState.availableAssets ? curState.availableAssets.length : 0, + }); } break; case ActionTypes.UPDATE_ACCOUNT_ETH_BALANCE: diff --git a/packages/instant/src/util/analytics.ts b/packages/instant/src/util/analytics.ts index dd595529d..30193839e 100644 --- a/packages/instant/src/util/analytics.ts +++ b/packages/instant/src/util/analytics.ts @@ -1,35 +1,37 @@ import { ObjectMap } from '@0x/types'; -import { logUtils } from '@0x/utils'; -import { ANALYTICS_ENABLED } from '../constants'; +import { heapUtil } from './heap'; -import { HeapAnalytics, heapUtil } from './heap'; - -const evaluteHeapCall = (heapFunctionCall: (heap: HeapAnalytics) => void): void => { - if (!ANALYTICS_ENABLED) { - return; - } - - const curHeap = heapUtil.getHeap(); - if (curHeap) { - try { - heapFunctionCall(curHeap); - } catch (e) { - // We never want analytics to crash our React component - // TODO: error reporter here - logUtils.log('Analytics error', e); - } - } +enum EventNames { + WALLET_OPENED = 'Wallet - Opened', + WALLET_READY = 'Wallet - Ready', + WIDGET_OPENED = 'Widget - Opened', +} +const track = (eventName: EventNames, eventData: ObjectMap = {}): void => { + heapUtil.evaluateHeapCall(heap => heap.track(eventName, eventData)); }; +function trackingEventFnWithoutPayload(eventName: EventNames): () => void { + return () => { + track(eventName); + }; +} +function trackingEventFnWithPayload>( + eventName: EventNames, +): (eventDataProperties: T) => void { + return (eventDataProperties: T) => { + track(eventName, eventDataProperties); + }; +} export const analytics = { + // TODO(sk): make these more specific addUserProperties: (properties: ObjectMap): void => { - evaluteHeapCall(heap => heap.addUserProperties(properties)); + heapUtil.evaluateHeapCall(heap => heap.addUserProperties(properties)); }, addEventProperties: (properties: ObjectMap): void => { - evaluteHeapCall(heap => heap.addEventProperties(properties)); - }, - track: (eventName: string, eventProperties?: ObjectMap): void => { - evaluteHeapCall(heap => heap.track(eventName, eventProperties)); + heapUtil.evaluateHeapCall(heap => heap.addEventProperties(properties)); }, + walletOpened: trackingEventFnWithoutPayload(EventNames.WALLET_OPENED), + walletReady: trackingEventFnWithPayload<{ numAssetsAvailable: number }>(EventNames.WALLET_READY), + widgetOpened: trackingEventFnWithoutPayload(EventNames.WIDGET_OPENED), }; diff --git a/packages/instant/src/util/heap.ts b/packages/instant/src/util/heap.ts index 6d3c75ea7..5fd61b4c9 100644 --- a/packages/instant/src/util/heap.ts +++ b/packages/instant/src/util/heap.ts @@ -1,6 +1,7 @@ import { ObjectMap } from '@0x/types'; +import { logUtils } from '@0x/utils'; -import { HEAP_ANALYTICS_DEVELOPMENT_APP_ID } from '../constants'; +import { ANALYTICS_ENABLED, HEAP_ANALYTICS_DEVELOPMENT_APP_ID } from '../constants'; export interface HeapAnalytics { loaded: boolean; @@ -82,4 +83,20 @@ export const heapUtil = { return setupZeroExInstantHeap(); }, + evaluateHeapCall: (heapFunctionCall: (heap: HeapAnalytics) => void): void => { + if (!ANALYTICS_ENABLED) { + return; + } + + const curHeap = heapUtil.getHeap(); + if (curHeap) { + try { + heapFunctionCall(curHeap); + } catch (e) { + // We never want analytics to crash our React component + // TODO: error reporter here + logUtils.log('Analytics error', e); + } + } + }, }; -- cgit v1.2.3