feat(lint): add lint

core-ds · Feb 11, 2020 · 3bd5492 · 3bd5492
1 parent a27310a
commit 3bd5492
Show file tree

Hide file tree

Showing 17 changed files with 1,982 additions and 362 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -0,0 +1,21 @@
+module.exports = {
+    extends: [
+        require.resolve('arui-presets-lint/eslint'),
+        require.resolve('arui-presets-ts/eslint')
+    ],
+    ignorePatterns: ['node_modules/'],
+    settings: {
+      'import/resolver': {
+        node: {
+          extensions: ['.js', '.jsx', '.ts', '.tsx'],
+        },
+      },
+    },
+    overrides: [{
+        files: ['**/*.tsx', '**/*.ts', '**/*.jsx', '**/*.js'],
+        rules: {
+            'import/no-extraneous-dependencies': 0,
+            'react/prop-types': 'off',
+        }
+    }]
+};
diff --git a/babel.config.js b/babel.config.js
diff --git a/package.json b/package.json
@@ -15,10 +15,11 @@
     "start": "start-storybook -p 9009 -c .storybook",
     "build-storybook": "build-storybook -o build",
     "update-colors": "node ./tools/update-colors.js",
-    "pub": "./bin/publish.sh"
-  },
-  "eslintConfig": {
-    "extends": "react-app"
+    "pub": "./bin/publish.sh",
+    "lint": "yarn lint:css && yarn lint:js",
+    "lint:css": "stylelint ./packages/**/*.css",
+    "lint:js": "eslint ./ --ext .ts,.tsx,.js,.jsx",
+    "test": "yarn lint"
   },
   "browserslist": {
     "production": [
@@ -55,7 +56,19 @@
     "@types/react": "^16.9.19",
     "@types/react-dom": "^16.9.5",
     "alfa-ui-primitives": "2.4.3",
+    "arui-presets-lint": "^2.0.1",
+    "arui-presets-ts": "^5.0.0",
     "babel-loader": "^8.0.6",
+    "eslint": "^6.8.0",
+    "eslint-config-airbnb": "^18.0.1",
+    "eslint-config-airbnb-typescript": "^7.0.0",
+    "eslint-import-resolver-typescript": "^2.0.0",
+    "eslint-plugin-chai-friendly": "^0.5.0",
+    "eslint-plugin-import": "^2.20.1",
+    "eslint-plugin-jsx-a11y": "^6.2.3",
+    "eslint-plugin-react": "^7.18.3",
+    "eslint-plugin-react-hooks": "^2.3.0",
+    "eslint-plugin-sort-class-members": "^1.6.0",
     "fork-ts-checker-webpack-plugin": "^4.0.2",
     "husky": "^4.2.1",
     "lerna": "^3.20.2",
@@ -65,6 +78,8 @@
     "react-docgen-typescript-loader": "^3.6.0",
     "react-scripts": "^3.3.1",
     "storybook-addon-designs": "^5.1.2",
+    "stylelint": "^13.1.0",
+    "stylelint-config-standard": "^20.0.0",
     "ts-loader": "^6.2.1",
     "typescript": "~3.7.5"
   },
@@ -74,5 +89,16 @@
   "peerDependencies": {
     "react": ">=16.12.0",
     "react-dom": ">=16.12.0"
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "yarn test",
+      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
+    }
+  },
+  "commitlint": {
+    "extends": [
+      "./node_modules/arui-presets-lint/commitlint"
+    ]
   }
 }
diff --git a/packages/amount/src/Component.tsx b/packages/amount/src/Component.tsx
@@ -15,8 +15,8 @@ import { formatAmount } from '../../utils';
  */
 
 import {
-  AMOUNT_MAJOR_MINOR_PARTS_SEPARATOR,
-  THINSP,
+    AMOUNT_MAJOR_MINOR_PARTS_SEPARATOR,
+    THINSP, CURRENCY_CODES
 } from '../../configs/currencyCodes';
 
 /**
@@ -38,26 +38,31 @@ type Props = {
  */
 
 export const Amount: React.FC<Props> = ({
-  value,
-  currency,
-  minority,
-  hideMinority = false,
+    value,
+    minority,
+    hideMinority = false,
 
-  className,
-  minorityClassName,
+    className,
+    minorityClassName
 }) => {
-  let { majorPart, minorPart, currencySymbol } = formatAmount(value);
-
-  return (
-    <div className={className}>
-      {majorPart}
-      {!hideMinority && minorPart && AMOUNT_MAJOR_MINOR_PARTS_SEPARATOR}
-
-      {!hideMinority && <span className={minorityClassName}>{minorPart}</span>}
-      <span>
-        {THINSP}
-        {currencySymbol}
-      </span>
-    </div>
-  );
+    const { majorPart, minorPart, currencySymbol } = formatAmount({
+        value,
+        currency: {
+            code: CURRENCY_CODES.RUR, // TODO need work
+            minority
+        }
+    });
+
+    return (
+        <div className={ className }>
+            { majorPart }
+            { !hideMinority && minorPart && AMOUNT_MAJOR_MINOR_PARTS_SEPARATOR }
+
+            { !hideMinority && <span className={ minorityClassName }>{ minorPart }</span> }
+            <span>
+                { THINSP }
+                { currencySymbol }
+            </span>
+        </div>
+    );
 };
diff --git a/packages/button/src/Component.stories.tsx b/packages/button/src/Component.stories.tsx
@@ -6,7 +6,9 @@ import React from 'react';
 
 import { action } from '@storybook/addon-actions';
 import { withDesign } from 'storybook-addon-designs';
-import { withKnobs, text, select, boolean } from '@storybook/addon-knobs';
+import {
+    withKnobs, text, select, boolean
+} from '@storybook/addon-knobs';
 
 /**
  * Components
@@ -15,39 +17,39 @@ import { withKnobs, text, select, boolean } from '@storybook/addon-knobs';
 import { Button } from './Component';
 
 export default {
-  title: 'Common',
-  component: Button,
-  decorators: [withDesign, withKnobs],
+    title: 'Common',
+    component: Button,
+    decorators: [withDesign, withKnobs]
 };
 
 export const ButtonStory = () => (
-  <Button
-    type={select(
-      'Type',
-      ['primary', 'secondary', 'extra', 'dashed', 'link'],
-      'primary'
-    )}
-    title={text('Title', '')}
-    disabled={boolean('Disabled', false)}
-    htmlType={select('htmlType', ['button', 'reset', 'submit'], 'button')}
-    loading={boolean('Loading', false)}
-    size={select('Size', ['xs', 's', 'm', 'l'], 'm')}
-    block={boolean('Block', false)}
-    className={text('className', '')}
-    dataTestId={text('dataTestId', '')}
-    onClick={action('click')}
-  >
-    {text('Label', 'Оплатить')}
-  </Button>
+    <Button
+        type={ select(
+            'Type',
+            ['primary', 'secondary', 'extra', 'dashed', 'link'],
+            'primary'
+        ) }
+        title={ text('Title', '') }
+        disabled={ boolean('Disabled', false) }
+        htmlType={ select('htmlType', ['button', 'reset', 'submit'], 'button') }
+        loading={ boolean('Loading', false) }
+        size={ select('Size', ['xs', 's', 'm', 'l'], 'm') }
+        block={ boolean('Block', false) }
+        className={ text('className', '') }
+        dataTestId={ text('dataTestId', '') }
+        onClick={ action('click') }
+    >
+        { text('Label', 'Оплатить') }
+    </Button>
 );
 
 ButtonStory.story = {
-  name: 'Button',
-  parameters: {
-    design: {
-      type: 'figma',
-      // public link for testing
-      url: 'https://www.figma.com/file/cgApcObBwfNQzVVzJNqxoQ/Button',
-    },
-  },
+    name: 'Button',
+    parameters: {
+        design: {
+            type: 'figma',
+            // public link for testing
+            url: 'https://www.figma.com/file/cgApcObBwfNQzVVzJNqxoQ/Button'
+        }
+    }
 };
diff --git a/packages/button/src/Component.test.tsx b/packages/button/src/Component.test.tsx
@@ -2,11 +2,11 @@
  * Vendor
  */
 
-import React from 'react';
-import { render } from '@testing-library/react';
+// import React from 'react';
+// import { render } from '@testing-library/react';
 
 /**
  * Exp
  */
 
-test('renders learn react link', () => {});
+// test('renders learn react link', () => {});
diff --git a/packages/button/src/Component.tsx b/packages/button/src/Component.tsx
@@ -35,39 +35,39 @@ type Props = {
  */
 
 export const Button: React.FC<Props> = ({
-  children,
-  type = 'secondary',
-  title = '',
-  disabled = false,
-  htmlType = 'button',
-  icon,
-  loading = false,
-  size = 'm',
-  block = false,
-  className = '',
-  dataTestId,
+    children,
+    type = 'secondary',
+    title = '',
+    disabled = false,
+    htmlType = 'button',
+    icon,
+    // loading = false,
+    size = 'm',
+    block = false,
+    className = '',
+    dataTestId,
 
-  onClick
-}) => {
-  return (
+    onClick
+}) => (
+    // TODO need work
+    // eslint-disable-next-line react/button-has-type
     <button
-      type={htmlType}
-      title={title}
-      disabled={disabled}
-      className={cn(
-        styles.component,
-        styles[type],
-        styles[size],
-        {
-          [styles.block]: block,
-        },
-        className
-      )}
-      onClick={onClick}
-      data-test-id={dataTestId}
+        type={ htmlType }
+        title={ title }
+        disabled={ disabled }
+        className={ cn(
+            styles.component,
+            styles[type],
+            styles[size],
+            {
+                [styles.block]: block
+            },
+            className
+        ) }
+        onClick={ onClick }
+        data-test-id={ dataTestId }
     >
-      {icon && icon}
-      {children}
+        { icon && icon }
+        { children }
     </button>
-  );
-};
+);
diff --git a/packages/button/src/index.ts b/packages/button/src/index.ts
@@ -1 +1 @@
-export * from './Component';
+export * from './Component';