eslint-plugin-smarthr 0.0.1 → 0.1.0

package/CHANGELOG.md

@@ -2,6 +2,31 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+## [0.1.0](https://github.com/kufu/eslint-plugin-smarthr/compare/v0.0.1...v0.1.0) (2022-02-09)
+
+
+### ⚠ BREAKING CHANGES
+
+* update prohibit-imoprt option
+
+* chore: require-importの対象ファイル指定方法をoptionの第一階層のkeyにする
+
+* chore: update README.md
+
+* chore: require-importのdefaultReportMessageを修正
+
+* chore: update yarn.lock
+
+* chore: fix test
+
+* chore: add test
+
+* chore: refactoring prohibit-import
+
+* chore: add test
+
+* BREAKING CHANGE: add require-import & update prohibit-import (#12) ([e6c5c44](https://github.com/kufu/eslint-plugin-smarthr/commit/e6c5c445a21620d4b796ded00a685e5da367c7bb)), closes [#12](https://github.com/kufu/eslint-plugin-smarthr/issues/12)
+
 ### [0.0.1](https://github.com/kufu/eslint-plugin-smarthr/compare/v0.0.0...v0.0.1) (2022-02-08)
 
 
@@ -10,9 +35,6 @@ All notable changes to this project will be documented in this file. See [standa
 * add type property function params redundant ([758df90](https://github.com/kufu/eslint-plugin-smarthr/commit/758df90f89bd27dd589aeeb55165e27c8e072b08))
 * redundant-name の修正候補を操作できるように改修 ([20991e8](https://github.com/kufu/eslint-plugin-smarthr/commit/20991e874890556e84e7c682e789e4b2650a85b0))
 
-### [0.0.2](https://github.com/kufu/eslint-plugin-smarthr/compare/v0.0.1...v0.0.2) (2022-01-26)
-
-### [0.0.1](https://github.com/kufu/eslint-plugin-smarthr/compare/v0.0.0...v0.0.1) (2022-01-26)
 
 ## 0.0.0 (2022-01-25)
 

package/README.md

@@ -145,13 +145,19 @@ import globalModulePart from '@/modules/views/parts'
 ## smarthr/jsx-start-with-spread-attributes
 
 - jsxを記述する際、意図しない属性の上書きを防ぐため、spread-attributesを先に指定するように強制するruleです
+- eslint を `--fix` オプション付きで実行する際、 fix option を true にすると自動修正します
 
 ### rules
 
 ```js
 {
   rules: {
-    'smarthr/jsx-start-with-spread-attributes': 'error', // 'warn', 'off'
+    'smarthr/jsx-start-with-spread-attributes': [
+      'error', // 'warn', 'off'
+      {
+        fix: false, // true
+      },
+    ]
   },
 }
 ```
@@ -268,12 +274,17 @@ import globalModulePart from '@/modules/views/parts'
     'smarthr/prohibit-import': [
       'error', // 'warn', 'off'
       {
-        targets: {
-          '^query-string$': true, // key は 正規表現を指定する
-          '^smarthr-ui$': ['SecondaryButtonAnchor'], 
+        '^.+$': {
+          'smarthr-ui': {
+            imported: ['SecondaryButtonAnchor'],
+            reportMessage: `{{module}}/{{export}} はXxxxxxなので利用せず yyyy/zzzz を利用してください`
+          }, 
+        }
+        '\/pages\/views\/': {
+          'query-string': {
+            imported: true,
+          },
         },
-        // generateReportMessage: (source, imported) => 
-        //   `${source}${imported && `/${imported}`} はXxxxxxなので利用せず yyyy/zzzz を利用してください`
       }
     ]
   },
@@ -283,6 +294,7 @@ import globalModulePart from '@/modules/views/parts'
 ### ❌ Incorrect
 
 ```js
+// src/pages/views/Page.tsx
 import queryString from 'query-string'
 import { SecondaryButtonAnchor } from 'smarthr-ui'
 ```
@@ -291,10 +303,61 @@ import { SecondaryButtonAnchor } from 'smarthr-ui'
 
 
 ```js
+// src/pages/views/Page.tsx
 import { PrimaryButton, SecondaryButton } from 'smarthr-ui'
 ```
 
+## smarthr/require-import
+
+- 対象ファイルにimportを強制させたい場合に利用します
+  - 例: Page.tsx ではページタイトルを設定させたいので useTitle を必ずimportさせたい
+
+### rules
+
+```js
+{
+  rules: {
+    'smarthr/require-import': [
+      'error',
+      {
+        'Buttons\/.+\.tsx': {
+          'smarthr-ui': {
+            imported: ['SecondaryButton'],
+            reportMessage: 'Buttons以下のコンポーネントでは {{module}}/{{export}} を拡張するようにしてください',
+          },
+        },
+        'Page.tsx$': {
+          './client/src/hooks/useTitle': {
+            imported: true,
+            reportMessage: '{{module}} を利用してください（ページタイトルを設定するため必要です）',
+          },
+        },
+      },
+    ]
+  },
+}
+```
+
+### ❌ Incorrect
+
+```js
+// client/src/Buttons/SecondaryButton.tsx
+import { SecondaryButtonAnchor } from 'smarthr-ui'
+
+// client/src/Page.tsx
+import { SecondaryButton } from 'smarthr-ui'
+```
+
+### ✅ Correct
+
+
+```js
+// client/src/Buttons/SecondaryButton.tsx
+import { SecondaryButton } from 'smarthr-ui'
 
+// client/src/Page.tsx
+import useTitle from '.hooks/useTitle'
+```
 
 
 ## smarthr/redundant-name

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-smarthr",
-  "version": "0.0.1",
+  "version": "0.1.0",
   "author": "SmartHR",
   "license": "MIT",
   "description": "A sharable ESLint plugin for SmartHR",

package/rules/jsx-start-with-spread-attributes.js

@@ -1,38 +1,72 @@
+const SCHEMA = [
+  {
+    type: 'object',
+    properties: {
+      fix: { type: 'boolean', default: false },
+    },
+    additionalProperties: false,
+  }
+]
+
 module.exports = {
   meta: {
     type: 'suggestion',
     messages: {
       'jsx-start-with-spread-attributes': '{{ message }}',
     },
-    schema: [],
+    fixable: 'code',
+    schema: SCHEMA,
   },
   create(context) {
     return {
       JSXSpreadAttribute: (node) => {
-        // HINT: 0: 計算中 1: 見つからなかった 2: 見つかった 
-        const hit = node.parent.attributes.reduce((h, a) => {
-          if (h === 0) {
+        // HINT: -2: 計算中 -1: 見つからなかった >= 0: 見つかった 
+        const insertIndex = node.parent.attributes.reduce((h, a, i) => {
+          if (h === -2) {
             if (a === node) {
-              return 1
+              return -1
             }
 
-            return a.type !== 'JSXSpreadAttribute' ? 2 : 0
+            return a.type !== 'JSXSpreadAttribute' ? i : h
           }
 
           return h
-        }, 0)
+        }, -2)
+
+        if (insertIndex >= 0) {
+          const option = context.options[0]
+          const sourceCode = context.getSourceCode()
+          const attributeCode = sourceCode.getText(node)
 
-        if (hit === 2) {
           context.report({
             node,
             messageId: 'jsx-start-with-spread-attributes',
             data: {
-              message: `"${context.getSourceCode().getText(node)}" は他の属性より先に記述してください`,
+              message: `"${attributeCode}" は意図しない上書きを防ぐため、spread attributesでない属性より先に記述してください`,
             },
+            fix: option?.fix ? (fixer) => {
+              const elementNode = node.parent
+              const sortedAttributes = [...elementNode.attributes].reduce((p, a, i) => {
+                if (insertIndex === i) {
+                  p = [attributeCode, ...p]
+                }
+
+                if (a !== node) {
+                  p = [...p, sourceCode.getText(a)]
+                }
+
+                return p
+              }, [])
+
+              return fixer.replaceText(
+                elementNode,
+                `<${elementNode.name.name} ${sortedAttributes.join(' ')}${elementNode.selfClosing ? '/' : ''}>`
+              )
+            } : null
           });
         }
       },
     }
   },
 }
-module.exports.schema = []
+module.exports.schema = SCHEMA

package/rules/prohibit-import.js

@@ -1,28 +1,34 @@
+const path = require('path')
+
 const SCHEMA = [{
-  type: "object",
+  type: 'object',
   patternProperties: {
-    ".+": {
-      type: "object",
-      required: [
-        "imported",
-      ],
-      properties: {
-        imported: {
-            type: ["boolean", "array"],
-            items: {
-              type: "string"
-            }
-        },
-        reportMessage: {
-            type: "string"
+    '.+': {
+      type: 'object',
+      patternProperties: {
+        '.+': {
+          type: 'object',
+          required: [
+            'imported',
+          ],
+          properties: {
+            imported: {
+              type: ['boolean', 'array'],
+              items: {
+                type: 'string',
+              },
+            },
+            reportMessage: {
+              type: 'string',
+            },
+          },
+          additionalProperties: false
         }
-      },
-      additionalProperties: false
       }
     },
-    additionalProperties: true,
-  }
-]
+  },
+  additionalProperties: true,
+}]
 
 const defaultReportMessage = (moduleName, exportName) => `${moduleName}${typeof exportName == 'string' ? `/${exportName}`: ''} は利用しないでください`
 
@@ -36,34 +42,59 @@ module.exports = {
   },
   create(context) {
     const options = context.options[0]
-    const targetModules = Object.keys(options)
+    const filename = context.getFilename()
+    const parentDir = (() => {
+      const dir = filename.match(/^(.+?)\..+?$/)[1].split('/')
+      dir.pop()
+
+      return dir.join('/')
+    })()
+    const targetPathRegexs = Object.keys(options)
+    const targetProhibits = targetPathRegexs.filter((regex) => !!filename.match(new RegExp(regex)))
+
+    if (targetProhibits.length === 0) {
+      return {}
+    }
+
     return {
       ImportDeclaration: (node) => {
-        targetModules.forEach((targetModule) => {
-          if (!node.source.value.match(new RegExp(targetModule))) {
-            return
-          }
-          
-          const {imported, reportMessage} = Object.assign({imported: true}, options[targetModule])
-          const useImported = (() => {
-            if (!Array.isArray(imported)) {
-              return !!imported
+        targetProhibits.forEach((prohibitKey) => {
+          const option = options[prohibitKey]
+          const targetModules = Object.keys(option)
+
+          targetModules.forEach((targetModule) => {
+            const { imported, reportMessage } = Object.assign({imported: true}, option[targetModule])
+            const actualTarget = targetModule[0] !== '.' ? targetModule : path.resolve(`${process.cwd()}/${targetModule}`)
+            let sourceValue = node.source.value
+
+            if (actualTarget[0] === '/') {
+              sourceValue = path.resolve(`${parentDir}/${sourceValue}`)
             }
 
-            const specifier = node.specifiers.find((s) => s.imported && imported.includes(s.imported.name))
+            if (actualTarget !== sourceValue) {
+              return
+            }
+            
+            const useImported = (() => {
+              if (!Array.isArray(imported)) {
+                return !!imported
+              }
 
-            return specifier ? specifier.imported.name : false
-          })()
+              const specifier = node.specifiers.find((s) => s.imported && imported.includes(s.imported.name))
 
-          if (useImported) {
-            context.report({
-              node,
-              messageId: 'prohibit_import',
-              data: {
-                message: reportMessage ? reportMessage.replace('{{module}}', node.source.value).replace('{{export}}', useImported) : defaultReportMessage(node.source.value, useImported)
-              },
-            });
-          }
+              return specifier ? specifier.imported.name : false
+            })()
+
+            if (useImported) {
+              context.report({
+                node,
+                messageId: 'prohibit_import',
+                data: {
+                  message: reportMessage ? reportMessage.replace('{{module}}', node.source.value).replace('{{export}}', useImported) : defaultReportMessage(node.source.value, useImported)
+                },
+              });
+            }
+          })
         })
       },
     }

package/rules/require-import.js

@@ -0,0 +1,113 @@
+const path = require('path')
+const SCHEMA = [{
+  type: 'object',
+  patternProperties: {
+    '.+': {
+      type: 'object',
+      patternProperties: {
+        '.+': {
+          type: 'object',
+          required: [
+            'imported',
+          ],
+          properties: {
+            imported: {
+              type: ['boolean', 'array'],
+              items: {
+                type: 'string',
+              }
+            },
+            reportMessage: {
+              type: 'string',
+            },
+          },
+          additionalProperties: false,
+        }
+      },
+      additionalProperties: true,
+    },
+  },
+  additionalProperties: true,
+}]
+
+const defaultReportMessage = (moduleName, exportName) => `${moduleName}${typeof exportName == 'string' ? `/${exportName}`: ''} をimportしてください`
+
+module.exports = {
+  meta: {
+    type: 'suggestion',
+    messages: {
+      'require_import': '{{ message }}',
+    },
+    schema: SCHEMA,
+  },
+  create(context) {
+    const options = context.options[0]
+    const filename = context.getFilename()
+    const targetPathRegexs = Object.keys(options)
+    const targetRequires = targetPathRegexs.filter((regex) => !!filename.match(new RegExp(regex)))
+
+    if (targetRequires.length === 0) {
+      return {}
+    }
+
+    return {
+      Program: (node) => {
+        const importDeclarations = node.body.filter((item) => item.type === 'ImportDeclaration')
+        const parentDir = (() => {
+          const dir = filename.match(/^(.+?)\..+?$/)[1].split('/')
+          dir.pop()
+
+          return dir.join('/')
+        })()
+
+        targetRequires.forEach((requireKey) => {
+          const option = options[requireKey]
+
+          Object.keys(option).forEach((targetModule) => {
+            const { imported, reportMessage, targetRegex } = Object.assign({imported: true}, option[targetModule])
+
+            if (targetRegex && !filename.match(new RegExp(targetRegex))) {
+              return
+            }
+
+            const actualTarget = targetModule[0] !== '.' ? targetModule : path.resolve(`${process.cwd()}/${targetModule}`)
+            const importDeclaration = importDeclarations.find(
+              actualTarget[0] !== '/' ? (
+                (id) => id.source.value === actualTarget
+              ) : (
+                (id) => path.resolve(`${parentDir}/${id.source.value}`) === actualTarget
+              )
+            )
+            const reporter = (item) => {
+              context.report({
+                node,
+                messageId: 'require_import',
+                data: {
+                  message: reportMessage ? reportMessage.replace('{{module}}', actualTarget).replace('{{export}}', item) : defaultReportMessage(actualTarget, item)
+                },
+              })
+            }
+
+            if (!importDeclaration) {
+              if (Array.isArray(imported)) {
+                imported.forEach((i) => {
+                  reporter(i)
+                })
+              } else if (imported) {
+                reporter()
+              }
+            } else if (Array.isArray(imported)) {
+              imported.forEach((i) => {
+                if (!importDeclaration.specifiers.find((s) => s.imported && s.imported.name === i)) {
+                  reporter(i)
+                }
+              })
+            }
+          })
+        })
+      },
+    }
+  },
+}
+
+module.exports.schema = SCHEMA

package/test/prohibit-import.js

@@ -1,63 +1,104 @@
-const rule = require("../rules/prohibit-import")
-const RuleTester = require("eslint").RuleTester
+const rule = require('../rules/prohibit-import')
+const RuleTester = require('eslint').RuleTester
 
 const ruleTester = new RuleTester({
   parserOptions: {
-    sourceType: "module",
+    sourceType: 'module',
     ecmaVersion: 2015
   },
 })
 
-ruleTester.run("prohibit-import-lodash", rule, {
+ruleTester.run('prohibit-import', rule, {
   valid: [
     {
       code: `import _ from 'lodash-es'`,
+      filename: 'hoge.js',
       options: [
         {
-          '^lodash$': {
-            imported: true,
+          '^.+$': {
+            'lodash': {
+              imported: true,
+            },
           },
         }
       ]
     },
     {
       code: `import { isEqual } from 'lodash-es'`,
+      filename: 'hoge.js',
       options: [
         {
-          '^lodash$': {
-            imported: ['isEqual']
+          '^.+$': {
+            'lodash': {
+              imported: ['isEqual']
+            },
           },
         }
       ]
     },
     {
       code: `import { isEqaul } from 'lodash'`,
+      filename: 'hoge.js',
       options: [
         {
-          '^lodash$': {
-            imported: ['isEqual']
+          '^.+$': {
+            'lodash': {
+              imported: ['isEqual']
+            },
           },
         }
       ]
     },
     {
       code: `import _ from 'lodash'`,
+      filename: 'hoge.js',
       options: [
         {
-          '^lodash$': {
-            imported: ['isEqual']
+          '^.+$': {
+            'lodash': {
+              imported: ['isEqual']
+            },
           },
         }
       ]
-    }
+    },
+    {
+      code: `import _ from 'lodash'`,
+      filename: 'hoge.js',
+      options: [
+        {
+          '^fuga.js$': {
+            'lodash': {
+              imported: true
+            },
+          },
+        }
+      ],
+    },
+    {
+      code: `import { isEqual } from './module/validator'`,
+      filename: 'page/hoge.js',
+      options: [
+        {
+          '^.+$': {
+            './module/validator': {
+              imported: ['isEqual'],
+            },
+          },
+        }
+      ],
+    },
   ],
   invalid: [
     {
       code: `import _ from 'lodash'`,
+      filename: 'hoge.js',
       options: [
         {
-          '^lodash$': {
-            imported: true
+          '^.+$': {
+            'lodash': {
+              imported: true
+            },
           },
         }
       ],
@@ -65,10 +106,13 @@ ruleTester.run("prohibit-import-lodash", rule, {
     },
     {
       code: `import { isEqual } from 'lodash'`,
+      filename: 'hoge.js',
       options: [
         {
-          '^lodash$': {
-            imported: true
+          '^.+$': {
+            'lodash': {
+              imported: true
+            },
           },
         }
       ],
@@ -76,10 +120,13 @@ ruleTester.run("prohibit-import-lodash", rule, {
     },
     {
       code: `import { isEqual } from 'lodash'`,
+      filename: 'hoge.js',
       options: [
         {
-          '^lodash$': {
-            imported: ['isEqual']
+          '^.+$': {
+            'lodash': {
+              imported: ['isEqual']
+            },
           },
         }
       ],
@@ -87,11 +134,14 @@ ruleTester.run("prohibit-import-lodash", rule, {
     },
     {
       code: `import { isEqual } from 'lodash'`,
+      filename: 'hoge.js',
       options: [
         {
-          '^lodash$': {
-            imported: ['isEqual'],
-            "reportMessage": "must not use {{module}}/{{export}}"
+          '^.+$': {
+            'lodash': {
+              imported: ['isEqual'],
+              "reportMessage": "must not use {{module}}/{{export}}"
+            },
           },
         }
       ],
@@ -99,18 +149,53 @@ ruleTester.run("prohibit-import-lodash", rule, {
     },
     {
       code: `import { isEqual } from 'lodash'`,
+      filename: 'hoge.js',
       options: [
         {
-          'example': {
-            imported: true,
+          '^.+$': {
+            'example': {
+              imported: true,
+            },
+            'lodash': {
+              imported: ['isEqual'],
+              reportMessage: "must not use {{module}}/{{export}}",
+            },
           },
-          '^lodash$': {
-            imported: ['isEqual'],
-            reportMessage: "must not use {{module}}/{{export}}",
+        }
+      ],
+      errors: [{message: 'must not use lodash/isEqual'}]
+    },
+    {
+      code: `import { isEqual } from 'lodash'`,
+      filename: 'hoge.js',
+      options: [
+        {
+          '^hoge.js$': {
+            'example': {
+              imported: true,
+            },
+            'lodash': {
+              imported: ['isEqual'],
+              reportMessage: "must not use {{module}}/{{export}}",
+            },
           },
         }
       ],
       errors: [{message: 'must not use lodash/isEqual'}]
-    }
+    },
+    {
+      code: `import { isEqual } from './module/validator'`,
+      filename: 'page/hoge.js',
+      options: [
+        {
+          '^.+$': {
+            './page/module/validator': {
+              imported: ['isEqual'],
+            },
+          },
+        }
+      ],
+      errors: [{ message: './module/validator/isEqual は利用しないでください' }]
+    },
   ]
-})
+})

package/test/require-import.js

@@ -0,0 +1,184 @@
+const rule = require('../rules/require-import')
+const RuleTester = require('eslint').RuleTester
+
+const ruleTester = new RuleTester({
+  parserOptions: {
+    sourceType: 'module',
+    ecmaVersion: 2015
+  },
+})
+
+ruleTester.run('require-import', rule, {
+  valid: [
+    {
+      code: `import _ from 'lodash'`,
+      filename: 'hoge.js',
+      options: [
+        {
+          '^.+$': {
+            'lodash': {
+              imported: true,
+            },
+          },
+        }
+      ],
+    },
+    {
+      code: ``,
+      filename: 'hoge.js',
+      options: [
+        {
+          '^fuga.js$': {
+            'lodash': {
+              imported: true,
+            },
+          },
+        }
+      ],
+    },
+    {
+      code: `import _ from 'lodash'`,
+      filename: 'hoge.js',
+      options: [
+        {
+          '^hoge.js$': {
+            'lodash': {
+              imported: true,
+              reportMessage: '{{module}} を絶対使ってください'
+            },
+          },
+        }
+      ],
+    },
+    {
+      code: `import { isEqual } from 'lodash'`,
+      filename: 'hoge.js',
+      options: [
+        {
+          '^hoge.js$': {
+            'lodash': {
+              imported: ['isEqual'],
+              reportMessage: '{{module}}/{{export}} を絶対使ってください'
+            },
+          },
+        }
+      ],
+      errors: [{ message: 'lodash/isEqual を絶対使ってください' }],
+    },
+    {
+      code: `import { chunk } from 'lodash'`,
+      filename: 'hoge.js',
+      options: [
+        {
+          '^hoge.js$': {
+            'lodash': {
+              imported: true,
+            },
+          },
+        }
+      ],
+    },
+    {
+      code: `import { isEqual } from './module/validator'`,
+      filename: 'page/hoge.js',
+      options: [
+        {
+          '^.+$': {
+            './page/module/validator': {
+              imported: ['isEqual'],
+            },
+          },
+        }
+      ],
+    },
+  ],
+  invalid: [
+    {
+      code: ``,
+      filename: 'hoge.js',
+      options: [
+        {
+          '^.+$': {
+            'lodash': {
+              imported: true,
+            },
+          },
+        }
+      ],
+      errors: [{ message: 'lodash をimportしてください' }],
+    },
+    {
+      code: ``,
+      filename: 'hoge.js',
+      options: [
+        {
+          '^hoge.js$': {
+            'lodash': {
+              imported: true,
+            },
+          },
+        }
+      ],
+      errors: [{ message: 'lodash をimportしてください' }],
+    },
+    {
+      code: ``,
+      filename: 'hoge.js',
+      options: [
+        {
+          '^hoge.js$': {
+            'lodash': {
+              imported: true,
+              reportMessage: '{{module}} を絶対使ってください'
+            },
+          },
+        }
+      ],
+      errors: [{ message: 'lodash を絶対使ってください' }],
+    },
+    {
+      code: ``,
+      filename: 'hoge.js',
+      options: [
+        {
+          '^hoge.js$': {
+            'lodash': {
+              imported: ['isEqual'],
+              reportMessage: '{{module}}/{{export}} を絶対使ってください'
+            },
+          },
+        }
+      ],
+      errors: [{ message: 'lodash/isEqual を絶対使ってください' }],
+    },
+    {
+      code: `import { chunk } from 'lodash'`,
+      filename: 'hoge.js',
+      options: [
+        {
+          '^hoge.js$': {
+            'lodash': {
+              imported: ['isEqual'],
+              reportMessage: '{{module}}/{{export}} を絶対使ってください'
+            },
+          },
+        }
+      ],
+      errors: [{ message: 'lodash/isEqual を絶対使ってください' }],
+    },
+    {
+      code: `import { isEqual } from './module/validator'`,
+      filename: 'page/hoge.js',
+      options: [
+        {
+          '^.+$': {
+            './module/validator': {
+              imported: ['isEqual'],
+            },
+          },
+        }
+      ],
+      errors: [{ message: /module\/validator\/isEqual をimportしてください$/ }],
+    },
+  ]
+})