fix(seer): Clear cache for /seer/onboarding-check/ api response, and iterate on seer config reminder

ryan953 · ryan953 · commit c00a24f38250 · 2026-04-09T19:41:11.000-07:00
diff --git a/static/app/components/events/autofix/v1/drawer.tsx b/static/app/components/events/autofix/v1/drawer.tsx
@@ -1,4 +1,5 @@
 import {useMemo} from 'react';
+import {useQuery} from '@tanstack/react-query';
 
 import {Flex} from '@sentry/scraps/layout';
 
@@ -13,8 +14,8 @@ import {Placeholder} from 'sentry/components/placeholder';
 import type {Event} from 'sentry/types/event';
 import type {Group} from 'sentry/types/group';
 import type {Project} from 'sentry/types/project';
+import {getSeerOnboardingCheckQueryOptions} from 'sentry/utils/getSeerOnboardingCheckQueryOptions';
 import {useOrganization} from 'sentry/utils/useOrganization';
-import {useSeerOnboardingCheck} from 'sentry/utils/useSeerOnboardingCheck';
 import {useAiConfig} from 'sentry/views/issueDetails/streamline/hooks/useAiConfig';
 
 interface SeerDrawerProps {
@@ -70,7 +71,7 @@ function InnerSeerDrawer({
   aiConfig,
 }: InnerSeerDrawerProps) {
   const organization = useOrganization();
-  const {isPending, data} = useSeerOnboardingCheck();
+  const {isPending, data} = useQuery(getSeerOnboardingCheckQueryOptions({organization}));
 
   const seatBasedSeer = organization.features.includes('seat-based-seer-enabled');
 
diff --git a/static/app/components/events/autofix/v2/autofixConfigureSeer.tsx b/static/app/components/events/autofix/v2/autofixConfigureSeer.tsx
@@ -1,5 +1,6 @@
 import {Fragment, type CSSProperties} from 'react';
 import styled from '@emotion/styled';
+import {useQuery} from '@tanstack/react-query';
 
 import seerConfigSeerImg from 'sentry-images/spot/seer-config-seer.svg';
 import seerConfigShipImg from 'sentry-images/spot/seer-config-ship.svg';
@@ -19,9 +20,9 @@ import {t} from 'sentry/locale';
 import type {Event} from 'sentry/types/event';
 import type {Group} from 'sentry/types/group';
 import type {Project} from 'sentry/types/project';
+import {getSeerOnboardingCheckQueryOptions} from 'sentry/utils/getSeerOnboardingCheckQueryOptions';
 import {MarkedText} from 'sentry/utils/marked/markedText';
 import {useOrganization} from 'sentry/utils/useOrganization';
-import {useSeerOnboardingCheck} from 'sentry/utils/useSeerOnboardingCheck';
 
 export const AiSetupConfiguration = HookOrDefault({
   hookName: 'component:ai-setup-configuration',
@@ -44,7 +45,7 @@ interface AutofixConfigureSeerProps {
 
 export function AutofixConfigureSeer({event, group, project}: AutofixConfigureSeerProps) {
   const organization = useOrganization();
-  const {data: setupCheck} = useSeerOnboardingCheck();
+  const {data: setupCheck} = useQuery(getSeerOnboardingCheckQueryOptions({organization}));
   const {data, isPending, isError} = useGroupSummary(group, event, project);
 
   const orgNeedsToConfigureSeer =
diff --git a/static/app/utils/getSeerOnboardingCheckQueryOptions.tsx b/static/app/utils/getSeerOnboardingCheckQueryOptions.tsx
@@ -0,0 +1,27 @@
+import type {Organization} from 'sentry/types/organization';
+import {apiOptions} from 'sentry/utils/api/apiOptions';
+
+interface SeerOnboardingCheckResponse {
+  hasSupportedScmIntegration: boolean;
+  isAutofixEnabled: boolean;
+  isCodeReviewEnabled: boolean;
+  isSeerConfigured: boolean;
+  needsConfigReminder: boolean;
+}
+
+interface Props {
+  organization: Organization;
+  staleTime?: number;
+}
+
+export function getSeerOnboardingCheckQueryOptions({organization, staleTime = 0}: Props) {
+  return apiOptions.as<SeerOnboardingCheckResponse>()(
+    '/organizations/$organizationIdOrSlug/seer/onboarding-check/',
+    {
+      path: {
+        organizationIdOrSlug: organization.slug,
+      },
+      staleTime,
+    }
+  );
+}
diff --git a/static/app/utils/useSeerOnboardingCheck.tsx b/static/app/utils/useSeerOnboardingCheck.tsx
diff --git a/static/app/views/issueDetails/streamline/sidebar/autofixSection.tsx b/static/app/views/issueDetails/streamline/sidebar/autofixSection.tsx
@@ -1,5 +1,6 @@
 import {useCallback, useMemo, type CSSProperties} from 'react';
 import styled from '@emotion/styled';
+import {useQuery} from '@tanstack/react-query';
 
 import seerConfigConnectImg from 'sentry-images/spot/seer-config-connect-2.svg';
 
@@ -39,11 +40,11 @@ import {t} from 'sentry/locale';
 import type {Event} from 'sentry/types/event';
 import type {Group} from 'sentry/types/group';
 import type {Project} from 'sentry/types/project';
+import {getSeerOnboardingCheckQueryOptions} from 'sentry/utils/getSeerOnboardingCheckQueryOptions';
 import {getConfigForIssueType} from 'sentry/utils/issueTypeConfig';
 import {useRouteAnalyticsParams} from 'sentry/utils/routeAnalytics/useRouteAnalyticsParams';
 import {useLocation} from 'sentry/utils/useLocation';
 import {useOrganization} from 'sentry/utils/useOrganization';
-import {useSeerOnboardingCheck} from 'sentry/utils/useSeerOnboardingCheck';
 import {SectionKey} from 'sentry/views/issueDetails/streamline/context';
 import {SidebarFoldSection} from 'sentry/views/issueDetails/streamline/foldSection';
 import {useAiConfig} from 'sentry/views/issueDetails/streamline/hooks/useAiConfig';
@@ -125,7 +126,9 @@ export interface AutofixContentProps {
 export function AutofixContent({aiConfig, group, project, event}: AutofixContentProps) {
   const organization = useOrganization();
   const autofix = useExplorerAutofix(group.id);
-  const {data: setupCheck, isPending} = useSeerOnboardingCheck();
+  const {data: setupCheck, isPending} = useQuery(
+    getSeerOnboardingCheckQueryOptions({organization})
+  );
 
   useAutoTriggerAutofix({autofix, group});
 
diff --git a/static/app/views/settings/seer/overview/codeReviewOverviewSection.tsx b/static/app/views/settings/seer/overview/codeReviewOverviewSection.tsx
@@ -20,6 +20,7 @@ import {t, tct, tn} from 'sentry/locale';
 import {DEFAULT_CODE_REVIEW_TRIGGERS} from 'sentry/types/integrations';
 import type {Organization} from 'sentry/types/organization';
 import {useFetchAllPages} from 'sentry/utils/api/apiFetch';
+import {getSeerOnboardingCheckQueryOptions} from 'sentry/utils/getSeerOnboardingCheckQueryOptions';
 import {useInfiniteQuery, useQueryClient} from 'sentry/utils/queryClient';
 import {fetchMutation} from 'sentry/utils/queryClient';
 import {useOrganization} from 'sentry/utils/useOrganization';
@@ -94,6 +95,10 @@ export function CodeReviewOverviewSection({
       if (queryKey) {
         queryClient.invalidateQueries({queryKey});
       }
+      // Invalidate the onboarding check query to get the updated settings
+      queryClient.invalidateQueries({
+        queryKey: getSeerOnboardingCheckQueryOptions({organization}).queryKey,
+      });
       (mutations ?? []).forEach(mutation => {
         // Invalidate related queries
         queryClient.invalidateQueries({
diff --git a/static/gsApp/components/primaryNavSeerConfigReminder.tsx b/static/gsApp/components/primaryNavSeerConfigReminder.tsx
@@ -4,14 +4,17 @@ import {LinkButton} from '@sentry/scraps/button';
 import {Flex, Stack} from '@sentry/scraps/layout';
 import {Heading, Text} from '@sentry/scraps/text';
 
+import {bulkAutofixAutomationSettingsInfiniteOptions} from 'sentry/components/events/autofix/preferences/hooks/useBulkAutofixAutomationSettings';
 import {IconSeer} from 'sentry/icons';
 import {t} from 'sentry/locale';
 import type {Integration} from 'sentry/types/integrations';
 import type {Organization} from 'sentry/types/organization';
 import {trackAnalytics} from 'sentry/utils/analytics';
+import {useFetchAllPages} from 'sentry/utils/api/apiFetch';
 import {getApiUrl} from 'sentry/utils/api/getApiUrl';
+import {getSeerOnboardingCheckQueryOptions} from 'sentry/utils/getSeerOnboardingCheckQueryOptions';
 import {isActiveSuperuser} from 'sentry/utils/isActiveSuperuser';
-import {useApiQuery} from 'sentry/utils/queryClient';
+import {useApiQuery, useInfiniteQuery, useQuery} from 'sentry/utils/queryClient';
 import {useOrganization} from 'sentry/utils/useOrganization';
 import {
   PrimaryNavigation,
@@ -124,40 +127,70 @@ function useCanSeeReminder(organization: Organization) {
 
 function useReminderCopywriting() {
   const organization = useOrganization();
-  const {initialStep} = useSeerOnboardingStep();
+
   const hasSeatBasedSeer = organization.features.includes('seat-based-seer-enabled');
-  const hasLegacySeer = organization.features.includes('seer-added');
 
-  const descriptionByStep: Record<Steps, {description: string; title: string} | null> = {
-    [Steps.CONNECT_GITHUB]: {
+  const autofixResult = useInfiniteQuery({
+    ...bulkAutofixAutomationSettingsInfiniteOptions({
+      organization,
+    }),
+    staleTime: 60_000,
+    select: ({pages}) => pages.flatMap(page => page.json),
+  });
+  useFetchAllPages({result: autofixResult});
+
+  const {data: autofixSettings, isPending: isAutofixPending} = autofixResult;
+
+  const {
+    isPending: isOnboardingPending,
+    isError: isOnboardingError,
+    data: onboardingData,
+  } = useQuery(getSeerOnboardingCheckQueryOptions({organization, staleTime: 60_000}));
+
+  if (!hasSeatBasedSeer || isOnboardingPending || isOnboardingError || isAutofixPending) {
+    return null;
+  }
+  const {hasSupportedScmIntegration, isCodeReviewEnabled} = onboardingData;
+  const hasAutofix = autofixSettings?.some(s => s.reposCount > 0);
+
+  if (!hasSupportedScmIntegration) {
+    return {
       title: t('Connect GitHub'),
       description: t(
-        'Seer is enabled, but Github is not connected. Connect your GitHub account to enable Root Cause Analysis and Code Review.'
+        'Seer is enabled, but Github is not connected. Connect your GitHub account to enable Autofix and Code Review.'
+      ),
+    };
+  }
+
+  if (!hasAutofix) {
+    return {
+      title: (
+        <Flex align="center" gap="sm">
+          <IconSeer />
+          {t('Start using Autofix')}
+        </Flex>
       ),
-    },
-    [Steps.SETUP_ROOT_CAUSE_ANALYSIS]: {
-      title: t('Start using Seer\u2019s Issue Autofix'),
       description: t(
-        'Seer is enabled but Root Cause Analysis is not configured. Configure Seer to automatically look at issues and generate code fixes.'
+        'Seer is enabled but projects are not connected to repos. Connecting your source code and run Root Cause Analysis, Solution generation, and PR creation.'
+      ),
+    };
+  }
+
+  if (!isCodeReviewEnabled) {
+    return {
+      title: (
+        <Flex align="center" gap="sm">
+          <IconSeer />
+          {t('Start using Code Review')}
+        </Flex>
       ),
-    },
-    [Steps.SETUP_CODE_REVIEW]: {
-      title: t('Start using Seer\u2019s AI Code Review'),
       description: t(
         'Seer is enabled but Code Review is not configured. Configure Seer to automatically review PRs and flag potential issues.'
       ),
-    },
-    [Steps.SETUP_DEFAULTS]: null,
-    [Steps.WRAP_UP]: null,
-  };
-
-  if (hasSeatBasedSeer) {
-    return descriptionByStep[initialStep];
+    };
   }
-  if (hasLegacySeer) {
-    return descriptionByStep[Steps.SETUP_CODE_REVIEW];
-  }
-  return descriptionByStep[Steps.SETUP_ROOT_CAUSE_ANALYSIS];
+
+  return null;
 }
 
 export function PrimaryNavSeerConfigReminder() {
@@ -200,11 +233,12 @@ export function PrimaryNavSeerConfigReminder() {
       />
       {isOpen && (
         <PrimaryNavigation.ButtonOverlay overlayProps={overlayProps}>
-          <Stack gap="lg" padding="xl">
+          <Stack gap="xl">
             <Heading as="h3">{copy.title}</Heading>
             <Text>{copy.description}</Text>
             <Flex justify="start">
               <LinkButton
+                size="sm"
                 to={`/settings/${organization.slug}/seer/`}
                 priority="primary"
                 onClick={() => state.close()}
diff --git a/static/gsApp/views/seerAutomation/components/repoTable/seerRepoTable.tsx b/static/gsApp/views/seerAutomation/components/repoTable/seerRepoTable.tsx
@@ -26,6 +26,7 @@ import {IconSearch} from 'sentry/icons/iconSearch';
 import {t, tct} from 'sentry/locale';
 import type {RepositoryWithSettings} from 'sentry/types/integrations';
 import {useFetchAllPages} from 'sentry/utils/api/apiFetch';
+import {getSeerOnboardingCheckQueryOptions} from 'sentry/utils/getSeerOnboardingCheckQueryOptions';
 import {
   ListItemCheckboxProvider,
   useListItemCheckboxContext,
@@ -121,6 +122,9 @@ export function SeerRepoTable() {
       });
     },
     onSettled: mutations => {
+      queryClient.invalidateQueries({
+        queryKey: getSeerOnboardingCheckQueryOptions({organization}).queryKey,
+      });
       (mutations ?? []).forEach(mutation => {
         queryClient.invalidateQueries({
           queryKey: getRepositoryWithSettingsQueryKey(organization, mutation.id),
diff --git a/static/gsApp/views/seerAutomation/components/seerConnectGitHubBanner.tsx b/static/gsApp/views/seerAutomation/components/seerConnectGitHubBanner.tsx
@@ -1,23 +1,28 @@
 import {useCallback} from 'react';
 import {ThemeProvider} from '@emotion/react';
 import styled from '@emotion/styled';
+import {useQuery} from '@tanstack/react-query';
 
 import seerConfigMainBg from 'sentry-images/spot/seer-config-main-bg.svg';
 
 import {Container, Flex, Grid, Stack} from '@sentry/scraps/layout';
 import {Heading, Text} from '@sentry/scraps/text';
 
 import {t} from 'sentry/locale';
+import {getSeerOnboardingCheckQueryOptions} from 'sentry/utils/getSeerOnboardingCheckQueryOptions';
 import {useInvertedTheme} from 'sentry/utils/theme/useInvertedTheme';
-import {useSeerOnboardingCheck} from 'sentry/utils/useSeerOnboardingCheck';
+import {useOrganization} from 'sentry/utils/useOrganization';
 
 import {GithubButton} from 'getsentry/views/seerAutomation/onboarding/githubButton';
 import {SeerOnboardingProvider} from 'getsentry/views/seerAutomation/onboarding/hooks/seerOnboardingContext';
 
 export function SeerConnectGitHubBanner() {
+  const organization = useOrganization();
   const theme = useInvertedTheme();
 
-  const {data, isFetched, isError} = useSeerOnboardingCheck();
+  const {data, isFetched, isError} = useQuery(
+    getSeerOnboardingCheckQueryOptions({organization})
+  );
 
   const handleAddIntegration = useCallback(() => {
     window.location.reload();
diff --git a/static/gsApp/views/seerAutomation/components/seerWizardSetupBanner.tsx b/static/gsApp/views/seerAutomation/components/seerWizardSetupBanner.tsx
@@ -1,5 +1,6 @@
 import {ThemeProvider} from '@emotion/react';
 import styled from '@emotion/styled';
+import {useQuery} from '@tanstack/react-query';
 
 import seerConfigMainBg from 'sentry-images/spot/seer-config-main-bg.svg';
 
@@ -9,15 +10,17 @@ import {Heading, Text} from '@sentry/scraps/text';
 
 import {IconSeer} from 'sentry/icons';
 import {t} from 'sentry/locale';
+import {getSeerOnboardingCheckQueryOptions} from 'sentry/utils/getSeerOnboardingCheckQueryOptions';
 import {useInvertedTheme} from 'sentry/utils/theme/useInvertedTheme';
 import {useOrganization} from 'sentry/utils/useOrganization';
-import {useSeerOnboardingCheck} from 'sentry/utils/useSeerOnboardingCheck';
 
 export function SeerWizardSetupBanner() {
   const organization = useOrganization();
   const theme = useInvertedTheme();
 
-  const {data, isFetched, isError} = useSeerOnboardingCheck();
+  const {data, isFetched, isError} = useQuery(
+    getSeerOnboardingCheckQueryOptions({organization})
+  );
 
   if (!isFetched || isError) {
     return null;
diff --git a/static/gsApp/views/seerAutomation/onboarding/hooks/useSeerOnboardingStep.tsx b/static/gsApp/views/seerAutomation/onboarding/hooks/useSeerOnboardingStep.tsx
@@ -1,9 +1,15 @@
-import {useSeerOnboardingCheck} from 'sentry/utils/useSeerOnboardingCheck';
+import {useQuery} from '@tanstack/react-query';
+
+import {getSeerOnboardingCheckQueryOptions} from 'sentry/utils/getSeerOnboardingCheckQueryOptions';
+import {useOrganization} from 'sentry/utils/useOrganization';
 
 import {Steps} from 'getsentry/views/seerAutomation/onboarding/types';
 
 export function useSeerOnboardingStep(): {initialStep: Steps; isPending: boolean} {
-  const {isPending, data} = useSeerOnboardingCheck({staleTime: 60_000});
+  const organization = useOrganization();
+  const {isPending, data} = useQuery(
+    getSeerOnboardingCheckQueryOptions({organization, staleTime: 60_000})
+  );
 
   let initialStep = Steps.CONNECT_GITHUB;
 
diff --git a/static/gsApp/views/subscriptionPage/usageOverview/components/panel.tsx b/static/gsApp/views/subscriptionPage/usageOverview/components/panel.tsx
