Skip to content

Commit c559b37

Browse files
snqbsnqb
authored
feat: introduce linter (#267)
1 parent 6bf215c commit c559b37

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

43 files changed

+852
-6574
lines changed

‎.eslintrc

+21-7
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,12 @@
11
{
22
"parser": "@typescript-eslint/parser",
33
"extends": [
4-
"standard",
5-
"standard-react",
4+
"airbnb",
65
"airbnb-typescript",
76
"plugin:@typescript-eslint/eslint-recommended",
87
"plugin:prettier/recommended"
98
],
10-
"plugins": [
11-
"react-hooks"
12-
],
9+
"plugins": ["react-hooks", "@typescript-eslint"],
1310
"env": {
1411
"node": true
1512
},
@@ -36,7 +33,7 @@
3633
"import/export": 0,
3734
"no-unused-vars": "off",
3835
"@typescript-eslint/no-unused-vars": "off",
39-
"@typescript-eslint/no-unused-vars-experimental": "error",
36+
"@typescript-eslint/no-use-before-define": "off",
4037
"react/jsx-props-no-spreading": 0,
4138
"jsx-a11y/click-events-have-key-events": 0,
4239
"linebreak-style": 0,
@@ -47,6 +44,23 @@
4744
"endOfLine": "auto"
4845
}
4946
],
50-
"object-curly-newline": "off"
47+
"object-curly-newline": "off",
48+
"no-restricted-exports": "off",
49+
"react/jsx-no-bind": "off",
50+
"no-shadow": "off",
51+
"import/no-cycle": "off",
52+
"react/jsx-boolean-value": "off",
53+
"@typescript-eslint/no-shadow": "off",
54+
"@typescript-eslint/explicit-module-boundary-types": "off",
55+
"@typescript-eslint/no-explicit-any": ["off"],
56+
"no-console": "off",
57+
"@typescript-eslint/no-non-null-assertion": "off",
58+
"func-names": "off",
59+
"react/jsx-uses-react": "off",
60+
"react/react-in-jsx-scope": "off",
61+
"import/prefer-default-export": "off",
62+
"react/function-component-definition": "off",
63+
"no-use-before-define": "off",
64+
"no-underscore-dangle": "off"
5165
}
5266
}

‎package.json

+11-17
Original file line numberDiff line numberDiff line change
@@ -18,12 +18,11 @@
1818
"start": "microbundle watch --no-compress --format modern,cjs --jsx React.createElement",
1919
"prepare": "run-s build",
2020
"prepack": "run-s build",
21+
"lint": "eslint --ext .ts,.tsx ./",
22+
"lint:fix": "yarn lint --fix",
2123
"test": "run-s test:unit test:lint test:build",
2224
"test:build": "run-s build",
23-
"test:lint": "eslint --ext .ts,.tsx ./",
24-
"test:unit": "cross-env CI=1 react-scripts test --env=jsdom",
25-
"test:watch": "react-scripts test --env=jsdom",
26-
"predeploy": "npm run build-storybook",
25+
"predeploy": "yarn build-storybook",
2726
"deploy": "gh-pages -d storybook-static",
2827
"build-storybook": "build-storybook",
2928
"storybook": "start-storybook -p 6006",
@@ -63,26 +62,21 @@
6362
"commitizen": "^4.2.4",
6463
"cross-env": "^7.0.3",
6564
"cz-conventional-changelog": "^3.3.0",
66-
"eslint": "^6.8.0",
67-
"eslint-config-airbnb-typescript": "^10.0.0",
68-
"eslint-config-prettier": "^8.4.0",
69-
"eslint-config-standard": "^14.1.0",
70-
"eslint-config-standard-react": "^9.2.0",
71-
"eslint-plugin-import": "^2.22.0",
72-
"eslint-plugin-jsx-a11y": "^6.3.1",
73-
"eslint-plugin-node": "^11.0.0",
65+
"eslint": "^8.18.0",
66+
"eslint-config-airbnb": "^19.0.4",
67+
"eslint-config-airbnb-typescript": "^17.0.0",
68+
"eslint-config-prettier": "^8.5.0",
69+
"eslint-plugin-import": "^2.26.0",
70+
"eslint-plugin-jsx-a11y": "^6.5.1",
7471
"eslint-plugin-prettier": "^4.0.0",
75-
"eslint-plugin-promise": "^4.2.1",
76-
"eslint-plugin-react": "^7.21.0",
77-
"eslint-plugin-react-hooks": "^4.1.2",
78-
"eslint-plugin-standard": "^4.0.1",
72+
"eslint-plugin-react": "^7.30.0",
73+
"eslint-plugin-react-hooks": "^4.6.0",
7974
"gh-pages": "^2.2.0",
8075
"microbundle": "^0.14.2",
8176
"npm-run-all": "^4.1.5",
8277
"prettier": "^2.5.1",
8378
"react": "^16.14.0",
8479
"react-dom": "^16.14.0",
85-
"react-scripts": "^3.4.1",
8680
"semantic-release": "^19.0.2",
8781
"typescript": "^4.6.2",
8882
"yalc": "^1.0.0-pre.53"

‎src/components/bar/progress-bar-2/progress-bar-2.stories.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { Box, Button, Flex } from 'rebass';
22
import { Meta, Story } from '@storybook/react/types-6-0';
3-
import ProgressBar2C, { ProgressBar2Props } from '.';
43
import { useState } from 'react';
4+
import ProgressBar2C, { ProgressBar2Props } from '.';
55

66
export default {
77
title: 'Quartz/ProgressBar2',

‎src/components/button/index.tsx

+2-3
Original file line numberDiff line numberDiff line change
@@ -72,11 +72,10 @@ const intentToColor: { [intent in Intent]?: Color } = {
7272
primary: 'white',
7373
alert: 'labels.red',
7474
/* [others]: 'primary' */
75-
}
75+
};
7676

7777
const buttonIntentToColor = (intent: Intent): Color => {
7878
const getColor = R.propOr(intent, 'primary');
7979

8080
return getColor(intentToColor);
81-
}
82-
81+
};

‎src/components/card/card.stories.tsx

+3-5
Original file line numberDiff line numberDiff line change
@@ -30,11 +30,9 @@ Default.args = {
3030
children: '',
3131
height: '270px',
3232
actions: (
33-
<React.Fragment>
34-
<Button variant="inline" pr="0" onClick={action('Card action')}>
35-
naked button
36-
</Button>
37-
</React.Fragment>
33+
<Button variant="inline" pr="0" onClick={action('Card action')}>
34+
naked button
35+
</Button>
3836
),
3937
};
4038

‎src/components/code-input/index.stories.tsx

+1-2
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,7 @@ import { action } from '@storybook/addon-actions';
33
import { Meta, Story } from '@storybook/react/types-6-0';
44
import React from 'react';
55

6-
import { InputProps } from '.';
7-
import CodeInput from '.';
6+
import CodeInput, { InputProps } from '.';
87

98
export default {
109
title: 'Quartz/CodeInput',

‎src/components/code-input/index.styles.ts

+11-12
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,15 @@
1-
21
const getStyles = () => ({
3-
'.react-codemirror2': {
4-
height: '100%',
5-
'.CodeMirror': {
6-
background: '#F5F5F5 !important',
7-
height: '100%'
8-
},
9-
'.CodeMirror-gutter': {
10-
color: 'gray',
11-
backgroundColor: 'grayShade2'
12-
}
13-
}
2+
'.react-codemirror2': {
3+
height: '100%',
4+
'.CodeMirror': {
5+
background: '#F5F5F5 !important',
6+
height: '100%',
7+
},
8+
'.CodeMirror-gutter': {
9+
color: 'gray',
10+
backgroundColor: 'grayShade2',
11+
},
12+
},
1413
});
1514

1615
export default getStyles;

‎src/components/datepicker/datepicker.styles.ts

+21-17
Original file line numberDiff line numberDiff line change
@@ -25,23 +25,27 @@ export default (align: 'left' | 'right') =>
2525
display: 'none',
2626
},
2727

28-
'.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item: hover': {
29-
backgroundColor: 'grayShade3',
30-
color: 'black',
31-
},
32-
'.react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected': {
33-
backgroundColor: 'primary',
34-
color: 'white',
35-
},
36-
'.react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected: hover': {
37-
backgroundColor: 'primary',
38-
color: 'white',
39-
},
40-
'.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item': {
41-
fontWeight: '500',
42-
height: '20px',
43-
lineHeight: '20px',
44-
},
28+
'.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item: hover':
29+
{
30+
backgroundColor: 'grayShade3',
31+
color: 'black',
32+
},
33+
'.react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected':
34+
{
35+
backgroundColor: 'primary',
36+
color: 'white',
37+
},
38+
'.react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected: hover':
39+
{
40+
backgroundColor: 'primary',
41+
color: 'white',
42+
},
43+
'.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item':
44+
{
45+
fontWeight: '500',
46+
height: '20px',
47+
lineHeight: '20px',
48+
},
4549

4650
'.react-datepicker__day: hover': {
4751
backgroundColor: 'grayShade3',

‎src/components/embedded-tabs/index.ts

+6-3
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
export type { Props as EmbeddedTabsItem } from './Tab';
2-
31
import EmbeddedTabs, { Controlled } from './EmbeddedTabs';
42

3+
export type { Props as EmbeddedTabsItem } from './Tab';
4+
55
type IEmbeddedTabs = typeof EmbeddedTabs;
66

77
interface EmbeddedTabsComponent extends IEmbeddedTabs {
@@ -10,5 +10,8 @@ interface EmbeddedTabsComponent extends IEmbeddedTabs {
1010

1111
(EmbeddedTabs as EmbeddedTabsComponent).Controlled = Controlled;
1212

13-
export type { Props as EmbeddedTabsProps, ControlledProps as ControlledEmbeddedTabsProps } from './EmbeddedTabs';
13+
export type {
14+
Props as EmbeddedTabsProps,
15+
ControlledProps as ControlledEmbeddedTabsProps,
16+
} from './EmbeddedTabs';
1417
export default EmbeddedTabs as EmbeddedTabsComponent;

‎src/components/embedded-tabs/styles.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@ export const tabsList = {
88
borderCollapse: 'collapse',
99

1010
'> div:not(:last-child)': {
11-
marginRight: '20px'
12-
}
11+
marginRight: '20px',
12+
},
1313
} as SxStyleProp;
1414

1515
/* this one is needed to have the line that spans across the rest of the width. Couldn't find any other solution. */

‎src/components/file-button/file-button.stories.tsx

+1-2
Original file line numberDiff line numberDiff line change
@@ -78,8 +78,7 @@ File.argTypes = {
7878
options: [undefined, IconName.download],
7979
},
8080
type: {
81-
summary:
82-
'Put icon component from IconName',
81+
summary: 'Put icon component from IconName',
8382
},
8483
},
8584
};

‎src/components/file-button/index.tsx

+3-1
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,9 @@ const UploadButton: FC<QuartzFileButtonProps> = ({
4040
{...props}
4141
onClick={handleClick}
4242
>
43-
<Box sx={{ ...inputBox }}><GetIcon color="primary" size="sm" icon={IconName.upload} /></Box>
43+
<Box sx={{ ...inputBox }}>
44+
<GetIcon color="primary" size="sm" icon={IconName.upload} />
45+
</Box>
4446
<input
4547
type="file"
4648
name={name}

‎src/components/file-loader/index.tsx

+3-1
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,9 @@ const FileLoader: FC<QuartzFileLoaderProps> = ({
6060
removeHandler(id);
6161
}}
6262
>
63-
<Flex><GetIcon size="sm" icon={IconName.cross} /></Flex>
63+
<Flex>
64+
<GetIcon size="sm" icon={IconName.cross} />
65+
</Flex>
6466
</Box>
6567
)}
6668
</Flex>

‎src/components/file-system-explorer/file-system-explorer.stories.tsx

+3-5
Original file line numberDiff line numberDiff line change
@@ -22,11 +22,9 @@ export const Default = Template.bind({});
2222
Default.args = {
2323
data: testData,
2424
shortcutActions: (
25-
<React.Fragment>
26-
<Button padding="0" variant="inline" onClick={action('Shortcut action')}>
27-
{'->'}Go directly to Jupyter notebook directory
28-
</Button>
29-
</React.Fragment>
25+
<Button padding="0" variant="inline" onClick={action('Shortcut action')}>
26+
{'->'}Go directly to Jupyter notebook directory
27+
</Button>
3028
),
3129
width: '830px',
3230
height: '100%',

‎src/components/footer-button/footer-button.stories.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ Footer.args = {
2222
children: (
2323
<>
2424
<span>Open Feature Group’s Page</span>
25-
<GetIcon icon={IconName.arrow_right}/>
25+
<GetIcon icon={IconName.arrow_right} />
2626
</>
2727
),
2828
onClick: action('onClick'),

‎src/components/graphs/split-graph/index.tsx

+2-1
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,8 @@ const SplitGraph: FC<SplitGraphProps> = ({
4242
);
4343

4444
const colors = useMemo(
45-
() => Array(Math.ceil(values.length / graphColors.length))
45+
() =>
46+
Array(Math.ceil(values.length / graphColors.length))
4647
.fill(0)
4748
.reduce((acc) => acc.concat(graphColors), []),
4849
[values],

‎src/components/graphs/split-graph/split-graph.styles.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ export const progressBarStyles = (
66
isSelected: boolean,
77
): SxStyleProp => ({
88
bg: color,
9-
width: percent + '%',
9+
width: `${percent}%`,
1010
marginRight: '2px',
1111
border: isSelected ? '1px solid #272727' : null,
1212
});

‎src/components/header/header.stories.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ Default.args = {
4040
],
4141
children: (
4242
<>
43-
<GetIcon icon={IconName.folder }/>
43+
<GetIcon icon={IconName.folder} />
4444
<Subtitle ml="16px">PROJECT ACME</Subtitle>
4545
</>
4646
),

‎src/components/header/index.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ const Header: FC<HeaderProps> = ({
2424
<Box sx={styles} variant="header">
2525
{/* Left Section */}
2626
<Box sx={leftSectionStyles} onClick={logoAction}>
27-
<Logo withName={true} height={35} width={160}/>
27+
<Logo withName={true} height={35} width={160} />
2828
</Box>
2929
<Box
3030
sx={{

‎src/components/holy-table/cell/styles.ts

+4-5
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
1-
import { SxStyleProp } from "rebass";
1+
import { SxStyleProp } from 'rebass';
22

3-
export default (paddedVertically: boolean) : SxStyleProp =>
4-
({
5-
py: paddedVertically ? '12px': 'initial',
3+
export default (paddedVertically: boolean): SxStyleProp => ({
4+
py: paddedVertically ? '12px' : 'initial',
65
px: '12px',
76
whiteSpace: 'pre',
8-
})
7+
});

‎src/components/icon/get-icon.stories.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import React, { useMemo, useState } from 'react';
22
import { Story, Meta } from '@storybook/react/types-6-0';
33

4-
import GetIcon, { GetIconProps } from './GetIcon';
5-
import { IconName } from '../icon/list';
64
import { Box, Flex } from 'rebass';
5+
import GetIcon, { GetIconProps } from './GetIcon';
6+
import { IconName } from './list';
77
import Tooltip from '../tooltip';
88
import theme from '../../theme/theme';
99
import Labeling from '../typography/labeling';

‎src/components/icon/index.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
11
export { default as GetIcon } from './GetIcon';
2-
export { IconName } from './list';
2+
export { IconName } from './list';

‎src/components/input/input.stories.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@ import { action } from '@storybook/addon-actions';
33
import { Meta, Story } from '@storybook/react/types-6-0';
44
import React from 'react';
55

6-
import Input, { InputProps } from '.';
76
import { Box } from 'rebass';
7+
import Input, { InputProps } from '.';
88
import { GetIcon, IconName } from '../icon';
99

1010
export default {

‎src/components/logo/index.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ const Logo: FC<LogoProps> = ({
2020
fill="none"
2121
xmlns="http://www.w3.org/2000/svg"
2222
>
23-
<g clip-path="url(#clip0_1335_76341)">
23+
<g clipPath="url(#clip0_1335_76341)">
2424
<path
2525
d="M19.4703 53.2099C18.3763 53.7885 17.1989 54.1934 15.9803 54.4099C15.0146 54.5598 14.0371 54.62 13.0603 54.5899C12.0217 54.5433 10.9866 54.4364 9.96033 54.2699C9.88684 54.2588 9.81581 54.2351 9.75033 54.1999H9.69033C9.65805 54.1332 9.63452 54.0627 9.62033 53.9899C9.45719 52.9601 9.35368 51.9217 9.31033 50.8799C9.27555 49.9031 9.33583 48.9251 9.49033 47.9599C9.70239 46.7434 10.1075 45.5686 10.6903 44.4799C10.7703 44.3299 10.8703 44.2599 11.0003 44.3099C12.3274 44.4933 13.6733 44.4933 15.0003 44.3099C16.0974 44.1948 17.1682 43.9009 18.1703 43.4399C18.2616 43.6803 18.3156 43.9332 18.3303 44.1899C18.3545 44.5572 18.4946 44.9073 18.7303 45.1899C19.0115 45.4281 19.3625 45.5685 19.7303 45.5899C19.9887 45.6154 20.2436 45.6691 20.4903 45.7499C20.0293 46.7556 19.7354 47.8297 19.6203 48.9299C19.4418 50.2573 19.4418 51.6026 19.6203 52.9299C19.6803 53.0099 19.6203 53.1299 19.4703 53.2099Z"
2626
fill="#1CB182"

0 commit comments

Comments
 (0)