eslint-plugin-mobx 0.0.13 → 0.1.0

package/dist/missing-observer.d.ts

@@ -0,0 +1,3 @@
+import type { Rule } from "eslint";
+declare const rule: Rule.RuleModule;
+export default rule;

package/dist/missing-observer.js

@@ -0,0 +1,85 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function create(context) {
+    var _a;
+    var sourceCode = (_a = context.sourceCode) !== null && _a !== void 0 ? _a : context.getSourceCode();
+    return {
+        "FunctionDeclaration,FunctionExpression,ArrowFunctionExpression,ClassDeclaration,ClassExpression": function (cmp) {
+            var _a, _b;
+            if (cmp.parent &&
+                cmp.parent.type === "CallExpression" &&
+                cmp.parent.callee.name === "observer") {
+                // observer(...)
+                return;
+            }
+            var forwardRef = cmp.parent &&
+                cmp.parent.type === "CallExpression" &&
+                cmp.parent.callee.name === "forwardRef"
+                ? cmp.parent
+                : undefined;
+            if (forwardRef &&
+                forwardRef.parent &&
+                forwardRef.parent.type === "CallExpression" &&
+                forwardRef.parent.callee.name === "observer") {
+                // forwardRef(observer(...))
+                return;
+            }
+            var cmpOrForwardRef = forwardRef || cmp;
+            var name = (_a = cmp.id) === null || _a === void 0 ? void 0 : _a.name;
+            // If anonymous try to infer name from variable declaration
+            if (!name && ((_b = cmpOrForwardRef.parent) === null || _b === void 0 ? void 0 : _b.type) === "VariableDeclarator") {
+                name = cmpOrForwardRef.parent.id.name;
+            }
+            if (cmp.type.startsWith("Class")) {
+                // Must extend Component or React.Component
+                var superClass = cmp.superClass;
+                if (!superClass) {
+                    // not a component
+                    return;
+                }
+                var superClassText = sourceCode.getText(superClass);
+                if (superClassText !== "Component" && superClassText !== "React.Component") {
+                    // not a component
+                    return;
+                }
+            }
+            else {
+                // Name must start with uppercase letter
+                if (!(name === null || name === void 0 ? void 0 : name.charAt(0).match(/^[A-Z]$/))) {
+                    // not a component
+                    return;
+                }
+            }
+            var fix = function (fixer) {
+                return [
+                    fixer.insertTextBefore(sourceCode.getFirstToken(cmpOrForwardRef), (name && cmp.type.endsWith("Declaration") ? "const ".concat(name, " = ") : "") +
+                        "observer("),
+                    fixer.insertTextAfter(sourceCode.getLastToken(cmpOrForwardRef), ")")
+                ];
+            };
+            context.report({
+                node: cmp,
+                messageId: "missingObserver",
+                data: {
+                    name: name || "<anonymous>"
+                },
+                fix: fix
+            });
+        }
+    };
+}
+var rule = {
+    meta: {
+        type: "problem",
+        fixable: "code",
+        docs: {
+            description: "prevents missing `observer` on react component",
+            recommended: true
+        },
+        messages: {
+            missingObserver: "Component `{{ name }}` is missing `observer`."
+        }
+    },
+    create: create
+};
+exports.default = rule;

package/dist/no-anonymous-observer.d.ts

@@ -0,0 +1,3 @@
+import type { Rule } from "eslint";
+declare const rule: Rule.RuleModule;
+export default rule;

package/dist/no-anonymous-observer.js

@@ -0,0 +1,64 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function create(context) {
+    var _a;
+    var sourceCode = (_a = context.sourceCode) !== null && _a !== void 0 ? _a : context.getSourceCode();
+    return {
+        'CallExpression[callee.name="observer"]': function (observer) {
+            var _a;
+            var cmp = observer.arguments[0];
+            if (!cmp)
+                return;
+            if ((_a = cmp === null || cmp === void 0 ? void 0 : cmp.id) === null || _a === void 0 ? void 0 : _a.name)
+                return;
+            var fix = function (fixer) {
+                var _a;
+                // Use name from variable for autofix
+                var name = ((_a = observer.parent) === null || _a === void 0 ? void 0 : _a.type) === "VariableDeclarator"
+                    ? observer.parent.id.name
+                    : undefined;
+                if (!name)
+                    return;
+                if (cmp.type === "ArrowFunctionExpression") {
+                    var arrowToken = sourceCode.getTokenBefore(cmp.body);
+                    var fixes = [
+                        fixer.replaceText(arrowToken, ""),
+                        fixer.insertTextBefore(cmp, "function ".concat(name))
+                    ];
+                    if (cmp.body.type !== "BlockStatement") {
+                        fixes.push(fixer.insertTextBefore(cmp.body, "{ return "), fixer.insertTextAfter(cmp.body, " }"));
+                    }
+                    return fixes;
+                }
+                if (cmp.type === "FunctionExpression") {
+                    var functionToken = sourceCode.getFirstToken(cmp);
+                    return fixer.replaceText(functionToken, "function ".concat(name));
+                }
+                if (cmp.type === "ClassExpression") {
+                    var classToken = sourceCode.getFirstToken(cmp);
+                    return fixer.replaceText(classToken, "class ".concat(name));
+                }
+            };
+            context.report({
+                node: cmp,
+                messageId: "observerComponentMustHaveName",
+                fix: fix
+            });
+        }
+    };
+}
+var rule = {
+    meta: {
+        type: "problem",
+        fixable: "code",
+        docs: {
+            description: "forbids anonymous functions or classes as `observer` components",
+            recommended: true
+        },
+        messages: {
+            observerComponentMustHaveName: "`observer` component must have a name."
+        }
+    },
+    create: create
+};
+exports.default = rule;

package/dist/unconditional-make-observable.d.ts

@@ -0,0 +1,3 @@
+import type { Rule } from 'eslint';
+declare const rule: Rule.RuleModule;
+export default rule;

package/dist/unconditional-make-observable.js

@@ -0,0 +1,63 @@
+"use strict";
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var utils_1 = require("./utils");
+function create(context) {
+    return {
+        'CallExpression[callee.name=/(makeObservable|makeAutoObservable)/]': function (makeObservable) {
+            var _a;
+            // Only interested about makeObservable(this, ...) inside constructor and not inside nested bindable function
+            var _b = __read(makeObservable.arguments, 1), firstArg = _b[0];
+            if (!firstArg)
+                return;
+            if (firstArg.type !== 'ThisExpression')
+                return;
+            //     MethodDefinition[key.name="constructor"][kind="constructor"]
+            //       FunctionExpression
+            //         BlockStatement
+            //           ExpressionStatement
+            //             CallExpression[callee.name="makeObservable"]
+            var closestFunction = (0, utils_1.findAncestor)(makeObservable, function (node) { return node.type === 'FunctionExpression' || node.type === 'FunctionDeclaration'; });
+            if (((_a = closestFunction === null || closestFunction === void 0 ? void 0 : closestFunction.parent) === null || _a === void 0 ? void 0 : _a.kind) !== 'constructor')
+                return;
+            if (makeObservable.parent.parent.parent !== closestFunction) {
+                context.report({
+                    node: makeObservable,
+                    messageId: 'mustCallUnconditionally',
+                    data: {
+                        name: makeObservable.callee.name,
+                    }
+                });
+            }
+        },
+    };
+}
+var rule = {
+    meta: {
+        type: 'problem',
+        docs: {
+            description: 'disallows calling `makeObservable(this)` conditionally inside constructors',
+            recommended: true,
+        },
+        messages: {
+            mustCallUnconditionally: '`{{ name }}` must be called unconditionally inside constructor.',
+        }
+    },
+    create: create,
+};
+exports.default = rule;

package/dist/utils.d.ts

@@ -0,0 +1,3 @@
+export declare function isMobxDecorator(decorator: any): boolean;
+export declare function findAncestor(node: any, match: any): any;
+export declare function assert(expr: any, error?: any): void;

package/dist/utils.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isMobxDecorator = isMobxDecorator;
+exports.findAncestor = findAncestor;
+exports.assert = assert;
+var mobxDecorators = new Set(['observable', 'computed', 'action', 'flow', 'override']);
+function isMobxDecorator(decorator) {
+    var _a, _b;
+    return mobxDecorators.has(decorator.expression.name) // @foo
+        || mobxDecorators.has((_a = decorator.expression.callee) === null || _a === void 0 ? void 0 : _a.name) // @foo()
+        || mobxDecorators.has((_b = decorator.expression.object) === null || _b === void 0 ? void 0 : _b.name); // @foo.bar
+}
+function findAncestor(node, match) {
+    var parent = node.parent;
+    if (!parent)
+        return;
+    if (match(parent))
+        return parent;
+    return findAncestor(parent, match);
+}
+function assert(expr, error) {
+    if (!expr) {
+        error !== null && error !== void 0 ? error : (error = 'Assertion failed');
+        error = error instanceof Error ? error : new Error(error);
+        throw error;
+    }
+}

package/package.json

@@ -1,8 +1,9 @@
 {
     "name": "eslint-plugin-mobx",
-    "version": "0.0.13",
+    "version": "0.1.0",
     "description": "ESLint rules for MobX",
     "main": "dist/index.js",
+    "types": "dist/index.d.ts",
     "repository": {
         "type": "git",
         "url": "https://github.com/mobxjs/mobx.git",
@@ -25,20 +26,15 @@
     ],
     "homepage": "https://mobx.js.org/",
     "peerDependencies": {
-        "eslint": "^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0"
+        "eslint": "^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0 || ^10.0.0"
+    },
+    "dependencies": {
+        "@types/eslint": "^9.6.1",
+        "@types/estree": "^1.0.0"
     },
     "devDependencies": {
-        "@babel/core": "^7.16.0",
-        "@babel/preset-env": "^7.16.4",
-        "@rollup/plugin-babel": "^5.3.0",
-        "@rollup/plugin-commonjs": "^21.0.1",
-        "@rollup/plugin-node-resolve": "13.0.6",
-        "@typescript-eslint/eslint-plugin": "^5.0.0",
-        "@typescript-eslint/parser": "^5.0.0",
-        "eslint": "^7.0.0",
         "eslint-7": "npm:eslint@^7.0.0",
-        "eslint-9": "npm:eslint@^9.0.0",
-        "rollup": "^2.60.2"
+        "eslint-9": "npm:eslint@^9.0.0"
     },
     "keywords": [
         "eslint",
@@ -50,7 +46,10 @@
         "test:7": "jest --config jest.config-eslint-7.js",
         "test:9": "jest --config jest.config-eslint-9.js",
         "test": "npm run test:7 && npm run test:9",
-        "build": "yarn rollup --config",
-        "prepublishOnly": "yarn build"
+        "test:types": "tsc --noEmit",
+        "test:check": "npm run test:types",
+        "prebuild": "rm -rf dist",
+        "build": "tsc",
+        "prepublishOnly": "npm run build"
     }
 }

package/src/{exhaustive-make-observable.js → exhaustive-make-observable.ts}

@@ -1,11 +1,11 @@
-"use strict"
+import type { Rule } from "eslint"
 
-const { findAncestor, isMobxDecorator } = require("./utils.js")
+import { findAncestor, isMobxDecorator } from "./utils"
 
 // TODO support this.foo = 5; in constructor
 // TODO? report on field as well
 function create(context) {
-    const sourceCode = context.getSourceCode()
+    const sourceCode = context.sourceCode ?? context.getSourceCode()
     const autofixAnnotation = context.options[0]?.autofixAnnotation ?? true
 
     function fieldToKey(field) {
@@ -42,7 +42,7 @@ function create(context) {
             }
 
             const annotationProps = secondArg?.properties || []
-            const nonAnnotatedMembers = []
+            const nonAnnotatedMembers: any[] = []
             let hasAnyDecorator = false
 
             members.forEach(member => {
@@ -102,7 +102,7 @@ function create(context) {
     }
 }
 
-module.exports = {
+const rule: Rule.RuleModule = {
     meta: {
         type: "suggestion",
         fixable: "code",
@@ -119,8 +119,7 @@ module.exports = {
         ],
         docs: {
             description: "enforce all fields being listen in `makeObservable`",
-            recommended: true,
-            suggestion: false
+            recommended: true
         },
         messages: {
             missingAnnotation:
@@ -129,3 +128,5 @@ module.exports = {
     },
     create
 }
+
+export default rule

package/src/{index.js → index.ts}

@@ -1,17 +1,17 @@
-"use strict"
+import fs from "fs"
+import path from "path"
 
-const fs = require("fs")
-const path = require("path")
+import type { ESLint, Linter } from "eslint"
 
-const exhaustiveMakeObservable = require("./exhaustive-make-observable.js")
-const unconditionalMakeObservable = require("./unconditional-make-observable.js")
-const missingMakeObservable = require("./missing-make-observable.js")
-const missingObserver = require("./missing-observer")
-const noAnonymousObserver = require("./no-anonymous-observer.js")
+import exhaustiveMakeObservable from "./exhaustive-make-observable"
+import unconditionalMakeObservable from "./unconditional-make-observable"
+import missingMakeObservable from "./missing-make-observable"
+import missingObserver from "./missing-observer"
+import noAnonymousObserver from "./no-anonymous-observer"
 
 const pkg = JSON.parse(fs.readFileSync(path.join(__dirname, "..", "package.json"), "utf8"))
 
-const pluginMobx = {
+const pluginMobx: ESLint.Plugin = {
     meta: {
         name: pkg.name,
         version: pkg.version
@@ -25,14 +25,17 @@ const pluginMobx = {
     }
 }
 
-const recommendedRules = {
+const recommendedRules: Linter.RulesRecord = {
     "mobx/exhaustive-make-observable": "warn",
     "mobx/unconditional-make-observable": "error",
     "mobx/missing-make-observable": "error",
     "mobx/missing-observer": "warn"
 }
 
-module.exports = {
+const plugin: typeof pluginMobx & {
+    configs: { recommended: Linter.LegacyConfig }
+    flatConfigs: { recommended: Linter.Config }
+} = {
     ...pluginMobx,
     configs: {
         recommended: {
@@ -48,3 +51,5 @@ module.exports = {
         }
     }
 }
+
+export = plugin

package/src/{missing-make-observable.js → missing-make-observable.ts}

@@ -1,9 +1,9 @@
-'use strict';
+import type { Rule } from 'eslint';
 
-const { findAncestor, isMobxDecorator } = require('./utils.js');
+import { findAncestor, isMobxDecorator } from './utils';
 
 function create(context) {
-  const sourceCode = context.getSourceCode();
+  const sourceCode = context.sourceCode ?? context.getSourceCode();
 
   return {
     'Decorator': decorator => {
@@ -53,14 +53,13 @@ function create(context) {
   };
 }
 
-module.exports = {
+const rule: Rule.RuleModule = {
   meta: {
     type: 'problem',
     fixable: 'code',
     docs: {
       description: 'prevents missing `makeObservable(this)` when using decorators',
       recommended: true,
-      suggestion: false,
     },
     messages: {
       missingMakeObservable: "Constructor is missing `makeObservable(this)`.",
@@ -68,4 +67,6 @@ module.exports = {
     },
   },
   create,
-};
+};
+
+export default rule;

package/src/{missing-observer.js → missing-observer.ts}

@@ -1,7 +1,7 @@
-"use strict"
+import type { Rule } from "eslint"
 
 function create(context) {
-    const sourceCode = context.getSourceCode()
+    const sourceCode = context.sourceCode ?? context.getSourceCode()
 
     return {
         "FunctionDeclaration,FunctionExpression,ArrowFunctionExpression,ClassDeclaration,ClassExpression":
@@ -78,7 +78,7 @@ function create(context) {
     }
 }
 
-module.exports = {
+const rule: Rule.RuleModule = {
     meta: {
         type: "problem",
         fixable: "code",
@@ -92,3 +92,5 @@ module.exports = {
     },
     create
 }
+
+export default rule

package/src/{no-anonymous-observer.js → no-anonymous-observer.ts}

@@ -1,7 +1,7 @@
-"use strict"
+import type { Rule } from "eslint"
 
 function create(context) {
-    const sourceCode = context.getSourceCode()
+    const sourceCode = context.sourceCode ?? context.getSourceCode()
 
     return {
         'CallExpression[callee.name="observer"]': observer => {
@@ -49,7 +49,7 @@ function create(context) {
     }
 }
 
-module.exports = {
+const rule: Rule.RuleModule = {
     meta: {
         type: "problem",
         fixable: "code",
@@ -63,3 +63,5 @@ module.exports = {
     },
     create
 }
+
+export default rule

package/src/{unconditional-make-observable.js → unconditional-make-observable.ts}

@@ -1,11 +1,11 @@
-'use strict';
+import type { Rule } from 'eslint';
 
-const { findAncestor } = require('./utils.js');
+import { findAncestor } from './utils';
 
 function create(context) {
   return {
     'CallExpression[callee.name=/(makeObservable|makeAutoObservable)/]': makeObservable => {
-      // Only iterested about makeObservable(this, ...) inside constructor and not inside nested bindable function
+      // Only interested about makeObservable(this, ...) inside constructor and not inside nested bindable function
       const [firstArg] = makeObservable.arguments;
       if (!firstArg) return;
       if (firstArg.type !== 'ThisExpression') return;
@@ -29,7 +29,7 @@ function create(context) {
   };
 }
 
-module.exports = {
+const rule: Rule.RuleModule = {
   meta: {
     type: 'problem',
     docs: {
@@ -41,4 +41,6 @@ module.exports = {
     }
   },
   create,
-}
+};
+
+export default rule;

package/src/{utils.js → utils.ts}

@@ -1,29 +1,22 @@
-'use strict';
-
 const mobxDecorators = new Set(['observable', 'computed', 'action', 'flow', 'override']);
 
-function isMobxDecorator(decorator) {
+export function isMobxDecorator(decorator) {
   return mobxDecorators.has(decorator.expression.name) // @foo
     || mobxDecorators.has(decorator.expression.callee?.name) // @foo()
     || mobxDecorators.has(decorator.expression.object?.name) // @foo.bar
 }
 
-function findAncestor(node, match) {
+export function findAncestor(node, match) {
   const { parent } = node;
   if (!parent) return;
   if (match(parent)) return parent;
   return findAncestor(parent, match);
 }
 
-function assert(expr, error) {
+export function assert(expr, error?) {
   if (!expr) {
     error ??= 'Assertion failed';
     error = error instanceof Error ? error : new Error(error)
     throw error;
   }
 }
-
-module.exports = {
-  findAncestor,
-  isMobxDecorator,
-}