From 0eeb6373742f372894e58323b5ca0d08290230e4 Mon Sep 17 00:00:00 2001 From: Kamil Gabryjelski Date: Fri, 15 Nov 2024 18:30:28 +0100 Subject: [PATCH] Fix lint --- .../components/gridComponents/Chart.jsx | 28 ++++++++----------- .../components/gridComponents/Tab.jsx | 13 +++------ .../components/gridComponents/Tabs.jsx | 24 ++++++---------- .../containers/DashboardComponent.jsx | 12 +++----- .../src/dashboard/util/charts/useChartIds.ts | 7 ++--- .../util/useFilterFocusHighlightStyles.ts | 2 +- 6 files changed, 31 insertions(+), 55 deletions(-) diff --git a/superset-frontend/src/dashboard/components/gridComponents/Chart.jsx b/superset-frontend/src/dashboard/components/gridComponents/Chart.jsx index fdc6af0b1e8a8..243f42b5d6043 100644 --- a/superset-frontend/src/dashboard/components/gridComponents/Chart.jsx +++ b/superset-frontend/src/dashboard/components/gridComponents/Chart.jsx @@ -20,8 +20,10 @@ import cx from 'classnames'; import { useCallback, useEffect, useRef, useMemo, useState, memo } from 'react'; import PropTypes from 'prop-types'; import { styled, t, logging } from '@superset-ui/core'; -import { debounce, isEqual } from 'lodash'; -import { useHistory, withRouter } from 'react-router-dom'; +import { debounce } from 'lodash'; +import { useHistory } from 'react-router-dom'; +import { bindActionCreators } from 'redux'; +import { useDispatch, useSelector } from 'react-redux'; import { exportChart, mountExploreUrl } from 'src/explore/exploreUtils'; import ChartContainer from 'src/components/Chart/ChartContainer'; @@ -32,16 +34,11 @@ import { LOG_ACTIONS_EXPORT_XLSX_DASHBOARD_CHART, LOG_ACTIONS_FORCE_REFRESH_CHART, } from 'src/logger/LogUtils'; -import { areObjectsEqual } from 'src/reduxUtils'; import { postFormData } from 'src/explore/exploreUtils/formData'; import { URL_PARAMS } from 'src/constants'; import SliceHeader from '../SliceHeader'; import MissingChart from '../MissingChart'; -import { slicePropShape, chartPropShape } from '../../util/propShapes'; -import { useDispatch, useSelector } from 'react-redux'; -import { bindActionCreators } from 'redux'; -import { updateComponents } from '../../actions/dashboardLayout'; import { addDangerToast, addSuccessToast, @@ -76,10 +73,6 @@ const propTypes = { // we use state + shouldComponentUpdate() logic to prevent perf-wrecking // resizing across all slices on a dashboard on every update const RESIZE_TIMEOUT = 500; -const SHOULD_UPDATE_ON_PROP_CHANGES = Object.keys(propTypes).filter( - prop => - prop !== 'width' && prop !== 'height' && prop !== 'isComponentVisible', -); const DEFAULT_HEADER_HEIGHT = 22; const ChartWrapper = styled.div` @@ -106,7 +99,7 @@ const SliceContainer = styled.div` const EMPTY_OBJECT = {}; -export const Chart = props => { +const Chart = props => { const dispatch = useDispatch(); const descriptionRef = useRef(null); const headerRef = useRef(null); @@ -194,11 +187,12 @@ export const Chart = props => { } }, [isExpanded]); - useEffect(() => { - return () => { + useEffect( + () => () => { resize.cancel(); - }; - }, []); + }, + [], + ); useEffect(() => { resize(); @@ -494,7 +488,7 @@ export const Chart = props => { dropProps.dropIndicatorProps &&
; -export const Tab = props => { +const Tab = props => { const dispatch = useDispatch(); const canEdit = useSelector(state => state.dashboardInfo.dash_edit_perm); const handleChangeTab = useCallback( @@ -157,9 +154,7 @@ export const Tab = props => { [props.handleComponentDrop], ); - const shouldDropToChild = useCallback(item => { - return item.type !== TAB_TYPE; - }, []); + const shouldDropToChild = useCallback(item => item.type !== TAB_TYPE, []); const renderTabContent = useCallback(() => { const { diff --git a/superset-frontend/src/dashboard/components/gridComponents/Tabs.jsx b/superset-frontend/src/dashboard/components/gridComponents/Tabs.jsx index 4b2fdeb9ffc1d..bbf88d6d5afb5 100644 --- a/superset-frontend/src/dashboard/components/gridComponents/Tabs.jsx +++ b/superset-frontend/src/dashboard/components/gridComponents/Tabs.jsx @@ -16,16 +16,10 @@ * specific language governing permissions and limitations * under the License. */ -import { - PureComponent, - useCallback, - useEffect, - useMemo, - useState, -} from 'react'; +import { useCallback, useEffect, useMemo, useState } from 'react'; import PropTypes from 'prop-types'; import { styled, t, usePrevious } from '@superset-ui/core'; -import { connect, useSelector } from 'react-redux'; +import { useSelector } from 'react-redux'; import { LineEditableTabs } from 'src/components/Tabs'; import Icons from 'src/components/Icons'; import { LOG_ACTIONS_SELECT_DASHBOARD_TAB } from 'src/logger/LogUtils'; @@ -145,12 +139,12 @@ export const Tabs = props => { 0, findTabIndexByComponentId({ currentComponent: props.component, - directPathToChild: props.directPathToChild, + directPathToChild, }), ); if (tabIndex === 0 && activeTabs?.length) { props.component.children.forEach((tabId, index) => { - if (tabIndex === 0 && props.activeTabs?.includes(tabId)) { + if (tabIndex === 0 && activeTabs?.includes(tabId)) { tabIndex = index; } }); @@ -162,7 +156,7 @@ export const Tabs = props => { tabIndex, activeKey, }; - }, [activeTabs?.length, props.component, props.directPathToChild]); + }, [activeTabs?.length, props.component, directPathToChild]); const [activeKey, setActiveKey] = useState(initActiveKey); const [selectedTabIndex, setSelectedTabIndex] = useState(initTabIndex); @@ -171,7 +165,7 @@ export const Tabs = props => { const [draggingTabId, setDraggingTabId] = useState(null); const prevActiveKey = usePrevious(activeKey); const prevDashboardId = usePrevious(props.dashboardId); - const prevDirectPathToChild = usePrevious(props.directPathToChild); + const prevDirectPathToChild = usePrevious(directPathToChild); const prevTabIds = usePrevious(props.component.children); useEffect(() => { @@ -201,7 +195,7 @@ export const Tabs = props => { if (props.isComponentVisible) { const nextFocusComponent = getLeafComponentIdFromPath( - props.directPathToChild, + directPathToChild, ); const currentFocusComponent = getLeafComponentIdFromPath( prevDirectPathToChild, @@ -217,7 +211,7 @@ export const Tabs = props => { ) { const nextTabIndex = findTabIndexByComponentId({ currentComponent: props.component, - directPathToChild: props.directPathToChild, + directPathToChild, }); // make sure nextFocusComponent is under this tabs component @@ -229,7 +223,7 @@ export const Tabs = props => { } }, [ props.component, - props.directPathToChild, + directPathToChild, props.isComponentVisible, selectedTabIndex, prevDirectPathToChild, diff --git a/superset-frontend/src/dashboard/containers/DashboardComponent.jsx b/superset-frontend/src/dashboard/containers/DashboardComponent.jsx index 3b956c1367be1..a08641b4aefb5 100644 --- a/superset-frontend/src/dashboard/containers/DashboardComponent.jsx +++ b/superset-frontend/src/dashboard/containers/DashboardComponent.jsx @@ -19,7 +19,7 @@ import { useCallback, memo, useMemo } from 'react'; import PropTypes from 'prop-types'; import { bindActionCreators } from 'redux'; -import { connect, useSelector, useDispatch } from 'react-redux'; +import { useSelector, useDispatch } from 'react-redux'; import { logEvent } from 'src/logger/actions'; import { addDangerToast } from 'src/components/MessageToasts/actions'; import { componentLookup } from 'src/dashboard/components/gridComponents'; @@ -60,12 +60,7 @@ const propTypes = { isComponentVisible: PropTypes.bool, }; -const DashboardComponent = ({ - id, - parentId, - isComponentVisible = true, - ...rest -}) => { +const DashboardComponent = ({ id, parentId, ...rest }) => { const dispatch = useDispatch(); const dashboardLayout = useSelector(state => state.dashboardLayout.present); const dashboardInfo = useSelector(state => state.dashboardInfo); @@ -112,8 +107,9 @@ const DashboardComponent = ({ components: dashboardLayout, }); - if (componentType === ROW_TYPE) + if (componentType === ROW_TYPE) { return { occupiedColumnCount: occupiedWidth }; + } if (componentType === COLUMN_TYPE) { return { minColumnWidth: minimumWidth }; } diff --git a/superset-frontend/src/dashboard/util/charts/useChartIds.ts b/superset-frontend/src/dashboard/util/charts/useChartIds.ts index 2b0b7d9eea32b..9afc16d9f4e75 100644 --- a/superset-frontend/src/dashboard/util/charts/useChartIds.ts +++ b/superset-frontend/src/dashboard/util/charts/useChartIds.ts @@ -19,8 +19,5 @@ import { useSelector } from 'react-redux'; import { RootState } from 'src/dashboard/types'; -export const useChartIds = () => { - return useSelector( - state => state.dashboardState.sliceIds, - ); -}; +export const useChartIds = () => + useSelector(state => state.dashboardState.sliceIds); diff --git a/superset-frontend/src/dashboard/util/useFilterFocusHighlightStyles.ts b/superset-frontend/src/dashboard/util/useFilterFocusHighlightStyles.ts index 1e2f17587a867..3dea0d54ac138 100644 --- a/superset-frontend/src/dashboard/util/useFilterFocusHighlightStyles.ts +++ b/superset-frontend/src/dashboard/util/useFilterFocusHighlightStyles.ts @@ -16,12 +16,12 @@ * specific language governing permissions and limitations * under the License. */ +import { useMemo } from 'react'; import { Filter, useTheme } from '@superset-ui/core'; import { useSelector } from 'react-redux'; import { RootState } from 'src/dashboard/types'; import { getRelatedCharts } from './getRelatedCharts'; -import { useMemo } from 'react'; const unfocusedChartStyles = { opacity: 0.3, pointerEvents: 'none' }; const EMPTY = {};