diff --git a/superset-frontend/src/components/ImportModal/ErrorAlert.tsx b/superset-frontend/src/components/ImportModal/ErrorAlert.tsx new file mode 100644 index 000000000000..91ee6467f4f9 --- /dev/null +++ b/superset-frontend/src/components/ImportModal/ErrorAlert.tsx @@ -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 = ({ errorMessage }) => ( + antdWarningAlertStyles(theme)} + type="error" + showIcon + message={errorMessage} + description={ + <> +
+ {t( + 'Database driver for importing maybe not installed. Visit the Superset documentation page for installation instructions:', + )} + + {t('here')} + + . + + } + /> +); + +export default ErrorAlert; diff --git a/superset-frontend/src/components/ImportModal/index.tsx b/superset-frontend/src/components/ImportModal/index.tsx index e8c29b94e956..c13546f7d3bf 100644 --- a/superset-frontend/src/components/ImportModal/index.tsx +++ b/superset-frontend/src/components/ImportModal/index.tsx @@ -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 = ({ resourceLabel, passwordsNeededMessage, confirmOverwriteMessage, - addDangerToast, onModelImport, show, onHide, @@ -130,6 +130,7 @@ const ImportModelsModal: FunctionComponent = ({ const [confirmedOverwrite, setConfirmedOverwrite] = useState(false); const [fileList, setFileList] = useState([]); const [importingModel, setImportingModel] = useState(false); + const [errorMessage, setErrorMessage] = useState(); const clearModal = () => { setFileList([]); @@ -138,11 +139,11 @@ const ImportModelsModal: FunctionComponent = ({ setNeedsOverwriteConfirm(false); setConfirmedOverwrite(false); setImportingModel(false); + setErrorMessage(''); }; const handleErrorMsg = (msg: string) => { - clearModal(); - addDangerToast(msg); + setErrorMessage(msg); }; const { @@ -294,10 +295,12 @@ const ImportModelsModal: FunctionComponent = ({ onRemove={removeFile} // upload is handled by hook customRequest={() => {}} + disabled={importingModel} > + {errorMessage && } {renderPasswordFields()} {renderOverwriteConfirmation()} diff --git a/superset-frontend/src/components/ImportModal/styles.ts b/superset-frontend/src/components/ImportModal/styles.ts new file mode 100644 index 000000000000..c73dc7c1ab27 --- /dev/null +++ b/superset-frontend/src/components/ImportModal/styles.ts @@ -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; + } + } +`;