feat(analytics): convert analytics on eventEntries and issueList/overview

static/app/components/events/eventEntries.tsx

@@ -2,6 +2,7 @@ import React, {memo, useEffect, useState} from 'react';
 import styled from '@emotion/styled';
 import * as Sentry from '@sentry/react';
 import {Location} from 'history';
+import uniq from 'lodash/uniq';
 
 import {addErrorMessage} from 'app/actionCreators/indicator';
 import {Client} from 'app/api';
@@ -40,7 +41,7 @@ import {Entry, EntryType, Event} from 'app/types/event';
 import {Thread} from 'app/types/events';
 import {isNotSharedOrganization} from 'app/types/utils';
 import {defined, objectIsEmpty} from 'app/utils';
-import {analytics} from 'app/utils/analytics';
+import trackAdvancedAnalyticsEvent from 'app/utils/analytics/trackAdvancedAnalyticsEvent';
 import withApi from 'app/utils/withApi';
 import withOrganization from 'app/utils/withOrganization';
 import {projectProcessingIssuesMessages} from 'app/views/settings/project/projectProcessingIssues';
@@ -113,14 +114,14 @@ const EventEntries = memo(
       const errorTypes = errors.map(errorEntries => errorEntries.type);
       const errorMessages = errors.map(errorEntries => errorEntries.message);
 
-      const orgId = organization.id;
       const platform = project.platform;
 
-      analytics('issue_error_banner.viewed', {
-        org_id: orgId ? parseInt(orgId, 10) : null,
+      // uniquify the array types
+      trackAdvancedAnalyticsEvent('issue_error_banner.viewed', {
+        organization: organization as Organization,
         group: event?.groupID,
-        error_type: errorTypes,
-        error_message: errorMessages,
+        error_type: uniq(errorTypes),
+        error_message: uniq(errorMessages),
         ...(platform && {platform}),
       });
     }

static/app/utils/analytics/issueAnalyticsEvents.tsx

@@ -6,13 +6,45 @@ export type IssueEventParameters = {
   'event_cause.docs_clicked': {};
   'event_cause.snoozed': {};
   'event_cause.dismissed': {};
+  'issue_error_banner.viewed': {
+    error_type: string[];
+    error_message: string[];
+    group?: string;
+    platform?: string;
+  };
+  'issues_tab.viewed': {
+    tab: string;
+    num_issues: number;
+  };
+  'issue_search.failed': {
+    search_type: string;
+    search_source: string;
+    error: string;
+  };
+  'search.searched': {
+    query: string;
+    search_type: string;
+    search_source: string;
+  };
+  'organization_saved_search.selected': {
+    search_type: string;
+    id: number;
+  };
+  'issue.search_sidebar_clicked': {};
 };
 
 export type IssueEventKey = keyof IssueEventParameters;
 
 export const issueEventMap: Record<IssueEventKey, string | null> = {
-  'event_cause.viewed': null, // send to reload only due to high event volume
+  'event_cause.viewed': null, // send to main event store only due to high event volume
   'event_cause.docs_clicked': 'Event Cause Docs Clicked',
   'event_cause.snoozed': 'Event Cause Snoozed',
   'event_cause.dismissed': 'Event Cause Dismissed',
+  'issue_error_banner.viewed': 'Issue Error Banner Viewed',
+  'issues_tab.viewed': 'Viewed Issues Tab', // high volume but send to our secondary event store anyways
+  'issue_search.failed': 'Issue Search: Failed',
+  'search.searched': 'Search: Performed search',
+  'organization_saved_search.selected':
+    'Organization Saved Search: Selected saved search',
+  'issue.search_sidebar_clicked': 'Issue Search Sidebar Clicked',
 };

static/app/views/issueList/overview.tsx

@@ -44,7 +44,7 @@ import {
   TagCollection,
 } from 'app/types';
 import {defined} from 'app/utils';
-import {analytics, trackAnalyticsEvent} from 'app/utils/analytics';
+import trackAdvancedAnalyticsEvent from 'app/utils/analytics/trackAdvancedAnalyticsEvent';
 import {callIfFunction} from 'app/utils/callIfFunction';
 import CursorPoller from 'app/utils/cursorPoller';
 import {getUtcDateString} from 'app/utils/dates';
@@ -510,10 +510,8 @@ class IssueListOverview extends React.Component<Props, State> {
         ([tabQuery]) => currentTabQuery === tabQuery
       )?.[1];
       if (tab && !endpointParams.cursor) {
-        trackAnalyticsEvent({
-          eventKey: 'issues_tab.viewed',
-          eventName: 'Viewed Issues Tab',
-          organization_id: organization.id,
+        trackAdvancedAnalyticsEvent('issues_tab.viewed', {
+          organization,
           tab: tab.analyticsName,
           num_issues: queryCounts[currentTabQuery].count,
         });
@@ -613,10 +611,8 @@ class IssueListOverview extends React.Component<Props, State> {
         });
       },
       error: err => {
-        trackAnalyticsEvent({
-          eventKey: 'issue_search.failed',
-          eventName: 'Issue Search: Failed',
-          organization_id: this.props.organization.id,
+        trackAdvancedAnalyticsEvent('issue_search.failed', {
+          organization: this.props.organization,
           search_type: 'issues',
           search_source: 'main_search',
           error: parseApiError(err),
@@ -696,8 +692,8 @@ class IssueListOverview extends React.Component<Props, State> {
   }
 
   onIssueListSidebarSearch = (query: string) => {
-    analytics('search.searched', {
-      org_id: this.props.organization.id,
+    trackAdvancedAnalyticsEvent('search.searched', {
+      organization: this.props.organization,
       query,
       search_type: 'issues',
       search_source: 'search_builder',
@@ -747,8 +743,8 @@ class IssueListOverview extends React.Component<Props, State> {
       isSidebarVisible: !this.state.isSidebarVisible,
       renderSidebar: true,
     });
-    analytics('issue.search_sidebar_clicked', {
-      org_id: parseInt(organization.id, 10),
+    trackAdvancedAnalyticsEvent('issue.search_sidebar_clicked', {
+      organization,
     });
   };
 
@@ -910,14 +906,11 @@ class IssueListOverview extends React.Component<Props, State> {
   };
 
   onSavedSearchSelect = (savedSearch: SavedSearch) => {
-    trackAnalyticsEvent({
-      eventKey: 'organization_saved_search.selected',
-      eventName: 'Organization Saved Search: Selected saved search',
-      organization_id: this.props.organization.id,
+    trackAdvancedAnalyticsEvent('organization_saved_search.selected', {
+      organization: this.props.organization,
       search_type: 'issues',
       id: savedSearch.id ? parseInt(savedSearch.id, 10) : -1,
     });
-
     this.setState({issuesLoading: true}, () => this.transitionTo(undefined, savedSearch));
   };