diff --git a/src/ui/analytics.js b/src/ui/analytics.js index b8bf48261..a30af33c6 100644 --- a/src/ui/analytics.js +++ b/src/ui/analytics.js @@ -14,6 +14,7 @@ type Analytics = { toggle: (boolean, ?boolean) => void, apiLogView: (string, string, string, ?number, ?() => void) => void, apiLogPublish: () => void, + tagFollowEvent: (string, boolean, string) => void, }; let analyticsEnabled: boolean = true; @@ -23,12 +24,14 @@ const analytics: Analytics = { ReactGA.pageview(path); } }, - setUser: user => { - // Commented out because currently there is some delay before we know the user - // We should retrieve this server side so we have it immediately - // if (analyticsEnabled && user.id) { - // ReactGA.set('userId', user.id); - // } + setUser: userId => { + if (analyticsEnabled && userId) { + ReactGA.event({ + category: 'User', + action: 'userId', + value: userId, + }); + } }, toggle: (enabled: boolean): void => { // Always collect analytics on lbry.tv @@ -78,6 +81,15 @@ const analytics: Analytics = { Lbryio.call('feedback', 'search', { query, vote }); } }, + tagFollowEvent: (tag, following, location) => { + if (analyticsEnabled) { + ReactGA.event({ + category: 'Tag', + action: following ? 'follow' : 'unfollow', + value: tag, + }); + } + }, }; // Initialize google analytics diff --git a/src/ui/component/app/view.jsx b/src/ui/component/app/view.jsx index 0c82d2233..fc28aa29c 100644 --- a/src/ui/component/app/view.jsx +++ b/src/ui/component/app/view.jsx @@ -1,5 +1,6 @@ // @flow import React, { useEffect, useRef } from 'react'; +import analytics from 'analytics'; import Router from 'component/router/index'; import ModalRouter from 'modal/modalRouter'; import ReactModal from 'react-modal'; @@ -16,15 +17,17 @@ type Props = { pageTitle: ?string, language: string, theme: string, + user: ?{ id: string }, fetchRewards: () => void, fetchRewardedContent: () => void, fetchTransactions: () => void, }; function App(props: Props) { - const { theme, fetchRewards, fetchRewardedContent, fetchTransactions } = props; + const { theme, fetchRewards, fetchRewardedContent, fetchTransactions, user } = props; const appRef = useRef(); const isEnhancedLayout = useKonamiListener(); + const userId = user && user.id; useEffect(() => { ReactModal.setAppElement(appRef.current); @@ -41,6 +44,12 @@ function App(props: Props) { document.documentElement.setAttribute('data-mode', theme); }, [theme]); + useEffect(() => { + if (userId) { + analytics.setUser(userId); + } + }, [userId]); + return (