mirror of https://github.com/apache/superset.git
fix(import): Show the error message with db install guide when exist the importing db issue (#20573)
* fix(import): make to update the error display when importing resurce * fix(import): make to update the error message
This commit is contained in:
parent
db088e9e2f
commit
c992ff3be4
|
@ -42,6 +42,7 @@ import IconButton from 'src/components/IconButton';
|
||||||
import InfoTooltip from 'src/components/InfoTooltip';
|
import InfoTooltip from 'src/components/InfoTooltip';
|
||||||
import withToasts from 'src/components/MessageToasts/withToasts';
|
import withToasts from 'src/components/MessageToasts/withToasts';
|
||||||
import ValidatedInput from 'src/components/Form/LabeledErrorBoundInput';
|
import ValidatedInput from 'src/components/Form/LabeledErrorBoundInput';
|
||||||
|
import ErrorAlert from 'src/components/ImportModal/ErrorAlert';
|
||||||
import {
|
import {
|
||||||
testDatabaseConnection,
|
testDatabaseConnection,
|
||||||
useSingleViewResource,
|
useSingleViewResource,
|
||||||
|
@ -452,6 +453,8 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
|
||||||
const [confirmedOverwrite, setConfirmedOverwrite] = useState<boolean>(false);
|
const [confirmedOverwrite, setConfirmedOverwrite] = useState<boolean>(false);
|
||||||
const [fileList, setFileList] = useState<UploadFile[]>([]);
|
const [fileList, setFileList] = useState<UploadFile[]>([]);
|
||||||
const [importingModal, setImportingModal] = useState<boolean>(false);
|
const [importingModal, setImportingModal] = useState<boolean>(false);
|
||||||
|
const [importingErrorMessage, setImportingErrorMessage] = useState<string>();
|
||||||
|
const [passwordFields, setPasswordFields] = useState<string[]>([]);
|
||||||
|
|
||||||
const conf = useCommonConf();
|
const conf = useCommonConf();
|
||||||
const dbImages = getDatabaseImages();
|
const dbImages = getDatabaseImages();
|
||||||
|
@ -522,6 +525,8 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
|
||||||
setEditNewDb(false);
|
setEditNewDb(false);
|
||||||
setFileList([]);
|
setFileList([]);
|
||||||
setImportingModal(false);
|
setImportingModal(false);
|
||||||
|
setImportingErrorMessage('');
|
||||||
|
setPasswordFields([]);
|
||||||
setPasswords({});
|
setPasswords({});
|
||||||
setConfirmedOverwrite(false);
|
setConfirmedOverwrite(false);
|
||||||
onHide();
|
onHide();
|
||||||
|
@ -537,8 +542,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
|
||||||
},
|
},
|
||||||
importResource,
|
importResource,
|
||||||
} = useImportResource('database', t('database'), msg => {
|
} = useImportResource('database', t('database'), msg => {
|
||||||
addDangerToast(msg);
|
setImportingErrorMessage(msg);
|
||||||
onClose();
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const onChange = (type: any, payload: any) => {
|
const onChange = (type: any, payload: any) => {
|
||||||
|
@ -810,6 +814,12 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
|
||||||
const handleBackButtonOnConnect = () => {
|
const handleBackButtonOnConnect = () => {
|
||||||
if (editNewDb) setHasConnectedDb(false);
|
if (editNewDb) setHasConnectedDb(false);
|
||||||
if (importingModal) setImportingModal(false);
|
if (importingModal) setImportingModal(false);
|
||||||
|
if (importErrored) {
|
||||||
|
setImportingModal(false);
|
||||||
|
setImportingErrorMessage('');
|
||||||
|
setPasswordFields([]);
|
||||||
|
setPasswords({});
|
||||||
|
}
|
||||||
setDB({ type: ActionType.reset });
|
setDB({ type: ActionType.reset });
|
||||||
setFileList([]);
|
setFileList([]);
|
||||||
};
|
};
|
||||||
|
@ -970,7 +980,14 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
|
||||||
}
|
}
|
||||||
}, [importingModal]);
|
}, [importingModal]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
setPasswordFields([...passwordsNeeded]);
|
||||||
|
}, [passwordsNeeded]);
|
||||||
|
|
||||||
const onDbImport = async (info: UploadChangeParam) => {
|
const onDbImport = async (info: UploadChangeParam) => {
|
||||||
|
setImportingErrorMessage('');
|
||||||
|
setPasswordFields([]);
|
||||||
|
setPasswords({});
|
||||||
setImportingModal(true);
|
setImportingModal(true);
|
||||||
setFileList([
|
setFileList([
|
||||||
{
|
{
|
||||||
|
@ -989,9 +1006,9 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
|
||||||
};
|
};
|
||||||
|
|
||||||
const passwordNeededField = () => {
|
const passwordNeededField = () => {
|
||||||
if (!passwordsNeeded.length) return null;
|
if (!passwordFields.length) return null;
|
||||||
|
|
||||||
return passwordsNeeded.map(database => (
|
return passwordFields.map(database => (
|
||||||
<>
|
<>
|
||||||
<StyledAlertMargin>
|
<StyledAlertMargin>
|
||||||
<Alert
|
<Alert
|
||||||
|
@ -1022,6 +1039,19 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
|
||||||
));
|
));
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const importingErrorAlert = () => {
|
||||||
|
if (!importingErrorMessage) return null;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<StyledAlertMargin>
|
||||||
|
<ErrorAlert
|
||||||
|
errorMessage={importingErrorMessage}
|
||||||
|
showDbInstallInstructions={passwordFields.length > 0}
|
||||||
|
/>
|
||||||
|
</StyledAlertMargin>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
const confirmOverwrite = (event: React.ChangeEvent<HTMLInputElement>) => {
|
const confirmOverwrite = (event: React.ChangeEvent<HTMLInputElement>) => {
|
||||||
const targetValue = (event.currentTarget?.value as string) ?? '';
|
const targetValue = (event.currentTarget?.value as string) ?? '';
|
||||||
setConfirmedOverwrite(targetValue.toUpperCase() === t('OVERWRITE'));
|
setConfirmedOverwrite(targetValue.toUpperCase() === t('OVERWRITE'));
|
||||||
|
@ -1225,7 +1255,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
if (fileList.length > 0 && (alreadyExists.length || passwordsNeeded.length)) {
|
if (fileList.length > 0 && (alreadyExists.length || passwordFields.length)) {
|
||||||
return (
|
return (
|
||||||
<Modal
|
<Modal
|
||||||
css={(theme: SupersetTheme) => [
|
css={(theme: SupersetTheme) => [
|
||||||
|
@ -1256,6 +1286,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
|
||||||
/>
|
/>
|
||||||
{passwordNeededField()}
|
{passwordNeededField()}
|
||||||
{confirmOverwriteField()}
|
{confirmOverwriteField()}
|
||||||
|
{importingErrorAlert()}
|
||||||
</Modal>
|
</Modal>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -1519,6 +1550,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
|
||||||
</Button>
|
</Button>
|
||||||
</Upload>
|
</Upload>
|
||||||
</StyledUploadWrapper>
|
</StyledUploadWrapper>
|
||||||
|
{importingErrorAlert()}
|
||||||
</SelectDatabaseStyles>
|
</SelectDatabaseStyles>
|
||||||
) : (
|
) : (
|
||||||
<>
|
<>
|
||||||
|
|
|
@ -468,8 +468,8 @@ export function useImportResource(
|
||||||
resourceLabel,
|
resourceLabel,
|
||||||
[
|
[
|
||||||
...error.errors.map(payload => payload.message),
|
...error.errors.map(payload => payload.message),
|
||||||
t('Please re-export your file and try importing again'),
|
t('Please re-export your file and try importing again.'),
|
||||||
].join('\n'),
|
].join('.\n'),
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
|
|
Loading…
Reference in New Issue