@dartess/eslint-plugin 0.3.0 → 0.5.0

package/CHANGELOG.md

@@ -2,6 +2,14 @@
 
 [//]: # (https://keepachangelog.com/en/1.1.0/)
 
+## [0.5.0] - 2026-01-16
+- add rule `@dartess/mobx-sync-action`
+- add `@dartess/mobx-sync-action` to `mobx` config
+
+## [0.4.0] - 2026-01-15
+- add rule `@dartess/mobx-sync-autorun`
+- add `@dartess/mobx-sync-autorun` to `mobx` config
+
 ## [0.3.0] - 2026-01-12
 
 - add `eslint-plugin-react-hooks:recommended` config to `react` config

package/README.md

@@ -60,8 +60,6 @@ npm i -D eslint-plugin-storybook
 
 ## Usage configs
 
-Shared config based on `eslint-config-airbnb`, `eslint-config-airbnb-typescript`, `eslint-plugin-react/recommended`, `eslint-plugin-react/jsx-runtime`.
-
 Edit or create `eslint.config.ts` (or `eslint.config.mts`). You probably have to install `jiti` for it.
 
 ```ts
@@ -159,14 +157,21 @@ Each rule has emojis denoting:
 
 | Name                                                                                                       | Description                                                                   | ✅ | 🔧 | 💡 |
 |:-----------------------------------------------------------------------------------------------------------|:------------------------------------------------------------------------------|:--|:---|:---|
-| [strict-observable-components-declaration](docs/rules/strict-observable-components-declaration.md)         | Wrapping components in `observer` must comply with the regulations.           | ✅ |    |    |
-| [require-observer](docs/rules/require-observer.md)                                                         | Components using the stores must be wrapped in an `observer`                  | ✅ | 🔧 |    |
-| [prevent-mixing-external-and-internal-classes](docs/rules/prevent-mixing-external-and-internal-classes.md) | Prevent mixing of outer and inner classes to avoid dependency on style order. |   |    |    |
+| **imports**                                                                                                | _config: recommended_                                                         |   |    |    |
+| [max-parent-import-depth](docs/rules/max-parent-import-depth.md)                                           | Limit relative imports to a maximum parent depth.                             | ✅ |    |    |
+| **TypeScript**                                                                                             | _config: recommended_                                                         |   |    |    |
+| [ts-named-tuple-elements](docs/rules/ts-named-tuple-elements.md)                                           | Enforce (or forbid) named tuple elements                                      | ✅ |    |    |
+| **React**                                                                                                  | _config: react_                                                               |   |    |    |
 | [jsx-no-text-as-child](docs/rules/jsx-text-as-child.md)                                                    | JSX elements should not have text without translation                         |   |    |    |
+| [prevent-mixing-external-and-internal-classes](docs/rules/prevent-mixing-external-and-internal-classes.md) | Prevent mixing of outer and inner classes to avoid dependency on style order. |   |    |    |
+| **Storybook**                                                                                              | _config: storybook_                                                           |   |    |    |
 | [stories-export-meta](docs/rules/stories-export-meta.md)                                                   | Storybook's Meta should be typed                                              | ✅ |    |    |
 | [stories-export-typed](docs/rules/stories-export-typed.md)                                                 | Storybook's Stories should be typed                                           | ✅ |    |    |
-| [max-parent-import-depth](docs/rules/max-parent-import-depth.md)                                           | Limit relative imports to a maximum parent depth.                             | ✅ |    |    |
-| [ts-named-tuple-elements](docs/rules/ts-named-tuple-elements.md)                                           | Enforce (or forbid) named tuple elements                                      | ✅ |    |    |
+| **MobX**                                                                                                   | _config: mobx_                                                                |   |    |    |
+| [strict-observable-components-declaration](docs/rules/strict-observable-components-declaration.md)         | Wrapping components in `observer` must comply with the regulations.           | ✅ |    |    |
+| [require-observer](docs/rules/require-observer.md)                                                         | Components using the stores must be wrapped in an `observer`                  | ✅ | 🔧 |    |
+| [mobx-sync-autorun](docs/rules/mobx-sync-autorun.md)                                                       | Enforce synchronous autorun callback                                          | ✅ |    |    |
+| [mobx-sync-action](docs/rules/mobx-sync-action.md)                                                         | Enforce synchronous actions                                                   |   |    |    |
 
 ## Code Reuse Policy
 

package/dist/configs/mobx.js

@@ -5,9 +5,11 @@ const config = [
         name: '@dartess/mobx',
         rules: {
             'mobx/missing-observer': 'off', // replaced by the neater "@dartess/require-observer"
-            'mobx/missing-make-observable': 'off', // useless with modern decorators syntax
+            'mobx/missing-make-observable': 'off', // useless with modern decorators syntax. TODO check original plugin?
             '@dartess/strict-observable-components-declaration': 'error',
             '@dartess/require-observer': 'error',
+            '@dartess/mobx-sync-autorun': 'error', // TODO implement it by types?
+            '@dartess/mobx-sync-action': 'error', // TODO implement it by types?
         },
     },
 ];

package/dist/index.js

@@ -7,6 +7,8 @@ import ruleStrictObservableComponentsDeclaration from "./rules/strict-observable
 import ruleRequireObserver from "./rules/require-observer.js";
 import ruleMaxParentImportDepth from "./rules/max-parent-import-depth.js";
 import ruleTsNamedTupleElements from "./rules/ts-named-tuple-elements.js";
+import ruleMobxSyncAutorun from "./rules/mobx-sync-autorun.js";
+import ruleMobxSyncAction from "./rules/mobx-sync-action.js";
 const plugin = {
     meta: {
         name: packageJson.name,
@@ -22,6 +24,8 @@ const plugin = {
         'require-observer': ruleRequireObserver,
         'max-parent-import-depth': ruleMaxParentImportDepth,
         'ts-named-tuple-elements': ruleTsNamedTupleElements,
+        'mobx-sync-autorun': ruleMobxSyncAutorun,
+        'mobx-sync-action': ruleMobxSyncAction,
     },
 };
 export default plugin;

package/dist/rules/mobx-sync-action.d.ts

@@ -0,0 +1,3 @@
+import { ESLintUtils } from '@typescript-eslint/utils';
+declare const _default: ESLintUtils.RuleModule<"requireSyncAction", [], unknown, ESLintUtils.RuleListener>;
+export default _default;

package/dist/rules/mobx-sync-action.js

@@ -0,0 +1,28 @@
+import { ESLintUtils } from '@typescript-eslint/utils';
+export default ESLintUtils.RuleCreator(() => '')({
+    name: 'mobx-sync-action',
+    defaultOptions: [],
+    meta: {
+        type: 'problem',
+        docs: {
+            description: 'Mobx methods marked as `@action` must must be synchronous.',
+        },
+        messages: {
+            requireSyncAction: '`action` must be synchronous function',
+        },
+        schema: [],
+    },
+    create(context) {
+        const selector = [
+            'MethodDefinition[value.async="true"] Decorator[expression.object.name="action"]',
+            'MethodDefinition[value.async="true"] Decorator[expression.name="action"]',
+            'PropertyDefinition[value.type="ArrowFunctionExpression"][value.async="true"] Decorator[expression.object.name="action"]',
+            'PropertyDefinition[value.type="ArrowFunctionExpression"][value.async="true"] Decorator[expression.name="action"]',
+        ].join(', ');
+        return {
+            [selector]: node => {
+                context.report({ node, messageId: 'requireSyncAction' });
+            },
+        };
+    },
+});

package/dist/rules/mobx-sync-autorun.d.ts

@@ -0,0 +1,3 @@
+import { ESLintUtils } from '@typescript-eslint/utils';
+declare const _default: ESLintUtils.RuleModule<"requireSyncAutorun", [], unknown, ESLintUtils.RuleListener>;
+export default _default;

package/dist/rules/mobx-sync-autorun.js

@@ -0,0 +1,26 @@
+import { ESLintUtils } from '@typescript-eslint/utils';
+export default ESLintUtils.RuleCreator(() => '')({
+    name: 'mobx-sync-autorun',
+    defaultOptions: [],
+    meta: {
+        type: 'problem',
+        docs: {
+            description: "Autorun tracks only the observables that are read during the synchronous execution of the provided function, but it won't track anything that happens asynchronously.",
+        },
+        messages: {
+            requireSyncAutorun: '`effect` must be synchronous function',
+        },
+        schema: [],
+    },
+    create(context) {
+        const selector = [
+            'CallExpression[callee.name="autorun"] > ArrowFunctionExpression[async="true"]',
+            'CallExpression[callee.name="autorun"] > FunctionExpression[async="true"]',
+        ].join(', ');
+        return {
+            [selector]: node => {
+                context.report({ node, messageId: 'requireSyncAutorun' });
+            },
+        };
+    },
+});

package/docs/rules/mobx-sync-action.md

@@ -0,0 +1,27 @@
+# Enforce synchronous actions
+
+Mobx methods marked as `@action` must be synchronous: https://mobx.js.org/actions.html#asynchronous-actions
+
+## Rule Details
+
+Examples of **incorrect** code for this rule:
+
+```ts
+class Store {
+  @action async method1() {};
+  @action.bound async method2() {};
+  @action method3 = async () => {};
+  @action.bound method4 = async () => {};
+}
+```
+
+Examples of **correct** code for this rule:
+
+```ts
+class Store {
+  @action method1() {};
+  @action.bound method2() {};
+  @action method3 = () => {};
+  @action.bound method4 = () => {};
+}
+```

package/docs/rules/mobx-sync-autorun.md

@@ -0,0 +1,29 @@
+# Enforce synchronous autorun callback
+
+Mobx `autorun` function must accept only synchronous `effect` callback.
+This follows from the rules from official documentation, https://mobx.js.org/reactions.html#rules #2:  
+
+```
+Autorun tracks only the observables that are read during the synchronous execution of the provided function, but it won't track anything that happens asynchronously.
+```
+
+It would be nice to track this at the type level, but that doesn't happen at the moment.
+
+## Rule Details
+
+Examples of **incorrect** code for this rule:
+
+```ts
+autorun(async () => {
+  await sleep(1);
+  console.log(store.value)
+})
+```
+
+Examples of **correct** code for this rule:
+
+```ts
+autorun(() => {
+  console.log(store.value)
+})
+```

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dartess/eslint-plugin",
   "type": "module",
-  "version": "0.3.0",
+  "version": "0.5.0",
   "description": "A set of rules and configs for various TypeScript projects",
   "keywords": [
     "eslint",
@@ -83,7 +83,7 @@
     }
   },
   "devDependencies": {
-    "@eslint-community/eslint-plugin-eslint-comments": "^4.5.0",
+    "@eslint-community/eslint-plugin-eslint-comments": "^4.6.0",
     "@eslint/js": "^9.39.2",
     "@types/confusing-browser-globals": "^1.0.3",
     "@types/eslint-plugin-jsx-a11y": "^6.10.1",