@blumintinc/eslint-plugin-blumint 1.7.1 → 1.7.2

package/lib/index.js

@@ -69,10 +69,11 @@ const enforce_centralized_mock_firestore_1 = require("./rules/enforce-centralize
 const require_hooks_default_params_1 = require("./rules/require-hooks-default-params");
 const prefer_destructuring_no_class_1 = require("./rules/prefer-destructuring-no-class");
 const enforce_render_hits_memoization_1 = require("./rules/enforce-render-hits-memoization");
+const prefer_fragment_component_1 = require("./rules/prefer-fragment-component");
 module.exports = {
     meta: {
         name: '@blumintinc/eslint-plugin-blumint',
-        version: '1.7.1',
+        version: '1.7.2',
     },
     parseOptions: {
         ecmaVersion: 2020,
@@ -104,7 +105,7 @@ module.exports = {
                 '@blumintinc/blumint/no-unpinned-dependencies': 'error',
                 '@blumintinc/blumint/no-unused-props': 'error',
                 //'@blumintinc/blumint/no-useless-fragment': 'error',
-                '@blumintinc/blumint/prefer-fragment-shorthand': 'error',
+                //'@blumintinc/blumint/prefer-fragment-shorthand': 'error',
                 '@blumintinc/blumint/prefer-type-over-interface': 'error',
                 '@blumintinc/blumint/require-memo': 'error',
                 '@blumintinc/blumint/require-dynamic-firebase-imports': 'error',
@@ -147,6 +148,7 @@ module.exports = {
                 '@blumintinc/blumint/require-hooks-default-params': 'error',
                 '@blumintinc/blumint/prefer-destructuring-no-class': 'error',
                 '@blumintinc/blumint/enforce-render-hits-memoization': 'error',
+                '@blumintinc/blumint/prefer-fragment-component': 'error',
             },
         },
     },
@@ -217,6 +219,7 @@ module.exports = {
         'require-hooks-default-params': require_hooks_default_params_1.requireHooksDefaultParams,
         'prefer-destructuring-no-class': prefer_destructuring_no_class_1.preferDestructuringNoClass,
         'enforce-render-hits-memoization': enforce_render_hits_memoization_1.enforceRenderHitsMemoization,
+        'prefer-fragment-component': prefer_fragment_component_1.preferFragmentComponent,
     },
 };
 //# sourceMappingURL=index.js.map

package/lib/rules/prefer-fragment-component.d.ts

@@ -0,0 +1,4 @@
+import { TSESLint } from '@typescript-eslint/utils';
+type MessageIds = 'preferFragment' | 'addFragmentImport';
+export declare const preferFragmentComponent: TSESLint.RuleModule<MessageIds, [], TSESLint.RuleListener>;
+export {};

package/lib/rules/prefer-fragment-component.js

@@ -0,0 +1,101 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.preferFragmentComponent = void 0;
+const utils_1 = require("@typescript-eslint/utils");
+const createRule_1 = require("../utils/createRule");
+exports.preferFragmentComponent = (0, createRule_1.createRule)({
+    name: 'prefer-fragment-component',
+    meta: {
+        type: 'suggestion',
+        docs: {
+            description: 'Enforce using Fragment imported from react over shorthand fragments and React.Fragment',
+            recommended: 'error',
+        },
+        fixable: 'code',
+        schema: [],
+        messages: {
+            preferFragment: 'Use Fragment imported from react instead of {{type}}',
+            addFragmentImport: 'Add Fragment import from react',
+        },
+    },
+    defaultOptions: [],
+    create(context) {
+        const sourceCode = context.getSourceCode();
+        let hasFragmentImport = false;
+        let reactImportNode = null;
+        function getReactImportNode() {
+            const program = sourceCode.ast;
+            for (const node of program.body) {
+                if (node.type === utils_1.AST_NODE_TYPES.ImportDeclaration &&
+                    node.source.value === 'react') {
+                    return node;
+                }
+            }
+            return null;
+        }
+        function checkFragmentImport(node) {
+            if (node.source.value === 'react') {
+                reactImportNode = node;
+                for (const specifier of node.specifiers) {
+                    if (specifier.type === utils_1.AST_NODE_TYPES.ImportSpecifier &&
+                        specifier.imported.name === 'Fragment') {
+                        hasFragmentImport = true;
+                        break;
+                    }
+                }
+            }
+        }
+        function addFragmentImport(fixer) {
+            if (reactImportNode) {
+                // Add Fragment to existing react import
+                const lastSpecifier = reactImportNode.specifiers[reactImportNode.specifiers.length - 1];
+                return fixer.insertTextAfter(lastSpecifier, ', Fragment');
+            }
+            // Add new react import with Fragment
+            return fixer.insertTextBefore(sourceCode.ast.body[0], 'import { Fragment } from \'react\';\n');
+        }
+        return {
+            ImportDeclaration: checkFragmentImport,
+            JSXFragment(node) {
+                context.report({
+                    node,
+                    messageId: 'preferFragment',
+                    data: { type: 'shorthand fragment (<>)' },
+                    *fix(fixer) {
+                        if (!hasFragmentImport) {
+                            yield addFragmentImport(fixer);
+                        }
+                        yield fixer.replaceText(node.openingFragment, '<Fragment>');
+                        yield fixer.replaceText(node.closingFragment, '</Fragment>');
+                    },
+                });
+            },
+            JSXIdentifier(node) {
+                if (node.name === 'Fragment' &&
+                    node.parent?.type === utils_1.AST_NODE_TYPES.JSXMemberExpression &&
+                    node.parent.object.type === utils_1.AST_NODE_TYPES.JSXIdentifier &&
+                    node.parent.object.name === 'React') {
+                    const memberExpr = node.parent;
+                    context.report({
+                        node: memberExpr,
+                        messageId: 'preferFragment',
+                        data: { type: 'React.Fragment' },
+                        *fix(fixer) {
+                            if (!hasFragmentImport) {
+                                yield addFragmentImport(fixer);
+                            }
+                            yield fixer.replaceText(memberExpr, 'Fragment');
+                        },
+                    });
+                }
+            },
+            'Program:exit'() {
+                // If we found any violations but no Fragment import, we need to add it
+                if (!hasFragmentImport && !reactImportNode) {
+                    reactImportNode = getReactImportNode();
+                }
+            },
+        };
+    },
+});
+//# sourceMappingURL=prefer-fragment-component.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blumintinc/eslint-plugin-blumint",
-  "version": "1.7.1",
+  "version": "1.7.2",
   "description": "Custom eslint rules for use within BluMint",
   "author": {
     "name": "Brodie McGuire",