Skip to content

Commit b76b610

Browse files
nebula-aacnebula-aac
authored
Merge pull request #362 from layer5io/361-eslint
build(repo): Setup `eslint` in root workspace
2 parents 7f7b991 + 03ef0fc commit b76b610

Some content is hidden

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

71 files changed

+1795
-2676
lines changed

‎.eslintignore

+8-2
Original file line numberDiff line numberDiff line change
@@ -3,5 +3,11 @@ vite.config.ts
33
.eslintrc.cjs
44
node_modules
55
dist
6-
storybook-static
7-
*.md
6+
*.md
7+
site
8+
apps/next-12
9+
.yarnrc.yml
10+
.eslintrc.*js
11+
*.config.*js
12+
eslint-config-sistent
13+
apps/design-system

‎.eslintrc.js

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
module.exports = {
2+
root: true,
3+
env: {
4+
browser: true,
5+
es6: true
6+
},
7+
extends: [
8+
'eslint:recommended',
9+
'plugin:@typescript-eslint/recommended',
10+
'plugin:react-hooks/recommended',
11+
'plugin:storybook/recommended'
12+
],
13+
plugins: ['react'],
14+
parser: '@typescript-eslint/parser',
15+
parserOptions: {
16+
ecmaVersion: 'latest',
17+
sourceType: 'module',
18+
requireConfigFile: false
19+
},
20+
settings: {
21+
react: {
22+
version: 'detect'
23+
}
24+
}
25+
};

‎.github/workflows/lint.yml

+25-22
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,31 @@
1-
name: Linting and formatting
1+
name: Lint check
22

33
on:
4-
push:
5-
branches:
6-
- "*"
7-
pull_request:
8-
branches:
9-
- "*"
4+
push:
5+
branches:
6+
- '*'
7+
pull_request:
8+
branches:
9+
- '*'
1010

1111
jobs:
12-
lint:
13-
runs-on: ubuntu-latest
14-
15-
steps:
16-
- name: Checkout code
17-
uses: actions/[email protected]
12+
lint:
13+
runs-on: ubuntu-latest
14+
strategy:
15+
matrix:
16+
node-version: [16, 18, 20]
1817

19-
- name: Set up Node.js ${{ matrix.node-version }}
20-
uses: actions/[email protected]
21-
with:
22-
node-version: ${{ matrix.node-version }}
23-
24-
- name: Install dependencies
25-
run: yarn install
18+
steps:
19+
- name: Checkout code
20+
uses: actions/checkout@v4
2621

27-
- name: Run Lint
28-
run: yarn lint && yarn format:check && yarn lint-staged
22+
- name: Set up Node.js ${{ matrix.node-version }}
23+
uses: actions/setup-node@v4
24+
with:
25+
node-version: ${{ matrix.node-version }}
26+
27+
- name: Install dependencies
28+
run: yarn install
29+
30+
- name: Run Lint
31+
run: yarn lint

‎.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -36,3 +36,4 @@ packages/design-system/node_modules/**
3636
**/storybook-static/**
3737
lerna-debug.log
3838
pub.sh
39+
.eslintcache

‎.prettierignore

+6-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,9 @@
11
# Ignore artifacts:
22
**/dist/**
33
**/coverage/**
4-
**/.cache/**
4+
**/.cache/**
5+
**/.github/**
6+
**/.yarn/**
7+
site/public
8+
.yarnrc.yml
9+
.eslintrc.*js

‎apps/next-12/.eslintrc.json

-3
This file was deleted.

‎apps/next-12/components/DefaultModal/index.jsx

+55-56
Original file line numberDiff line numberDiff line change
@@ -1,57 +1,56 @@
11
import {
2-
Button,
3-
Dialog,
4-
DialogActions,
5-
DialogContent,
6-
DialogTitle,
7-
IconButton,
8-
Typography
9-
} from '@layer5/sistent-components';
10-
import { CloseIcon } from '@layer5/sistent-svg';
11-
import React from 'react';
12-
13-
export default function DefaultModal() {
14-
const [open, setOpen] = React.useState(false);
15-
16-
const handleClickOpen = () => {
17-
setOpen(true);
18-
};
19-
const handleClose = () => {
20-
setOpen(false);
21-
};
22-
23-
return (
24-
<React.Fragment>
25-
<Button variant="contained" onClick={handleClickOpen}>
26-
Open Dialog
27-
</Button>
28-
<Dialog onClose={handleClose} open={open}>
29-
<DialogTitle>Modal Title</DialogTitle>
30-
<IconButton onClick={handleClose} sx={{ position: 'absolute', right: 8, top: 8 }}>
31-
<CloseIcon width={24} height={24} />
32-
</IconButton>
33-
<DialogContent dividers>
34-
<Typography gutterBottom>
35-
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis
36-
in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
37-
</Typography>
38-
<Typography gutterBottom>
39-
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis
40-
lacus vel augue laoreet rutrum faucibus dolor auctor.
41-
</Typography>
42-
<Typography gutterBottom>
43-
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel
44-
scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus
45-
auctor fringilla.
46-
</Typography>
47-
</DialogContent>
48-
<DialogActions>
49-
<Button variant="contained" autoFocus onClick={handleClose}>
50-
Save changes
51-
</Button>
52-
</DialogActions>
53-
</Dialog>
54-
</React.Fragment>
55-
);
56-
}
57-
2+
Button,
3+
Dialog,
4+
DialogActions,
5+
DialogContent,
6+
DialogTitle,
7+
IconButton,
8+
Typography
9+
} from '@layer5/sistent-components';
10+
import { CloseIcon } from '@layer5/sistent-svg';
11+
import React from 'react';
12+
13+
export default function DefaultModal() {
14+
const [open, setOpen] = React.useState(false);
15+
16+
const handleClickOpen = () => {
17+
setOpen(true);
18+
};
19+
const handleClose = () => {
20+
setOpen(false);
21+
};
22+
23+
return (
24+
<React.Fragment>
25+
<Button variant="contained" onClick={handleClickOpen}>
26+
Open Dialog
27+
</Button>
28+
<Dialog onClose={handleClose} open={open}>
29+
<DialogTitle>Modal Title</DialogTitle>
30+
<IconButton onClick={handleClose} sx={{ position: 'absolute', right: 8, top: 8 }}>
31+
<CloseIcon width={24} height={24} />
32+
</IconButton>
33+
<DialogContent dividers>
34+
<Typography gutterBottom>
35+
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis
36+
in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
37+
</Typography>
38+
<Typography gutterBottom>
39+
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis
40+
lacus vel augue laoreet rutrum faucibus dolor auctor.
41+
</Typography>
42+
<Typography gutterBottom>
43+
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel
44+
scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus
45+
auctor fringilla.
46+
</Typography>
47+
</DialogContent>
48+
<DialogActions>
49+
<Button variant="contained" autoFocus onClick={handleClose}>
50+
Save changes
51+
</Button>
52+
</DialogActions>
53+
</Dialog>
54+
</React.Fragment>
55+
);
56+
}

‎apps/next-12/components/ModeToggleButton.jsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1+
import { toggleTheme } from '@/lib/redux/theme/themeSlice';
12
import { IconButton } from '@mui/material';
23
import { useDispatch, useSelector } from 'react-redux';
3-
import { toggleTheme } from '@/lib/redux/theme/themeSlice';
44

55
import DarkModeIcon from '@mui/icons-material/DarkMode';
66
import LightModeIcon from '@mui/icons-material/LightMode';
@@ -17,7 +17,7 @@ function ModeToggleButton() {
1717
const dispatch = useDispatch(); // Initialize the useDispatch function
1818

1919
// Use useSelector to get the darkTheme state from your Redux store
20-
const mode = useSelector((state) => state.theme.darkTheme ? 'dark' : 'light');
20+
const mode = useSelector((state) => (state.theme.darkTheme ? 'dark' : 'light'));
2121

2222
const toggleMode = () => {
2323
// Dispatch the toggleTheme action when the button is clicked

‎apps/next-12/components/ResponsiveDataTable/ResponsiveDataTable.jsx

+4-9
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,7 @@
11
import MUIDataTable from 'mui-datatables';
22
import { useEffect, useState } from 'react';
33

4-
export function ResponsiveDataTable({
5-
data,
6-
columns,
7-
options = {},
8-
...props
9-
}) {
4+
export function ResponsiveDataTable({ data, columns, options = {}, ...props }) {
105
const [tableCols, updateCols] = useState(columns);
116
const [columnVisibility, ,] = useState({});
127

@@ -15,7 +10,7 @@ export function ResponsiveDataTable({
1510
weekday: 'short',
1611
day: 'numeric',
1712
month: 'long',
18-
year: 'numeric',
13+
year: 'numeric'
1914
};
2015

2116
return new Intl.DateTimeFormat('un-US', dateOptions).format(date);
@@ -42,7 +37,7 @@ export function ResponsiveDataTable({
4237
break;
4338
}
4439
}
45-
},
40+
}
4641
};
4742

4843
useEffect(() => {
@@ -81,7 +76,7 @@ export function ResponsiveDataTable({
8176
}, [columnVisibility]);
8277

8378
const components = {
84-
ExpandButton: () => '',
79+
ExpandButton: () => ''
8580
};
8681

8782
return (

‎apps/next-12/components/ResponsiveDataTable/index.jsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
export { ResponsiveDataTable } from "./ResponsiveDataTable";
1+
export { ResponsiveDataTable } from './ResponsiveDataTable';

‎apps/next-12/components/SistentModal/index.jsx

+4-2
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,9 @@ export default function SistentModal() {
1717
};
1818
return (
1919
<React.Fragment>
20-
<Button variant="contained" onClick={handleModalOpen}>Open</Button>
20+
<Button variant="contained" onClick={handleModalOpen}>
21+
Open
22+
</Button>
2123
<Modal
2224
open={openModal}
2325
modalTitle="Where do you want to start?"
@@ -42,4 +44,4 @@ export default function SistentModal() {
4244
</Modal>
4345
</React.Fragment>
4446
);
45-
}
47+
}

‎apps/next-12/components/index.jsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
export * from './ResponsiveDataTable';
1+
export * from './ResponsiveDataTable';

‎apps/next-12/lib/providers/AppThemeProvider.jsx

+36-36
Original file line numberDiff line numberDiff line change
@@ -1,45 +1,45 @@
1-
import { useSelector, useDispatch } from "react-redux";
2-
import createEmotionCache from "@/styles/createEmotionCache";
1+
import createEmotionCache from '@/styles/createEmotionCache';
2+
import { darkTheme, lightTheme } from '@/styles/themes/theme';
33
import { CacheProvider } from '@emotion/react';
44
import { CssBaseline, ThemeProvider, createTheme } from '@mui/material';
5-
import { darkTheme, lightTheme } from "@/styles/themes/theme";
6-
import { useMemo } from "react";
5+
import { useMemo } from 'react';
6+
import { useSelector } from 'react-redux';
77

88
const clientSideEmotionCache = createEmotionCache();
99

1010
export function AppThemeProvider({ children, emotionCache = clientSideEmotionCache }) {
11-
// const dispatch = useDispatch();
11+
// const dispatch = useDispatch();
1212

13-
const mode = useSelector((state) => state.theme.darkTheme ? "dark" : "light")
13+
const mode = useSelector((state) => (state.theme.darkTheme ? 'dark' : 'light'));
1414

15-
const theme = useMemo(
16-
() =>
17-
createTheme({
18-
palette: {
19-
mode,
20-
primary: {
21-
...(mode === 'light' ? lightTheme.palette.primary : darkTheme.palette.primary),
22-
},
23-
secondary: {
24-
main: '#EE5351',
25-
},
26-
background: {
27-
...(mode === 'light' ? lightTheme.palette.background : darkTheme.palette.background),
28-
},
29-
text: {
30-
...(mode === 'light' ? lightTheme.palette.text : darkTheme.palette.text),
31-
},
32-
},
33-
}),
34-
[mode],
35-
);
15+
const theme = useMemo(
16+
() =>
17+
createTheme({
18+
palette: {
19+
mode,
20+
primary: {
21+
...(mode === 'light' ? lightTheme.palette.primary : darkTheme.palette.primary)
22+
},
23+
secondary: {
24+
main: '#EE5351'
25+
},
26+
background: {
27+
...(mode === 'light' ? lightTheme.palette.background : darkTheme.palette.background)
28+
},
29+
text: {
30+
...(mode === 'light' ? lightTheme.palette.text : darkTheme.palette.text)
31+
}
32+
}
33+
}),
34+
[mode]
35+
);
3636

37-
return (
38-
<CacheProvider value={emotionCache}>
39-
<ThemeProvider theme={theme}>
40-
<CssBaseline />
41-
{children}
42-
</ThemeProvider>
43-
</CacheProvider>
44-
);
45-
}
37+
return (
38+
<CacheProvider value={emotionCache}>
39+
<ThemeProvider theme={theme}>
40+
<CssBaseline />
41+
{children}
42+
</ThemeProvider>
43+
</CacheProvider>
44+
);
45+
}

0 commit comments

Comments
 (0)