feat(issue-details): Add analytics for thread selector (#61302)

static/app/components/events/interfaces/threads/threadSelector/index.tsx

@@ -6,9 +6,11 @@ import DropdownAutoComplete from 'sentry/components/dropdownAutoComplete';
 import DropdownButton from 'sentry/components/dropdownButton';
 import {getMappedThreadState} from 'sentry/components/events/interfaces/threads/threadSelector/threadStates';
 import {t} from 'sentry/locale';
-import {Event, ExceptionType, Thread} from 'sentry/types';
+import {Event, ExceptionType, Frame, Thread} from 'sentry/types';
 import {defined} from 'sentry/utils';
+import {trackAnalytics} from 'sentry/utils/analytics';
 import theme from 'sentry/utils/theme';
+import useOrganization from 'sentry/utils/useOrganization';
 
 import filterThreadInfo from './filterThreadInfo';
 import Header from './header';
@@ -34,6 +36,7 @@ function ThreadSelector({
   onChange,
   fullWidth = false,
 }: Props) {
+  const organization = useOrganization({allowNull: true});
   const hasThreadStates = threads.some(thread =>
     defined(getMappedThreadState(thread.state))
   );
@@ -73,14 +76,40 @@ function ThreadSelector({
     }
   };
 
+  const items = getItems();
+
   return (
     <ClassNames>
       {({css}) => (
         <StyledDropdownAutoComplete
           detached
           data-test-id="thread-selector"
-          items={getItems()}
+          items={items}
+          onOpen={() => {
+            trackAnalytics('stack_trace.threads.thread_selector_opened', {
+              organization,
+              platform: event.platform,
+              num_threads: items.length,
+            });
+          }}
           onSelect={item => {
+            const selectedThread: Thread = item.thread;
+
+            trackAnalytics('stack_trace.threads.thread_selected', {
+              organization,
+              platform: event.platform,
+              thread_index: items.findIndex(
+                ({thread}) => thread.id === selectedThread.id
+              ),
+              num_threads: items.length,
+              is_crashed_thread: selectedThread.crashed,
+              is_current_thread: selectedThread.current,
+              thread_state: selectedThread.state ?? '',
+              has_stacktrace: defined(selectedThread.stacktrace),
+              num_in_app_frames:
+                selectedThread.stacktrace?.frames?.filter((frame: Frame) => frame.inApp)
+                  .length ?? 0,
+            });
             handleChange(item.thread);
           }}
           maxHeight={DROPDOWN_MAX_HEIGHT}

static/app/utils/analytics/stackTraceAnalyticsEvents.tsx

@@ -72,6 +72,20 @@ export type StackTraceEventParameters = {
     project_slug: string;
     platform?: string;
   };
+  'stack_trace.threads.thread_selected': {
+    has_stacktrace: boolean;
+    num_in_app_frames: number;
+    num_threads: number;
+    thread_index: number;
+    thread_state: string;
+    is_crashed_thread?: boolean;
+    is_current_thread?: boolean;
+    platform?: string;
+  };
+  'stack_trace.threads.thread_selector_opened': {
+    num_threads: number;
+    platform?: string;
+  };
 };
 
 export const stackTraceEventMap: Record<keyof StackTraceEventParameters, string> = {
@@ -98,4 +112,6 @@ export const stackTraceEventMap: Record<keyof StackTraceEventParameters, string>
     'Stack Trace: Sort Option - Recent First - Clicked',
   'stack-trace.sort_option_recent_last_clicked':
     'Stack Trace: Sort Option - Recent Last - Clicked',
+  'stack_trace.threads.thread_selected': 'Stack Trace: Thread Selected',
+  'stack_trace.threads.thread_selector_opened': 'Stack Trace: Thread Selector Opened',
 };