migrate useRepoConfigurationStatus to RepoConfigurationStatusQueryOpts

codecov · Dec 31, 2024 · 0c14fde · 0c14fde
1 parent a1e07ef
commit 0c14fde
Show file tree

Hide file tree

Showing 2 changed files with 61 additions and 43 deletions.
diff --git a/...tatus/useRepoConfigurationStatus.test.tsx → ...RepoConfigurationStatusQueryOpts.test.tsx b/...tatus/useRepoConfigurationStatus.test.tsx → ...RepoConfigurationStatusQueryOpts.test.tsx
@@ -1,9 +1,13 @@
-import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import {
+  QueryClientProvider as QueryClientProviderV5,
+  QueryClient as QueryClientV5,
+  useQuery as useQueryV5,
+} from '@tanstack/react-queryV5'
 import { renderHook, waitFor } from '@testing-library/react'
 import { graphql, HttpResponse } from 'msw'
 import { setupServer } from 'msw/node'
 
-import { useRepoConfigurationStatus } from './useRepoConfigurationStatus'
+import { RepoConfigurationStatusQueryOpts } from './RepoConfigurationStatusQueryOpts'
 
 const mockRepoNotFound = {
   owner: {
@@ -49,20 +53,22 @@ const mockGoodResponse = {
   },
 }
 
-const queryClient = new QueryClient({
+const queryClientV5 = new QueryClientV5({
   defaultOptions: { queries: { retry: false } },
 })
 const server = setupServer()
 
 const wrapper: React.FC<React.PropsWithChildren> = ({ children }) => (
-  <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
+  <QueryClientProviderV5 client={queryClientV5}>
+    {children}
+  </QueryClientProviderV5>
 )
 
 beforeAll(() => {
   server.listen()
 })
 afterEach(() => {
-  queryClient.clear()
+  queryClientV5.clear()
   server.resetHandlers()
 })
 afterAll(() => {
@@ -104,11 +110,13 @@ describe('useRepoConfigurationStatus', () => {
     console.error = () => {}
     const { result } = renderHook(
       () =>
-        useRepoConfigurationStatus({
-          provider: 'gh',
-          owner: 'codecov',
-          repo: 'cool-repo',
-        }),
+        useQueryV5(
+          RepoConfigurationStatusQueryOpts({
+            provider: 'gh',
+            owner: 'codecov',
+            repo: 'cool-repo',
+          })
+        ),
       { wrapper }
     )
 
@@ -128,11 +136,13 @@ describe('useRepoConfigurationStatus', () => {
     console.error = () => {}
     const { result } = renderHook(
       () =>
-        useRepoConfigurationStatus({
-          provider: 'gh',
-          owner: 'codecov',
-          repo: 'cool-repo',
-        }),
+        useQueryV5(
+          RepoConfigurationStatusQueryOpts({
+            provider: 'gh',
+            owner: 'codecov',
+            repo: 'cool-repo',
+          })
+        ),
       { wrapper }
     )
 
@@ -152,11 +162,13 @@ describe('useRepoConfigurationStatus', () => {
     console.error = () => {}
     const { result } = renderHook(
       () =>
-        useRepoConfigurationStatus({
-          provider: 'gh',
-          owner: 'codecov',
-          repo: 'cool-repo',
-        }),
+        useQueryV5(
+          RepoConfigurationStatusQueryOpts({
+            provider: 'gh',
+            owner: 'codecov',
+            repo: 'cool-repo',
+          })
+        ),
       { wrapper }
     )
 
@@ -175,11 +187,13 @@ describe('useRepoConfigurationStatus', () => {
     setup({ nullOwner: true })
     const { result } = renderHook(
       () =>
-        useRepoConfigurationStatus({
-          provider: 'gh',
-          owner: 'codecov',
-          repo: 'cool-repo',
-        }),
+        useQueryV5(
+          RepoConfigurationStatusQueryOpts({
+            provider: 'gh',
+            owner: 'codecov',
+            repo: 'cool-repo',
+          })
+        ),
       { wrapper }
     )
 
@@ -197,11 +211,13 @@ describe('useRepoConfigurationStatus', () => {
     setup({})
     const { result } = renderHook(
       () =>
-        useRepoConfigurationStatus({
-          provider: 'gh',
-          owner: 'codecov',
-          repo: 'cool-repo',
-        }),
+        useQueryV5(
+          RepoConfigurationStatusQueryOpts({
+            provider: 'gh',
+            owner: 'codecov',
+            repo: 'cool-repo',
+          })
+        ),
       { wrapper }
     )
 

diff --git a/...tionStatus/useRepoConfigurationStatus.tsx → ...atus/RepoConfigurationStatusQueryOpts.tsx b/...tionStatus/useRepoConfigurationStatus.tsx → ...atus/RepoConfigurationStatusQueryOpts.tsx
@@ -1,4 +1,4 @@
-import { useQuery } from '@tanstack/react-query'
+import { queryOptions as queryOptionsV5 } from '@tanstack/react-queryV5'
 import { z } from 'zod'
 
 import {
@@ -7,7 +7,7 @@ import {
 } from 'services/repo'
 import { TierNames } from 'services/tier'
 import Api from 'shared/api/api'
-import { NetworkErrorObject } from 'shared/api/helpers'
+import { rejectNetworkError } from 'shared/api/helpers'
 import A from 'ui/A'
 
 const RepositorySchema = z.object({
@@ -51,7 +51,8 @@ const RequestSchema = z.object({
     .nullable(),
 })
 
-const query = `query GetRepoConfigurationStatus($owner: String!, $repo: String!){
+const query = `
+query GetRepoConfigurationStatus($owner: String!, $repo: String!) {
   owner(username: $owner) {
     plan {
       tierName
@@ -79,18 +80,18 @@ const query = `query GetRepoConfigurationStatus($owner: String!, $repo: String!)
   }
 }`
 
-interface UseRepoConfigurationStatusArgs {
+interface RepoConfigurationStatusQueryArgs {
   provider: string
   owner: string
   repo: string
 }
 
-export function useRepoConfigurationStatus({
+export function RepoConfigurationStatusQueryOpts({
   provider,
   owner,
   repo,
-}: UseRepoConfigurationStatusArgs) {
-  return useQuery({
+}: RepoConfigurationStatusQueryArgs) {
+  return queryOptionsV5({
     queryKey: ['GetRepoConfigurationStatus', provider, owner, repo],
     queryFn: ({ signal }) => {
       return Api.graphql({
@@ -105,25 +106,26 @@ export function useRepoConfigurationStatus({
         const parsedRes = RequestSchema.safeParse(res?.data)
 
         if (!parsedRes.success) {
-          return Promise.reject({
+          return rejectNetworkError({
             status: 404,
             data: {},
             dev: 'useRepoConfigurationStatus - 404 Failed to parse data',
-          } satisfies NetworkErrorObject)
+            error: parsedRes.error,
+          })
         }
 
         const data = parsedRes.data
 
         if (data?.owner?.repository?.__typename === 'NotFoundError') {
-          return Promise.reject({
+          return rejectNetworkError({
             status: 404,
             data: {},
             dev: 'useRepoConfigurationStatus - 404 Not found error',
-          } satisfies NetworkErrorObject)
+          })
         }
 
         if (data?.owner?.repository?.__typename === 'OwnerNotActivatedError') {
-          return Promise.reject({
+          return rejectNetworkError({
             status: 403,
             data: {
               detail: (
@@ -136,7 +138,7 @@ export function useRepoConfigurationStatus({
               ),
             },
             dev: 'useRepoConfigurationStatus - 403 Owner not activated error',
-          } satisfies NetworkErrorObject)
+          })
         }
 
         return {