fix(seer): Add links to manage your agent integrations, whenever a user can choose an agent

ryan953 · ryan953 · commit dd3c630e61cd · 2026-04-09T18:51:42.000-07:00
diff --git a/static/app/views/settings/seer/overview/autofixOverviewSection.tsx b/static/app/views/settings/seer/overview/autofixOverviewSection.tsx
@@ -24,6 +24,7 @@ import type {Project} from 'sentry/types/project';
 import {useFetchAllPages} from 'sentry/utils/api/apiFetch';
 import {fetchMutation} from 'sentry/utils/queryClient';
 import {useInfiniteQuery} from 'sentry/utils/queryClient';
+import {normalizeUrl} from 'sentry/utils/url/normalizeUrl';
 import {useOrganization} from 'sentry/utils/useOrganization';
 import {useProjects} from 'sentry/utils/useProjects';
 import {
@@ -182,9 +183,27 @@ function AgentNameForm({
         <Stack gap="md">
           <field.Layout.Row
             label={t('Default Preferred Coding Agent')}
-            hintText={t(
-              'For new projects, select which coding agent to use when proposing code changes.'
-            )}
+            hintText={
+              <Text>
+                {tct(
+                  'For new projects, select which coding agent to use when proposing code changes. [manageLink:Manage Coding Agent Integrations]',
+                  {
+                    manageLink: (
+                      <Link
+                        to={{
+                          pathname: normalizeUrl(
+                            `/settings/${organization.slug}/integrations/`
+                          ),
+                          query: {category: 'coding agent'},
+                        }}
+                      >
+                        {t('Manage Coding Agent Integrations')}
+                      </Link>
+                    ),
+                  }
+                )}
+              </Text>
+            }
           >
             <Container flexGrow={1}>
               {preferredAgent.isPending || codingAgentSelectOptions.isPending ? (
@@ -209,6 +228,19 @@ function AgentNameForm({
           </field.Layout.Row>
 
           <Flex align="center" alignSelf="end" gap="md" width="50%" paddingLeft="xl">
+            {/* <Text variant="secondary" size="sm">
+                <Link
+                  to={{
+                    pathname: normalizeUrl(
+                      `/settings/${organization.slug}/integrations/`
+                    ),
+                    query: {category: 'coding agent'},
+                  }}
+                >
+                  {t('Manage Coding Agent Integrations')}
+                </Link>
+              </Text> */}
+
             <Button
               size="xs"
               busy={isPending || isBulkMutatingAgent}
diff --git a/static/gsApp/views/seerAutomation/components/projectDetails/autofixAgent.tsx b/static/gsApp/views/seerAutomation/components/projectDetails/autofixAgent.tsx
@@ -2,7 +2,7 @@ import {Fragment} from 'react';
 import styled from '@emotion/styled';
 
 import {Flex} from '@sentry/scraps/layout';
-import {ExternalLink} from '@sentry/scraps/link';
+import {ExternalLink, Link} from '@sentry/scraps/link';
 
 import {addErrorMessage, addSuccessMessage} from 'sentry/actionCreators/indicator';
 import type {ProjectSeerPreferences} from 'sentry/components/events/autofix/types';
@@ -19,6 +19,7 @@ import {Placeholder} from 'sentry/components/placeholder';
 import {t, tct} from 'sentry/locale';
 import type {Project} from 'sentry/types/project';
 import {useMutation, useQuery, useQueryClient} from 'sentry/utils/queryClient';
+import {normalizeUrl} from 'sentry/utils/url/normalizeUrl';
 import {useOrganization} from 'sentry/utils/useOrganization';
 import {useFetchAgentOptions} from 'sentry/views/settings/seer/overview/utils/seerPreferredAgent';
 import {
@@ -78,7 +79,7 @@ export function AutofixAgent({canWrite, preference, project}: Props) {
 
   return (
     <PanelNoMargin>
-      <PanelHeader>{t('Autofix Handoff')}</PanelHeader>
+      <PanelHeader>{t('Autofix')}</PanelHeader>
       <PanelBody>
         {isPending ? (
           <Flex justify="center" align="center" padding="xl">
@@ -88,22 +89,31 @@ export function AutofixAgent({canWrite, preference, project}: Props) {
           <LoadingError />
         ) : (
           <Fragment>
-            {/* If the `agent` is undefined then we have a problem! Show an alert? */}
+            {/* If the `agent` is undefined then we default to Seer Agent */}
             <SelectField
               disabled={Boolean(disabledReason)}
               disabledReason={disabledReason}
               name="autofixAgent"
-              label={t('Autofix Handoff')}
+              label={t('Preferred Coding Agent')}
               help={tct(
-                'Seer will orchestrate the autofix process, and automatically hand off issue data to the coding agent for processing. You can choose to automatically process Issues, and which agent to use here. You can also manually trigger autofix with different agents from the Issue Details page. [docsLink:Read the docs] to learn more.',
+                'Select the coding agent to use when proposing code changes. [manageLink:Manage Coding Agent Integrations]',
                 {
-                  docsLink: (
-                    <ExternalLink href="https://docs.sentry.io/product/ai-in-sentry/" />
+                  manageLink: (
+                    <Link
+                      to={{
+                        pathname: normalizeUrl(
+                          `/settings/${organization.slug}/integrations/`
+                        ),
+                        query: {category: 'coding agent'},
+                      }}
+                    >
+                      {t('Manage Coding Agent Integrations')}
+                    </Link>
                   ),
                 }
               )}
               options={options.data ?? []}
-              value={selected}
+              value={selected ?? 'seer'}
               onChange={(integration: 'seer' | CodingAgentIntegration) => {
                 mutateSelectedAgent(integration, {
                   onSuccess: () =>
diff --git a/static/gsApp/views/seerAutomation/components/projectTable/seerProjectTableHeader.tsx b/static/gsApp/views/seerAutomation/components/projectTable/seerProjectTableHeader.tsx
@@ -5,16 +5,19 @@ import {Alert} from '@sentry/scraps/alert';
 import {Checkbox} from '@sentry/scraps/checkbox';
 import {InfoTip} from '@sentry/scraps/info';
 import {Flex} from '@sentry/scraps/layout';
+import {Link} from '@sentry/scraps/link';
 
 import {addErrorMessage, addSuccessMessage} from 'sentry/actionCreators/indicator';
 import {DropdownMenu} from 'sentry/components/dropdownMenu';
 import type {useUpdateBulkAutofixAutomationSettings} from 'sentry/components/events/autofix/preferences/hooks/useBulkAutofixAutomationSettings';
 import {SimpleTable} from 'sentry/components/tables/simpleTable';
 import {t, tct, tn} from 'sentry/locale';
+import type {Organization} from 'sentry/types/organization';
 import type {Project} from 'sentry/types/project';
 import {parseQueryKey} from 'sentry/utils/api/apiQueryKey';
 import type {Sort} from 'sentry/utils/discover/fields';
 import {useListItemCheckboxContext} from 'sentry/utils/list/useListItemCheckboxState';
+import {normalizeUrl} from 'sentry/utils/url/normalizeUrl';
 import {useOrganization} from 'sentry/utils/useOrganization';
 import {
   useBulkMutateSelectedAgent,
@@ -34,7 +37,34 @@ interface Props {
 
 const COLUMNS = [
   {title: t('Project'), key: 'project', sortKey: 'project'},
-  {title: t('Agent'), key: 'fixes', sortKey: 'agent'},
+  {
+    title: ({organization}: {organization: Organization}) => (
+      <Flex gap="sm" align="center">
+        {t('Preferred Coding Agent')}
+        <InfoTip
+          title={tct(
+            'Select the coding agent to use when proposing code changes. [manageLink:Manage Coding Agent Integrations]',
+            {
+              manageLink: (
+                <Link
+                  to={{
+                    pathname: normalizeUrl(
+                      `/settings/${organization.slug}/integrations/`
+                    ),
+                    query: {category: 'coding agent'},
+                  }}
+                >
+                  {t('Manage Coding Agent Integrations')}
+                </Link>
+              ),
+            }
+          )}
+        />
+      </Flex>
+    ),
+    key: 'fixes',
+    sortKey: 'agent',
+  },
   {
     title: (
       <Flex gap="sm" align="center">
@@ -126,7 +156,7 @@ export function ProjectTableHeader({
             }
             sort={sort?.field === sortKey ? sort.kind : undefined}
           >
-            {title}
+            {typeof title === 'function' ? title({organization}) : title}
           </SimpleTable.HeaderCell>
         ))}
       </TableHeader>
diff --git a/static/gsApp/views/seerAutomation/components/projectTable/seerProjectTableRow.tsx b/static/gsApp/views/seerAutomation/components/projectTable/seerProjectTableRow.tsx
@@ -96,7 +96,7 @@ export function SeerProjectTableRow({
               disabled={!canWrite}
               name="autofixAgent"
               options={agentOptions.data ?? []}
-              value={autofixAgent}
+              value={autofixAgent ?? 'seer'}
               onChange={option => {
                 mutateSelectedAgent(option.value, {
                   onSuccess: () => {
diff --git a/static/gsApp/views/seerAutomation/projects.tsx b/static/gsApp/views/seerAutomation/projects.tsx
@@ -1,15 +1,18 @@
-import {ExternalLink} from '@sentry/scraps/link';
+import {ExternalLink, Link} from '@sentry/scraps/link';
 
 import {AnalyticsArea} from 'sentry/components/analyticsArea';
 import {SentryDocumentTitle} from 'sentry/components/sentryDocumentTitle';
 import {t, tct} from 'sentry/locale';
+import {normalizeUrl} from 'sentry/utils/url/normalizeUrl';
+import {useOrganization} from 'sentry/utils/useOrganization';
 import {SettingsPageHeader} from 'sentry/views/settings/components/settingsPageHeader';
 
 import {SeerProjectTable} from 'getsentry/views/seerAutomation/components/projectTable/seerProjectTable';
 import {SeerSettingsPageContent} from 'getsentry/views/seerAutomation/components/seerSettingsPageContent';
 import {SeerSettingsPageWrapper} from 'getsentry/views/seerAutomation/components/seerSettingsPageWrapper';
 
 export default function SeerAutomationProjects() {
+  const organization = useOrganization();
   return (
     <AnalyticsArea name="projects">
       <SeerSettingsPageWrapper>
@@ -25,6 +28,19 @@ export default function SeerAutomationProjects() {
               docs: (
                 <ExternalLink href="https://docs.sentry.io/product/ai-in-sentry/seer/#seer-capabilities" />
               ),
+
+              manageLink: (
+                <Link
+                  to={{
+                    pathname: normalizeUrl(
+                      `/settings/${organization.slug}/integrations/`
+                    ),
+                    query: {category: 'coding agent'},
+                  }}
+                >
+                  {t('Manage Coding Agent Integrations')}
+                </Link>
+              ),
             }
           )}
         />
