Skip to content
This repository was archived by the owner on Jul 26, 2022. It is now read-only.

Commit 50a9bd3

Browse files
snitin315snitin315
authored
chore: format and lint code (#19)
* chore: format and lint code * chore: lint files
1 parent 16d3514 commit 50a9bd3

20 files changed

+6342
-1991
lines changed

‎.eslintignore

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
node_modules
2+
_site
3+
src/assets/js

‎.eslintrc.js

+66
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
"use strict";
2+
3+
module.exports = {
4+
root: true,
5+
extends: ["eslint"],
6+
parserOptions: {
7+
ecmaVersion: 2022
8+
},
9+
rules: {
10+
11+
// Disable eslint-plugin-node rules from eslint-config-eslint
12+
"no-process-exit": "off",
13+
"func-style": "off",
14+
"node/no-deprecated-api": "off",
15+
"node/no-extraneous-require": "off",
16+
"node/no-missing-require": "off",
17+
"node/no-unpublished-bin": "off",
18+
"node/no-unpublished-require": "off",
19+
"node/no-unsupported-features/es-builtins": "off",
20+
"node/no-unsupported-features/es-syntax": "off",
21+
"node/no-unsupported-features/node-builtins": "off",
22+
"node/process-exit-as-throw": "off",
23+
"node/shebang": "off",
24+
"node/no-extraneous-import": "off",
25+
"node/no-missing-import": "off",
26+
"node/no-unpublished-import": "off",
27+
28+
// Disable rules that the codebase doesn't currently follow.
29+
"jsdoc/require-jsdoc": "off",
30+
"jsdoc/require-returns": "off",
31+
"jsdoc/require-param-description": "off",
32+
"jsdoc/require-param-type": "off"
33+
},
34+
overrides: [
35+
{
36+
files: ["src/playground/**/*.{js,jsx}"],
37+
plugins: ["react", "jsx-a11y"],
38+
extends: ["plugin:react/recommended", "plugin:jsx-a11y/recommended"],
39+
parserOptions: {
40+
sourceType: "module",
41+
ecmaFeatures: {
42+
jsx: true
43+
}
44+
},
45+
env: {
46+
browser: true,
47+
es6: true,
48+
node: false
49+
},
50+
settings: {
51+
react: {
52+
version: "16.8.6"
53+
}
54+
},
55+
rules: {
56+
"react/jsx-no-target-blank": "error",
57+
58+
// Disable rules that the codebase doesn't currently follow.
59+
// It might be a good idea to enable these in the future.
60+
"jsx-a11y/no-onchange": "off",
61+
"react/prop-types": "off",
62+
"jsdoc/require-jsdoc": "off"
63+
}
64+
}
65+
]
66+
};

‎package-lock.json

+5,910-1,655
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

+8
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,8 @@
1818
"prestart": "npm run build",
1919
"start": "node tools/dev-server.js",
2020
"build": "npm-run-all install:playground build:sass build:eleventy build:webpack images",
21+
"lint": "eslint --ext=.js,.jsx .",
22+
"fix": "npm run lint -- --fix",
2123
"postinstall": "npm run install:playground"
2224
},
2325
"devDependencies": {
@@ -32,6 +34,12 @@
3234
"cross-env": "^7.0.3",
3335
"css-loader": "^6.7.1",
3436
"dom-parser": "^0.1.6",
37+
"eslint": "^8.13.0",
38+
"eslint-config-eslint": "^7.0.0",
39+
"eslint-plugin-jsdoc": "^39.2.0",
40+
"eslint-plugin-jsx-a11y": "^6.5.1",
41+
"eslint-plugin-node": "^11.1.0",
42+
"eslint-plugin-react": "^7.29.4",
3543
"express": "^4.17.3",
3644
"imagemin": "^8.0.1",
3745
"imagemin-cli": "^7.0.0",

‎src/_data/helpers.js

+14-9
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,16 @@
1+
"use strict";
2+
13
module.exports = {
4+
25
/**
36
* Returns some attributes based on whether the link is active or
47
* a parent of an active item
5-
*
6-
* @param {String} itemUrl is the link in question
7-
* @param {String} pageUrl is the page context
8-
* @returns {String} is the attributes or empty
8+
* @param {string} itemUrl is the link in question
9+
* @param {string} pageUrl is the page context
10+
* @returns {string} is the attributes or empty
911
*/
10-
getLinkActiveState: function(itemUrl, pageUrl) {
11-
let response = '';
12+
getLinkActiveState(itemUrl, pageUrl) {
13+
let response = "";
1214

1315
if (itemUrl === pageUrl) {
1416
response = ' aria-current="page" ';
@@ -20,10 +22,13 @@ module.exports = {
2022

2123
return response;
2224
},
23-
excludeThis: function(arr, pageUrl) {
24-
var newArray = [];
25+
excludeThis(arr, pageUrl) {
26+
const newArray = [];
27+
2528
arr.forEach(item => {
26-
if(item.url !== pageUrl) newArray.push(item);
29+
if (item.url !== pageUrl) {
30+
newArray.push(item);
31+
}
2732
});
2833
return newArray;
2934
}

‎src/assets/scss/components/alert.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -108,7 +108,7 @@
108108
.alert__line-number {
109109
font-weight: 500;
110110
margin-bottom: .25rem;
111-
111+
border-bottom: 1px solid currentColor;
112112
.alert--error & {
113113
color: var(--color-rose-700);
114114

‎src/playground/App.js

+24-25
Original file line numberDiff line numberDiff line change
@@ -37,8 +37,7 @@ const hasLocalStorage = () => {
3737
const App = () => {
3838
const { text: storedText, options: storedOptions } = JSON.parse(window.localStorage.getItem("linterDemoState") || "{}");
3939
const { text: urlText, options: urlOptions } = getUrlState();
40-
41-
const [text, setText] = useState(urlText || storedText || `/* eslint quotes: ["error", "double"] */\nconst a = 'b';`);
40+
const [text, setText] = useState(urlText || storedText || "/* eslint quotes: [\"error\", \"double\"] */\nconst a = 'b';");
4241
const [fix, setFix] = useState(false);
4342
const [options, setOptions] = useState(
4443
urlOptions || storedOptions || {
@@ -80,7 +79,7 @@ const App = () => {
8079
error
8180
};
8281
}
83-
}
82+
};
8483

8584
const storeState = ({ newText, newOptions }) => {
8685
const serializedState = JSON.stringify({ text: newText || text, options: newOptions || options });
@@ -90,23 +89,22 @@ const App = () => {
9089
}
9190

9291
window.location.hash = Unicode.encodeToBase64(serializedState);
93-
}
92+
};
9493

9594
const { messages, output, fatalMessage } = lint();
9695
const isInvalidAutofix = fatalMessage && text !== output;
9796
const sourceCode = linter.getSourceCode();
9897

99-
const onFix = (message) => {
100-
const { fix } = message;
101-
102-
if (fix && message.fix) {
98+
const onFix = message => {
99+
if (message.fix) {
103100
const { output: fixedCode } = SourceCodeFixer.applyFixes(text, [message], true);
101+
104102
setText(fixedCode);
105-
storeState({ newText: fixedCode});
103+
storeState({ newText: fixedCode });
106104
}
107-
}
105+
};
108106

109-
const updateOptions = (newOptions) => {
107+
const updateOptions = newOptions => {
110108
setOptions(newOptions);
111109
storeState({ newOptions });
112110
};
@@ -138,15 +136,16 @@ const App = () => {
138136
</div>
139137

140138
<div className="playground__main">
141-
<main className="playground__editor" id="main" tabIndex="0" aria-label="Editor">
139+
<main className="playground__editor" id="main" aria-label="Editor">
142140
<CodeEditor
141+
tabIndex="0"
143142
codeValue={text}
144143
errors={messages}
145144
eslintOptions={options}
146-
onUpdate={(value) => {
145+
onUpdate={value => {
147146
setFix(false);
148147
setText(value);
149-
storeState({ newText: value});
148+
storeState({ newText: value });
150149
}}
151150
getIndexFromLoc={sourceCode && sourceCode.getIndexFromLoc.bind(sourceCode)}
152151
/>
@@ -159,28 +158,28 @@ const App = () => {
159158
{
160159
isInvalidAutofix && <Alert type="error" text={`Invalid autofix! ${fatalMessage.message}`} />
161160
}
162-
{messages.length > 0 && messages.map((message) => (
163-
message.suggestions ? (
164-
<Alert
161+
{messages.length > 0 && messages.map(message => (
162+
message.suggestions ? (
163+
<Alert
165164
key={`${message.ruleId}-${message.line}-${message.column}`}
166-
type={message.severity === 2 ? 'error' : 'warning'}
165+
type={message.severity === 2 ? "error" : "warning"}
167166
message={message}
168167
suggestions={message.suggestions}
169168
onFix={onFix}
170169
/>
171170
) : (
172-
<Alert
173-
key={`${message.ruleId}-${message.line}-${message.column}`}
174-
type={message.severity === 2 ? 'error' : 'warning'}
175-
message={message}
176-
onFix={onFix}
177-
/>
171+
<Alert
172+
key={`${message.ruleId}-${message.line}-${message.column}`}
173+
type={message.severity === 2 ? "error" : "warning"}
174+
message={message}
175+
onFix={onFix}
176+
/>
178177
)
179178
))}
180179
</section>
181180
</div>
182181
</div>
183-
)
182+
);
184183
};
185184

186185
export default App;

‎src/playground/components/Alert.js

+7-6
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from "react";
22

3-
export default function Alert({ type, text, message, onFix, ...props}) {
3+
export default function Alert({ type, text, message, onFix }) {
44
if (!message) {
55
return (
66
<article aria-roledescription={type} className={`alert alert--${type}`}>
@@ -28,17 +28,17 @@ export default function Alert({ type, text, message, onFix, ...props}) {
2828
<path d="M9.49999 6.66667V10M9.49999 13.3333H9.50832M17.8333 10C17.8333 14.6024 14.1024 18.3333 9.49999 18.3333C4.89762 18.3333 1.16666 14.6024 1.16666 10C1.16666 5.39763 4.89762 1.66667 9.49999 1.66667C14.1024 1.66667 17.8333 5.39763 17.8333 10Z" stroke="currentColor" strokeWidth="1.66667" strokeLinecap="round" strokeLinejoin="round" />
2929
</svg>
3030
<span className="visually-hidden">Error</span>
31-
<a href="#" className="alert__line-number">
31+
<p className="alert__line-number">
3232
<span className="line-number">{line}</span>
3333
<span aria-hidden="true">:</span>
3434
<span className="colun-number">{column}</span>
35-
</a>
35+
</p>
3636
</div>
3737
<div className="alert__text">
3838
{alertMessage}
3939
{ruleId && (
4040
<>
41-
&nbsp; &#40;<a href={`https://eslint.org/docs/rules/${ruleId}`} target="_blank">{ruleId}</a>&#41;
41+
&nbsp; &#40;<a href={`https://eslint.org/docs/rules/${ruleId}`} target="_blank" rel="noreferrer">{ruleId}</a>&#41;
4242
</>
4343
)}
4444
</div>
@@ -59,6 +59,7 @@ export default function Alert({ type, text, message, onFix, ...props}) {
5959
<li
6060
className="alert__fix-options__item"
6161
role="menuitem"
62+
onKeyPress={() => onFix(suggestion)}
6263
tabIndex="-1"
6364
key={suggestion.desc}
6465
onClick={() => onFix(suggestion)}
@@ -76,5 +77,5 @@ export default function Alert({ type, text, message, onFix, ...props}) {
7677
)
7778
)}
7879
</article>
79-
)
80-
};
80+
);
81+
}

‎src/playground/components/CodeEditor.js

+7-8
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,34 @@
11
import React from "react";
2-
import CodeMirror from '@uiw/react-codemirror';
2+
import CodeMirror from "@uiw/react-codemirror";
33
import { history } from "@codemirror/history";
44
import { bracketMatching } from "@codemirror/matchbrackets";
5-
import { javascript, esLint } from '@codemirror/lang-javascript';
5+
import { javascript, esLint } from "@codemirror/lang-javascript";
66
import { linter } from "../utils/codemirror-linter-extension";
77
import { ESLintPlaygroundTheme, ESLintPlaygroundHighlightStyle } from "../utils/codemirror-theme";
88
import { Linter as ESLint } from "../node_modules/eslint/lib/linter/";
99
import "../scss/editor.scss";
1010

11-
export default function CodeEditor({ codeValue, onUpdate, errors, eslintOptions, ...props}) {
11+
export default function CodeEditor({ codeValue, onUpdate, eslintOptions }) {
1212
return (
1313
<>
1414
<CodeMirror
1515
value={codeValue}
1616
minWidth="100%"
1717
height="100%"
18-
autoFocus={true}
1918
extensions={
2019
[
2120
history(),
2221
bracketMatching(),
23-
linter(esLint(new ESLint(), eslintOptions), { delay: 0}),
22+
linter(esLint(new ESLint(), eslintOptions), { delay: 0 }),
2423
javascript(),
2524
ESLintPlaygroundTheme,
26-
ESLintPlaygroundHighlightStyle,
25+
ESLintPlaygroundHighlightStyle
2726
]
2827
}
29-
onChange={(value) => {
28+
onChange={value => {
3029
onUpdate(value);
3130
}}
3231
/>
3332
</>
3433
);
35-
};
34+
}

0 commit comments

Comments
 (0)