eslint-plugin-power-esrules 0.1.1

package/INTEGRATION_GUIDE.md

@@ -0,0 +1,99 @@
+# Руководство по интеграции eslint-plugin-power-esrules
+
+### Структура плагина
+Плагин содержит:
+- `package.json` - метаданные плагина (версия 0.1.0)
+- `index.js` - точка входа, экспортирует правила и конфигурацию `recommended`
+- `lib/rules/` - директория с правилами:
+  - `formatting-blank-lines.js` - проверка расстановки пустых строк
+  - `no-default-props.js` - запрет использования defaultProps
+  - `no-inline-callbacks-in-jsx.js` - запрет инлайн-колбэков в JSX
+  - `id-naming-convention.js` - проверка именования идентификаторов (ID должно быть капсом)
+  - `use-state-naming.js` - проверка именования useState хуков
+  - `class-to-functional.js` - определение классовых компонентов для конвертации в функциональные  
+  - `import-sorting.js` - сортировка импортов
+
+### Правила плагина
+
+#### 1. `formatting-blank-lines`
+**Назначение:** Проверяет расстановку пустых строк согласно соглашению.
+
+**Логика:**
+- Добавляет пустую строку после последнего импорта
+- Добавляет пустую строку между styled-компонентами
+- Добавляет пустую строку перед объявлениями функций внутри React-компонента
+- Добавляет пустую строку перед return, обозначающим начало блока рендера
+- Добавляет пустую строку перед экспортом по умолчанию
+- Не добавляет пустую строку внутри тел функций, внутри styled-компонентов
+
+#### 2. `no-default-props`
+**Назначение:** Запрещает использование `defaultProps` в React-компонентах.
+
+**Логика:**
+- Выдает ошибку при использовании `Component.defaultProps`
+- Рекомендует использовать дефолтные параметры функций или деструктуризацию с значениями по умолчанию
+
+#### 3. `no-inline-callbacks-in-jsx`
+**Назначение:** Запрещает использование инлайн-колбэков в JSX.
+
+**Логика:**
+- Выдает ошибку при передаче стрелочных функций или function expressions напрямую в JSX-атрибуты
+- Рекомендует выносить колбэки в отдельные функции или использовать useCallback
+
+#### 4. `id-naming-convention`
+**Назначение:** Проверяет именование идентификаторов - `id` должно быть написано капсом (`ID`).
+
+**Логика:**
+- Проверяет переменные, параметры функций, свойства объектов
+- Выдает ошибку, если найдено `id` в нижнем регистре (например, `assetId`, `taskId`)
+- Требует использовать `assetID`, `taskID`, `userID` и т.д.
+
+#### 5. `use-state-naming`
+**Назначение:** Проверяет именование useState хуков согласно соглашению.
+
+**Логика:**
+- Проверяет соответствие именования state переменных и setter функций
+- Выдает ошибку при несоответствии соглашению (например, `const [count, setCount] = useState()`)
+
+#### 6. `class-to-functional`
+**Назначение:** Определяет классовые компоненты, которые можно конвертировать в функциональные.
+
+**Логика:**
+- Находит классовые компоненты без внутреннего стейта (`this.state`)
+- Проверяет количество методов класса (от 1 до 4, не считая методы жизненного цикла)
+- Выдает предупреждение с рекомендацией запустить codemod скрипт для автоматической конвертации
+
+#### 7. `import-sorting`
+**Назначение:** Сортирует импорты согласно правилам установленным в команде разработки.
+
+## Что нужно для интеграции
+
+### 1. npm install eslint-plugin-power-esrules
+
+### 2. Обновить .eslintrc.js
+
+**Рекомендуемый вариант:** Использовать готовую конфигурацию `recommended` из плагина:
+```javascript
+module.exports = {
+    extends: [
+        'airbnb', 
+        'airbnb/hooks', 
+        'prettier',
+        'plugin:power-esrules/recommended' // Добавить конфигурацию плагина
+    ],
+    parser: '@babel/eslint-parser',
+    // ...
+};
+```
+
+### 3. Установить зависимости
+
+После добавления в `package.json`:
+```bash
+npm install
+```
+
+## Требования
+
+### Peer Dependencies
+Плагин требует ESLint версии `^8.0.0`.

package/index.js

@@ -0,0 +1,25 @@
+module.exports = {
+  rules: {
+    "formatting-blank-lines": require("./lib/rules/formatting-blank-lines"),
+    "no-default-props": require("./lib/rules/no-default-props"),
+    "no-inline-callbacks-in-jsx": require("./lib/rules/no-inline-callbacks-in-jsx"),
+    "id-naming-convention": require("./lib/rules/id-naming-convention"),
+    "use-state-naming": require("./lib/rules/use-state-naming"),
+    "class-to-functional": require("./lib/rules/class-to-functional"),
+    "import-sorting": require("./lib/rules/import-sorting"),
+  },
+  configs: {
+    recommended: {
+      plugins: ["power-esrules"],
+      rules: {
+        "power-esrules/formatting-blank-lines": "error",
+        "power-esrules/no-default-props": "error",
+        "power-esrules/no-inline-callbacks-in-jsx": "error",
+        "power-esrules/id-naming-convention": "error",
+        "power-esrules/use-state-naming": "error",
+        "power-esrules/class-to-functional": "error",
+        "power-esrules/import-sorting": "error",
+      },
+    },
+  },
+};

package/lib/rules/class-to-functional.js

@@ -0,0 +1,236 @@
+/**
+ * Rule: class-to-functional
+ *
+ * Автоматически определяет классовые компоненты для конвертации в функциональные
+ * и выводит уведомление с рекомендацией запустить codemod скрипт.
+ *
+ * Условия для определения:
+ * 1. Не содержит внутреннего стейта (this.state)
+ * 2. Содержит от 1 до 4 методов класса (не считая методы жизненного цикла)
+ * Рекомендация: Запустите npm run codemod:classToFC -- <file-path>
+ */
+
+const path = require('path');
+
+/**
+ * Проверяет, является ли класс React компонентом
+ */
+function isReactComponentClass(node) {
+    if (!node || (node.type !== 'ClassDeclaration' && node.type !== 'ClassExpression')) {
+        return false;
+    }
+    if (!node.superClass) {
+        return false;
+    }
+    const { superClass } = node;
+    if (superClass.type === 'Identifier') {
+        return superClass.name === 'Component' || superClass.name === 'PureComponent';
+    }
+    if (
+        superClass.type === 'MemberExpression' &&
+        superClass.object &&
+        superClass.object.type === 'Identifier' &&
+        superClass.object.name === 'React' &&
+        superClass.property &&
+        superClass.property.type === 'Identifier' &&
+        (superClass.property.name === 'Component' || superClass.property.name === 'PureComponent')
+    ) {
+        return true;
+    }
+    return false;
+}
+
+/**
+ * Проверяет, является ли метод методом жизненного цикла
+ */
+function isLifecycleMethod(methodName) {
+    const lifecycleMethods = [
+        'componentDidMount',
+        'componentDidUpdate',
+        'componentWillUnmount',
+        'componentWillMount',
+        'componentWillReceiveProps',
+        'UNSAFE_componentWillMount',
+        'UNSAFE_componentWillReceiveProps',
+        'UNSAFE_componentWillUpdate',
+        'shouldComponentUpdate',
+        'componentWillUpdate',
+        'getSnapshotBeforeUpdate',
+        'componentDidCatch',
+        'getDerivedStateFromProps',
+    ];
+    return lifecycleMethods.includes(methodName) || methodName.startsWith('component');
+}
+
+/**
+ * Проверяет, содержит ли узел использование this.state или this.setState
+ */
+function hasStateUsage(node) {
+    let hasState = false;
+    // Используем обход AST для поиска this.state и this.setState
+    function traverse(node) {
+        if (!node || hasState) {
+            return;
+        }
+        if (
+            node.type === 'MemberExpression' &&
+            node.object &&
+            node.object.type === 'ThisExpression' &&
+            node.property &&
+            node.property.type === 'Identifier' &&
+            node.property.name === 'state'
+        ) {
+            hasState = true;
+            return;
+        }
+        if (
+            node.type === 'CallExpression' &&
+            node.callee &&
+            node.callee.type === 'MemberExpression' &&
+            node.callee.object &&
+            node.callee.object.type === 'ThisExpression' &&
+            node.callee.property &&
+            node.callee.property.type === 'Identifier' &&
+            node.callee.property.name === 'setState'
+        ) {
+            hasState = true;
+            return;
+        }
+        // Рекурсивно обходим дочерние узлы
+        for (const key in node) {
+            if (key !== 'parent' && node[key] && typeof node[key] === 'object') {
+                if (Array.isArray(node[key])) {
+                    node[key].forEach((child) => traverse(child));
+                } else {
+                    traverse(node[key]);
+                }
+            }
+        }
+    }
+    traverse(node);
+    return hasState;
+}
+
+/**
+ * Подсчитывает методы класса, исключая lifecycle методы, render и constructor
+ */
+function countNonLifecycleMethods(classBody) {
+    let count = 0;
+    if (!classBody || !classBody.body || !Array.isArray(classBody.body)) {
+        return 0;
+    }
+    classBody.body.forEach((member) => {
+        if (member.type === 'MethodDefinition') {
+            const methodName = member.key && member.key.name;
+            if (methodName === 'render' || methodName === 'constructor') {
+                return;
+            }
+            if (!isLifecycleMethod(methodName)) {
+                count++;
+            }
+        } else if (
+            member.type === 'Property' ||
+            member.type === 'ClassProperty' ||
+            member.type === 'PropertyDefinition'
+        ) {
+            const methodName = member.key && member.key.name;
+            if (methodName === 'render') {
+                return;
+            }
+            if (!isLifecycleMethod(methodName)) {
+                if (
+                    member.value &&
+                    (member.value.type === 'ArrowFunctionExpression' || member.value.type === 'FunctionExpression')
+                ) {
+                    count++;
+                }
+            }
+        }
+    });
+
+    return count;
+}
+
+/**
+ * Получает относительный путь к файлу от корня проекта
+ */
+function getRelativeFilePath(context) {
+    const filename = context.getFilename();
+    const workspaceRoot = context.getCwd ? context.getCwd() : process.cwd();
+    return path.relative(workspaceRoot, filename);
+}
+
+module.exports = {
+    meta: {
+        type: 'suggestion',
+        docs: {
+            description:
+                'Определяет классовые компоненты для конвертации в функциональные и рекомендует запустить codemod',
+            category: 'Best Practices',
+            recommended: false,
+        },
+        fixable: null,
+        schema: [],
+        messages: {
+            shouldConvertToFunctional:
+                'Классовый компонент "{{componentName}}" подходит для конвертации в функциональный. ' +
+                'Запустите: npm run codemod:classToFC -- {{filePath}}',
+        },
+    },
+
+    create(context) {
+        return {
+            ClassDeclaration(node) {
+                if (!isReactComponentClass(node)) {
+                    return;
+                }
+                const componentName = node.id ? node.id.name : 'Unknown';
+                // Проверяем использование this.state
+                if (hasStateUsage(node)) {
+                    return;
+                }
+                const methodCount = countNonLifecycleMethods(node.body);
+                if (methodCount >= 1 && methodCount <= 4) {
+                    const filePath = getRelativeFilePath(context);
+                    context.report({
+                        node: node.id || node,
+                        messageId: 'shouldConvertToFunctional',
+                        data: {
+                            componentName,
+                            filePath,
+                        },
+                    });
+                }
+            },
+
+            ClassExpression(node) {
+                if (!isReactComponentClass(node)) {
+                    return;
+                }
+                let componentName = 'Unknown';
+                const { parent } = node;
+                if (parent && parent.type === 'VariableDeclarator' && parent.id) {
+                    componentName = parent.id.name;
+                } else if (parent && parent.type === 'ExportDefaultDeclaration') {
+                    componentName = 'DefaultExport';
+                }
+                // Проверяем использование this.state
+                if (hasStateUsage(node)) {
+                    return;
+                }
+                const methodCount = countNonLifecycleMethods(node.body);
+                if (methodCount >= 1 && methodCount <= 4) {
+                    const filePath = getRelativeFilePath(context);
+                    context.report({
+                        node: node.parent && node.parent.id ? node.parent.id : node,
+                        messageId: 'shouldConvertToFunctional',
+                        data: {
+                            componentName,
+                            filePath,
+                        },
+                    });
+                }
+            },
+        };
+    },
+};