chore!: rename require-query-options -> use-query-no-inline-query

Author: danielpza

README.md

@@ -21,9 +21,19 @@ export default [
 💼 Configurations enabled in.\
 ✅ Set in the `recommended` configuration.
 
-| Name                                                         | Description                                                         | 💼 |
-| :----------------------------------------------------------- | :------------------------------------------------------------------ | :- |
-| [require-query-options](docs/rules/require-query-options.md) | Enforce use*Query functions are called with a queryOptions pattern. | ✅  |
+| Name                                                                 | Description                                                                                                                                          | 💼 |
+| :------------------------------------------------------------------- | :--------------------------------------------------------------------------------------------------------------------------------------------------- | :- |
+| [use-query-no-inline-query](docs/rules/use-query-no-inline-query.md) | Enforces useQuery (and family) hooks use some form of query constructor pattern. Will error if queryKey or queryFn properties are passed to the hook | ✅  |
 
 <!-- end auto-generated rules list -->
 <!-- prettier-ignore-end -->
+
+## Configs
+
+<!-- begin auto-generated configs list -->
+
+|    | Name          |
+| :- | :------------ |
+| ✅  | `recommended` |
+
+<!-- end auto-generated configs list -->

docs/rules/require-query-options.md renamed to docs/rules/use-query-no-inline-query.md

@@ -1,4 +1,4 @@
-# Enforce use*Query functions are called with a queryOptions pattern (`react-query-options/require-query-options`)
+# Enforces useQuery (and family) hooks use some form of query constructor pattern. Will error if queryKey or queryFn properties are passed to the hook (`react-query-options/use-query-no-inline-query`)
 
 💼 This rule is enabled in the ✅ `recommended` config.
 

src/index.ts

@@ -1,4 +1,5 @@
-import requireQueryOptions from "./rules/require-query-options.js";
+import useQueryNoInlineQuery from "./rules/use-query-no-inline-query.js";
+
 import pkg from "../package.json" with { type: "json" };
 
 const reactQueryOptions = {
@@ -11,18 +12,19 @@ const reactQueryOptions = {
     return configs;
   },
   rules: {
-    "require-query-options": requireQueryOptions,
+    [useQueryNoInlineQuery.name]: useQueryNoInlineQuery.rule,
   },
 };
 
 const configs = {
   recommended: [
     {
       plugins: {
-        "react-query-options": reactQueryOptions,
+        [reactQueryOptions.meta.namespace]: reactQueryOptions,
       },
       rules: {
-        "react-query-options/require-query-options": "error",
+        [`${reactQueryOptions.meta.namespace}/${useQueryNoInlineQuery.name}`]:
+          "error",
       },
     },
   ],

src/rules/require-query-options.ts

@@ -2,11 +2,11 @@ import "../_test/setup.js";
 
 import { RuleTester } from "@typescript-eslint/rule-tester";
 
-import requireQueryOptions from "./require-query-options.js";
+import requireQueryOptions from "./use-query-no-inline-query.js";
 
 const ruleTester = new RuleTester({});
 
-ruleTester.run("require-query-options", requireQueryOptions, {
+ruleTester.run(requireQueryOptions.name, requireQueryOptions.rule, {
   valid: [
     { code: `useQuery(usersQuery)` },
     { code: `useQuery({ ...usersQuery })` },
@@ -16,19 +16,19 @@ ruleTester.run("require-query-options", requireQueryOptions, {
   invalid: [
     {
       code: `useQuery({ queryKey: [] })`,
-      errors: [{ messageId: "require-query-options" }],
+      errors: [{ messageId: "no-inline-query" }],
     },
     {
       code: `const users = useQuery({ ...queryOptions, queryKey: [] })`,
-      errors: [{ messageId: "require-query-options" }],
+      errors: [{ messageId: "no-inline-query" }],
     },
     {
       code: `const users = useQuery({ queryFn: () => {} })`,
-      errors: [{ messageId: "require-query-options" }],
+      errors: [{ messageId: "no-inline-query" }],
     },
     {
       code: `const users = useQuery({ ...queryOptions, queryFn: () => {} })`,
-      errors: [{ messageId: "require-query-options" }],
+      errors: [{ messageId: "no-inline-query" }],
     },
   ],
 });

src/rules/require-query-options.test.ts renamed to src/rules/use-query-no-inline-query.test.ts

@@ -0,0 +1,78 @@
+import {
+  AST_NODE_TYPES,
+  ESLintUtils,
+  TSESTree,
+} from "@typescript-eslint/utils";
+
+const createRule = ESLintUtils.RuleCreator(
+  (name) =>
+    `https://github.com/danielpza/eslint-plugin-react-query/docs/rules/${name}.md`,
+);
+
+const useQueryHooks = [
+  // see https://tanstack.com/query/latest/docs/framework/react/reference/useQuery
+  "useQuery",
+  "useQueries",
+  "useInfiniteQuery",
+  "useSuspenseQuery",
+  "useSuspenseQueries",
+  "useSuspenseInfiniteQuery",
+];
+
+const invalidProperties = ["queryKey", "queryFn"];
+
+function isValidQueryNode(queryNode: TSESTree.Node) {
+  // we only care about object expressions
+  if (queryNode.type !== AST_NODE_TYPES.ObjectExpression) return true;
+
+  // check if any of the properties is queryKey or queryFn
+  const hasInvalidProperties = queryNode.properties.find(
+    (property) =>
+      property.type === AST_NODE_TYPES.Property &&
+      property.key.type === AST_NODE_TYPES.Identifier &&
+      invalidProperties.includes(property.key.name),
+  );
+
+  return !hasInvalidProperties;
+}
+
+const name = "use-query-no-inline-query";
+
+export default {
+  name,
+  rule: createRule({
+    name,
+    defaultOptions: [],
+    meta: {
+      type: "suggestion",
+      messages: {
+        "no-inline-query": "Expected query hook to use queryOptions pattern",
+      },
+      docs: {
+        description:
+          "Enforces useQuery (and family) hooks use some form of query constructor pattern. Will error if queryKey or queryFn properties are passed to the hook",
+      },
+      schema: [],
+    },
+    create(context) {
+      return {
+        CallExpression(node) {
+          if (node.callee.type !== AST_NODE_TYPES.Identifier) return;
+          if (!useQueryHooks.includes(node.callee.name)) return;
+
+          // use*Query hook call
+          if (!node.arguments[0]) return;
+
+          // if if caller first argument is an object
+          const queryNode = node.arguments[0];
+
+          if (!isValidQueryNode(queryNode))
+            context.report({
+              messageId: "no-inline-query",
+              node,
+            });
+        },
+      };
+    },
+  }),
+};