mirror of
https://github.com/apache/superset.git
synced 2024-09-16 02:29:39 -04:00
fix(import): Add the error alert on failed database import (#19673)
* fix(import): make to add the error alert * fix(import): make to add licence * fix(import): make to create ErrorAlert component and use errorMessage spelling
This commit is contained in:
parent
a05ff5e598
commit
a2d34ec4b8
63
superset-frontend/src/components/ImportModal/ErrorAlert.tsx
Normal file
63
superset-frontend/src/components/ImportModal/ErrorAlert.tsx
Normal file
@ -0,0 +1,63 @@
|
||||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
import React, { FunctionComponent } from 'react';
|
||||
import { t, SupersetTheme } from '@superset-ui/core';
|
||||
|
||||
import { getDatabaseDocumentationLinks } from 'src/views/CRUD/hooks';
|
||||
import Alert from 'src/components/Alert';
|
||||
import { antdWarningAlertStyles } from './styles';
|
||||
|
||||
const supersetTextDocs = getDatabaseDocumentationLinks();
|
||||
export const DOCUMENTATION_LINK = supersetTextDocs
|
||||
? supersetTextDocs.support
|
||||
: 'https://superset.apache.org/docs/databases/installing-database-drivers';
|
||||
|
||||
export interface IProps {
|
||||
errorMessage: string;
|
||||
}
|
||||
|
||||
const ErrorAlert: FunctionComponent<IProps> = ({ errorMessage }) => (
|
||||
<Alert
|
||||
closable={false}
|
||||
css={(theme: SupersetTheme) => antdWarningAlertStyles(theme)}
|
||||
type="error"
|
||||
showIcon
|
||||
message={errorMessage}
|
||||
description={
|
||||
<>
|
||||
<br />
|
||||
{t(
|
||||
'Database driver for importing maybe not installed. Visit the Superset documentation page for installation instructions:',
|
||||
)}
|
||||
<a
|
||||
href={DOCUMENTATION_LINK}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="additional-fields-alert-description"
|
||||
>
|
||||
{t('here')}
|
||||
</a>
|
||||
.
|
||||
</>
|
||||
}
|
||||
/>
|
||||
);
|
||||
|
||||
export default ErrorAlert;
|
@ -25,6 +25,7 @@ import Modal from 'src/components/Modal';
|
||||
import { Upload } from 'src/components';
|
||||
import { useImportResource } from 'src/views/CRUD/hooks';
|
||||
import { ImportResourceName } from 'src/views/CRUD/types';
|
||||
import ErrorAlert from './ErrorAlert';
|
||||
|
||||
const HelperMessage = styled.div`
|
||||
display: block;
|
||||
@ -116,7 +117,6 @@ const ImportModelsModal: FunctionComponent<ImportModelsModalProps> = ({
|
||||
resourceLabel,
|
||||
passwordsNeededMessage,
|
||||
confirmOverwriteMessage,
|
||||
addDangerToast,
|
||||
onModelImport,
|
||||
show,
|
||||
onHide,
|
||||
@ -130,6 +130,7 @@ const ImportModelsModal: FunctionComponent<ImportModelsModalProps> = ({
|
||||
const [confirmedOverwrite, setConfirmedOverwrite] = useState<boolean>(false);
|
||||
const [fileList, setFileList] = useState<UploadFile[]>([]);
|
||||
const [importingModel, setImportingModel] = useState<boolean>(false);
|
||||
const [errorMessage, setErrorMessage] = useState<string>();
|
||||
|
||||
const clearModal = () => {
|
||||
setFileList([]);
|
||||
@ -138,11 +139,11 @@ const ImportModelsModal: FunctionComponent<ImportModelsModalProps> = ({
|
||||
setNeedsOverwriteConfirm(false);
|
||||
setConfirmedOverwrite(false);
|
||||
setImportingModel(false);
|
||||
setErrorMessage('');
|
||||
};
|
||||
|
||||
const handleErrorMsg = (msg: string) => {
|
||||
clearModal();
|
||||
addDangerToast(msg);
|
||||
setErrorMessage(msg);
|
||||
};
|
||||
|
||||
const {
|
||||
@ -294,10 +295,12 @@ const ImportModelsModal: FunctionComponent<ImportModelsModalProps> = ({
|
||||
onRemove={removeFile}
|
||||
// upload is handled by hook
|
||||
customRequest={() => {}}
|
||||
disabled={importingModel}
|
||||
>
|
||||
<Button loading={importingModel}>Select file</Button>
|
||||
</Upload>
|
||||
</StyledInputContainer>
|
||||
{errorMessage && <ErrorAlert errorMessage={errorMessage} />}
|
||||
{renderPasswordFields()}
|
||||
{renderOverwriteConfirmation()}
|
||||
</Modal>
|
||||
|
43
superset-frontend/src/components/ImportModal/styles.ts
Normal file
43
superset-frontend/src/components/ImportModal/styles.ts
Normal file
@ -0,0 +1,43 @@
|
||||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
import { css, SupersetTheme } from '@superset-ui/core';
|
||||
|
||||
export const antdWarningAlertStyles = (theme: SupersetTheme) => css`
|
||||
border: 1px solid ${theme.colors.warning.light1};
|
||||
padding: ${theme.gridUnit * 4}px;
|
||||
margin: ${theme.gridUnit * 4}px 0;
|
||||
color: ${theme.colors.warning.dark2};
|
||||
|
||||
.ant-alert-message {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.ant-alert-description {
|
||||
font-size: ${theme.typography.sizes.s + 1}px;
|
||||
line-height: ${theme.gridUnit * 4}px;
|
||||
|
||||
.ant-alert-icon {
|
||||
margin-right: ${theme.gridUnit * 2.5}px;
|
||||
font-size: ${theme.typography.sizes.l + 1}px;
|
||||
position: relative;
|
||||
top: ${theme.gridUnit / 4}px;
|
||||
}
|
||||
}
|
||||
`;
|
Loading…
Reference in New Issue
Block a user