@mkaradeniz/eslint-config 5.5.0 → 5.7.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mkaradeniz/eslint-config",
-  "version": "5.5.0",
+  "version": "5.7.0",
   "private": false,
   "files": [
     "base.mjs",
@@ -8,6 +8,7 @@
     "next.mjs",
     "react.mjs",
     "shadcn.mjs",
+    "tanstackQuery.mjs",
     "turbo.mjs",
     "eslint.config.mjs",
     "rules/"
@@ -28,6 +29,7 @@
     "@eslint/compat": "^2.0.2",
     "@next/eslint-plugin-next": "^16.1.6",
     "@stylistic/eslint-plugin": "^5.8.0",
+    "@tanstack/eslint-plugin-query": "^5.91.4",
     "eslint-plugin-import-x": "^4.16.1",
     "eslint-plugin-jsdoc": "^62.5.5",
     "eslint-plugin-jsx-a11y": "^6.10.2",

package/rules/reactRules.mjs

@@ -8,34 +8,6 @@ export const reactRules = {
     'no-restricted-imports': [
       'warn',
       {
-        paths: [
-          {
-            importNames: [
-              'createContext',
-              'forwardRef',
-              'startTransition',
-              'use',
-              'useCallback',
-              'useContext',
-              'useDebugValue',
-              'useDeferredValue',
-              'useEffect',
-              'useId',
-              'useImperativeHandle',
-              'useInsertionEffect',
-              'useLayoutEffect',
-              'useMemo',
-              'useReducer',
-              'useRef',
-              'useState',
-              'useSyncExternalStore',
-              'useTransition',
-            ],
-            message:
-              "React built-in hooks & functions should not be imported directly. `import React from 'react'` and then use `React.useBuiltInHook()` || `React.function()`.",
-            name: 'react',
-          },
-        ],
         patterns: [
           {
             allowImportNamePattern: 'Icon$',
@@ -48,6 +20,18 @@ export const reactRules = {
     'no-restricted-syntax': [
       baseNoRestrictedSyntaxSeverity,
       ...baseNoRestrictedSyntaxSelectors,
+      {
+        message: "Use named imports instead of `import React from 'react'`. Use `import { useState } from 'react'`.",
+        selector: "ImportDeclaration[source.value='react'] ImportDefaultSpecifier",
+      },
+      {
+        message: "Use named imports instead of `import * as React from 'react'`. Use `import { useState } from 'react'`.",
+        selector: "ImportDeclaration[source.value='react'] ImportNamespaceSpecifier",
+      },
+      {
+        message: "Use named imports instead of `React.method()`. Use `import { useState } from 'react'`.",
+        selector: "MemberExpression[object.name='React']",
+      },
       {
         message: 'Use the cn() utility instead of template literals for className.',
         selector: "JSXAttribute[name.name='className'] > JSXExpressionContainer > TemplateLiteral",

package/rules/tanstackQueryRules.mjs

@@ -0,0 +1,11 @@
+export const tanstackQueryRules = {
+  rules: {
+    '@tanstack/query/exhaustive-deps': ['warn'],
+    '@tanstack/query/infinite-query-property-order': ['warn'],
+    '@tanstack/query/mutation-property-order': ['warn'],
+    '@tanstack/query/no-rest-destructuring': ['warn'],
+    '@tanstack/query/no-unstable-deps': ['warn'],
+    '@tanstack/query/no-void-query-fn': ['warn'],
+    '@tanstack/query/stable-query-client': ['warn'],
+  },
+};

package/tanstackQuery.mjs

@@ -0,0 +1,15 @@
+import eslintPluginQuery from '@tanstack/eslint-plugin-query';
+
+import { tanstackQueryRules } from './rules/tanstackQueryRules.mjs';
+
+export const tanstackQueryConfig = [
+  {
+    plugins: {
+      /**
+       * https://tanstack.com/query/latest/docs/eslint/eslint-plugin-query
+       */
+      '@tanstack/query': eslintPluginQuery,
+    },
+  },
+  { ...tanstackQueryRules },
+];