dev: Add amplitude events for links on prevent onboarding page (#102361)

This PR adds some simple track analytic events to the sentry prevent
onboarding page to see what aspects of the page are getting engagement
vs. not


<!--

  Sentry employees and contractors can delete or ignore the following.

-->

### Legal Boilerplate

Look, I get it. The entity doing business as "Sentry" was incorporated
in the State of Delaware in 2015 as Functional Software, Inc. and is
gonna need some rights from me in order to utilize my contributions in
this here PR. So here's the deal: I retain all rights, title and
interest in and to my contributions, and by keeping this boilerplate
intact I confirm that Sentry can use, modify, copy, and redistribute my
contributions, under Sentry's choice of terms.

Author: ajay-sentry

static/app/views/prevent/preventAI/onboarding.spec.tsx

@@ -1,11 +1,12 @@
 import {ThemeProvider, type Theme} from '@emotion/react';
 import {OrganizationFixture} from 'sentry-fixture/organization';
 
-import {render, screen} from 'sentry-test/reactTestingLibrary';
+import {render, screen, userEvent} from 'sentry-test/reactTestingLibrary';
 import {textWithMarkupMatcher} from 'sentry-test/utils';
 
 import ConfigStore from 'sentry/stores/configStore';
 import type {Config} from 'sentry/types/system';
+import {trackAnalytics} from 'sentry/utils/analytics';
 
 import PreventAIOnboarding from './onboarding';
 
@@ -20,6 +21,7 @@ jest.mock(
   () => 'prevent-pr-comments-dark-mock.svg',
   {virtual: true}
 );
+jest.mock('sentry/utils/analytics');
 
 describe('PreventAIOnboarding', () => {
   const organization = OrganizationFixture({
@@ -81,11 +83,16 @@ describe('PreventAIOnboarding', () => {
     expect(screen.getByRole('heading', {name: 'Setup Seer'})).toBeInTheDocument();
   });
 
-  it('renders external links with correct hrefs', () => {
+  it('renders external links with correct hrefs', async () => {
     render(<PreventAIOnboarding />, {organization});
 
     const orgSettingsLink = screen.getByRole('link', {name: 'organization settings'});
     expect(orgSettingsLink).toHaveAttribute('href', '/settings/test-org/#hideAiFeatures');
+    await userEvent.click(orgSettingsLink);
+    expect(trackAnalytics).toHaveBeenCalledWith(
+      'prevent.ai_onboarding.settings_link.clicked',
+      {organization}
+    );
 
     const sentryGitHubAppLink = screen.getByRole('link', {
       name: 'Sentry GitHub App',
@@ -94,6 +101,11 @@ describe('PreventAIOnboarding', () => {
       'href',
       '/settings/test-org/integrations/github/'
     );
+    await userEvent.click(sentryGitHubAppLink);
+    expect(trackAnalytics).toHaveBeenCalledWith(
+      'prevent.ai_onboarding.github_integration_link.clicked',
+      {organization}
+    );
 
     const githubIntegrationLink = screen.getByRole('link', {
       name: 'GitHub integration',
@@ -102,15 +114,30 @@ describe('PreventAIOnboarding', () => {
       'href',
       'https://docs.sentry.io/organization/integrations/source-code-mgmt/github/#installing-github'
     );
+    await userEvent.click(githubIntegrationLink);
+    expect(trackAnalytics).toHaveBeenCalledWith(
+      'prevent.ai_onboarding.github_docs_link.clicked',
+      {organization}
+    );
 
     const seerLink = screen.getByRole('link', {name: 'Seer by Sentry GitHub App'});
     expect(seerLink).toHaveAttribute('href', 'https://github.com/apps/seer-by-sentry');
+    await userEvent.click(seerLink);
+    expect(trackAnalytics).toHaveBeenCalledWith(
+      'prevent.ai_onboarding.seer_app_link.clicked',
+      {organization}
+    );
 
     const learnMoreLink = screen.getByRole('link', {name: 'Learn more'});
     expect(learnMoreLink).toHaveAttribute(
       'href',
       'https://docs.sentry.io/product/ai-in-sentry/ai-code-review/'
     );
+    await userEvent.click(learnMoreLink);
+    expect(trackAnalytics).toHaveBeenCalledWith(
+      'prevent.ai_onboarding.ai_code_review_docs_link.clicked',
+      {organization}
+    );
   });
 
   it('renders feature list items', () => {

static/app/views/prevent/preventAI/onboarding.tsx

@@ -12,6 +12,7 @@ import {Text} from 'sentry/components/core/text';
 import {Heading} from 'sentry/components/core/text/heading';
 import {IconInfo} from 'sentry/icons/iconInfo';
 import {t, tct} from 'sentry/locale';
+import {trackAnalytics} from 'sentry/utils/analytics';
 import {getRegionDataFromOrganization} from 'sentry/utils/regions';
 import useOrganization from 'sentry/utils/useOrganization';
 
@@ -38,6 +39,7 @@ function OnboardingStep({step, title, description}: OnboardingStepProps) {
 }
 
 export function FeatureOverview() {
+  const organization = useOrganization();
   return (
     <Flex direction="column" gap="md" padding="xl" background="secondary" radius="md">
       <Text variant="primary" size="md" bold>
@@ -92,7 +94,17 @@ export function FeatureOverview() {
           'Sentry Error Prediction works better with Sentry Issue Context. [link:Learn more] on how to set this up to get the most accurate error prediction we can offer.',
           {
             link: (
-              <ExternalLink href="https://docs.sentry.io/product/ai-in-sentry/ai-code-review/" />
+              <ExternalLink
+                href="https://docs.sentry.io/product/ai-in-sentry/ai-code-review/"
+                onClick={() => {
+                  trackAnalytics(
+                    'prevent.ai_onboarding.ai_code_review_docs_link.clicked',
+                    {
+                      organization,
+                    }
+                  );
+                }}
+              />
             ),
           }
         )}
@@ -193,6 +205,11 @@ export default function PreventAIOnboarding() {
                         pathname: `/settings/${organization.slug}/`,
                         hash: 'hideAiFeatures',
                       }}
+                      onClick={() => {
+                        trackAnalytics('prevent.ai_onboarding.settings_link.clicked', {
+                          organization,
+                        });
+                      }}
                     />
                   ),
                 }
@@ -205,10 +222,27 @@ export default function PreventAIOnboarding() {
                 'To grant Seer access to your codebase, install the [sentryGitHubApp:Sentry GitHub App] to connect your GitHub repositories. Learn more about [gitHubIntegration:GitHub integration].',
                 {
                   sentryGitHubApp: (
-                    <Link to={`/settings/${organization.slug}/integrations/github/`} />
+                    <Link
+                      to={`/settings/${organization.slug}/integrations/github/`}
+                      onClick={() => {
+                        trackAnalytics(
+                          'prevent.ai_onboarding.github_integration_link.clicked',
+                          {
+                            organization,
+                          }
+                        );
+                      }}
+                    />
                   ),
                   gitHubIntegration: (
-                    <ExternalLink href="https://docs.sentry.io/organization/integrations/source-code-mgmt/github/#installing-github" />
+                    <ExternalLink
+                      href="https://docs.sentry.io/organization/integrations/source-code-mgmt/github/#installing-github"
+                      onClick={() => {
+                        trackAnalytics('prevent.ai_onboarding.github_docs_link.clicked', {
+                          organization,
+                        });
+                      }}
+                    />
                   ),
                 }
               )}
@@ -219,7 +253,16 @@ export default function PreventAIOnboarding() {
               description={tct(
                 'AI Code Review uses the Sentry Seer agent to power its core functionalities. Install the [link:Seer by Sentry GitHub App] within the same GitHub organization.',
                 {
-                  link: <ExternalLink href="https://github.com/apps/seer-by-sentry" />,
+                  link: (
+                    <ExternalLink
+                      href="https://github.com/apps/seer-by-sentry"
+                      onClick={() => {
+                        trackAnalytics('prevent.ai_onboarding.seer_app_link.clicked', {
+                          organization,
+                        });
+                      }}
+                    />
+                  ),
                 }
               )}
             />