Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(database): make to display validation error msg when all cases #20095

Merged
merged 13 commits into from
Aug 24, 2022
Merged
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ import React, {
useState,
useReducer,
Reducer,
ReactElement,
} from 'react';
import { UploadChangeParam, UploadFile } from 'antd/lib/upload/interface';
import Tabs from 'src/components/Tabs';
Expand Down Expand Up @@ -447,6 +448,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
const [confirmedOverwrite, setConfirmedOverwrite] = useState<boolean>(false);
const [fileList, setFileList] = useState<UploadFile[]>([]);
const [importingModal, setImportingModal] = useState<boolean>(false);
const [errorDetailModal, setErrorDetailModal] = useState<boolean>(false);

const conf = useCommonConf();
const dbImages = getDatabaseImages();
Expand Down Expand Up @@ -818,9 +820,23 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
return false;
};

const handleErrorDetailModal = () => {
setErrorDetailModal(!errorDetailModal);
};

const renderModalFooter = () => {
if (db) {
// if db show back + connenct
if (errorDetailModal) {
return (
<>
<StyledFooterButton key="back" onClick={handleErrorDetailModal}>
{t('Back')}
</StyledFooterButton>
</>
);
}

if (!hasConnectedDb || editNewDb) {
return (
<>
Expand Down Expand Up @@ -1085,13 +1101,28 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({

// eslint-disable-next-line consistent-return
const errorAlert = () => {
let alertErrors: string[] = [];
if (isEmpty(dbErrors) === false) {
let alertErrors: Array<ReactElement> = [];
if (isEmpty(dbErrors)) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
if (isEmpty(dbErrors)) {
if (!isEmpty(dbErrors)) {

alertErrors = typeof dbErrors === 'object' ? Object.values(dbErrors) : [];
} else if (db?.engine === Engines.Snowflake) {
} else if (!isEmpty(validationErrors)) {
alertErrors =
validationErrors?.error_type === 'GENERIC_DB_ENGINE_ERROR'
? [validationErrors?.description]
? [
<>
{t('We are unable to connect to your database. Click ')}
<a
className="additional-fields-alert-description"
onClick={handleErrorDetailModal}
role="button"
tabIndex={0}
>
{t('See more')}
</a>
{t(
' for database-provided information that may help troubleshoot the issue.',
)}
</>,
]
: [];
}

Expand All @@ -1101,7 +1132,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
type="error"
css={(theme: SupersetTheme) => antDErrorAlertStyles(theme)}
message={t('Database Creation Error')}
description={t(alertErrors[0])}
description={alertErrors[0]}
/>
);
}
Expand Down Expand Up @@ -1414,21 +1445,28 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
<Modal
css={(theme: SupersetTheme) => [
antDModalNoPaddingStyles,
antDModalStyles(theme),
!errorDetailModal && antDModalStyles(theme),
formHelperStyles(theme),
formStyles(theme),
]}
name="database"
onHandledPrimaryAction={onSave}
onHide={onClose}
onHide={errorDetailModal ? handleErrorDetailModal : onClose}
primaryButtonName={hasConnectedDb ? t('Finish') : t('Connect')}
width="500px"
centered
show={show}
title={<h4>{t('Connect a database')}</h4>}
title={errorDetailModal ? t('Error Detail') : t('Connect a database')}
footer={renderModalFooter()}
>
{hasConnectedDb ? (
{errorDetailModal ? (
<Alert
type="error"
css={(theme: SupersetTheme) => antDErrorAlertStyles(theme)}
message={t('DB-Provided Error')}
description={t(validationErrors?.description)}
/>
) : hasConnectedDb ? (
<>
<ModalHeader
isLoading={isLoading}
Expand Down