@fullstacksjs/eslint-config 7.0.3 → 8.0.0

package/README.md

@@ -58,16 +58,6 @@ Just extend from `@fullstacksjs`:
 
 It reads your root `package.json` dependencies and includes necessary rules.
 
-## NextJS
-
-[NextJS](https://nextjs.org/) config is subset of base config which is compatible with builtin NextJS eslint config.
-
-```json
-{
-  "extends": ["@fullstacksjs/eslint-config/nextjs"]
-}
-```
-
 ## Advanced Usage
 
 ```jsonc
@@ -79,6 +69,7 @@ It reads your root `package.json` dependencies and includes necessary rules.
     "@fullstacksjs/eslint-config/typescript",
     "@fullstacksjs/eslint-config/strict",
     "@fullstacksjs/eslint-config/cypress",
+    "@fullstacksjs/eslint-config/storybook",
     "@fullstacksjs/eslint-config/esm", // for native ESM modules
     "@fullstacksjs/eslint-config/typecheck" // ⚠️ Needs configurations (not included in default config)
   ]
@@ -115,7 +106,8 @@ If you need more advanced `typescript-eslint` rules, then you can extend from `"
 * eslint-plugin-simple-import-sort
 * eslint-plugin-fp
 * eslint-plugin-node
-* ~~eslint-plugin-promise~~ ⚠️ Disabled in v7-beta, because it's not currently supports eslint@8 ([Issue](https://github.com/xjamundx/eslint-plugin-promise/issues/218))
+* eslint-plugin-promise
+* eslint-plugin-storybook
 
 That's all. Feel free to use 💛
 

package/base.js

@@ -1,12 +1,5 @@
 module.exports = {
-  plugins: [
-    'prettier',
-    'import',
-    'simple-import-sort',
-    // 'promise' PENDING: https://github.com/xjamundx/eslint-plugin-promise/issues/218
-    'node',
-    'fp',
-  ],
+  plugins: ['prettier', 'import', 'simple-import-sort', 'promise', 'node', 'fp'],
   parserOptions: {
     ecmaVersion: 2020,
     sourceType: 'module',
@@ -34,7 +27,7 @@ module.exports = {
     './rules/style',
     './rules/variables',
     './rules/fp',
-    // './rules/promise', PENDING: https://github.com/xjamundx/eslint-plugin-promise/issues/218
+    './rules/promise',
     './rules/node',
     'prettier',
   ],

package/bin/index.js

@@ -0,0 +1,9 @@
+#!/usr/bin/env node
+
+const createOptions = require('./lib/createOptions');
+const createTasks = require('./lib/tasks');
+
+createOptions()
+  .then(createTasks)
+  .then(tasks => tasks.run())
+  .catch(() => {});

package/bin/lib/askWhenConfigExists.js

@@ -0,0 +1,51 @@
+const { readFile } = require('fs/promises');
+const inquirer = require('inquirer');
+
+const isObject = x => typeof x === 'object' && !Array.isArray(x) && x !== null;
+
+// TODO: add this function to the toolbox
+const merge = (obj, obj2) =>
+  Object.entries(obj)
+    .concat(Object.entries(obj2))
+    .reduce((acc, [key, value]) => {
+      const accValue = acc[key];
+      return Array.isArray(accValue) && Array.isArray(value)
+        ? { ...acc, [key]: accValue.concat(value) }
+        : isObject(accValue) && isObject(value)
+        ? { ...acc, [key]: merge(accValue, value) }
+        : { ...acc, [key]: value };
+    }, {});
+
+const Choice = {
+  noConfig: 'noConfig',
+  overwrite: 'overwrite',
+  extend: 'extend',
+};
+
+const askWhenConfigExists = async eslintrc => {
+  const file = await readFile('.eslintrc.json').catch(() => null);
+  if (file === null) return eslintrc;
+
+  const currentConfig = JSON.parse(file);
+  const isConfiguredBefore = eslintrc?.extends.every(c => currentConfig?.extends?.includes(c));
+  if (isConfiguredBefore) return currentConfig;
+
+  const { choice } = await inquirer.prompt({
+    type: 'list',
+    name: 'choice',
+    message: 'config found',
+    choices: [
+      {
+        value: 'overwrite',
+        name: 'overwrite the current config completely',
+      },
+      {
+        value: 'extend',
+        name: 'extend the fullstacks config alongside current config',
+      },
+    ],
+  });
+  return choice === Choice.extend ? merge(currentConfig, eslintrc) : eslintrc;
+};
+
+module.exports = askWhenConfigExists;

package/bin/lib/createOptions.js

@@ -0,0 +1,25 @@
+const getUserInput = require('./getUserInput');
+const args = require('./parseArgs');
+
+const eslintrcConfig = {
+  extends: ['@fullstacksjs'],
+};
+
+const requiredPackages = ['@fullstacksjs/eslint-config', 'eslint', 'prettier'];
+
+async function createOptions() {
+  const isTechnologyInArgv = args.t != null;
+  const optionsFromArgs = { technology: args.t };
+  const userInput = isTechnologyInArgv ? optionsFromArgs : await getUserInput();
+
+  if (userInput.technology === 'ts') {
+    requiredPackages.push('typescript');
+  }
+
+  return {
+    eslintrc: eslintrcConfig,
+    packages: requiredPackages,
+  };
+}
+
+module.exports = createOptions;

package/bin/lib/generateFile.js

@@ -0,0 +1,15 @@
+const { writeFile } = require('fs/promises');
+
+function createFileTask(eslintrc, ctx, task) {
+  return writeFile('.eslintrc.json', JSON.stringify(eslintrc, null, 2))
+    .then(() => {
+      task.title = `.eslintrc - Successfully Generated.`;
+    })
+    .catch(() => {
+      ctx.isEslintrc = false;
+      task.title = `Generating .eslintrc file`;
+      throw Error("Couldn't create file");
+    });
+}
+
+module.exports = createFileTask;

package/bin/lib/getUserInput.js

@@ -0,0 +1,24 @@
+const inquirer = require('inquirer');
+
+function getUserInput() {
+  return inquirer.prompt([
+    {
+      type: 'list',
+      name: 'technology',
+      message: 'which technology are you using?',
+      choices: [
+        {
+          value: 'ts',
+          name: 'ESLint alongside TypeScript',
+        },
+        {
+          value: 'js',
+          name: 'ESLint for JavaScript development',
+        },
+      ],
+      default: 'js',
+    },
+  ]);
+}
+
+module.exports = getUserInput;

package/bin/lib/parseArgs.js

@@ -0,0 +1,12 @@
+const yargs = require('yargs');
+
+const args = yargs(process.argv.slice(2))
+  .alias('t', 'technology')
+  .describe('t', 'Which technology are you using')
+  .choices('t', ['ts', 'js'])
+  .usage('Usage: $0 [-t ts|js]')
+  .example('$0 - ts')
+  .help('h')
+  .alias('h', 'help').argv;
+
+module.exports = args;

package/bin/lib/tasks.js

@@ -0,0 +1,30 @@
+const Listr = require('listr');
+const util = require('util');
+const askWhenConfigExists = require('./askWhenConfigExists');
+const exec = util.promisify(require('child_process').exec);
+const createFileTask = require('./generateFile');
+
+async function createTasks({ packages, eslintrc }) {
+  const installTasks = packages.map(pkg => ({
+    title: `Installing ${pkg}`,
+    task: (ctx, task) => exec(`npm i -D ${pkg}`).then(() => (task.title = `${pkg} Installed`)),
+  }));
+
+  const config = await askWhenConfigExists(eslintrc);
+
+  return new Listr(
+    [
+      {
+        title: 'Installing dependencies using npm',
+        task: () => new Listr(installTasks, { exitOnError: true }),
+      },
+      {
+        title: 'Generating .eslintrc.json file',
+        task: (ctx, task) => createFileTask(config, ctx, task),
+      },
+    ],
+    { exitOnError: false },
+  );
+}
+
+module.exports = createTasks;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fullstacksjs/eslint-config",
-  "version": "7.0.3",
+  "version": "8.0.0",
   "license": "MIT",
   "author": "fullstacks <fullstacksjs@gmail.com>",
   "description": "fullstacks eslint config",
@@ -11,13 +11,17 @@
   "publishConfig": {
     "registry": "https://registry.npmjs.org"
   },
+  "bin": {
+    "fullstacksjs-eslint": "./bin/index.js"
+  },
   "files": [
+    "bin",
     "rules",
     "base.js",
     "index.js",
     "jest.js",
     "cypress.js",
-    "nextjs.js",
+    "storybook.js",
     "react.js",
     "typescript.js",
     "typecheck.js",
@@ -45,19 +49,24 @@
     "eslint-plugin-cypress": "2.12.1",
     "eslint-plugin-fp": "2.3.0",
     "eslint-plugin-import": "2.25.3",
-    "eslint-plugin-jest-formatting": "3.1.0",
     "eslint-plugin-jest": "25.3.0",
+    "eslint-plugin-jest-formatting": "3.1.0",
     "eslint-plugin-jsx-a11y": "6.5.1",
     "eslint-plugin-node": "11.1.0",
     "eslint-plugin-prettier": "4.0.0",
-    "eslint-plugin-react-hooks": "4.3.0",
+    "eslint-plugin-promise": "6.0.0",
     "eslint-plugin-react": "7.27.1",
+    "eslint-plugin-react-hooks": "4.3.0",
     "eslint-plugin-simple-import-sort": "7.0.0",
+    "eslint-plugin-storybook": "0.5.6",
+    "inquirer": "8.2.0",
+    "listr": "0.14.3",
     "lodash.has": "4.5.2",
-    "read-pkg-up": "7.0.1"
+    "read-pkg-up": "7.0.1",
+    "yargs": "17.3.1"
   },
   "devDependencies": {
-    "eslint": "8.4.1",
+    "eslint": "8.5.0",
     "eslint-find-rules": "4.0.0",
     "husky": "7.0.4",
     "lint-staged": "12.1.2",
@@ -65,14 +74,14 @@
     "npm-run-all": "4.1.5",
     "pinst": "2.1.6",
     "prettier": "2.5.1",
-    "typescript": "4.5.2"
+    "typescript": "4.5.4"
   },
   "peerDependencies": {
+    "cypress": ">=8",
     "eslint": ">=7",
     "prettier": "2",
     "react": ">=16",
-    "typescript": "4",
-    "cypress": ">=8"
+    "typescript": "4"
   },
   "peerDependenciesMeta": {
     "typescript": {

package/rules/es2015.js

@@ -25,5 +25,6 @@ module.exports = {
     'prefer-template': 'error',
     'require-yield': 'error',
     'symbol-description': 'error',
+    'prefer-object-has-own': 'warn',
   },
 };

package/rules/storybook.js

@@ -0,0 +1,17 @@
+module.exports = {
+  rules: {
+    'storybook/await-interactions': 'error',
+    'storybook/context-in-play-function': 'error',
+    'storybook/default-exports': 'error',
+    'storybook/hierarchy-separator': 'warn',
+    'storybook/no-redundant-story-name': 'warn',
+    'storybook/prefer-pascal-case': 'warn',
+    'storybook/story-exports': 'error',
+    'storybook/use-storybook-expect': 'error',
+    'storybook/use-storybook-testing-library': 'error',
+
+    'storybook/csf-component': 'warn',
+    'storybook/no-stories-of': 'warn',
+    'storybook/no-title-property-in-meta': 'warn',
+  },
+};

package/rules/strict.js

@@ -16,6 +16,10 @@ module.exports = {
         selector: 'default',
         format: ['camelCase'],
       },
+      {
+        selector: 'function',
+        format: ['camelCase', 'PascalCase'],
+      },
       // variables, CONSTANTS, ReactComponents
       {
         selector: 'variable',
@@ -23,7 +27,7 @@ module.exports = {
       },
       {
         selector: 'parameter',
-        format: ['camelCase'],
+        format: ['camelCase', 'PascalCase'],
         leadingUnderscore: 'allow',
       },
       {

package/rules/typescript.js

@@ -29,6 +29,58 @@ module.exports = {
     '@typescript-eslint/member-naming': 'off',
     '@typescript-eslint/member-ordering': 'off',
     '@typescript-eslint/method-signature-style': ['warn', 'property'],
+    '@typescript-eslint/naming-convention': [
+      'warn',
+      {
+        selector: 'default',
+        format: ['camelCase'],
+      },
+      {
+        selector: 'function',
+        format: ['camelCase', 'PascalCase'],
+      },
+      // variables, CONSTANTS, ReactComponents
+      {
+        selector: 'variable',
+        format: ['camelCase', 'UPPER_CASE', 'PascalCase'],
+      },
+      {
+        selector: 'parameter',
+        format: ['camelCase', 'PascalCase'],
+        leadingUnderscore: 'allow',
+      },
+      {
+        selector: 'memberLike',
+        format: ['camelCase', 'PascalCase', 'UPPER_CASE'],
+        leadingUnderscore: 'allow',
+      },
+      {
+        selector: 'memberLike',
+        modifiers: ['static'],
+        format: ['camelCase', 'PascalCase'],
+        leadingUnderscore: 'allow',
+      },
+      {
+        selector: 'memberLike',
+        modifiers: ['private'],
+        format: ['camelCase'],
+        leadingUnderscore: 'allow',
+      },
+      {
+        selector: 'typeLike',
+        format: ['PascalCase'],
+      },
+      {
+        selector: 'enumMember',
+        format: ['PascalCase'],
+      },
+      // disallow I prefix for interfaces
+      {
+        selector: 'interface',
+        format: ['PascalCase'],
+        custom: { regex: '^I[A-Z]', match: false },
+      },
+    ],
     '@typescript-eslint/no-array-constructor': 'error',
     '@typescript-eslint/no-base-to-string': 'off', // false negative
     '@typescript-eslint/no-confusing-non-null-assertion': 'error',

package/storybook.js

@@ -0,0 +1,9 @@
+module.exports = {
+  overrides: [
+    {
+      plugin: ['storybook'],
+      files: ['*.stories.@(ts|tsx|js|jsx|mjs|cjs)', '*.story.@(ts|tsx|js|jsx|mjs|cjs)'],
+      extends: ['./rules/storybook.js'],
+    },
+  ],
+};

package/nextjs.js

@@ -1,24 +0,0 @@
-module.exports = {
-  plugins: ['prettier', 'simple-import-sort', 'promise', 'node', 'fp'],
-  parserOptions: {
-    ecmaVersion: 2020,
-    sourceType: 'module',
-    requireConfigFile: false,
-  },
-  env: {
-    browser: true,
-    es6: true,
-    node: true,
-  },
-  extends: [
-    './rules/base',
-    './rules/es2015',
-    './rules/forbidden',
-    './rules/style',
-    './rules/variables',
-    './rules/fp',
-    './rules/promise',
-    './rules/node',
-    'prettier',
-  ],
-};