iop
/
superset
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore: Removes direct theme imports (#19368)

This commit is contained in:
Michael S. Molina 2022-03-29 10:15:07 -03:00 committed by GitHub
parent d304849b46
commit 816a2c3e1e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
11 changed files with 42 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
superset-frontend/.eslintrc.js
View File

@ -181,7 +181,6 @@ module.exports = {
], ],
'no-only-tests/no-only-tests': 'error', 'no-only-tests/no-only-tests': 'error',
'max-classes-per-file': 0, 'max-classes-per-file': 0,
'theme-colors/no-literal-colors': 0,
}, },
}, },
{ {
@ -198,6 +197,7 @@ module.exports = {
], ],
rules: { rules: {
'theme-colors/no-literal-colors': 0, 'theme-colors/no-literal-colors': 0,
'no-restricted-imports': 0,
}, },
}, },
], ],

14
superset-frontend/src/SqlLab/components/App/index.jsx
View File

@ -20,7 +20,7 @@ import React from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { bindActionCreators } from 'redux'; import { bindActionCreators } from 'redux';
import { connect } from 'react-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 throttle from 'lodash/throttle';
import ToastContainer from 'src/components/MessageToasts/ToastContainer'; import ToastContainer from 'src/components/MessageToasts/ToastContainer';
import { import {
@ -98,13 +98,11 @@ class App extends React.PureComponent {
return window.location.replace('/superset/sqllab/history/'); return window.location.replace('/superset/sqllab/history/');
} }
return ( return (
<ThemeProvider theme={supersetTheme}> <div className="App SqlLab">
<div className="App SqlLab"> <QueryAutoRefresh />
<QueryAutoRefresh /> <TabbedSqlEditors />
<TabbedSqlEditors /> <ToastContainer />
<ToastContainer /> </div>
</div>
</ThemeProvider>
); );
} }
} }

9
superset-frontend/src/SqlLab/components/RunQueryActionButton/RunQueryActionButton.test.jsx
View File

@ -17,8 +17,8 @@
* under the License. * under the License.
*/ */
import React from 'react'; 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 RunQueryActionButton from 'src/SqlLab/components/RunQueryActionButton';
import Button from 'src/components/Button'; import Button from 'src/components/Button';
@ -35,7 +35,10 @@ describe('RunQueryActionButton', () => {
}; };
beforeEach(() => { beforeEach(() => {
wrapper = shallow(<RunQueryActionButton {...defaultProps} />); wrapper = mount(<RunQueryActionButton {...defaultProps} />, {
wrappingComponent: ThemeProvider,
wrappingComponentProps: { theme: supersetTheme },
});
}); });
it('is a valid react element', () => { it('is a valid react element', () => {

8
superset-frontend/src/SqlLab/components/RunQueryActionButton/index.tsx
View File

@ -17,7 +17,7 @@
* under the License. * under the License.
*/ */
import React from 'react'; 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 { Menu } from 'src/components/Menu';
import Button, { ButtonProps } from 'src/components/Button'; import Button, { ButtonProps } from 'src/components/Button';
@ -93,6 +93,8 @@ const RunQueryActionButton = ({
runQuery, runQuery,
stopQuery, stopQuery,
}: Props) => { }: Props) => {
const theme = useTheme();
const shouldShowStopBtn = const shouldShowStopBtn =
!!queryState && ['running', 'pending'].indexOf(queryState) > -1; !!queryState && ['running', 'pending'].indexOf(queryState) > -1;
@ -123,8 +125,8 @@ const RunQueryActionButton = ({
<Icons.CaretDown <Icons.CaretDown
iconColor={ iconColor={
isDisabled isDisabled
? supersetTheme.colors.grayscale.base ? theme.colors.grayscale.base
: supersetTheme.colors.grayscale.light5 : theme.colors.grayscale.light5
} }
name="caret-down" name="caret-down"
/> />

9
superset-frontend/src/components/CertifiedBadge/index.tsx
View File

@ -17,7 +17,7 @@
* under the License. * under the License.
*/ */
import React from 'react'; 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 Icons, { IconType } from 'src/components/Icons';
import { Tooltip } from 'src/components/Tooltip'; import { Tooltip } from 'src/components/Tooltip';
@ -32,6 +32,8 @@ function CertifiedBadge({
details, details,
size = 'l', size = 'l',
}: CertifiedBadgeProps) { }: CertifiedBadgeProps) {
const theme = useTheme();
return ( return (
<Tooltip <Tooltip
id="certified-details-tooltip" id="certified-details-tooltip"
@ -46,10 +48,7 @@ function CertifiedBadge({
</> </>
} }
> >
<Icons.Certified <Icons.Certified iconColor={theme.colors.primary.base} iconSize={size} />
iconColor={supersetTheme.colors.primary.base}
iconSize={size}
/>
</Tooltip> </Tooltip>
); );
} }

2
superset-frontend/src/components/Icons/Icon.tsx
View File

@ -42,7 +42,7 @@ export const StyledIcon = styled(AntdIconComponent)<IconType>`
: '24px'}; : '24px'};
`; `;
interface IconProps extends IconType { export interface IconProps extends IconType {
fileName: string; fileName: string;
} }

8
superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterSets/FilterSetUnit.tsx
View File

@ -24,7 +24,7 @@ import {
FilterSet, FilterSet,
HandlerFunction, HandlerFunction,
styled, styled,
supersetTheme, useTheme,
t, t,
} from '@superset-ui/core'; } from '@superset-ui/core';
import { CheckOutlined, EllipsisOutlined } from '@ant-design/icons'; import { CheckOutlined, EllipsisOutlined } from '@ant-design/icons';
@ -76,6 +76,8 @@ const FilterSetUnit: FC<FilterSetUnitProps> = ({
isApplied, isApplied,
onRebuild, onRebuild,
}) => { }) => {
const theme = useTheme();
const menu = ( const menu = (
<Menu> <Menu>
<Menu.Item onClick={onEdit}>{t('Edit')}</Menu.Item> <Menu.Item onClick={onEdit}>{t('Edit')}</Menu.Item>
@ -105,9 +107,7 @@ const FilterSetUnit: FC<FilterSetUnitProps> = ({
</Typography.Text> </Typography.Text>
<IconsBlock> <IconsBlock>
{isApplied && ( {isApplied && (
<CheckOutlined <CheckOutlined style={{ color: theme.colors.success.base }} />
style={{ color: supersetTheme.colors.success.base }}
/>
)} )}
{onDelete && ( {onDelete && (
<AntdDropdown <AntdDropdown

13
superset-frontend/src/explore/components/controls/DatasourceControl/DatasourceControl.test.jsx
View File

@ -19,7 +19,8 @@
import React from 'react'; import React from 'react';
import sinon from 'sinon'; import sinon from 'sinon';
import configureStore from 'redux-mock-store'; import configureStore from 'redux-mock-store';
import { shallow } from 'enzyme'; import { mount, shallow } from 'enzyme';
import { supersetTheme, ThemeProvider } from '@superset-ui/core';
import { Menu } from 'src/components/Menu'; import { Menu } from 'src/components/Menu';
import { import {
DatasourceModal, DatasourceModal,
@ -60,8 +61,10 @@ describe('DatasourceControl', () => {
...defaultProps, ...defaultProps,
...overrideProps, ...overrideProps,
}; };
return shallow(<DatasourceControl {...props} />, { return mount(<DatasourceControl {...props} />, {
context: { store }, context: { store },
wrappingComponent: ThemeProvider,
wrappingComponentProps: { theme: supersetTheme },
}); });
} }
@ -80,7 +83,7 @@ describe('DatasourceControl', () => {
expect(wrapper.find('[data-test="datasource-menu"]')).toExist(); expect(wrapper.find('[data-test="datasource-menu"]')).toExist();
let menuWrapper = shallow( let menuWrapper = shallow(
<div> <div>
{wrapper.find('[data-test="datasource-menu"]').prop('overlay')} {wrapper.find('[data-test="datasource-menu"]').first().prop('overlay')}
</div>, </div>,
); );
expect(menuWrapper.find(Menu.Item)).toHaveLength(3); expect(menuWrapper.find(Menu.Item)).toHaveLength(3);
@ -91,7 +94,7 @@ describe('DatasourceControl', () => {
expect(wrapper.find('[data-test="datasource-menu"]')).toExist(); expect(wrapper.find('[data-test="datasource-menu"]')).toExist();
menuWrapper = shallow( menuWrapper = shallow(
<div> <div>
{wrapper.find('[data-test="datasource-menu"]').prop('overlay')} {wrapper.find('[data-test="datasource-menu"]').first().prop('overlay')}
</div>, </div>,
); );
expect(menuWrapper.find(Menu.Item)).toHaveLength(2); expect(menuWrapper.find(Menu.Item)).toHaveLength(2);
@ -113,7 +116,7 @@ describe('DatasourceControl', () => {
expect(wrapper.find('[data-test="datasource-menu"]')).toExist(); expect(wrapper.find('[data-test="datasource-menu"]')).toExist();
menuWrapper = shallow( menuWrapper = shallow(
<div> <div>
{wrapper.find('[data-test="datasource-menu"]').prop('overlay')} {wrapper.find('[data-test="datasource-menu"]').first().prop('overlay')}
</div>, </div>,
); );
expect(menuWrapper.find(Menu.Item)).toHaveLength(2); expect(menuWrapper.find(Menu.Item)).toHaveLength(2);

1
superset-frontend/src/explore/components/controls/DatasourceControl/DatasourceControl.test.tsx
View File

@ -33,6 +33,7 @@ const createProps = () => ({
default: null, default: null,
description: null, description: null,
value: '25__table', value: '25__table',
form_data: {},
datasource: { datasource: {
id: 25, id: 25,
database: { database: {

8
superset-frontend/src/explore/components/controls/DatasourceControl/index.jsx
View File

@ -19,7 +19,7 @@
*/ */
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types'; 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 { getUrlParam } from 'src/utils/urlUtils';
import { AntdDropdown } from 'src/components'; import { AntdDropdown } from 'src/components';
@ -183,7 +183,7 @@ class DatasourceControl extends React.PureComponent {
render() { render() {
const { showChangeDatasourceModal, showEditDatasourceModal } = this.state; const { showChangeDatasourceModal, showEditDatasourceModal } = this.state;
const { datasource, onChange } = this.props; const { datasource, onChange, theme } = this.props;
const isMissingDatasource = datasource.id == null; const isMissingDatasource = datasource.id == null;
let isMissingParams = false; let isMissingParams = false;
if (isMissingDatasource) { if (isMissingDatasource) {
@ -235,7 +235,7 @@ class DatasourceControl extends React.PureComponent {
)} )}
{healthCheckMessage && ( {healthCheckMessage && (
<Tooltip title={healthCheckMessage}> <Tooltip title={healthCheckMessage}>
<Icons.AlertSolid iconColor={supersetTheme.colors.warning.base} /> <Icons.AlertSolid iconColor={theme.colors.warning.base} />
</Tooltip> </Tooltip>
)} )}
{extra?.warning_markdown && ( {extra?.warning_markdown && (
@ -325,4 +325,4 @@ class DatasourceControl extends React.PureComponent {
DatasourceControl.propTypes = propTypes; DatasourceControl.propTypes = propTypes;
DatasourceControl.defaultProps = defaultProps; DatasourceControl.defaultProps = defaultProps;
export default DatasourceControl; export default withTheme(DatasourceControl);

4
superset-frontend/src/views/CRUD/alert/components/AlertStatusIcon.tsx
View File

@ -16,7 +16,7 @@
* specific language governing permissions and limitations * specific language governing permissions and limitations
* under the License. * under the License.
*/ */
import { t, supersetTheme, useTheme } from '@superset-ui/core'; import { t, SupersetTheme, useTheme } from '@superset-ui/core';
import React from 'react'; import React from 'react';
import { Tooltip } from 'src/components/Tooltip'; import { Tooltip } from 'src/components/Tooltip';
import Icons from 'src/components/Icons'; import Icons from 'src/components/Icons';
@ -25,7 +25,7 @@ import { AlertState } from '../types';
function getStatusColor( function getStatusColor(
status: string, status: string,
isReportEnabled: boolean, isReportEnabled: boolean,
theme: typeof supersetTheme, theme: SupersetTheme,
) { ) {
switch (status) { switch (status) {
case AlertState.Working: case AlertState.Working: