QT/superset2
1
0
Fork 0
mirror of https://github.com/apache/superset.git synced 2026-05-12 19:35:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

Migrates Button component from Bootstrap to AntD (#12832)

Browse Source
This commit is contained in:
Michael S. Molina
2021-02-01 20:13:10 -03:00
committed by GitHub
parent 51195af4fa
commit c781ab8adf
33 changed files with 605 additions and 558 deletions
Download Patch File Download Diff File Expand all files Collapse all files

90
superset-frontend/src/explore/components/QueryAndSaveBtns.jsx
View File

@@ -18,8 +18,8 @@
*/
import React from 'react';
import PropTypes from 'prop-types';
import { ButtonGroup } from 'react-bootstrap';
import { t, styled } from '@superset-ui/core';
import ButtonGroup from 'src/components/ButtonGroup';
import { t, useTheme } from '@superset-ui/core';
import { Tooltip } from 'src/common/components/Tooltip';
import Button from 'src/components/Button';
@@ -39,20 +39,6 @@ const defaultProps = {
onSave: () => {},
};
const Styles = styled.div`
display: flex;
flex-shrink: 0;
flex-direction: row;
align-items: center;
padding: ${({ theme }) => 2 * theme.gridUnit}px
${({ theme }) => 2 * theme.gridUnit}px 0
${({ theme }) => 4 * theme.gridUnit}px;
.btn {
/* just to make sure buttons don't jiggle */
width: 100px;
}
`;
export default function QueryAndSaveBtns({
canAdd,
onQuery,
@@ -91,37 +77,51 @@ export default function QueryAndSaveBtns({
</Button>
);
const theme = useTheme();
return (
<Styles>
<div>
<ButtonGroup className="query-and-save">
{qryOrStopButton}
<Button
buttonStyle="tertiary"
buttonSize="small"
data-target="#save_modal"
data-toggle="modal"
disabled={saveButtonDisabled}
onClick={onSave}
data-test="query-save-button"
<div
css={{
display: 'flex',
flexShrink: 0,
flexDirection: 'row',
alignItems: 'center',
paddingTop: theme.gridUnit * 2,
paddingRight: theme.gridUnit * 2,
paddingBottom: 0,
paddingLeft: theme.gridUnit * 4,
'& button': {
width: 100,
},
}}
>
<ButtonGroup className="query-and-save">
{qryOrStopButton}
<Button
buttonStyle="tertiary"
buttonSize="small"
data-target="#save_modal"
data-toggle="modal"
disabled={saveButtonDisabled}
onClick={onSave}
data-test="query-save-button"
>
<i className="fa fa-plus-circle" /> {t('Save')}
</Button>
</ButtonGroup>
{errorMessage && (
<span>
{' '}
<Tooltip
id="query-error-tooltip"
placement="right"
title={errorMessage}
>
<i className="fa fa-plus-circle" /> {t('Save')}
</Button>
</ButtonGroup>
{errorMessage && (
<span>
{' '}
<Tooltip
id="query-error-tooltip"
placement="right"
title={errorMessage}
>
<i className="fa fa-exclamation-circle text-danger fa-lg" />
</Tooltip>
</span>
)}
</div>
</Styles>
<i className="fa fa-exclamation-circle text-danger fa-lg" />
</Tooltip>
</span>
)}
</div>
);
}