From 518a42e544c63fc9d5c0116cc27723d3190b8439 Mon Sep 17 00:00:00 2001 From: v1rtl Date: Wed, 7 Aug 2024 18:46:44 +0300 Subject: [PATCH] wip fix components lint --- .vscode/settings.json | 3 +- .../src/components/atoms/Portal/Portal.tsx | 1 - .../components/atoms/ScrollBox/ScrollBox.tsx | 1 - .../molecules/Backdrop/Backdrop.tsx | 1 - .../RadioButtonGroup/RadioButtonGroup.tsx | 2 +- .../components/molecules/Select/Select.tsx | 11 ++++---- .../components/organisms/Dialog/Dialog.tsx | 28 +++++++++---------- .../src/components/organisms/Toast/Toast.tsx | 5 ---- components/src/hooks/useDocumentEvent.ts | 1 - .../src/hooks/useIntersectionalObserver.ts | 1 - components/test/index.tsx | 6 +--- components/test/overrides.ts | 2 +- eslint.config.mjs | 2 +- stylelint.config.mjs | 1 + tsconfig.json | 3 +- 15 files changed, 27 insertions(+), 41 deletions(-) diff --git a/.vscode/settings.json b/.vscode/settings.json index dbc00f23..9db45f29 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -6,8 +6,7 @@ }, "editor.formatOnSave": false, "eslint.useFlatConfig": true, - "stylelint.configFile": ".stylelintrc.json", - "stylelint.validate": ["css", "typescriptreact"], + "stylelint.configFile": "stylelint.config.mjs", "svg.preview.background": "custom", "prettier.enable": false } diff --git a/components/src/components/atoms/Portal/Portal.tsx b/components/src/components/atoms/Portal/Portal.tsx index 775faf6a..7157c5f1 100644 --- a/components/src/components/atoms/Portal/Portal.tsx +++ b/components/src/components/atoms/Portal/Portal.tsx @@ -27,7 +27,6 @@ export const Portal: React.FC = ({ return () => { document.body.removeChild(container) } - // eslint-disable-next-line react-hooks/exhaustive-deps }, [renderCallback]) return ReactDOM.createPortal(children, container) diff --git a/components/src/components/atoms/ScrollBox/ScrollBox.tsx b/components/src/components/atoms/ScrollBox/ScrollBox.tsx index 2eef8cdd..50570ef7 100644 --- a/components/src/components/atoms/ScrollBox/ScrollBox.tsx +++ b/components/src/components/atoms/ScrollBox/ScrollBox.tsx @@ -138,7 +138,6 @@ export const ScrollBox = ({ return () => { observer.disconnect() } - // eslint-disable-next-line react-hooks/exhaustive-deps }, [bottomTriggerPx, topTriggerPx]) React.useEffect(() => { diff --git a/components/src/components/molecules/Backdrop/Backdrop.tsx b/components/src/components/molecules/Backdrop/Backdrop.tsx index 60f55094..80477e7e 100644 --- a/components/src/components/molecules/Backdrop/Backdrop.tsx +++ b/components/src/components/molecules/Backdrop/Backdrop.tsx @@ -82,7 +82,6 @@ export const Backdrop = ({ return () => { toggle(false) } - // eslint-disable-next-line react-hooks/exhaustive-deps }, [open, noBackground]) return state.status !== 'unmounted' diff --git a/components/src/components/molecules/RadioButtonGroup/RadioButtonGroup.tsx b/components/src/components/molecules/RadioButtonGroup/RadioButtonGroup.tsx index 8f0f3eae..eed4e035 100644 --- a/components/src/components/molecules/RadioButtonGroup/RadioButtonGroup.tsx +++ b/components/src/components/molecules/RadioButtonGroup/RadioButtonGroup.tsx @@ -58,7 +58,7 @@ export const RadioButtonGroup = React.forwardRef( const [value, setValue] = React.useState(_value) React.useEffect(() => { if (_value && _value != value) setValue(_value) - // eslint-disable-next-line react-hooks/exhaustive-deps + }, [_value]) const handleChange = (e: React.ChangeEvent) => { diff --git a/components/src/components/molecules/Select/Select.tsx b/components/src/components/molecules/Select/Select.tsx index cdd8a94f..09b9e0e1 100644 --- a/components/src/components/molecules/Select/Select.tsx +++ b/components/src/components/molecules/Select/Select.tsx @@ -561,7 +561,6 @@ export const Select = React.forwardRef( const [value, setValue] = React.useState('') React.useEffect(() => { if (_value !== value && _value !== undefined) setValue(_value) - // eslint-disable-next-line react-hooks/exhaustive-deps }, [_value]) const selectedOption = options?.find(o => o.value === value) || null @@ -569,7 +568,7 @@ export const Select = React.forwardRef( const changeSelectedOption = (option?: SelectOptionProps, event?: any) => { if (option?.disabled) return if (option?.value === CREATE_OPTION_VALUE) { - onCreate && onCreate(queryValue) + onCreate?.(queryValue) } else if (option?.value) { setValue(option?.value) @@ -592,7 +591,7 @@ export const Select = React.forwardRef( }, }, }) - onChange && onChange(clonedEvent) + onChange?.(clonedEvent) } } } @@ -683,7 +682,6 @@ export const Select = React.forwardRef( useEffect(() => { toggle(isOpen) - // eslint-disable-next-line react-hooks/exhaustive-deps }, [isOpen]) useEffect(() => { @@ -845,14 +843,15 @@ export const Select = React.forwardRef( tabIndex={-1} value={value} onChange={(e) => { - const newValue = (e.target as any).value + const newValue = (e.target as HTMLInputElement).value const option = options?.find(o => o.value === newValue) if (option) { setValue(option.value) - onChange && onChange(e) + onChange?.(e) } }} onFocus={() => { + // eslint-disable-next-line @typescript-eslint/no-unused-expressions searchInputRef.current ? searchInputRef.current.focus() : displayRef.current?.focus() diff --git a/components/src/components/organisms/Dialog/Dialog.tsx b/components/src/components/organisms/Dialog/Dialog.tsx index 1a559dc4..8bda7b55 100644 --- a/components/src/components/organisms/Dialog/Dialog.tsx +++ b/components/src/components/organisms/Dialog/Dialog.tsx @@ -9,7 +9,7 @@ import { FontSize } from '@/src/tokens/typography' import { DialogContent } from './DialogContent' -import { Modal, ScrollBox, Typography } from '../..' +import { Modal, Typography } from '../..' import { Box, BoxProps } from '../../atoms/Box/Box' import { getValueForAlert } from './utils/getValueForAlert' import { getValueForStepType } from './utils/getValueForStepType' @@ -217,19 +217,19 @@ const Heading = ({ ) } -const Content = ({ children }: { children?: React.ReactNode }) => { - return ( - - - {children} - - - ) -} +// const Content = ({ children }: { children?: React.ReactNode }) => { +// return ( +// +// +// {children} +// +// +// ) +// } const Footer = ({ leading, diff --git a/components/src/components/organisms/Toast/Toast.tsx b/components/src/components/organisms/Toast/Toast.tsx index c09e371a..e015336b 100644 --- a/components/src/components/organisms/Toast/Toast.tsx +++ b/components/src/components/organisms/Toast/Toast.tsx @@ -187,7 +187,6 @@ InternalProps & { if (open) { setCalcTop(0.025 * window.innerHeight) } - // eslint-disable-next-line react-hooks/exhaustive-deps }, [open]) React.useEffect(() => { @@ -228,7 +227,6 @@ InternalProps & { // } // } } - // eslint-disable-next-line react-hooks/exhaustive-deps }, [touches]) const onTouchStart = React.useCallback((e: TouchEvent) => { @@ -261,7 +259,6 @@ InternalProps & { capture: false, }) } - // eslint-disable-next-line react-hooks/exhaustive-deps }, []) React.useEffect(() => { @@ -274,7 +271,6 @@ InternalProps & { capture: false, }) } - // eslint-disable-next-line react-hooks/exhaustive-deps }, [popped]) return ( @@ -335,7 +331,6 @@ export const Toast = ({ onClose() } } - // eslint-disable-next-line react-hooks/exhaustive-deps }, [open]) React.useEffect(() => { diff --git a/components/src/hooks/useDocumentEvent.ts b/components/src/hooks/useDocumentEvent.ts index cc748301..23ffbed3 100644 --- a/components/src/hooks/useDocumentEvent.ts +++ b/components/src/hooks/useDocumentEvent.ts @@ -15,6 +15,5 @@ export const useDocumentEvent = ( return () => { document.removeEventListener(event, callback) } - // eslint-disable-next-line react-hooks/exhaustive-deps }, [shouldCallback]) } diff --git a/components/src/hooks/useIntersectionalObserver.ts b/components/src/hooks/useIntersectionalObserver.ts index 295bd4e1..f093af66 100644 --- a/components/src/hooks/useIntersectionalObserver.ts +++ b/components/src/hooks/useIntersectionalObserver.ts @@ -20,6 +20,5 @@ export const useIntersectionalObserver = ( return () => { if (observer && target) observer.unobserve(target) } - // eslint-disable-next-line react-hooks/exhaustive-deps }, [ref, active]) } diff --git a/components/test/index.tsx b/components/test/index.tsx index 29039e90..6d9fbff7 100644 --- a/components/test/index.tsx +++ b/components/test/index.tsx @@ -5,16 +5,12 @@ import './mocks/URL.js' // -------------------------------------------------- // re-export everything -// -------------------------------------------------- -/* eslint-disable import/export */ +// ---------------------------------- export * from '@testing-library/react' -/* eslint-enable import/export */ export { default as userEvent } from '@testing-library/user-event' // override methods -/* eslint-disable import/export */ export { render } -/* eslint-enable import/export */ export * from './utils' export const getPropertyValue = (element: Element, property: string) => { diff --git a/components/test/overrides.ts b/components/test/overrides.ts index 5e1260e0..be6b415a 100644 --- a/components/test/overrides.ts +++ b/components/test/overrides.ts @@ -1,7 +1,7 @@ export {} // Format string with arguments -function sprintf(message: string, args: any[]) { +function sprintf(message: string, args: unknown[]) { let i = 0 return message.replace(/%((%)|s|d)/g, function (m: any) { // m is the matched format, e.g. %s, %d diff --git a/eslint.config.mjs b/eslint.config.mjs index e1c83c20..a740cf15 100644 --- a/eslint.config.mjs +++ b/eslint.config.mjs @@ -19,7 +19,7 @@ const baseConfig = tseslint.config( }, }, { - ignores: ['docs/node_modules', 'docs/dist', 'docs/.next', '**/*.cjs'], + ignores: ['docs/node_modules', 'docs/dist', 'docs/.next', '**/*.cjs', '**/*.js'], }, eslint.configs.recommended, ...tseslint.configs.recommended, diff --git a/stylelint.config.mjs b/stylelint.config.mjs index 9abcb67a..ace8bdcf 100644 --- a/stylelint.config.mjs +++ b/stylelint.config.mjs @@ -6,4 +6,5 @@ export default { '@stylistic/max-empty-lines': 1, '@stylistic/string-quotes': 'single', }, + ignorePatterns: ['**/*.tsx'], } diff --git a/tsconfig.json b/tsconfig.json index 53a235b6..190547d7 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -10,7 +10,8 @@ }, "module": "ESNext", "target": "ESNext", - "skipLibCheck": true + "skipLibCheck": true, + "jsx": "preserve" }, "include": ["components/**/*", "docs/**/*", "playroom/**/*"] } \ No newline at end of file