eslint-plugin-code-style 1.14.0 → 1.14.3

package/CHANGELOG.md

@@ -7,6 +7,39 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ---
 
+## [1.14.3] - 2026-02-05
+
+### Enhanced
+
+- **`type-annotation-spacing`** - Add auto-fix to collapse function types with 2 or fewer params to one line
+- **`interface-format`** - Fix circular fix conflict by skipping collapse when property has multi-line function type
+
+---
+
+## [1.14.2] - 2026-02-05
+
+### Enhanced
+
+- **`type-annotation-spacing`** - Add spacing rules for async keyword and function types:
+  - Enforce space after `async` keyword: `async()` → `async ()`
+  - Enforce space after `=>` in function types: `() =>void` → `() => void`
+  - Format function types with 3+ params on multiple lines
+- **`interface-format`** - Skip collapsing single-property interfaces when property has function type with 3+ params
+
+---
+
+## [1.14.1] - 2026-02-05
+
+### Enhanced
+
+- **`function-naming-convention`** - Detect functions destructured from hooks without proper naming
+  - Flags: `const { logout } = useAuth()` (should be `logoutHandler`)
+  - Auto-fixes to: `const { logout: logoutHandler } = useAuth()`
+  - Renames all usages of the local variable
+  - Only flags clear action verbs (login, logout, toggle, increment, etc.)
+
+---
+
 ## [1.14.0] - 2026-02-05
 
 **New Rule: useState Naming Convention**
@@ -1654,6 +1687,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ---
 
+[1.14.3]: https://github.com/Mohamed-Elhawary/eslint-plugin-code-style/compare/v1.14.2...v1.14.3
+[1.14.2]: https://github.com/Mohamed-Elhawary/eslint-plugin-code-style/compare/v1.14.1...v1.14.2
+[1.14.1]: https://github.com/Mohamed-Elhawary/eslint-plugin-code-style/compare/v1.14.0...v1.14.1
 [1.14.0]: https://github.com/Mohamed-Elhawary/eslint-plugin-code-style/compare/v1.13.0...v1.14.0
 [1.13.0]: https://github.com/Mohamed-Elhawary/eslint-plugin-code-style/compare/v1.12.1...v1.13.0
 [1.12.1]: https://github.com/Mohamed-Elhawary/eslint-plugin-code-style/compare/v1.12.0...v1.12.1

package/index.js

@@ -2500,11 +2500,139 @@ const functionNamingConvention = {
             }
         };
 
+        // Check functions destructured from custom hooks: const { logout } = useAuth()
+        // Valid: onLogout, logoutAction, logoutHandler
+        // Invalid: logout (should be logoutHandler)
+        const checkDestructuredHookFunctionHandler = (node) => {
+            // Check if this is destructuring from a hook call: const { ... } = useXxx()
+            if (!node.init || node.init.type !== "CallExpression") return;
+            if (!node.id || node.id.type !== "ObjectPattern") return;
+
+            const callee = node.init.callee;
+
+            // Check if it's a hook call (starts with "use")
+            if (!callee || callee.type !== "Identifier" || !hookRegex.test(callee.name)) return;
+
+            // Action verbs that are clearly function names (not noun-like)
+            // These are verbs that when used alone as a name, clearly indicate an action/function
+            const actionVerbs = [
+                // Auth actions
+                "login", "logout", "authenticate", "authorize", "signup", "signout", "signin",
+                // CRUD actions (when standalone, not as prefix)
+                "submit", "reset", "clear", "refresh", "reload", "retry",
+                // Toggle/state actions
+                "toggle", "enable", "disable", "activate", "deactivate",
+                "show", "hide", "open", "close", "expand", "collapse",
+                // Navigation
+                "navigate", "redirect", "goBack", "goForward",
+                // Increment/decrement
+                "increment", "decrement", "increase", "decrease",
+                // Other common hook function names
+                "connect", "disconnect", "subscribe", "unsubscribe",
+                "start", "stop", "pause", "resume", "cancel", "abort",
+                "select", "deselect", "check", "uncheck",
+                "add", "remove", "insert", "delete", "update",
+            ];
+
+            // Check each destructured property
+            node.id.properties.forEach((prop) => {
+                if (prop.type !== "Property" || prop.key.type !== "Identifier") return;
+
+                const name = prop.key.name;
+
+                // Get the local variable name (value node for non-shorthand, key for shorthand)
+                const valueNode = prop.value || prop.key;
+                const localName = valueNode.type === "Identifier" ? valueNode.name : name;
+
+                // Skip if local name starts with "on" (like onLogout, onClick)
+                if (/^on[A-Z]/.test(localName)) return;
+
+                // Skip if local name ends with "Action" (like logoutAction)
+                if (/Action$/.test(localName)) return;
+
+                // Skip if local name ends with "Handler" (like logoutHandler)
+                if (handlerRegex.test(localName)) return;
+
+                // Skip boolean-like names (is, has, can, should, etc.)
+                const booleanPrefixes = ["is", "has", "can", "should", "will", "did", "was", "were", "does"];
+
+                if (booleanPrefixes.some((prefix) => localName.startsWith(prefix) && localName.length > prefix.length && /[A-Z]/.test(localName[prefix.length]))) return;
+
+                // Only flag if the name is exactly an action verb or starts with one followed by uppercase
+                const isActionVerb = actionVerbs.some((verb) =>
+                    localName === verb || (localName.startsWith(verb) && localName.length > verb.length && /[A-Z]/.test(localName[verb.length])));
+
+                if (!isActionVerb) return;
+
+                // This is a function name without proper prefix/suffix
+                // Add Handler suffix: logout -> logoutHandler
+                const suggestedName = localName + "Handler";
+
+                context.report({
+                    fix(fixer) {
+                        const fixes = [];
+                        const sourceCode = context.sourceCode || context.getSourceCode();
+
+                        if (prop.shorthand) {
+                            // Shorthand: { logout } -> { logout: logoutHandler }
+                            // Replace the entire property with key: newValue format
+                            fixes.push(fixer.replaceText(prop, `${name}: ${suggestedName}`));
+                        } else {
+                            // Non-shorthand: { logout: myVar } -> { logout: myVarHandler }
+                            // Just replace the value identifier
+                            fixes.push(fixer.replaceText(valueNode, suggestedName));
+                        }
+
+                        // Find and rename all usages of the local variable
+                        const scope = sourceCode.getScope
+                            ? sourceCode.getScope(node)
+                            : context.getScope();
+
+                        // Helper to find variable in scope chain
+                        const findVariableHandler = (s, varName) => {
+                            const v = s.variables.find((variable) => variable.name === varName);
+
+                            if (v) return v;
+                            if (s.upper) return findVariableHandler(s.upper, varName);
+
+                            return null;
+                        };
+
+                        const variable = findVariableHandler(scope, localName);
+
+                        if (variable) {
+                            const fixedRanges = new Set();
+
+                            // Add the definition range to avoid double-fixing
+                            if (valueNode.range) {
+                                fixedRanges.add(`${valueNode.range[0]}-${valueNode.range[1]}`);
+                            }
+
+                            // Fix all references
+                            variable.references.forEach((ref) => {
+                                const rangeKey = `${ref.identifier.range[0]}-${ref.identifier.range[1]}`;
+
+                                if (!fixedRanges.has(rangeKey)) {
+                                    fixedRanges.add(rangeKey);
+                                    fixes.push(fixer.replaceText(ref.identifier, suggestedName));
+                                }
+                            });
+                        }
+
+                        return fixes;
+                    },
+                    message: `Function "${localName}" destructured from hook should end with "Handler" suffix. Use "${suggestedName}" instead`,
+                    node: valueNode,
+                });
+            });
+        };
+
         return {
             ArrowFunctionExpression: checkFunctionHandler,
             FunctionDeclaration: checkFunctionHandler,
             FunctionExpression: checkFunctionHandler,
             MethodDefinition: checkMethodHandler,
+            VariableDeclarator: checkDestructuredHookFunctionHandler,
         };
     },
     meta: {
@@ -19852,6 +19980,57 @@ const typeAnnotationSpacing = {
         const sourceCode = context.sourceCode || context.getSourceCode();
 
         return {
+            ArrowFunctionExpression(node) {
+                // Check for space after async keyword: async() => -> async () =>
+                if (node.async) {
+                    const asyncToken = sourceCode.getFirstToken(node, (t) => t.value === "async");
+                    const openParen = sourceCode.getTokenAfter(asyncToken, (t) => t.value === "(");
+
+                    if (asyncToken && openParen) {
+                        const textBetween = sourceCode.text.slice(asyncToken.range[1], openParen.range[0]);
+
+                        // Should have exactly one space after async
+                        if (textBetween === "") {
+                            context.report({
+                                fix: (fixer) => fixer.insertTextAfter(asyncToken, " "),
+                                message: "Missing space after async keyword",
+                                node: asyncToken,
+                            });
+                        } else if (textBetween !== " " && !textBetween.includes("\n")) {
+                            // Has extra spaces but not newline
+                            context.report({
+                                fix: (fixer) => fixer.replaceTextRange([asyncToken.range[1], openParen.range[0]], " "),
+                                message: "Should have exactly one space after async keyword",
+                                node: asyncToken,
+                            });
+                        }
+                    }
+                }
+            },
+            FunctionExpression(node) {
+                // Check for space after async keyword in function expressions: async function() -> async function ()
+                if (node.async) {
+                    const asyncToken = sourceCode.getFirstToken(node, (t) => t.value === "async");
+                    const functionToken = sourceCode.getTokenAfter(asyncToken, (t) => t.value === "function");
+
+                    if (functionToken) {
+                        const openParen = sourceCode.getTokenAfter(functionToken, (t) => t.value === "(");
+
+                        if (openParen) {
+                            const textBetween = sourceCode.text.slice(functionToken.range[1], openParen.range[0]);
+
+                            // Should have exactly one space after function keyword
+                            if (textBetween === "") {
+                                context.report({
+                                    fix: (fixer) => fixer.insertTextAfter(functionToken, " "),
+                                    message: "Missing space after function keyword",
+                                    node: functionToken,
+                                });
+                            }
+                        }
+                    }
+                }
+            },
             TSArrayType(node) {
                 // Check for space before [] like: Type []
                 const elementType = node.elementType;
@@ -20237,6 +20416,83 @@ const typeAnnotationSpacing = {
                     }
                 }
             },
+            TSFunctionType(node) {
+                // Check for space after => in function types: () =>void -> () => void
+                // Find the arrow token by searching all tokens in the node
+                const tokens = sourceCode.getTokens(node);
+                const arrowToken = tokens.find((t) => t.value === "=>");
+
+                if (arrowToken) {
+                    const nextToken = sourceCode.getTokenAfter(arrowToken);
+
+                    if (nextToken) {
+                        const textAfterArrow = sourceCode.text.slice(arrowToken.range[1], nextToken.range[0]);
+
+                        // Should have exactly one space after =>
+                        if (textAfterArrow === "") {
+                            context.report({
+                                fix: (fixer) => fixer.insertTextAfter(arrowToken, " "),
+                                message: "Missing space after => in function type",
+                                node: arrowToken,
+                            });
+                        } else if (textAfterArrow !== " " && !textAfterArrow.includes("\n")) {
+                            // Has extra spaces but not newline
+                            context.report({
+                                fix: (fixer) => fixer.replaceTextRange([arrowToken.range[1], nextToken.range[0]], " "),
+                                message: "Should have exactly one space after => in function type",
+                                node: arrowToken,
+                            });
+                        }
+                    }
+                }
+
+                // Check function type params formatting
+                // - 3+ params should be multiline
+                // - 0-2 params should be on one line
+                const params = node.params;
+                const openParen = tokens.find((t) => t.value === "(");
+
+                if (openParen && arrowToken) {
+                    const closeParen = sourceCode.getTokenBefore(arrowToken, (t) => t.value === ")");
+
+                    if (closeParen) {
+                        const isMultiLine = openParen.loc.start.line !== closeParen.loc.end.line;
+
+                        if (params && params.length >= 3 && !isMultiLine) {
+                            // 3+ params on one line - expand to multiple lines
+                            const lineStart = sourceCode.text.lastIndexOf("\n", node.range[0]) + 1;
+                            const lineText = sourceCode.text.slice(lineStart, node.range[0]);
+                            const match = lineText.match(/^(\s*)/);
+                            const baseIndent = match ? match[1] : "";
+                            const paramIndent = baseIndent + "    ";
+
+                            const formattedParams = params.map((p) => {
+                                const paramText = sourceCode.getText(p);
+
+                                return paramIndent + paramText;
+                            }).join(",\n");
+
+                            const newParamsText = `(\n${formattedParams},\n${baseIndent})`;
+
+                            context.report({
+                                fix: (fixer) => fixer.replaceTextRange([openParen.range[0], closeParen.range[1]], newParamsText),
+                                message: "Function type with 3+ parameters should have each parameter on its own line",
+                                node,
+                            });
+                        } else if (params && params.length <= 2 && isMultiLine) {
+                            // 0-2 params on multiple lines - collapse to one line
+                            const formattedParams = params.map((p) => sourceCode.getText(p).trim()).join(", ");
+                            const newParamsText = `(${formattedParams})`;
+
+                            context.report({
+                                fix: (fixer) => fixer.replaceTextRange([openParen.range[0], closeParen.range[1]], newParamsText),
+                                message: "Function type with 2 or fewer parameters should be on one line",
+                                node,
+                            });
+                        }
+                    }
+                }
+            },
             VariableDeclarator(node) {
                 // Check for space before generic like: ColumnDef <T>
                 if (node.id && node.id.typeAnnotation) {
@@ -21705,6 +21961,7 @@ const interfaceFormat = {
 
                 // For single member, should be on one line without trailing punctuation
                 // But skip if the property has a nested object type with 2+ members
+                // Or if the property has a multi-line function type (let type-annotation-spacing handle it first)
                 if (members.length === 1) {
                     const member = members[0];
                     const isMultiLine = openBraceToken.loc.end.line !== closeBraceToken.loc.start.line;
@@ -21715,7 +21972,11 @@ const interfaceFormat = {
                     const hasMultiMemberNestedType = hasNestedType && nestedType.members?.length >= 2;
                     const hasSingleMemberNestedType = hasNestedType && nestedType.members?.length === 1;
 
-                    if (isMultiLine && !hasMultiMemberNestedType) {
+                    // Check if property has function type that spans multiple lines
+                    const hasMultiLineFunctionType = nestedType?.type === "TSFunctionType" &&
+                        nestedType.loc.start.line !== nestedType.loc.end.line;
+
+                    if (isMultiLine && !hasMultiMemberNestedType && !hasMultiLineFunctionType) {
                         // Build the collapsed text, handling nested types specially
                         let cleanText;
 

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "eslint-plugin-code-style",
-    "version": "1.14.0",
+    "version": "1.14.3",
     "description": "A custom ESLint plugin for enforcing consistent code formatting and style rules in React/JSX projects",
     "main": "index.js",
     "types": "index.d.ts",