fix: Resolve Sentry issue fetching in MissingDesignatedAdmins Without a Provider (#3612)

Author: nsdeschenes

src/shared/GlobalBanners/MissingDesignatedAdmins/MissingDesignatedAdmins.test.jsx

@@ -1,4 +1,3 @@
-import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import {
   QueryClientProvider as QueryClientProviderV5,
   QueryClient as QueryClientV5,
@@ -19,9 +18,6 @@ const mockApiSelfHostedSetUpCorrectly = { config: { hasAdmins: true } }
 const mockApiSelfHostedSetUpIncorrectly = { config: { hasAdmins: false } }
 const mockApiCloud = { config: undefined }
 
-const queryClient = new QueryClient({
-  defaultOptions: { queries: { retry: false } },
-})
 const queryClientV5 = new QueryClientV5({
   defaultOptions: { queries: { retry: false } },
 })
@@ -30,13 +26,11 @@ const wrapper =
   (initialEntries = ['/gh/test-org/test-repo/pull/12']) =>
   ({ children }) => (
     <QueryClientProviderV5 client={queryClientV5}>
-      <QueryClientProvider client={queryClient}>
-        <MemoryRouter initialEntries={initialEntries}>
-          <Route path="/:provider/:owner/:repo/pull/:pullId">
-            <Suspense fallback={<div>Loading</div>}>{children}</Suspense>
-          </Route>
-        </MemoryRouter>
-      </QueryClientProvider>
+      <MemoryRouter initialEntries={initialEntries}>
+        <Route path="/:provider/:owner/:repo/pull/:pullId">
+          <Suspense fallback={<div>Loading</div>}>{children}</Suspense>
+        </Route>
+      </MemoryRouter>
     </QueryClientProviderV5>
   )
 
@@ -46,7 +40,6 @@ beforeAll(() => {
 })
 
 afterEach(() => {
-  queryClient.clear()
   queryClientV5.clear()
   server.resetHandlers()
 })

src/shared/GlobalBanners/MissingDesignatedAdmins/MissingDesignatedAdmins.tsx

@@ -8,44 +8,18 @@ import { Provider } from 'shared/api/helpers'
 import A from 'ui/A'
 import Banner from 'ui/Banner'
 
-interface Props {
+interface MissingDesignatedAdminsProps {
   provider: Provider
-  hasAdmins?: boolean | null
-  isFetching?: boolean
-  isSelfHosted?: boolean
 }
 
-const useHideBanner = ({
+const MissingDesignatedAdmins: React.FC<MissingDesignatedAdminsProps> = ({
   provider,
-  hasAdmins,
-  isFetching,
-  isSelfHosted,
-}: Props) => {
-  if (!isSelfHosted || !provider || hasAdmins || isFetching) {
-    return true
-  }
-
-  return false
-}
-
-interface URLParams {
-  provider: Provider
-}
-
-const MissingDesignatedAdmins = () => {
-  const { provider } = useParams<URLParams>()
+}) => {
   const { data: hasAdmins, isFetching } = useSuspenseQueryV5(
     SelfHostedHasAdminsQueryOpts({ provider })
   )
-  // This hook is purely side stepping the complexity rule here.
-  const hideBanner = useHideBanner({
-    provider,
-    hasAdmins,
-    isFetching,
-    isSelfHosted: !!config.IS_SELF_HOSTED,
-  })
 
-  if (hideBanner) {
+  if (!config.IS_SELF_HOSTED || hasAdmins || isFetching) {
     return null
   }
 
@@ -70,4 +44,18 @@ const MissingDesignatedAdmins = () => {
   )
 }
 
-export default MissingDesignatedAdmins
+interface URLParams {
+  provider?: Provider
+}
+
+const MissingDesignatedAdminsWrapper = () => {
+  const { provider } = useParams<URLParams>()
+
+  if (provider) {
+    return <MissingDesignatedAdmins provider={provider} />
+  }
+
+  return null
+}
+
+export default MissingDesignatedAdminsWrapper