forked from deriv-com/deriv-app
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Agrim/CRO-731/ analytics script in deriv app (deriv-com#17180)
* fix: script in deriv app * fix: updates * fix: update * fix: types and tracking * fix: empty commit * feat: adding loggedIn attribute * fix: empty commit * fix: normal event * fix: add normal event tracking for account signup * fix: refactor * fix: updates * fix: domain update * fix: pageloadevent * fix: pageloadevent * fix: change domain name to check * fix: testing with consoles * fix: testing * fix: tracking * fix: cache * fix: cache * fix: domain * fix: fixing domain and consoles * fix: check * fix: changing domain to binary sx * fix: changing domain to binary sx * fix: update analytics version * fix: add pageview, remove consoles, password screen * fix: password screen signup no cache * fix: remove console logs
- Loading branch information
1 parent
004d8de
commit b159c62
Showing
19 changed files
with
431 additions
and
132 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,48 +1,163 @@ | ||
| interface AnalyticsEvent { | ||
| name: string; | ||
| properties: { | ||
| [key: string]: string; | ||
| }; | ||
| import { Analytics } from '@deriv-com/analytics'; | ||
| import Cookies from 'js-cookie'; | ||
|
|
||
| interface Payload { | ||
| type: string; | ||
| anonymousId: string; | ||
| } | ||
|
|
||
| const handleCachedEvents = () => { | ||
| let eventQueue: AnalyticsEvent[] = []; | ||
| const storedEvents = localStorage.getItem('pending_events'); | ||
| try { | ||
| if (storedEvents) { | ||
| eventQueue = JSON.parse(storedEvents) as AnalyticsEvent[]; | ||
| if (eventQueue.length > 0) { | ||
| eventQueue.forEach(event => { | ||
| window.rudderanalytics.track(event.name, event.properties); | ||
| type ResponseData = { | ||
| url: string; | ||
| method: string; | ||
| status: number; | ||
| headers: string; | ||
| data: string; | ||
| payload: Payload; | ||
| }; | ||
| type Event = { | ||
| name: string; | ||
| properties: Record<string, string>; | ||
| cache?: boolean; | ||
| }; | ||
| type Item = { | ||
| event: Event; | ||
| cache?: boolean; | ||
| callback?: (e: Event) => Event; | ||
| }; | ||
| const cacheTrackEvents = { | ||
| interval: null as NodeJS.Timeout | null, | ||
| responses: [] as ResponseData[], | ||
| isTrackingResponses: false, | ||
| trackPageUnload: () => { | ||
| window.addEventListener('beforeunload', event => { | ||
| if (!cacheTrackEvents.isPageViewSent()) { | ||
| cacheTrackEvents.push('cached_analytics_page_views', { | ||
| name: window.location.href, | ||
| properties: { | ||
| url: window.location.href, | ||
| }, | ||
| }); | ||
|
|
||
| eventQueue = []; | ||
| localStorage.removeItem('pending_events'); | ||
| } | ||
| }); | ||
| }, | ||
| isReady: (): boolean => { | ||
| if (typeof Analytics === 'undefined' || Analytics === null) { | ||
| return false; | ||
| } | ||
| } catch (error) { | ||
| // eslint-disable-next-line no-console | ||
| console.log(error); | ||
| } | ||
| }; | ||
|
|
||
| const setEvent = (event: AnalyticsEvent): void => { | ||
| const storedEvents = localStorage.getItem('pending_events'); | ||
| let eventQueue: AnalyticsEvent[] = []; | ||
| if (storedEvents) { | ||
| eventQueue = JSON.parse(storedEvents) as AnalyticsEvent[]; | ||
| } | ||
| eventQueue.push(event); | ||
| localStorage.setItem('pending_events', JSON.stringify(eventQueue)); | ||
| }; | ||
| const instances = Analytics?.getInstances(); | ||
| return !!instances?.tracking; | ||
| }, | ||
| parseCookies: (cookieName: string): any => { | ||
| const cookies: { [key: string]: string } = document.cookie | ||
| .split('; ') | ||
| .reduce((acc: { [key: string]: string }, cookie: string) => { | ||
| const [key, value] = cookie.split('='); | ||
| acc[decodeURIComponent(key)] = decodeURIComponent(value); | ||
| return acc; | ||
| }, {}); | ||
| try { | ||
| return cookies[cookieName] ? JSON.parse(cookies[cookieName]) : null; | ||
| } catch (error) { | ||
| return null; | ||
| } | ||
| }, | ||
| isPageViewSent: (): boolean => | ||
| !!cacheTrackEvents.responses.find(e => e.payload?.type === 'page' && e.payload?.anonymousId), | ||
| set: (event: Event) => { | ||
| cacheTrackEvents.push('cached_analytics_events', event); | ||
| }, | ||
| push: (cookieName: string, data: Event) => { | ||
| let storedCookies: Event[] = []; | ||
| const cacheCookie = cacheTrackEvents.parseCookies(cookieName); | ||
| if (cacheCookie) storedCookies = cacheCookie; | ||
| storedCookies.push(data); | ||
| document.cookie = `${cookieName}=${JSON.stringify(storedCookies)}; path=/; Domain=.binary.sx;`; | ||
| }, | ||
| processEvent: (event: Event): Event => { | ||
| const clientInfo = Cookies.get('client_information'); | ||
| if (clientInfo) { | ||
| const { email = null } = JSON.parse(clientInfo); | ||
| if (email) { | ||
| event.properties.email = email; | ||
| } | ||
| } | ||
| if (event?.properties?.email) { | ||
| const email = event.properties.email; | ||
| delete event.properties.email; | ||
| } | ||
| return event; | ||
| }, | ||
| track: (originalEvent: Event, cache?: boolean) => { | ||
| const event: any = cacheTrackEvents.processEvent(originalEvent); | ||
| if (cacheTrackEvents.isReady() && !cache) { | ||
| Analytics?.trackEvent(event.name, event.properties); | ||
| } else { | ||
| cacheTrackEvents.set(event); | ||
| } | ||
| }, | ||
| pageView: () => { | ||
| if (!cacheTrackEvents.isTrackingResponses) { | ||
| cacheTrackEvents.trackPageUnload(); | ||
| } | ||
| let pageViewInterval: NodeJS.Timeout | null = null; | ||
| pageViewInterval = setInterval(() => { | ||
| const loggedIn = !!Cookies.get('client_information'); | ||
| const signup_device = Cookies.get('signup_device'); | ||
|
|
||
| const trackEventWithCache = (event: AnalyticsEvent): void => { | ||
| if (window.rudderanalytics) { | ||
| handleCachedEvents(); | ||
| window.rudderanalytics.track(event.name, event.properties); | ||
| } else { | ||
| setEvent(event); | ||
| } | ||
| if (Analytics !== undefined && typeof Analytics?.pageView === 'function' && cacheTrackEvents.isReady()) { | ||
| Analytics?.pageView(window.location.href, 'Deriv-App', { | ||
| loggedIn, | ||
| signup_device: signup_device || 'none', | ||
| }); | ||
| } | ||
| if (cacheTrackEvents.isPageViewSent()) { | ||
| clearInterval(pageViewInterval!); | ||
| } | ||
| }, 1000); | ||
| }, | ||
| loadEvent: (items: Item[]) => { | ||
| items.forEach(({ event, cache }) => { | ||
| const { name, properties } = event; | ||
| cacheTrackEvents.track( | ||
| { | ||
| name, | ||
| properties, | ||
| }, | ||
| cache | ||
| ); | ||
| }); | ||
| return cacheTrackEvents; | ||
| }, | ||
| pageLoadEvent: ( | ||
| items: Array<{ pages?: string[]; excludedPages?: string[]; event: Event; callback?: () => Event }> | ||
| ) => { | ||
| const pathname = window.location.pathname.slice(1); | ||
| if (!Array.isArray(items)) { | ||
| return cacheTrackEvents; | ||
| } | ||
| items.forEach(({ pages = [], excludedPages = [], event, callback = null }) => { | ||
| let dispatch = false; | ||
| if (pages.length) { | ||
| if (pages.includes(pathname)) { | ||
| dispatch = true; | ||
| } | ||
| } else if (excludedPages.length) { | ||
| if (!excludedPages.includes(pathname)) { | ||
| dispatch = true; | ||
| } | ||
| } else { | ||
| dispatch = true; | ||
| } | ||
| if (dispatch) { | ||
| const eventData = callback ? callback() : event; | ||
| cacheTrackEvents.loadEvent([ | ||
| { | ||
| event: eventData, | ||
| }, | ||
| ]); | ||
| } | ||
| }); | ||
| return cacheTrackEvents; | ||
| }, | ||
| }; | ||
|
|
||
| export { trackEventWithCache, handleCachedEvents }; | ||
| export default cacheTrackEvents; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.