mirror of https://github.com/apache/superset.git
chore: Removes direct theme imports (#19368)
This commit is contained in:
parent
d304849b46
commit
816a2c3e1e
|
@ -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,
|
||||
},
|
||||
},
|
||||
],
|
||||
|
|
|
@ -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 (
|
||||
<ThemeProvider theme={supersetTheme}>
|
||||
<div className="App SqlLab">
|
||||
<QueryAutoRefresh />
|
||||
<TabbedSqlEditors />
|
||||
<ToastContainer />
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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(<RunQueryActionButton {...defaultProps} />);
|
||||
wrapper = mount(<RunQueryActionButton {...defaultProps} />, {
|
||||
wrappingComponent: ThemeProvider,
|
||||
wrappingComponentProps: { theme: supersetTheme },
|
||||
});
|
||||
});
|
||||
|
||||
it('is a valid react element', () => {
|
||||
|
|
|
@ -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 = ({
|
|||
<Icons.CaretDown
|
||||
iconColor={
|
||||
isDisabled
|
||||
? supersetTheme.colors.grayscale.base
|
||||
: supersetTheme.colors.grayscale.light5
|
||||
? theme.colors.grayscale.base
|
||||
: theme.colors.grayscale.light5
|
||||
}
|
||||
name="caret-down"
|
||||
/>
|
||||
|
|
|
@ -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 (
|
||||
<Tooltip
|
||||
id="certified-details-tooltip"
|
||||
|
@ -46,10 +48,7 @@ function CertifiedBadge({
|
|||
</>
|
||||
}
|
||||
>
|
||||
<Icons.Certified
|
||||
iconColor={supersetTheme.colors.primary.base}
|
||||
iconSize={size}
|
||||
/>
|
||||
<Icons.Certified iconColor={theme.colors.primary.base} iconSize={size} />
|
||||
</Tooltip>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -42,7 +42,7 @@ export const StyledIcon = styled(AntdIconComponent)<IconType>`
|
|||
: '24px'};
|
||||
`;
|
||||
|
||||
interface IconProps extends IconType {
|
||||
export interface IconProps extends IconType {
|
||||
fileName: string;
|
||||
}
|
||||
|
||||
|
|
|
@ -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<FilterSetUnitProps> = ({
|
|||
isApplied,
|
||||
onRebuild,
|
||||
}) => {
|
||||
const theme = useTheme();
|
||||
|
||||
const menu = (
|
||||
<Menu>
|
||||
<Menu.Item onClick={onEdit}>{t('Edit')}</Menu.Item>
|
||||
|
@ -105,9 +107,7 @@ const FilterSetUnit: FC<FilterSetUnitProps> = ({
|
|||
</Typography.Text>
|
||||
<IconsBlock>
|
||||
{isApplied && (
|
||||
<CheckOutlined
|
||||
style={{ color: supersetTheme.colors.success.base }}
|
||||
/>
|
||||
<CheckOutlined style={{ color: theme.colors.success.base }} />
|
||||
)}
|
||||
{onDelete && (
|
||||
<AntdDropdown
|
||||
|
|
|
@ -19,7 +19,8 @@
|
|||
import React from 'react';
|
||||
import sinon from 'sinon';
|
||||
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 {
|
||||
DatasourceModal,
|
||||
|
@ -60,8 +61,10 @@ describe('DatasourceControl', () => {
|
|||
...defaultProps,
|
||||
...overrideProps,
|
||||
};
|
||||
return shallow(<DatasourceControl {...props} />, {
|
||||
return mount(<DatasourceControl {...props} />, {
|
||||
context: { store },
|
||||
wrappingComponent: ThemeProvider,
|
||||
wrappingComponentProps: { theme: supersetTheme },
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -80,7 +83,7 @@ describe('DatasourceControl', () => {
|
|||
expect(wrapper.find('[data-test="datasource-menu"]')).toExist();
|
||||
let menuWrapper = shallow(
|
||||
<div>
|
||||
{wrapper.find('[data-test="datasource-menu"]').prop('overlay')}
|
||||
{wrapper.find('[data-test="datasource-menu"]').first().prop('overlay')}
|
||||
</div>,
|
||||
);
|
||||
expect(menuWrapper.find(Menu.Item)).toHaveLength(3);
|
||||
|
@ -91,7 +94,7 @@ describe('DatasourceControl', () => {
|
|||
expect(wrapper.find('[data-test="datasource-menu"]')).toExist();
|
||||
menuWrapper = shallow(
|
||||
<div>
|
||||
{wrapper.find('[data-test="datasource-menu"]').prop('overlay')}
|
||||
{wrapper.find('[data-test="datasource-menu"]').first().prop('overlay')}
|
||||
</div>,
|
||||
);
|
||||
expect(menuWrapper.find(Menu.Item)).toHaveLength(2);
|
||||
|
@ -113,7 +116,7 @@ describe('DatasourceControl', () => {
|
|||
expect(wrapper.find('[data-test="datasource-menu"]')).toExist();
|
||||
menuWrapper = shallow(
|
||||
<div>
|
||||
{wrapper.find('[data-test="datasource-menu"]').prop('overlay')}
|
||||
{wrapper.find('[data-test="datasource-menu"]').first().prop('overlay')}
|
||||
</div>,
|
||||
);
|
||||
expect(menuWrapper.find(Menu.Item)).toHaveLength(2);
|
||||
|
|
|
@ -33,6 +33,7 @@ const createProps = () => ({
|
|||
default: null,
|
||||
description: null,
|
||||
value: '25__table',
|
||||
form_data: {},
|
||||
datasource: {
|
||||
id: 25,
|
||||
database: {
|
||||
|
|
|
@ -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 && (
|
||||
<Tooltip title={healthCheckMessage}>
|
||||
<Icons.AlertSolid iconColor={supersetTheme.colors.warning.base} />
|
||||
<Icons.AlertSolid iconColor={theme.colors.warning.base} />
|
||||
</Tooltip>
|
||||
)}
|
||||
{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);
|
||||
|
|
|
@ -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:
|
||||
|
|
Loading…
Reference in New Issue