diff --git a/.eslintrc b/.eslintrc index 86c254d3..b8d844a4 100644 --- a/.eslintrc +++ b/.eslintrc @@ -1,6 +1,11 @@ { - "extends": "@steroidsjs/eslint-config", + "extends": "@steroidsjs/eslint-config/frontend", "rules": { + // "prettier/prettier": "off" disabled because + // Definition for rule 'prettier/prettier' was not found + // in every file + // remove if fixed + "prettier/prettier": "off", "jsx-a11y/no-static-element-interactions": "off", "jsx-a11y/click-events-have-key-events": "off" } diff --git a/package.json b/package.json index 02ffffd6..66bc3728 100644 --- a/package.json +++ b/package.json @@ -36,7 +36,7 @@ }, "devDependencies": { "@steroidsjs/core": "3.0.57", - "@steroidsjs/eslint-config": "^2.1.6", + "@steroidsjs/eslint-config": "^3.0.1", "@types/enzyme": "^3.10.8", "@types/googlemaps": "^3.43.3", "@types/jest": "^26.0.22", diff --git a/src/content/Avatar/AvatarView.tsx b/src/content/Avatar/AvatarView.tsx index 8c9d3a98..dd0eec37 100644 --- a/src/content/Avatar/AvatarView.tsx +++ b/src/content/Avatar/AvatarView.tsx @@ -52,14 +52,12 @@ export default function Avatar(props: IAvatarProps) { ...customSize, }} > - <> - {(props.src && renderImage()) || ( - - {props.formattedTitle} - + {(props.src && renderImage()) || ( + + {props.formattedTitle} + )} - {props.children} - + {props.children} ); diff --git a/src/content/Calendar/CalendarView.tsx b/src/content/Calendar/CalendarView.tsx index f6c9640c..3578ef86 100644 --- a/src/content/Calendar/CalendarView.tsx +++ b/src/content/Calendar/CalendarView.tsx @@ -63,6 +63,7 @@ export default function CalendarView(props: ICalendarViewProps) { {...props} {...props.pickerProps} className={bem(bem.block({ranged: isRange}), props.className)} + // eslint-disable-next-line react/no-unstable-nested-components captionElement={useCallback(({classNames, date, localeUtils, locale}: CaptionElementProps) => ( {props.header && ( -
{props.header.avatar && ( diff --git a/src/content/Chat/ChatView.tsx b/src/content/Chat/ChatView.tsx index 0fde65ad..7a3259a1 100644 --- a/src/content/Chat/ChatView.tsx +++ b/src/content/Chat/ChatView.tsx @@ -1,7 +1,6 @@ import React, {useCallback, useEffect, useRef} from 'react'; import useBem from '@steroidsjs/core/hooks/useBem'; import {IChatViewProps} from '@steroidsjs/core/ui/content/Chat/Chat'; - import BubblesDateGroup from './views/BubblesDateGroup'; export default function ChatView(props: IChatViewProps) { diff --git a/src/content/Chat/views/BubbleMessage/BubbleMessageView.tsx b/src/content/Chat/views/BubbleMessage/BubbleMessageView.tsx index 3f78a791..fba8aa68 100644 --- a/src/content/Chat/views/BubbleMessage/BubbleMessageView.tsx +++ b/src/content/Chat/views/BubbleMessage/BubbleMessageView.tsx @@ -9,9 +9,8 @@ import Icon from '@steroidsjs/core/ui/content/Icon'; import {IChatUser} from '@steroidsjs/core/ui/content/Chat/Chat'; import {SECONDS_IN_MINUTE_VALUE} from '@steroidsjs/core/ui/content/Chat/constants/timeTemplatesAndUnits'; import {calculateMessageTimeAgo} from '@steroidsjs/core/ui/content/Chat/utils'; - -import './BubbleMessageView.scss'; import ChatFileItemView from '../ChatFileItem'; +import './BubbleMessageView.scss'; interface IBubbleMessageProps { user: IChatUser, diff --git a/src/content/Chat/views/BubblesDateGroup/BubblesDateGroup.tsx b/src/content/Chat/views/BubblesDateGroup/BubblesDateGroup.tsx index 28234367..457b34bb 100644 --- a/src/content/Chat/views/BubblesDateGroup/BubblesDateGroup.tsx +++ b/src/content/Chat/views/BubblesDateGroup/BubblesDateGroup.tsx @@ -3,7 +3,6 @@ import useBem from '@steroidsjs/core/hooks/useBem'; import {calculateMessageTimeAgo, isTodayMessage} from '@steroidsjs/core/ui/content/Chat/utils'; import {IGroupedMessage} from '@steroidsjs/core/ui/content/Chat/hooks/useChat'; import {IChatUser} from '@steroidsjs/core/ui/content/Chat/Chat'; - import BubbleMessageView from '../BubbleMessage'; import './BubblesDateGroup.scss'; diff --git a/src/content/Chat/views/ChatInput/ChatInputView.tsx b/src/content/Chat/views/ChatInput/ChatInputView.tsx index e63c1f93..cb63959a 100644 --- a/src/content/Chat/views/ChatInput/ChatInputView.tsx +++ b/src/content/Chat/views/ChatInput/ChatInputView.tsx @@ -2,7 +2,6 @@ import React, {forwardRef, useCallback, useRef} from 'react'; import useBem from '@steroidsjs/core/hooks/useBem'; import {FileField, Form, InputField} from '@steroidsjs/core/ui/form'; import {IChatInputViewProps} from '@steroidsjs/core/ui/content/Chat/Chat'; - import ButtonView from '../../../../form/Button/ButtonView'; import ChatFileItemView from '../ChatFileItem'; import './ChatInputView.scss'; diff --git a/src/content/DropDown/DropDownView.tsx b/src/content/DropDown/DropDownView.tsx index 684e9482..156d44cf 100644 --- a/src/content/DropDown/DropDownView.tsx +++ b/src/content/DropDown/DropDownView.tsx @@ -2,7 +2,6 @@ import * as React from 'react'; import _isFunction from 'lodash-es/isFunction'; import {useBem, useComponents} from '@steroidsjs/core/hooks'; import {IDropDownViewProps} from '@steroidsjs/core/ui/content/DropDown/DropDown'; - import {useEffect, useMemo, useRef} from 'react'; export default function DropDownView(props: IDropDownViewProps) { diff --git a/src/content/Icon/IconView.tsx b/src/content/Icon/IconView.tsx index d26db60c..53201f34 100644 --- a/src/content/Icon/IconView.tsx +++ b/src/content/Icon/IconView.tsx @@ -1,5 +1,4 @@ import * as React from 'react'; - import {IIconViewProps} from '@steroidsjs/core/ui/content/Icon/Icon'; import {useBem} from '@steroidsjs/core/hooks'; import _omit from 'lodash-es/omit'; diff --git a/src/content/Menu/MenuView.tsx b/src/content/Menu/MenuView.tsx index 97e854d0..7e2c24b9 100644 --- a/src/content/Menu/MenuView.tsx +++ b/src/content/Menu/MenuView.tsx @@ -9,6 +9,7 @@ export default function MenuView(props: IMenuViewProps) { const MenuItemView = props.itemView; const renderMenuItems = React.useCallback(() => ( + // eslint-disable-next-line react/jsx-no-useless-fragment <> {props.items?.map((item, index) => (
diff --git a/src/form/Button/ButtonView.tsx b/src/form/Button/ButtonView.tsx index aa4cdee1..6fb8afdd 100644 --- a/src/form/Button/ButtonView.tsx +++ b/src/form/Button/ButtonView.tsx @@ -1,8 +1,6 @@ import * as React from 'react'; import _isString from 'lodash-es/isString'; - import {IButtonViewProps} from '@steroidsjs/core/ui/form/Button/Button'; - import Icon from '@steroidsjs/core/ui/content/Icon'; import {useBem} from '@steroidsjs/core/hooks'; @@ -51,10 +49,12 @@ export default function ButtonView(props: IButtonViewProps) { return ( diff --git a/src/form/CheckboxField/CheckboxFieldView.tsx b/src/form/CheckboxField/CheckboxFieldView.tsx index deec9e15..06484623 100644 --- a/src/form/CheckboxField/CheckboxFieldView.tsx +++ b/src/form/CheckboxField/CheckboxFieldView.tsx @@ -1,5 +1,4 @@ import * as React from 'react'; - import {ICheckboxFieldViewProps} from '@steroidsjs/core/ui/form/CheckboxField/CheckboxField'; import {useBem} from '@steroidsjs/core/hooks'; import useUniqueId from '@steroidsjs/core/hooks/useUniqueId'; diff --git a/src/form/CheckboxListField/CheckboxListFieldView.tsx b/src/form/CheckboxListField/CheckboxListFieldView.tsx index 13f500e5..d78b4134 100644 --- a/src/form/CheckboxListField/CheckboxListFieldView.tsx +++ b/src/form/CheckboxListField/CheckboxListFieldView.tsx @@ -1,5 +1,4 @@ import * as React from 'react'; - import {ICheckboxListFieldViewProps} from '@steroidsjs/core/ui/form/CheckboxListField/CheckboxListField'; import {useBem} from '@steroidsjs/core/hooks'; import useUniqueId from '@steroidsjs/core/hooks/useUniqueId'; diff --git a/src/form/DateRangeField/views/RangeButtons/RangeButtons.tsx b/src/form/DateRangeField/views/RangeButtons/RangeButtons.tsx index 5fbba91c..1d41c4d7 100644 --- a/src/form/DateRangeField/views/RangeButtons/RangeButtons.tsx +++ b/src/form/DateRangeField/views/RangeButtons/RangeButtons.tsx @@ -1,6 +1,5 @@ import React, {useMemo} from 'react'; import {useBem, useComponents} from '@steroidsjs/core/hooks'; - import {IDateRangeButton, IDateRangeFieldViewProps} from '@steroidsjs/core/ui/form/DateRangeField/DateRangeField'; import {Button} from '@steroidsjs/core/ui/form'; import {RANGE_BUTTONS} from './consts'; @@ -31,13 +30,15 @@ export default function RangeButtons(props: IRangeButtonsProps) { const {locale} = useComponents(); const {changeFrom, changeTo} = props; - const buttons = useMemo( - () => (Array.isArray(props.config) ? props.config : DEFAULT_BUTTONS) - .map((button) => ({ - ...button, - onClick: button.onClick.bind(null, locale, changeFrom, changeTo, props.format || DEFAULT_VALUE_FORMAT), - })), [changeFrom, changeTo, locale, props.config, props.format], - ); + const buttons = useMemo(() => ( + Array.isArray(props.config) + ? props.config + : DEFAULT_BUTTONS + ) + .map((button) => ({ + ...button, + onClick: button.onClick.bind(null, locale, changeFrom, changeTo, props.format || DEFAULT_VALUE_FORMAT), + })), [changeFrom, changeTo, locale, props.config, props.format]); return (
diff --git a/src/form/DateTimeField/DateTimeFieldView.tsx b/src/form/DateTimeField/DateTimeFieldView.tsx index 17fea4fa..b7b260b1 100644 --- a/src/form/DateTimeField/DateTimeFieldView.tsx +++ b/src/form/DateTimeField/DateTimeFieldView.tsx @@ -4,7 +4,6 @@ import {useCallback} from 'react'; import Icon from '@steroidsjs/core/ui/content/Icon'; import Calendar from '@steroidsjs/core/ui/content/Calendar'; import DropDown from '@steroidsjs/core/ui/content/DropDown'; - import {IDateTimeFieldViewProps} from '@steroidsjs/core/ui/form/DateTimeField/DateTimeField'; import TimePanelView from '../TimeField/TimePanelView'; diff --git a/src/form/DateTimeRangeField/DateTimeRangeFieldView.tsx b/src/form/DateTimeRangeField/DateTimeRangeFieldView.tsx index 83ba0c69..8c490131 100644 --- a/src/form/DateTimeRangeField/DateTimeRangeFieldView.tsx +++ b/src/form/DateTimeRangeField/DateTimeRangeFieldView.tsx @@ -5,7 +5,6 @@ import Icon from '@steroidsjs/core/ui/content/Icon'; import DropDown from '@steroidsjs/core/ui/content/DropDown'; import Calendar from '@steroidsjs/core/ui/content/Calendar'; import {IDateTimeRangeFieldViewProps} from '@steroidsjs/core/ui/form/DateTimeRangeField/DateTimeRangeField'; - import TimePanelView from '../TimeField/TimePanelView'; import RangeButtons from '../DateRangeField/views/RangeButtons'; @@ -63,12 +62,14 @@ export default function DateTimeRangeFieldView(props: IDateTimeRangeFieldViewPro className={bem.element('dropdown')} >
diff --git a/src/form/FieldLayout/FieldLayoutView.tsx b/src/form/FieldLayout/FieldLayoutView.tsx index 760654ab..bcf69b47 100644 --- a/src/form/FieldLayout/FieldLayoutView.tsx +++ b/src/form/FieldLayout/FieldLayoutView.tsx @@ -1,6 +1,5 @@ import * as React from 'react'; import _isEmpty from 'lodash-es/isEmpty'; - import {IFieldLayoutViewProps} from '@steroidsjs/core/ui/form/FieldLayout/FieldLayout'; import {useBem} from '@steroidsjs/core/hooks'; import Icon from '@steroidsjs/core/ui/content/Icon'; @@ -40,10 +39,12 @@ export default function FieldLayoutView(props: IFieldLayoutViewProps) { className={bem.element('icon_error')} tabIndex={-1} /> - {error} diff --git a/src/form/FieldList/FieldListItemView.tsx b/src/form/FieldList/FieldListItemView.tsx index 9309be89..6191c6d7 100644 --- a/src/form/FieldList/FieldListItemView.tsx +++ b/src/form/FieldList/FieldListItemView.tsx @@ -1,5 +1,4 @@ import * as React from 'react'; - import {IFieldListItemViewProps} from '@steroidsjs/core/ui/form/FieldList/FieldList'; import {useBem} from '@steroidsjs/core/hooks'; import {Field} from '@steroidsjs/core/ui/form'; diff --git a/src/form/FileField/FileFieldItemView.tsx b/src/form/FileField/FileFieldItemView.tsx index 80997aa0..faf7f01d 100644 --- a/src/form/FileField/FileFieldItemView.tsx +++ b/src/form/FileField/FileFieldItemView.tsx @@ -1,6 +1,5 @@ import * as React from 'react'; import {useBem} from '@steroidsjs/core/hooks'; - import {FilesLayout, IFileFieldItemViewProps} from '@steroidsjs/core/ui/form/FileField/FileField'; import Icon from '@steroidsjs/core/ui/content/Icon'; diff --git a/src/form/Form/FormView.tsx b/src/form/Form/FormView.tsx index 90f455fe..9fed83b2 100644 --- a/src/form/Form/FormView.tsx +++ b/src/form/Form/FormView.tsx @@ -1,6 +1,5 @@ import * as React from 'react'; import _isString from 'lodash-es/isString'; - import {IFormViewProps} from '@steroidsjs/core/ui/form/Form/Form'; import {useBem} from '@steroidsjs/core/hooks'; import Field from '@steroidsjs/core/ui/form/Field'; diff --git a/src/form/InputField/InputFieldView.tsx b/src/form/InputField/InputFieldView.tsx index c15f37b8..d4181472 100644 --- a/src/form/InputField/InputFieldView.tsx +++ b/src/form/InputField/InputFieldView.tsx @@ -3,7 +3,6 @@ import * as React from 'react'; import {IInputFieldViewProps} from '@steroidsjs/core/ui/form/InputField/InputField'; import {useBem} from '@steroidsjs/core/hooks'; import Icon from '@steroidsjs/core/ui/content/Icon'; - import renderIcon from '../../utils/renderIcon'; export default function InputFieldView(props: IInputFieldViewProps) { @@ -41,11 +40,13 @@ export default function InputFieldView(props: IInputFieldViewProps) { {props.addonBefore} )} - {props.leadIcon && renderIcon(props.leadIcon, + {props.leadIcon && renderIcon( +props.leadIcon, { className: bem.element('lead-icon'), tabIndex: -1, - })} + }, +)} {props.maskOptions ? ( props.renderLoading(), [props]); return props.renderList( -
{props.renderSearchForm()} {props.renderPaginationSize()} diff --git a/src/list/Grid/views/DiagramColumnView/DiagramColumnView.tsx b/src/list/Grid/views/DiagramColumnView/DiagramColumnView.tsx index a1fdf64b..cbf7b8fd 100644 --- a/src/list/Grid/views/DiagramColumnView/DiagramColumnView.tsx +++ b/src/list/Grid/views/DiagramColumnView/DiagramColumnView.tsx @@ -17,7 +17,7 @@ export default function DiagramColumnView(props: IColumnViewProps) { const isVertical = props.diagram?.type === DiagramType.VERTICAL; const isCircle = props.diagram?.type === DiagramType.CIRCLE; - const getItemData = (item: {color: string, percentageAttribute: string,}) => ({ + const getItemData = (item: {color: string, percentageAttribute: string}) => ({ itemPercentage: props.item[item?.percentageAttribute], itemColor: item?.color, }); diff --git a/src/list/List/ListItemView.tsx b/src/list/List/ListItemView.tsx index 866d6053..fbe99072 100644 --- a/src/list/List/ListItemView.tsx +++ b/src/list/List/ListItemView.tsx @@ -1,7 +1,5 @@ import * as React from 'react'; - import {IListItemViewProps} from '@steroidsjs/core/ui/list/List/List'; - import {useBem} from '@steroidsjs/core/hooks'; export default function ListItemView(props: IListItemViewProps) { diff --git a/src/list/List/ListView.tsx b/src/list/List/ListView.tsx index a33f553e..006158e6 100644 --- a/src/list/List/ListView.tsx +++ b/src/list/List/ListView.tsx @@ -1,5 +1,4 @@ import * as React from 'react'; - import {IListViewProps} from '@steroidsjs/core/ui/list/List/List'; import {useBem} from '@steroidsjs/core/hooks'; diff --git a/src/list/Pagination/PaginationButtonView.tsx b/src/list/Pagination/PaginationButtonView.tsx index 71735cae..b08ab258 100644 --- a/src/list/Pagination/PaginationButtonView.tsx +++ b/src/list/Pagination/PaginationButtonView.tsx @@ -1,5 +1,4 @@ import * as React from 'react'; - import {IPaginationViewProps} from '@steroidsjs/core/ui/list/Pagination/Pagination'; import {useBem} from '@steroidsjs/core/hooks'; import {Icon} from '@steroidsjs/core/ui/content'; @@ -8,6 +7,7 @@ const renderArrowStep = ( bem: any, onClick: () => void, iconName: string, + // eslint-disable-next-line default-param-last rotate = false, rounding?: { left?: boolean, @@ -23,10 +23,12 @@ const renderArrowStep = ( })} >