change prettierrc settings, add configs to linting

ILyaCyclone · Mar 30, 2021 · c8adbb7 · c8adbb7
1 parent b5dffc6
commit c8adbb7
Show file tree

Hide file tree

Showing 20 changed files with 382 additions and 333 deletions.
diff --git a/.eslintignore b/.eslintignore
@@ -0,0 +1,3 @@
+.vscode
+coverage
+dist
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -1,50 +1,43 @@
 {
-    "env": {
-        "browser": true,
-        "node": true,
-        "es6": true
-    },
-    "extends": [
-        "eslint:recommended",
-        "plugin:@typescript-eslint/recommended",
-        "prettier",
-        "plugin:prettier/recommended",
-        "plugin:react/recommended"
+  "env": {
+    "browser": true,
+    "node": true,
+    "es6": true
+  },
+  "extends": [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "prettier",
+    "plugin:prettier/recommended",
+    "plugin:react/recommended"
+  ],
+  "settings": {
+    "react": {
+      "version": "detect"
+    }
+  },
+  "parser": "@typescript-eslint/parser",
+  "parserOptions": {
+    "ecmaVersion": 12,
+    "sourceType": "module"
+  },
+  "plugins": ["@typescript-eslint", "prettier"],
+  "rules": {
+    "no-constant-condition": "off",
+    "prettier/prettier": [
+      "error",
+      {
+        "endOfLine": "auto"
+      }
     ],
-    "settings": {
-        "react": {
-            "version": "detect"
-        }
-    },
-    "parser": "@typescript-eslint/parser",
-    "parserOptions": {
-        "ecmaVersion": 12,
-        "sourceType": "module"
-    },
-    "plugins": [
-        "@typescript-eslint",
-        "prettier"
-    ],
-    "rules": {
-        "no-constant-condition": "off",
-        "prettier/prettier": [
-            "error",
-            {
-                "endOfLine": "auto"
-            }
-        ],
-        "react/prop-types": "off"
-    },
-    "overrides": [
-        {
-          "files": [
-            "webpack.config.js"
-          ],
-          "rules": {
-            "@typescript-eslint/no-var-requires": [
-              "off"
-            ]
-          }
-        }
-    ]
-}
+    "react/prop-types": "off"
+  },
+  "overrides": [
+    {
+      "files": ["webpack.config.js"],
+      "rules": {
+        "@typescript-eslint/no-var-requires": ["off"]
+      }
+    }
+  ]
+}
diff --git a/.prettierrc b/.prettierrc
@@ -1,6 +1,4 @@
 {
-  "printWidth": 140,
-  "tabWidth": 4,
   "semi": true,
   "trailingComma": "none",
   "singleQuote": false,

diff --git a/.storybook/preview.js b/.storybook/preview.js
@@ -1,4 +1,3 @@
-
 export const parameters = {
   actions: { argTypesRegex: "^on[A-Z].*" },
 }
diff --git a/babel.config.json b/babel.config.json
@@ -1,7 +1,3 @@
 {
-    "presets": [
-        "@babel/env",
-        "@babel/preset-typescript",
-        "@babel/preset-react"
-    ]
+  "presets": ["@babel/env", "@babel/preset-typescript", "@babel/preset-react"]
 }
diff --git a/jest.config.js b/jest.config.js
@@ -1,9 +1,9 @@
 module.exports = {
-    clearMocks: true,
-    coverageDirectory: "coverage",
-    testEnvironment: "node",
-    transform: {
-        "^.+\\.(js|ts)x?$": "<rootDir>/node_modules/babel-jest"
-    },
-    setupFilesAfterEnv: ['./jest.setup.js']
+  clearMocks: true,
+  coverageDirectory: "coverage",
+  testEnvironment: "node",
+  transform: {
+    "^.+\\.(js|ts)x?$": "<rootDir>/node_modules/babel-jest"
+  },
+  setupFilesAfterEnv: ["./jest.setup.js"]
 };
diff --git a/jest.setup.js b/jest.setup.js
@@ -1,4 +1,4 @@
-import Enzyme from 'enzyme';
-import Adapter from '@wojtekmaj/enzyme-adapter-react-17';
+import Enzyme from "enzyme";
+import Adapter from "@wojtekmaj/enzyme-adapter-react-17";
 
-Enzyme.configure({ adapter: new Adapter() });
+Enzyme.configure({ adapter: new Adapter() });
diff --git a/package.json b/package.json
@@ -12,7 +12,7 @@
     "test": "npx jest && npx loki",
     "jest": "jest",
     "coverage": "jest --collect-coverage",
-    "lint": "eslint ./src/ --fix",
+    "lint": "npx eslint --ext .js,.jsx,.ts,.tsx,.json --fix ./",
     "check": "npm run lint && npm test",
     "storybook": "start-storybook -p 6006",
     "build-storybook": "build-storybook",

diff --git a/src/App.tsx b/src/App.tsx
@@ -3,22 +3,22 @@ import React from "react";
 import BoardContainer from "./components/Board/BoardContainer";
 
 interface Props {
-    rows: number;
-    cols: number;
+  rows: number;
+  cols: number;
 }
 
 const App: React.FC<Props> = ({ rows, cols }) => {
-    return (
-        <>
-            <h1>Board</h1>
-            <p>
-                size: {rows}x{cols}
-            </p>
-            <p>Click cells to toggle their values</p>
+  return (
+    <>
+      <h1>Board</h1>
+      <p>
+        size: {rows}x{cols}
+      </p>
+      <p>Click cells to toggle their values</p>
 
-            <BoardContainer rows={rows} cols={cols} />
-        </>
-    );
+      <BoardContainer rows={rows} cols={cols} />
+    </>
+  );
 };
 
 export default App;
diff --git a/src/components/Board/Board.stories.tsx b/src/components/Board/Board.stories.tsx
@@ -5,35 +5,37 @@ import { Story, Meta } from "@storybook/react/types-6-0";
 import Board from "./Board";
 
 export default {
-    title: "Board/Board",
-    component: Board,
-    argTypes: {
-        cellClicked: { action: "cell clicked" }
-    }
+  title: "Board/Board",
+  component: Board,
+  argTypes: {
+    cellClicked: { action: "cell clicked" }
+  }
 } as Meta;
 
-const Template: Story<ComponentProps<typeof Board>> = (args) => <Board {...args} />;
+const Template: Story<ComponentProps<typeof Board>> = (args) => (
+  <Board {...args} />
+);
 
 export const PartiallyFilled = Template.bind({});
 PartiallyFilled.args = {
-    highlights: [
-        [true, false],
-        [false, true]
-    ]
+  highlights: [
+    [true, false],
+    [false, true]
+  ]
 };
 
 export const Empty = Template.bind({});
 Empty.args = {
-    highlights: [
-        [false, false],
-        [false, false]
-    ]
+  highlights: [
+    [false, false],
+    [false, false]
+  ]
 };
 
 export const Filled = Template.bind({});
 Filled.args = {
-    highlights: [
-        [true, true],
-        [true, true]
-    ]
+  highlights: [
+    [true, true],
+    [true, true]
+  ]
 };
diff --git a/src/components/Board/Board.test.tsx b/src/components/Board/Board.test.tsx
@@ -6,57 +6,68 @@ import Board from "./Board";
 import Cell from "./Cell";
 
 describe("<Board />", () => {
-    let mockCellClicked: jest.Mock;
-    beforeEach(() => {
-        mockCellClicked = jest.fn();
-    });
-
-    it("creates <Cell /> components with highlights", () => {
-        const highlights = [
-            [true, false],
-            [false, true]
-        ];
-        const wrapper = shallow(<Board highlights={highlights} cellClicked={mockCellClicked} />);
-
-        const actualHighlights = wrapper.find("tr").map((tr) => tr.find(Cell).map((cell) => cell.prop("highlighted")));
-
-        expect(actualHighlights).toStrictEqual([
-            [true, false],
-            [false, true]
-        ]);
-    });
-
-    it("passes rowIndex, colIndex to <Cell /> components", () => {
-        const highlights = [
-            [false, false],
-            [false, false]
-        ];
-        const wrapper = shallow(<Board highlights={highlights} cellClicked={mockCellClicked} />);
-
-        const actualIndexes = wrapper
-            .find("tr")
-            .map((tr, mapRowIndex) =>
-                tr.find(Cell).map((cell, mapColIndex) => (({ rowIndex, colIndex }) => ({ rowIndex, colIndex }))(cell.props()))
-            );
-
-        expect(actualIndexes).toStrictEqual([
-            [
-                { rowIndex: 0, colIndex: 0 },
-                { rowIndex: 0, colIndex: 1 }
-            ],
-            [
-                { rowIndex: 1, colIndex: 0 },
-                { rowIndex: 1, colIndex: 1 }
-            ]
-        ]);
-    });
-
-    it("<Cell /> click calls cellClicked", () => {
-        const highlights = [[false]];
-        const wrapper = mount(<Board highlights={highlights} cellClicked={mockCellClicked} />);
-
-        wrapper.find(Cell).simulate("click");
-
-        expect(mockCellClicked).toBeCalledTimes(1);
-    });
+  let mockCellClicked: jest.Mock;
+  beforeEach(() => {
+    mockCellClicked = jest.fn();
+  });
+
+  it("creates <Cell /> components with highlights", () => {
+    const highlights = [
+      [true, false],
+      [false, true]
+    ];
+    const wrapper = shallow(
+      <Board highlights={highlights} cellClicked={mockCellClicked} />
+    );
+
+    const actualHighlights = wrapper
+      .find("tr")
+      .map((tr) => tr.find(Cell).map((cell) => cell.prop("highlighted")));
+
+    expect(actualHighlights).toStrictEqual([
+      [true, false],
+      [false, true]
+    ]);
+  });
+
+  it("passes rowIndex, colIndex to <Cell /> components", () => {
+    const highlights = [
+      [false, false],
+      [false, false]
+    ];
+    const wrapper = shallow(
+      <Board highlights={highlights} cellClicked={mockCellClicked} />
+    );
+
+    /* eslint-disable */
+    const actualIndexes = wrapper.find("tr")
+      .map((tr, mapRowIndex) => tr.find(Cell)
+          .map((cell, mapColIndex) =>
+            (({ rowIndex, colIndex }) => ({ rowIndex, colIndex }))(cell.props())
+          )
+      );
+    /* eslint-enable */
+
+    expect(actualIndexes).toStrictEqual([
+      [
+        { rowIndex: 0, colIndex: 0 },
+        { rowIndex: 0, colIndex: 1 }
+      ],
+      [
+        { rowIndex: 1, colIndex: 0 },
+        { rowIndex: 1, colIndex: 1 }
+      ]
+    ]);
+  });
+
+  it("<Cell /> click calls cellClicked", () => {
+    const highlights = [[false]];
+    const wrapper = mount(
+      <Board highlights={highlights} cellClicked={mockCellClicked} />
+    );
+
+    wrapper.find(Cell).simulate("click");
+
+    expect(mockCellClicked).toBeCalledTimes(1);
+  });
 });