Skip to content

Commit 5728ddf

Browse files
authored
[Dashboard] - Refactor linter (#3375)
* refacor: using modern flat eslint config, add some rules, change a pattern for import paths * fix: lint * fix: install dependencies * refactor: sort and order imports * feat: add lint-staged * refactor: eslint config and ts config per feedback * fix: replace with tseslint.config * bump eslint
1 parent 1fbd6f8 commit 5728ddf

File tree

96 files changed

+974
-398
lines changed

Some content is hidden

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

96 files changed

+974
-398
lines changed

packages/apps/dashboard/client/.eslintrc.cjs

Lines changed: 0 additions & 19 deletions
This file was deleted.
Lines changed: 99 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
import eslint from '@eslint/js';
2+
import tseslint from 'typescript-eslint';
3+
import reactPlugin from 'eslint-plugin-react';
4+
import reactHooksPlugin from 'eslint-plugin-react-hooks';
5+
import prettierPlugin from 'eslint-plugin-prettier';
6+
import importPlugin from 'eslint-plugin-import';
7+
import globals from 'globals';
8+
9+
export default tseslint.config(
10+
{
11+
ignores: ['dist/', 'tsconfig.json'],
12+
},
13+
eslint.configs.recommended,
14+
tseslint.configs.recommended,
15+
{
16+
files: ['**/*.ts', '**/*.tsx'],
17+
languageOptions: {
18+
ecmaVersion: 2022,
19+
sourceType: 'module',
20+
parser: tseslint.parser,
21+
parserOptions: {
22+
ecmaFeatures: {
23+
jsx: true,
24+
},
25+
projectService: true,
26+
},
27+
globals: {
28+
...globals.browser,
29+
...globals.es2022,
30+
},
31+
},
32+
plugins: {
33+
react: reactPlugin,
34+
'react-hooks': reactHooksPlugin,
35+
prettier: prettierPlugin,
36+
import: importPlugin,
37+
},
38+
settings: {
39+
react: {
40+
version: 'detect',
41+
},
42+
'import/resolver': {
43+
typescript: {
44+
alwaysTryTypes: true,
45+
},
46+
},
47+
},
48+
rules: {
49+
'react/prop-types': 'off',
50+
'react/display-name': 'off',
51+
'react/react-in-jsx-scope': 'off',
52+
'react-hooks/exhaustive-deps': 'warn',
53+
'react-hooks/rules-of-hooks': 'error',
54+
'import/order': [
55+
'error',
56+
{
57+
'groups': ['builtin', 'external', 'internal', 'parent', 'sibling', 'index'],
58+
'pathGroups': [
59+
{
60+
'pattern': 'react',
61+
'group': 'external',
62+
'position': 'before'
63+
}
64+
],
65+
'pathGroupsExcludedImportTypes': ['react'],
66+
'newlines-between': 'always',
67+
'alphabetize': {
68+
'order': 'asc',
69+
'caseInsensitive': true
70+
}
71+
}
72+
],
73+
'import/no-duplicates': 'error',
74+
'import/no-unresolved': 'error',
75+
'@typescript-eslint/no-unused-vars': ['error', { 'argsIgnorePattern': '^_' }],
76+
'@typescript-eslint/no-explicit-any': 'error',
77+
'no-console': ['error', { allow: ['warn', 'error'] }],
78+
quotes: [
79+
'error',
80+
'single',
81+
{
82+
avoidEscape: true,
83+
},
84+
],
85+
'no-restricted-imports': [
86+
'error',
87+
{
88+
paths: [
89+
{
90+
name: 'lodash',
91+
message:
92+
'Please import only specific modules from lodash to reduce bundle size. Instead of import {compact} from `lodash`, import compact from lodash/compact',
93+
},
94+
],
95+
},
96+
],
97+
},
98+
}
99+
);

packages/apps/dashboard/client/package.json

Lines changed: 16 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,8 @@
99
"clean": "tsc --build --clean && rm -rf dist",
1010
"start": "vite",
1111
"build": "tsc --build && vite build",
12-
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
12+
"lint": "eslint . --report-unused-disable-directives --max-warnings 0",
13+
"lint:fix": "eslint . --fix",
1314
"preview": "vite preview",
1415
"vercel-build": "yarn workspace human-protocol build:libs && yarn build",
1516
"test": "exit 0"
@@ -44,18 +45,30 @@
4445
"zustand": "^4.5.4"
4546
},
4647
"devDependencies": {
48+
"@eslint/js": "^9.27.0",
4749
"@types/react": "^18.2.66",
4850
"@types/react-dom": "^18.2.22",
4951
"@typescript-eslint/eslint-plugin": "^7.2.0",
5052
"@typescript-eslint/parser": "^7.2.0",
5153
"@vitejs/plugin-react": "^4.2.1",
52-
"eslint": "^8.57.0",
53-
"eslint-plugin-react-hooks": "^5.1.0",
54+
"eslint": "^9.27.0",
55+
"eslint-plugin-import": "^2.31.0",
56+
"eslint-plugin-prettier": "^5.4.0",
57+
"eslint-plugin-react": "^7.37.5",
58+
"eslint-plugin-react-hooks": "^5.2.0",
5459
"eslint-plugin-react-refresh": "^0.4.11",
60+
"globals": "^16.2.0",
5561
"prettier": "^3.4.2",
5662
"sass": "^1.85.0",
5763
"typescript": "^5.6.3",
64+
"typescript-eslint": "^8.33.0",
5865
"vite": "^6.2.4",
5966
"vite-plugin-svgr": "^4.2.0"
67+
},
68+
"lint-staged": {
69+
"*.{ts,tsx}": [
70+
"prettier --write",
71+
"eslint --fix"
72+
]
6073
}
6174
}

packages/apps/dashboard/client/src/App.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,10 @@ import { FC } from 'react';
22

33
import { BrowserRouter as Router, Route, Routes } from 'react-router-dom';
44

5-
import Graph from '@pages/Graph';
6-
import Home from '@pages/Home';
7-
import LeaderBoard from '@pages/Leaderboard';
8-
import SearchResults from '@pages/SearchResults';
5+
import Graph from '@/pages/Graph';
6+
import Home from '@/pages/Home';
7+
import LeaderBoard from '@/pages/Leaderboard';
8+
import SearchResults from '@/pages/SearchResults';
99

1010
const App: FC = () => {
1111
return (

packages/apps/dashboard/client/src/components/Breadcrumbs/Breadcrumbs.tsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,10 @@
11
import { FC } from 'react';
22

3-
import { Link as RouterLink } from 'react-router-dom';
4-
import Link from '@mui/material/Link';
3+
import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';
54
import Box from '@mui/material/Box';
5+
import Link from '@mui/material/Link';
66
import Typography from '@mui/material/Typography';
7-
8-
import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';
7+
import { Link as RouterLink } from 'react-router-dom';
98

109
const Breadcrumbs: FC<{ title?: string }> = ({ title }) => {
1110
return (

packages/apps/dashboard/client/src/components/Charts/AreaChart.tsx

Lines changed: 17 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,9 @@
1+
import { useEffect, useRef, useState } from 'react';
2+
3+
import { Typography } from '@mui/material';
4+
import Card from '@mui/material/Card';
5+
import Stack from '@mui/material/Stack';
6+
import dayjs, { Dayjs } from 'dayjs';
17
import {
28
CartesianGrid,
39
Tooltip,
@@ -7,26 +13,23 @@ import {
713
Area,
814
ResponsiveContainer,
915
} from 'recharts';
10-
import CustomChartTooltip from './CustomChartTooltip';
11-
import { useEffect, useRef, useState } from 'react';
12-
import Card from '@mui/material/Card';
13-
import { Typography } from '@mui/material';
14-
import Stack from '@mui/material/Stack';
15-
import { colorPalette } from '@assets/styles/color-palette';
16-
import CustomXAxisTick from '@components/Charts/CustomXAxisTick';
17-
import DatePicker from '@components/DataEntry/DatePicker';
18-
import ToggleButtons from '@components/DataEntry/ToggleButtons';
19-
import dayjs, { Dayjs } from 'dayjs';
20-
import ToggleCharts from '@components/Charts/ToggleCharts';
21-
import { formatNumber } from '@helpers/formatNumber';
16+
17+
import { colorPalette } from '@/assets/styles/color-palette';
18+
import CustomXAxisTick from '@/components/Charts/CustomXAxisTick';
19+
import ToggleCharts from '@/components/Charts/ToggleCharts';
20+
import DatePicker from '@/components/DataEntry/DatePicker';
21+
import ToggleButtons from '@/components/DataEntry/ToggleButtons';
22+
import { formatNumber } from '@/helpers/formatNumber';
2223
import {
2324
GraphPageChartData,
2425
useGraphPageChartData,
25-
} from '@services/api/use-graph-page-chart-data';
26+
} from '@/services/api/use-graph-page-chart-data';
2627
import {
2728
initialAllTime,
2829
useGraphPageChartParams,
29-
} from '@utils/hooks/use-graph-page-chart-params';
30+
} from '@/utils/hooks/use-graph-page-chart-params';
31+
32+
import CustomChartTooltip from './CustomChartTooltip';
3033

3134
export type GraphPageChartDataConfigObject<T> = Partial<
3235
Record<keyof GraphPageChartData[number], T>

packages/apps/dashboard/client/src/components/Charts/CustomChartTooltip.tsx

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,15 @@
1-
import { TooltipProps } from 'recharts';
2-
import Card from '@mui/material/Card';
3-
import Box from '@mui/material/Box';
1+
import FiberManualRecordIcon from '@mui/icons-material/FiberManualRecord';
42
import { Grid, Typography } from '@mui/material';
3+
import Box from '@mui/material/Box';
4+
import Card from '@mui/material/Card';
55
import Stack from '@mui/material/Stack';
6-
import FiberManualRecordIcon from '@mui/icons-material/FiberManualRecord';
7-
import { colorPalette } from '@assets/styles/color-palette';
8-
import { formatDate } from '@helpers/formatDate';
9-
import { GraphPageChartDataConfigObject } from '@components/Charts/AreaChart';
106
import { NumericFormat } from 'react-number-format';
7+
import { TooltipProps } from 'recharts';
8+
9+
import { colorPalette } from '@/assets/styles/color-palette';
10+
import { GraphPageChartDataConfigObject } from '@/components/Charts/AreaChart';
11+
import { formatDate } from '@/helpers/formatDate';
12+
1113

1214
const renderTitle = (title: string) => {
1315
const currentTitle: GraphPageChartDataConfigObject<string> = {

packages/apps/dashboard/client/src/components/Charts/CustomXAxisTick.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
1-
import { colorPalette } from '@assets/styles/color-palette';
21
// @ts-expect-error -- import error, but this type work property
32
import { ContentRenderer } from 'recharts';
4-
import { formatDate } from '@helpers/formatDate';
3+
4+
import { colorPalette } from '@/assets/styles/color-palette';
5+
import { formatDate } from '@/helpers/formatDate';
56

67
const CustomXAxisTick = ({ x, y, payload }: ContentRenderer<string>) => {
78
return (

packages/apps/dashboard/client/src/components/Charts/ToggleCharts.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
11
import { FormControlLabel, FormGroup, Typography } from '@mui/material';
2-
import Stack from '@mui/material/Stack';
32
import Checkbox from '@mui/material/Checkbox';
4-
import { FormatNumber } from '@components/Home/FormatNumber';
3+
import Stack from '@mui/material/Stack';
4+
5+
import { FormatNumber } from '@/components/Home/FormatNumber';
56

67
interface ToggleChartsProps {
78
handleChange: (event: React.ChangeEvent<HTMLInputElement>) => void;

packages/apps/dashboard/client/src/components/Clipboard/Clipboard.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
import { useState } from 'react';
22

3+
import ContentCopyIcon from '@mui/icons-material/ContentCopy';
34
import Card from '@mui/material/Card';
5+
import IconButton from '@mui/material/IconButton';
46
import Stack from '@mui/material/Stack';
57
import Typography from '@mui/material/Typography';
6-
import IconButton from '@mui/material/IconButton';
7-
import ContentCopyIcon from '@mui/icons-material/ContentCopy';
8-
import CustomTooltip from '@components/CustomTooltip';
8+
9+
import CustomTooltip from '@/components/CustomTooltip';
910

1011
interface ClipboardProps {
1112
value: string;

0 commit comments

Comments
 (0)