diff --git a/superset-frontend/.eslintrc.js b/superset-frontend/.eslintrc.js index 1ba0436c283c7..8decc32ee7dc8 100644 --- a/superset-frontend/.eslintrc.js +++ b/superset-frontend/.eslintrc.js @@ -181,7 +181,6 @@ module.exports = { ], 'no-only-tests/no-only-tests': 'error', 'max-classes-per-file': 0, - 'theme-colors/no-literal-colors': 0, }, }, { @@ -198,6 +197,7 @@ module.exports = { ], rules: { 'theme-colors/no-literal-colors': 0, + 'no-restricted-imports': 0, }, }, ], diff --git a/superset-frontend/src/SqlLab/components/App/index.jsx b/superset-frontend/src/SqlLab/components/App/index.jsx index c98ff12e87017..8a0ade9509ac6 100644 --- a/superset-frontend/src/SqlLab/components/App/index.jsx +++ b/superset-frontend/src/SqlLab/components/App/index.jsx @@ -20,7 +20,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { bindActionCreators } from 'redux'; import { connect } from 'react-redux'; -import { t, supersetTheme, ThemeProvider } from '@superset-ui/core'; +import { t } from '@superset-ui/core'; import throttle from 'lodash/throttle'; import ToastContainer from 'src/components/MessageToasts/ToastContainer'; import { @@ -98,13 +98,11 @@ class App extends React.PureComponent { return window.location.replace('/superset/sqllab/history/'); } return ( - -
- - - -
- +
+ + + +
); } } diff --git a/superset-frontend/src/SqlLab/components/RunQueryActionButton/RunQueryActionButton.test.jsx b/superset-frontend/src/SqlLab/components/RunQueryActionButton/RunQueryActionButton.test.jsx index 198759c69ecb6..823f10741ac09 100644 --- a/superset-frontend/src/SqlLab/components/RunQueryActionButton/RunQueryActionButton.test.jsx +++ b/superset-frontend/src/SqlLab/components/RunQueryActionButton/RunQueryActionButton.test.jsx @@ -17,8 +17,8 @@ * under the License. */ import React from 'react'; -import { shallow } from 'enzyme'; - +import { mount } from 'enzyme'; +import { supersetTheme, ThemeProvider } from '@superset-ui/core'; import RunQueryActionButton from 'src/SqlLab/components/RunQueryActionButton'; import Button from 'src/components/Button'; @@ -35,7 +35,10 @@ describe('RunQueryActionButton', () => { }; beforeEach(() => { - wrapper = shallow(); + wrapper = mount(, { + wrappingComponent: ThemeProvider, + wrappingComponentProps: { theme: supersetTheme }, + }); }); it('is a valid react element', () => { diff --git a/superset-frontend/src/SqlLab/components/RunQueryActionButton/index.tsx b/superset-frontend/src/SqlLab/components/RunQueryActionButton/index.tsx index 398ec3011008d..2a9e0fbaf8d8b 100644 --- a/superset-frontend/src/SqlLab/components/RunQueryActionButton/index.tsx +++ b/superset-frontend/src/SqlLab/components/RunQueryActionButton/index.tsx @@ -17,7 +17,7 @@ * under the License. */ import React from 'react'; -import { t, styled, supersetTheme } from '@superset-ui/core'; +import { t, styled, useTheme } from '@superset-ui/core'; import { Menu } from 'src/components/Menu'; import Button, { ButtonProps } from 'src/components/Button'; @@ -93,6 +93,8 @@ const RunQueryActionButton = ({ runQuery, stopQuery, }: Props) => { + const theme = useTheme(); + const shouldShowStopBtn = !!queryState && ['running', 'pending'].indexOf(queryState) > -1; @@ -123,8 +125,8 @@ const RunQueryActionButton = ({ diff --git a/superset-frontend/src/components/CertifiedBadge/index.tsx b/superset-frontend/src/components/CertifiedBadge/index.tsx index 6ad82fb1c83a8..80581e6320d70 100644 --- a/superset-frontend/src/components/CertifiedBadge/index.tsx +++ b/superset-frontend/src/components/CertifiedBadge/index.tsx @@ -17,7 +17,7 @@ * under the License. */ import React from 'react'; -import { t, supersetTheme } from '@superset-ui/core'; +import { t, useTheme } from '@superset-ui/core'; import Icons, { IconType } from 'src/components/Icons'; import { Tooltip } from 'src/components/Tooltip'; @@ -32,6 +32,8 @@ function CertifiedBadge({ details, size = 'l', }: CertifiedBadgeProps) { + const theme = useTheme(); + return ( } > - + ); } diff --git a/superset-frontend/src/components/Icons/Icon.tsx b/superset-frontend/src/components/Icons/Icon.tsx index d45943502dbd5..7d698d0d542a8 100644 --- a/superset-frontend/src/components/Icons/Icon.tsx +++ b/superset-frontend/src/components/Icons/Icon.tsx @@ -42,7 +42,7 @@ export const StyledIcon = styled(AntdIconComponent)` : '24px'}; `; -interface IconProps extends IconType { +export interface IconProps extends IconType { fileName: string; } diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FilterSetUnit.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FilterSetUnit.tsx index 2c21dc6afe01f..53ea1c94c5289 100644 --- a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FilterSetUnit.tsx +++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FilterSetUnit.tsx @@ -24,7 +24,7 @@ import { FilterSet, HandlerFunction, styled, - supersetTheme, + useTheme, t, } from '@superset-ui/core'; import { CheckOutlined, EllipsisOutlined } from '@ant-design/icons'; @@ -76,6 +76,8 @@ const FilterSetUnit: FC = ({ isApplied, onRebuild, }) => { + const theme = useTheme(); + const menu = ( {t('Edit')} @@ -105,9 +107,7 @@ const FilterSetUnit: FC = ({ {isApplied && ( - + )} {onDelete && ( { ...defaultProps, ...overrideProps, }; - return shallow(, { + return mount(, { context: { store }, + wrappingComponent: ThemeProvider, + wrappingComponentProps: { theme: supersetTheme }, }); } @@ -80,7 +83,7 @@ describe('DatasourceControl', () => { expect(wrapper.find('[data-test="datasource-menu"]')).toExist(); let menuWrapper = shallow(
- {wrapper.find('[data-test="datasource-menu"]').prop('overlay')} + {wrapper.find('[data-test="datasource-menu"]').first().prop('overlay')}
, ); expect(menuWrapper.find(Menu.Item)).toHaveLength(3); @@ -91,7 +94,7 @@ describe('DatasourceControl', () => { expect(wrapper.find('[data-test="datasource-menu"]')).toExist(); menuWrapper = shallow(
- {wrapper.find('[data-test="datasource-menu"]').prop('overlay')} + {wrapper.find('[data-test="datasource-menu"]').first().prop('overlay')}
, ); expect(menuWrapper.find(Menu.Item)).toHaveLength(2); @@ -113,7 +116,7 @@ describe('DatasourceControl', () => { expect(wrapper.find('[data-test="datasource-menu"]')).toExist(); menuWrapper = shallow(
- {wrapper.find('[data-test="datasource-menu"]').prop('overlay')} + {wrapper.find('[data-test="datasource-menu"]').first().prop('overlay')}
, ); expect(menuWrapper.find(Menu.Item)).toHaveLength(2); diff --git a/superset-frontend/src/explore/components/controls/DatasourceControl/DatasourceControl.test.tsx b/superset-frontend/src/explore/components/controls/DatasourceControl/DatasourceControl.test.tsx index 43ac29b2c7a05..f4f66ef43ead8 100644 --- a/superset-frontend/src/explore/components/controls/DatasourceControl/DatasourceControl.test.tsx +++ b/superset-frontend/src/explore/components/controls/DatasourceControl/DatasourceControl.test.tsx @@ -33,6 +33,7 @@ const createProps = () => ({ default: null, description: null, value: '25__table', + form_data: {}, datasource: { id: 25, database: { diff --git a/superset-frontend/src/explore/components/controls/DatasourceControl/index.jsx b/superset-frontend/src/explore/components/controls/DatasourceControl/index.jsx index 35004e43cbf0a..f7cda8b752504 100644 --- a/superset-frontend/src/explore/components/controls/DatasourceControl/index.jsx +++ b/superset-frontend/src/explore/components/controls/DatasourceControl/index.jsx @@ -19,7 +19,7 @@ */ import React from 'react'; import PropTypes from 'prop-types'; -import { t, styled, supersetTheme } from '@superset-ui/core'; +import { t, styled, withTheme } from '@superset-ui/core'; import { getUrlParam } from 'src/utils/urlUtils'; import { AntdDropdown } from 'src/components'; @@ -183,7 +183,7 @@ class DatasourceControl extends React.PureComponent { render() { const { showChangeDatasourceModal, showEditDatasourceModal } = this.state; - const { datasource, onChange } = this.props; + const { datasource, onChange, theme } = this.props; const isMissingDatasource = datasource.id == null; let isMissingParams = false; if (isMissingDatasource) { @@ -235,7 +235,7 @@ class DatasourceControl extends React.PureComponent { )} {healthCheckMessage && ( - + )} {extra?.warning_markdown && ( @@ -325,4 +325,4 @@ class DatasourceControl extends React.PureComponent { DatasourceControl.propTypes = propTypes; DatasourceControl.defaultProps = defaultProps; -export default DatasourceControl; +export default withTheme(DatasourceControl); diff --git a/superset-frontend/src/views/CRUD/alert/components/AlertStatusIcon.tsx b/superset-frontend/src/views/CRUD/alert/components/AlertStatusIcon.tsx index 048a12f35e5e5..dca3563b63fbe 100644 --- a/superset-frontend/src/views/CRUD/alert/components/AlertStatusIcon.tsx +++ b/superset-frontend/src/views/CRUD/alert/components/AlertStatusIcon.tsx @@ -16,7 +16,7 @@ * specific language governing permissions and limitations * under the License. */ -import { t, supersetTheme, useTheme } from '@superset-ui/core'; +import { t, SupersetTheme, useTheme } from '@superset-ui/core'; import React from 'react'; import { Tooltip } from 'src/components/Tooltip'; import Icons from 'src/components/Icons'; @@ -25,7 +25,7 @@ import { AlertState } from '../types'; function getStatusColor( status: string, isReportEnabled: boolean, - theme: typeof supersetTheme, + theme: SupersetTheme, ) { switch (status) { case AlertState.Working: