Skip to content
This repository was archived by the owner on May 27, 2024. It is now read-only.

Commit 561ef48

Browse files
mbaumanndevmbaumanndev
authored
Merge pull request #26 from PsycleResearch/tools/linting
tools: Linting
2 parents 41dec27 + 050650b commit 561ef48

File tree

10 files changed

+1316
-435
lines changed

10 files changed

+1316
-435
lines changed

‎.eslintignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
*.css

‎.eslintrc.json

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
{
2+
"root": true,
3+
"parser": "@typescript-eslint/parser",
4+
"settings": {
5+
"react": {
6+
"version": "detect"
7+
}
8+
},
9+
"extends": [
10+
"eslint:recommended",
11+
"plugin:@typescript-eslint/eslint-recommended",
12+
"plugin:@typescript-eslint/recommended",
13+
"plugin:react/recommended",
14+
"prettier",
15+
"plugin:storybook/recommended"
16+
],
17+
"plugins": [
18+
"@typescript-eslint",
19+
"unused-imports",
20+
"react-hooks",
21+
"jsx-a11y"
22+
],
23+
"rules": {
24+
"@typescript-eslint/no-unused-vars": "off",
25+
"unused-imports/no-unused-imports": [
26+
"error",
27+
{
28+
"ignoreRestSiblings": false
29+
}
30+
],
31+
"unused-imports/no-unused-vars": [
32+
"error",
33+
{
34+
"ignoreRestSiblings": true,
35+
"argsIgnorePattern": "^_",
36+
"varsIgnorePattern": "^_",
37+
"caughtErrorsIgnorePattern": "^_"
38+
}
39+
],
40+
"react/no-unescaped-entities": "off",
41+
"react-hooks/rules-of-hooks": "error",
42+
"react-hooks/exhaustive-deps": "warn",
43+
"jsx-a11y/anchor-is-valid": "off",
44+
"jsx-a11y/click-events-have-key-events": "warn",
45+
"react/jsx-uses-react": "warn",
46+
"react/jsx-uses-vars": "warn",
47+
"no-console": ["error", { "allow": ["warn", "error"] }],
48+
"@typescript-eslint/no-explicit-any": [
49+
"error",
50+
{ "ignoreRestArgs": true }
51+
],
52+
"sort-imports": [
53+
"error",
54+
{
55+
"ignoreDeclarationSort": true
56+
}
57+
]
58+
}
59+
}

‎package.json

Lines changed: 19 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
"scripts": {
1717
"build": "rollup -c",
1818
"dev": "rollup -cw",
19-
"lint": "yarn prettier src/ --write",
19+
"lint": "eslint ./src/** -c .eslintrc.json --fix --ext ts,tsx --no-error-on-unmatched-pattern",
2020
"release": "yarn build && yarn publish",
2121
"clean": "rm -rf dist/",
2222
"storybook": "start-storybook -p 6006",
@@ -27,28 +27,39 @@
2727
"@svgdotjs/svg.draggable.js": "^3.0.2",
2828
"@svgdotjs/svg.js": "^3.0.16",
2929
"date-fns": "^2.21.3",
30-
"interactjs": "^1.9.20"
30+
"interactjs": "^1.9.20",
31+
"react-hook-form": "^7.30.0"
3132
},
3233
"peerDependencies": {
3334
"react": "^17.0.2",
3435
"react-dom": "^17.0.2"
3536
},
3637
"devDependencies": {
3738
"@babel/core": "^7.15.0",
39+
"@hookform/devtools": "^4.1.0",
3840
"@rollup/plugin-commonjs": "^20.0.0",
3941
"@rollup/plugin-node-resolve": "^13.0.4",
4042
"@rollup/plugin-typescript": "^8.3.0",
41-
"@storybook/addon-actions": "^6.4.19",
42-
"@storybook/addon-essentials": "^6.4.19",
43-
"@storybook/addon-links": "^6.4.19",
44-
"@storybook/react": "^6.4.19",
43+
"@storybook/addon-actions": "^6.4.22",
44+
"@storybook/addon-essentials": "^6.4.22",
45+
"@storybook/addon-links": "^6.4.22",
46+
"@storybook/react": "^6.4.22",
47+
"@typescript-eslint/eslint-plugin": "^5.21.0",
48+
"@typescript-eslint/parser": "^5.21.0",
4549
"babel-loader": "^8.2.2",
50+
"eslint": "^8.14.0",
51+
"eslint-config-prettier": "^8.5.0",
52+
"eslint-plugin-jsx-a11y": "^6.5.1",
53+
"eslint-plugin-react": "^7.29.4",
54+
"eslint-plugin-react-hooks": "^4.5.0",
55+
"eslint-plugin-storybook": "^0.5.11",
56+
"eslint-plugin-unused-imports": "^2.0.0",
4657
"install-peers-cli": "^2.2.0",
47-
"prettier": "^2.4.1",
58+
"prettier": "^2.6.2",
4859
"rollup": "^2.56.3",
4960
"rollup-plugin-cleaner": "^1.0.0",
5061
"rollup-plugin-peer-deps-external": "^2.2.4",
5162
"tslib": "^2.3.1",
52-
"typescript": "^4.3.5"
63+
"typescript": "^4.6.4"
5364
}
5465
}

‎src/draw-zone/index.stories.tsx

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,20 @@
1-
import React, { useEffect, useState } from 'react'
1+
import React, { FunctionComponent, useEffect, useState } from 'react'
22

33
import DrawZone, { ChangedElement, DrawZoneContainer, useDrawZone } from '.'
44

55
export default {
66
title: 'Components/DrawZone',
77
component: DrawZone,
88
decorators: [
9-
(Story: any) => (
9+
(Story: FunctionComponent) => (
1010
<DrawZoneContainer>
1111
<Story />
1212
</DrawZoneContainer>
1313
),
1414
],
1515
}
1616

17-
export function Default({}) {
17+
export function Default() {
1818
const originalElements = [
1919
{
2020
id: 'rect1',
@@ -83,7 +83,7 @@ export function Default({}) {
8383
)
8484
}
8585

86-
export function Rects({}) {
86+
export function Rects() {
8787
const originalElements = [
8888
{
8989
id: 'rect1',
@@ -202,7 +202,7 @@ export function Rects({}) {
202202
)
203203
}
204204

205-
export function Polygons({}) {
205+
export function Polygons() {
206206
const originalElements = [
207207
/*
208208
{
@@ -350,7 +350,7 @@ export function Polygons({}) {
350350
)
351351
}
352352

353-
export function ScaleIn({}) {
353+
export function ScaleIn() {
354354
const originalElements = [
355355
{
356356
id: 'poly2',
@@ -478,7 +478,7 @@ export function ScaleIn({}) {
478478
)
479479
}
480480

481-
export function ScaleOut({}) {
481+
export function ScaleOut() {
482482
const originalElements = [
483483
{
484484
id: 'rect1',
@@ -604,7 +604,7 @@ export function ScaleOut({}) {
604604
)
605605
}
606606

607-
export function ScaleInRect({}) {
607+
export function ScaleInRect() {
608608
const originalElements = [
609609
{
610610
id: 'rect1',
@@ -730,7 +730,7 @@ export function ScaleInRect({}) {
730730
)
731731
}
732732

733-
export function None({}) {
733+
export function None() {
734734
const { isMarkerShown, zoomIn, zoomOut, toggleMarker, reset } =
735735
useDrawZone()
736736
const [move, setMove] = useState(false)

‎src/draw-zone/index.tsx

Lines changed: 22 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,35 @@
11
import React, {
2-
useState,
3-
useEffect,
4-
useLayoutEffect,
5-
useRef,
62
Dispatch,
3+
ReactNode,
74
createContext,
8-
useContext,
95
useCallback,
10-
ReactNode,
6+
useContext,
7+
useEffect,
8+
useLayoutEffect,
119
useReducer,
10+
useRef,
11+
useState,
1212
} from 'react'
1313
import {
14-
SVG,
15-
Rect,
16-
Svg,
17-
Polygon,
1814
ArrayXY,
1915
Circle,
20-
Use,
21-
PointArrayAlias,
2216
FillData,
17+
PointArrayAlias,
18+
Polygon,
2319
Polyline,
20+
Rect,
21+
SVG,
2422
StrokeData,
23+
Svg,
24+
Use,
2525
} from '@svgdotjs/svg.js'
2626
import '@svgdotjs/svg.draggable.js'
2727
import interact from 'interactjs'
2828
import { DraggableOptions } from '@interactjs/types/index'
2929
import { uuid4 } from '../helpers'
3030
import { useMousePosition } from '../hooks'
3131
import { isTouchDevice } from '../utils'
32+
import { LinkedHTMLElement } from '@svgdotjs/svg.js'
3233

3334
export type DrawZoneMode = 'draw' | 'path' | 'move' | 'none'
3435
export type SizeMode = 'auto' | 'fit'
@@ -292,7 +293,6 @@ const blue = '#2BB1FD'
292293
const defaultStroke = { color: '#fff', width: 2, opacity: 1 }
293294
const defaultFill = { color: '#000', opacity: 0 }
294295

295-
296296
function getRectCoords(rect: Rect) {
297297
const bbox = rect.bbox()
298298
return [
@@ -415,7 +415,7 @@ function useDraw(
415415
if (event.defaultPrevented) return false
416416
if (event.key === 'Escape' && this.closest('svg')) {
417417
event.preventDefault()
418-
;(this as any).instance.fire('deselect')
418+
;(this as unknown as LinkedHTMLElement).instance.fire('deselect')
419419

420420
return true
421421
}
@@ -561,7 +561,7 @@ function useDraw(
561561
}
562562

563563
let circle: Circle | undefined
564-
let handles: Use[] = []
564+
const handles: Use[] = []
565565

566566
// Custom events.
567567
rect.on('select', () => {
@@ -618,7 +618,7 @@ function useDraw(
618618
onChange()
619619
})
620620
rect.on('deselect', (e) => {
621-
if ((e as any).detail?.inst === rect) return
621+
if ((e as CustomEvent).detail?.inst === rect) return
622622
rect.stroke(stroke)
623623
rect.data('selected', false)
624624

@@ -767,7 +767,6 @@ function useDraw(
767767
rect.data('label', label)
768768

769769
if (stroke.color !== defaultStroke.color)
770-
771770
rect.data('color', stroke.color)
772771

773772
return rect
@@ -806,8 +805,8 @@ function useDraw(
806805
poly.stroke(stroke)
807806
poly.css('touch-action', 'none') // silence interactjs warning.
808807

809-
let circles: Circle[] = []
810-
let handles: Use[] = []
808+
const circles: Circle[] = []
809+
const handles: Use[] = []
811810
let rootMatrix: DOMMatrix
812811

813812
function polyDelKeyPress(ev: KeyboardEvent) {
@@ -963,7 +962,7 @@ function useDraw(
963962
onChange()
964963
})
965964
poly.on('deselect', (e) => {
966-
if ((e as any).detail?.inst === poly) return
965+
if ((e as CustomEvent).detail?.inst === poly) return
967966
poly.stroke(stroke)
968967
poly.data('selected', false)
969968

@@ -989,7 +988,7 @@ function useDraw(
989988

990989
interact(poly.node).draggable({
991990
listeners: {
992-
start(event) {
991+
start() {
993992
interact('.point-handle').unset()
994993
handles.forEach((handle) => {
995994
handle.remove()
@@ -1009,7 +1008,7 @@ function useDraw(
10091008

10101009
onChange()
10111010
},
1012-
end(event) {
1011+
end() {
10131012
for (
10141013
let i = 0;
10151014
i < poly.node.points.numberOfItems;
@@ -1165,7 +1164,7 @@ function useDraw(
11651164
svg.node !== e.target &&
11661165
!startPosition
11671166
) {
1168-
const element = e.target as any
1167+
const element = e.target as unknown as LinkedHTMLElement
11691168
element.instance.fire('select')
11701169
return
11711170
} else if (e.target === svg.node) {

‎src/error-boundary/index.tsx

Lines changed: 17 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,17 @@ import React, { Component } from 'react'
22

33
import { truncate } from '../helpers'
44

5+
interface ErrorBoundaryState {
6+
readonly title: string | null
7+
readonly hasError: boolean
8+
readonly error: Error | null
9+
readonly more: boolean
10+
}
511
export default class ErrorBoundary extends Component<
6-
{},
7-
{ [key: string]: any }
12+
Record<string, never>,
13+
ErrorBoundaryState
814
> {
9-
constructor(props: any) {
15+
constructor(props: Record<string, never>) {
1016
super(props)
1117

1218
this.state = {
@@ -17,12 +23,12 @@ export default class ErrorBoundary extends Component<
1723
}
1824
}
1925

20-
static getDerivedStateFromError(error: any) {
26+
static getDerivedStateFromError() {
2127
// Update state so the next render will show the fallback UI.
2228
return { hasError: true }
2329
}
2430

25-
componentDidCatch(error: any) {
31+
componentDidCatch(error: Error) {
2632
this.setState({ error })
2733
}
2834

@@ -43,9 +49,12 @@ export default class ErrorBoundary extends Component<
4349
<br />
4450
<br />
4551
<code>
46-
{truncate(error.stack, {
47-
length: more ? error.stack.length : 128,
48-
})}
52+
{error.stack &&
53+
truncate(error.stack, {
54+
length: more
55+
? error.stack.length
56+
: 128,
57+
})}
4958
</code>
5059
&nbsp;&nbsp;
5160
<button

0 commit comments

Comments
 (0)