@tanstack/eslint-plugin-query 5.59.7 → 5.60.1

package/src/__tests__/infinite-query-property-order.rule.test.ts

@@ -1,222 +0,0 @@
-import { RuleTester } from '@typescript-eslint/rule-tester'
-import combinate from 'combinate'
-
-import {
-  checkedProperties,
-  infiniteQueryFunctions,
-} from '../rules/infinite-query-property-order/constants'
-import {
-  name,
-  rule,
-} from '../rules/infinite-query-property-order/infinite-query-property-order.rule'
-import {
-  generateInterleavedCombinations,
-  generatePartialCombinations,
-  generatePermutations,
-  normalizeIndent,
-} from './test-utils'
-import type { InfiniteQueryFunctions } from '../rules/infinite-query-property-order/constants'
-
-const ruleTester = new RuleTester()
-
-type CheckedProperties = (typeof checkedProperties)[number]
-const orderIndependentProps = [
-  'queryKey',
-  '...objectExpressionSpread',
-  '...callExpressionSpread',
-  '...memberCallExpressionSpread',
-] as const
-type OrderIndependentProps = (typeof orderIndependentProps)[number]
-
-interface TestCase {
-  infiniteQueryFunction: InfiniteQueryFunctions
-  properties: Array<CheckedProperties | OrderIndependentProps>
-}
-
-const validTestMatrix = combinate({
-  infiniteQueryFunction: [...infiniteQueryFunctions],
-  properties: generatePartialCombinations(checkedProperties, 2),
-})
-
-export function generateInvalidPermutations(
-  arr: ReadonlyArray<CheckedProperties>,
-): Array<{
-  invalid: Array<CheckedProperties>
-  valid: Array<CheckedProperties>
-}> {
-  const combinations = generatePartialCombinations(arr, 2)
-  const allPermutations: Array<{
-    invalid: Array<CheckedProperties>
-    valid: Array<CheckedProperties>
-  }> = []
-
-  for (const combination of combinations) {
-    const permutations = generatePermutations(combination)
-    // skip the first permutation as it matches the original combination
-    const invalidPermutations = permutations.slice(1)
-
-    if (
-      combination.includes('getNextPageParam') &&
-      combination.includes('getPreviousPageParam')
-    ) {
-      if (
-        combination.indexOf('getNextPageParam') <
-        combination.indexOf('getPreviousPageParam')
-      ) {
-        // since we ignore the relative order of 'getPreviousPageParam' and 'getNextPageParam', we skip this combination (but keep the other one where `getPreviousPageParam` is before `getNextPageParam`)
-
-        continue
-      }
-    }
-
-    allPermutations.push(
-      ...invalidPermutations
-        .map((p) => {
-          // ignore the relative order of 'getPreviousPageParam' and 'getNextPageParam'
-          const correctedValid = [...combination].sort((a, b) => {
-            if (
-              (a === 'getNextPageParam' && b === 'getPreviousPageParam') ||
-              (a === 'getPreviousPageParam' && b === 'getNextPageParam')
-            ) {
-              return p.indexOf(a) - p.indexOf(b)
-            }
-            return checkedProperties.indexOf(a) - checkedProperties.indexOf(b)
-          })
-          return { invalid: p, valid: correctedValid }
-        })
-        .filter(
-          ({ invalid }) =>
-            // if `getPreviousPageParam` and `getNextPageParam` are next to each other and `queryFn` is not present, we skip this invalid permutation
-            Math.abs(
-              invalid.indexOf('getNextPageParam') -
-                invalid.indexOf('getPreviousPageParam'),
-            ) !== 1,
-        ),
-    )
-  }
-
-  return allPermutations
-}
-
-const invalidPermutations = generateInvalidPermutations(checkedProperties)
-
-type Interleaved = CheckedProperties | OrderIndependentProps
-const interleavedInvalidPermutations: Array<{
-  invalid: Array<Interleaved>
-  valid: Array<Interleaved>
-}> = []
-for (const invalidPermutation of invalidPermutations) {
-  const invalid = generateInterleavedCombinations(
-    invalidPermutation.invalid,
-    orderIndependentProps,
-  )
-  const valid = generateInterleavedCombinations(
-    invalidPermutation.valid,
-    orderIndependentProps,
-  )
-
-  for (let i = 0; i < invalid.length; i++) {
-    interleavedInvalidPermutations.push({
-      invalid: invalid[i]!,
-      valid: valid[i]!,
-    })
-  }
-}
-
-const invalidTestMatrix = combinate({
-  infiniteQueryFunction: [...infiniteQueryFunctions],
-  properties: interleavedInvalidPermutations,
-})
-
-const callExpressionSpread = normalizeIndent`
-        ...communitiesQuery({
-          filters: {
-            ...fieldValues,
-            placementFormats: [],
-          },
-        })`
-
-function getCode({
-  infiniteQueryFunction: infiniteQueryFunction,
-  properties,
-}: TestCase) {
-  function getPropertyCode(
-    property: CheckedProperties | OrderIndependentProps,
-  ) {
-    switch (property) {
-      case '...objectExpressionSpread':
-        return `...objectExpressionSpread`
-      case '...callExpressionSpread':
-        return callExpressionSpread
-      case '...memberCallExpressionSpread':
-        return '...myOptions.infiniteQueryOptions()'
-      case 'queryKey':
-        return `queryKey: ['projects']`
-      case 'queryFn':
-        return 'queryFn: async ({ pageParam }) => { \n await fetch(`/api/projects?cursor=${pageParam}`) \n return await response.json() \n }'
-      case 'getPreviousPageParam':
-        return 'getPreviousPageParam: (firstPage) => firstPage.previousId ?? undefined'
-      case 'getNextPageParam':
-        return 'getNextPageParam: (lastPage) => lastPage.nextId ?? undefined'
-    }
-  }
-  return `
-    import { ${infiniteQueryFunction} } from '@tanstack/react-query'
-
-    ${infiniteQueryFunction}({
-        ${properties.map(getPropertyCode).join(',\n        ')}
-    })
-  `
-}
-
-const validTestCases = validTestMatrix.map(
-  ({ infiniteQueryFunction, properties }) => ({
-    name: `should pass when order is correct for ${infiniteQueryFunction} with order: ${properties.join(', ')}`,
-    code: getCode({ infiniteQueryFunction, properties }),
-  }),
-)
-
-const invalidTestCases = invalidTestMatrix.map(
-  ({ infiniteQueryFunction, properties }) => ({
-    name: `incorrect property order is detected for ${infiniteQueryFunction} with invalid order: ${properties.invalid.join(', ')}, valid order: ${properties.valid.join(', ')}`,
-    code: getCode({
-      infiniteQueryFunction: infiniteQueryFunction,
-      properties: properties.invalid,
-    }),
-    errors: [{ messageId: 'invalidOrder' }],
-    output: getCode({
-      infiniteQueryFunction: infiniteQueryFunction,
-      properties: properties.valid,
-    }),
-  }),
-)
-
-ruleTester.run(name, rule, {
-  valid: validTestCases,
-  invalid: invalidTestCases,
-})
-
-// regression tests
-
-const regressionTestCases = {
-  valid: [
-    {
-      name: 'should pass with call expression spread',
-      code: normalizeIndent`
-      import { useInfiniteQuery } from '@tanstack/react-query'
-      const { data, isFetching, isLoading, hasNextPage, fetchNextPage } =
-      useInfiniteQuery({
-        ...communitiesQuery({
-          filters: {
-            ...fieldValues,
-            placementFormats: [],
-          },
-        }),
-        refetchOnMount: false,
-      })`,
-    },
-  ],
-  invalid: [],
-}
-
-ruleTester.run(name, rule, regressionTestCases)

package/src/__tests__/infinite-query-property-order.utils.test.ts

@@ -1,79 +0,0 @@
-import { describe, expect, test } from 'vitest'
-import { sortDataByOrder } from '../rules/infinite-query-property-order/infinite-query-property-order.utils'
-
-describe('create-route-property-order utils', () => {
-  describe('sortDataByOrder', () => {
-    const testCases = [
-      {
-        data: [{ key: 'a' }, { key: 'c' }, { key: 'b' }],
-        orderArray: [
-          [['a'], ['b']],
-          [['b'], ['c']],
-        ],
-        key: 'key',
-        expected: [{ key: 'a' }, { key: 'b' }, { key: 'c' }],
-      },
-      {
-        data: [{ key: 'b' }, { key: 'a' }, { key: 'c' }],
-        orderArray: [
-          [['a'], ['b']],
-          [['b'], ['c']],
-        ],
-        key: 'key',
-        expected: [{ key: 'a' }, { key: 'b' }, { key: 'c' }],
-      },
-      {
-        data: [{ key: 'a' }, { key: 'b' }, { key: 'c' }],
-        orderArray: [
-          [['a'], ['b']],
-          [['b'], ['c']],
-        ],
-        key: 'key',
-        expected: null,
-      },
-      {
-        data: [{ key: 'a' }, { key: 'b' }, { key: 'c' }, { key: 'd' }],
-        orderArray: [
-          [['a'], ['b']],
-          [['b'], ['c']],
-        ],
-        key: 'key',
-        expected: null,
-      },
-      {
-        data: [{ key: 'a' }, { key: 'b' }, { key: 'd' }, { key: 'c' }],
-        orderArray: [
-          [['a'], ['b']],
-          [['b'], ['c']],
-        ],
-        key: 'key',
-        expected: null,
-      },
-      {
-        data: [{ key: 'd' }, { key: 'a' }, { key: 'b' }, { key: 'c' }],
-        orderArray: [
-          [['a'], ['b']],
-          [['b'], ['c']],
-        ],
-        key: 'key',
-        expected: null,
-      },
-      {
-        data: [{ key: 'd' }, { key: 'b' }, { key: 'a' }, { key: 'c' }],
-        orderArray: [
-          [['a'], ['b']],
-          [['b'], ['c']],
-        ],
-        key: 'key',
-        expected: [{ key: 'd' }, { key: 'a' }, { key: 'b' }, { key: 'c' }],
-      },
-    ] as const
-    test.each(testCases)(
-      '$data $orderArray $key $expected',
-      ({ data, orderArray, key, expected }) => {
-        const sortedData = sortDataByOrder(data, orderArray, key)
-        expect(sortedData).toEqual(expected)
-      },
-    )
-  })
-})

package/src/__tests__/no-rest-destructuring.test.ts

@@ -1,192 +0,0 @@
-import { RuleTester } from '@typescript-eslint/rule-tester'
-import { rule } from '../rules/no-rest-destructuring/no-rest-destructuring.rule'
-import { normalizeIndent } from './test-utils'
-
-const ruleTester = new RuleTester()
-
-ruleTester.run('no-rest-destructuring', rule, {
-  valid: [
-    {
-      name: 'useQuery is not captured',
-      code: normalizeIndent`
-        import { useQuery } from '@tanstack/react-query'
-
-        function Component() {
-          useQuery()
-          return
-        }
-      `,
-    },
-    {
-      name: 'useQuery is not destructured',
-      code: normalizeIndent`
-          import { useQuery } from '@tanstack/react-query'
-
-          function Component() {
-            const query = useQuery()
-            return
-          }
-        `,
-    },
-    {
-      name: 'useQuery is destructured without rest',
-      code: normalizeIndent`
-          import { useQuery } from '@tanstack/react-query'
-
-          function Component() {
-            const { data, isLoading, isError } = useQuery()
-            return
-          }
-        `,
-    },
-    {
-      name: 'useInfiniteQuery is not captured',
-      code: normalizeIndent`
-        import { useInfiniteQuery } from '@tanstack/react-query'
-
-        function Component() {
-          useInfiniteQuery()
-          return
-        }
-      `,
-    },
-    {
-      name: 'useInfiniteQuery is not destructured',
-      code: normalizeIndent`
-          import { useInfiniteQuery } from '@tanstack/react-query'
-
-          function Component() {
-            const query = useInfiniteQuery()
-            return
-          }
-        `,
-    },
-    {
-      name: 'useInfiniteQuery is destructured without rest',
-      code: normalizeIndent`
-          import { useInfiniteQuery } from '@tanstack/react-query'
-
-          function Component() {
-            const { data, isLoading, isError } = useInfiniteQuery()
-            return
-          }
-        `,
-    },
-    {
-      name: 'useQueries is not captured',
-      code: normalizeIndent`
-        import { useQueries } from '@tanstack/react-query'
-
-        function Component() {
-          useQueries([])
-          return
-        }
-      `,
-    },
-    {
-      name: 'useQueries is not destructured',
-      code: normalizeIndent`
-          import { useQueries } from '@tanstack/react-query'
-
-          function Component() {
-            const queries = useQueries([])
-            return
-          }
-        `,
-    },
-    {
-      name: 'useQueries array has no rest destructured element',
-      code: normalizeIndent`
-          import { useQueries } from '@tanstack/react-query'
-
-          function Component() {
-            const [query1, { data, isLoading },, ...others] = useQueries([
-              { queryKey: ['key1'], queryFn: () => {} },
-              { queryKey: ['key2'], queryFn: () => {} },
-              { queryKey: ['key3'], queryFn: () => {} },
-              { queryKey: ['key4'], queryFn: () => {} },
-              { queryKey: ['key5'], queryFn: () => {} },
-            ])
-            return
-          }
-        `,
-    },
-    {
-      name: 'useQuery is destructured with rest but not from tanstack query',
-      code: normalizeIndent`
-        import { useQuery } from 'other-package'
-
-        function Component() {
-          const { data, ...rest } = useQuery()
-          return
-        }
-      `,
-    },
-    {
-      name: 'useInfiniteQuery is destructured with rest but not from tanstack query',
-      code: normalizeIndent`
-        import { useInfiniteQuery } from 'other-package'
-
-        function Component() {
-          const { data, ...rest } = useInfiniteQuery()
-          return
-        }
-      `,
-    },
-    {
-      name: 'useQueries array has rest destructured element but not from tanstack query',
-      code: normalizeIndent`
-          import { useQueries } from 'other-package'
-
-          function Component() {
-            const [query1, { data, ...rest }] = useQueries([
-              { queryKey: ['key1'], queryFn: () => {} },
-              { queryKey: ['key2'], queryFn: () => {} },
-            ])
-            return
-          }
-        `,
-    },
-  ],
-  invalid: [
-    {
-      name: 'useQuery is destructured with rest',
-      code: normalizeIndent`
-        import { useQuery } from '@tanstack/react-query'
-
-        function Component() {
-          const { data, ...rest } = useQuery()
-          return
-        }
-      `,
-      errors: [{ messageId: 'objectRestDestructure' }],
-    },
-    {
-      name: 'useInfiniteQuery is destructured with rest',
-      code: normalizeIndent`
-        import { useInfiniteQuery } from '@tanstack/react-query'
-
-        function Component() {
-          const { data, ...rest } = useInfiniteQuery()
-          return
-        }
-      `,
-      errors: [{ messageId: 'objectRestDestructure' }],
-    },
-    {
-      name: 'useQueries array has rest destructured element',
-      code: normalizeIndent`
-          import { useQueries } from '@tanstack/react-query'
-
-          function Component() {
-            const [query1, { data, ...rest }] = useQueries([
-              { queryKey: ['key1'], queryFn: () => {} },
-              { queryKey: ['key2'], queryFn: () => {} },
-            ])
-            return
-          }
-        `,
-      errors: [{ messageId: 'objectRestDestructure' }],
-    },
-  ],
-})

package/src/__tests__/no-unstable-deps.test.ts

@@ -1,129 +0,0 @@
-import { RuleTester } from '@typescript-eslint/rule-tester'
-import {
-  reactHookNames,
-  rule,
-  useQueryHookNames,
-} from '../rules/no-unstable-deps/no-unstable-deps.rule'
-
-const ruleTester = new RuleTester()
-
-interface TestCase {
-  reactHookImport: string
-  reactHookInvocation: string
-  reactHookAlias: string
-}
-const baseTestCases = {
-  valid: ({ reactHookImport, reactHookInvocation, reactHookAlias }: TestCase) =>
-    [
-      {
-        name: `should pass when destructured mutate is passed to ${reactHookAlias} as dependency`,
-        code: `
-            ${reactHookImport}
-            import { useMutation } from "@tanstack/react-query";
-
-            function Component() {
-                const { mutate } = useMutation({ mutationFn: (value: string) => value });
-                const callback = ${reactHookInvocation}(() => { mutate('hello') }, [mutate]);
-                return;
-            }
-              `,
-      },
-    ].concat(
-      useQueryHookNames.map((queryHook) => ({
-        name: `should pass result of ${queryHook} is passed to ${reactHookInvocation} as dependency`,
-        code: `
-            ${reactHookImport}
-            import { ${queryHook} } from "@tanstack/react-query";
-
-            function Component() {
-              const { refetch } = ${queryHook}({ queryFn: (value: string) => value });
-              const callback = ${reactHookInvocation}(() => { query.refetch() }, [refetch]);
-              return;
-            }
-          `,
-      })),
-    ),
-  invalid: ({
-    reactHookImport,
-    reactHookInvocation,
-    reactHookAlias,
-  }: TestCase) =>
-    [
-      {
-        name: `result of useMutation is passed to ${reactHookInvocation} as dependency `,
-        code: `
-            ${reactHookImport}
-            import { useMutation } from "@tanstack/react-query";
-
-            function Component() {
-              const mutation = useMutation({ mutationFn: (value: string) => value });
-              const callback = ${reactHookInvocation}(() => { mutation.mutate('hello') }, [mutation]);
-              return;
-            }
-          `,
-        errors: [
-          {
-            messageId: 'noUnstableDeps',
-            data: { reactHook: reactHookAlias, queryHook: 'useMutation' },
-          },
-        ],
-      },
-    ].concat(
-      useQueryHookNames.map((queryHook) => ({
-        name: `result of ${queryHook} is passed to ${reactHookInvocation} as dependency`,
-        code: `
-            ${reactHookImport}
-            import { ${queryHook} } from "@tanstack/react-query";
-
-            function Component() {
-              const query = ${queryHook}({ queryFn: (value: string) => value });
-              const callback = ${reactHookInvocation}(() => { query.refetch() }, [query]);
-              return;
-            }
-          `,
-        errors: [
-          {
-            messageId: 'noUnstableDeps',
-            data: { reactHook: reactHookAlias, queryHook },
-          },
-        ],
-      })),
-    ),
-}
-
-const testCases = (reactHookName: string) => [
-  {
-    reactHookImport: 'import * as React from "React";',
-    reactHookInvocation: `React.${reactHookName}`,
-    reactHookAlias: reactHookName,
-  },
-  {
-    reactHookImport: `import { ${reactHookName} } from "React";`,
-    reactHookInvocation: reactHookName,
-    reactHookAlias: reactHookName,
-  },
-  {
-    reactHookImport: `import { ${reactHookName} as useAlias } from "React";`,
-    reactHookInvocation: 'useAlias',
-    reactHookAlias: 'useAlias',
-  },
-]
-
-reactHookNames.forEach((reactHookName) => {
-  testCases(reactHookName).forEach(
-    ({ reactHookInvocation, reactHookAlias, reactHookImport }) => {
-      ruleTester.run('no-unstable-deps', rule, {
-        valid: baseTestCases.valid({
-          reactHookImport,
-          reactHookInvocation,
-          reactHookAlias,
-        }),
-        invalid: baseTestCases.invalid({
-          reactHookImport,
-          reactHookInvocation,
-          reactHookAlias,
-        }),
-      })
-    },
-  )
-})