fix: Change Datasource styling fixes (#12165)

This commit is contained in:
Hugh A. Miles II 2021-01-04 14:51:15 -05:00 committed by GitHub
parent 164db3e5a1
commit 7d88e6b891
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 27 additions and 26 deletions

View File

@ -36,7 +36,12 @@ import Loading from '../components/Loading';
import withToasts from '../messageToasts/enhancers/withToasts';
const CONFIRM_WARNING_MESSAGE = t(
'Warning! Changing the dataset may break the chart if the metadata (columns/metrics) does not exist in the target dataset',
'Warning! Changing the dataset may break the chart if the metadata does not exist.',
);
const CHANGE_WARNING_MSG = t(
'Changing the dataset may break the chart if the chart relies ' +
'on columns or metadata that does not exist in the target dataset',
);
interface Datasource {
@ -83,11 +88,6 @@ const TABLE_COLUMNS = [
'creator',
].map(col => ({ accessor: col, Header: col }));
const CHANGE_WARNING_MSG = t(
'Changing the dataset may break the chart if the chart relies ' +
'on columns or metadata that does not exist in the target dataset',
);
const emptyRequest = {
pageIndex: 0,
pageSize: 20,
@ -186,7 +186,7 @@ const ChangeDatasourceModal: FunctionComponent<ChangeDatasourceModalProps> = ({
);
});
onHide();
addSuccessToast('Successfully changed datasource!');
addSuccessToast('Successfully changed dataset!');
};
const handlerCancelConfirm = () => {
@ -219,8 +219,25 @@ const ChangeDatasourceModal: FunctionComponent<ChangeDatasourceModalProps> = ({
show={show}
onHide={onHide}
responsive
title={t('Select a dataset')}
hideFooter
title={t('Change Dataset')}
footer={
<>
{confirmChange && (
<ConfirmModalStyled>
<div className="btn-container">
<Button onClick={handlerCancelConfirm}>Cancel</Button>
<Button
className="proceed-btn"
buttonStyle="primary"
onClick={handleChangeConfirm}
>
Proceed
</Button>
</div>
</ConfirmModalStyled>
)}
</>
}
>
<>
{!confirmChange && (
@ -251,23 +268,7 @@ const ChangeDatasourceModal: FunctionComponent<ChangeDatasourceModalProps> = ({
)}
</>
)}
{confirmChange && (
<ConfirmModalStyled>
<div className="confirm-modal-container">
{CONFIRM_WARNING_MESSAGE}
<div className="btn-container">
<Button onClick={handlerCancelConfirm}>Cancel</Button>
<Button
className="proceed-btn"
buttonStyle="primary"
onClick={handleChangeConfirm}
>
Proceed
</Button>
</div>
</div>
</ConfirmModalStyled>
)}
{confirmChange && <>{CONFIRM_WARNING_MESSAGE}</>}
</>
</StyledModal>
);