iop
/
superset
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore: allow sqla docs to use supersettext (#18585) 

* chore: allow sqla docs to use supersettext

* Update SqlAlchemyForm.tsx
This commit is contained in:
Phillip Kelley-Dotson 2022-02-07 12:45:42 -08:00 committed by GitHub
parent 85c8d0183b
commit 4e2bdd49c4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 73 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

136
superset-frontend/src/views/CRUD/data/database/DatabaseModal/SqlAlchemyForm.tsx
View File

@ -18,6 +18,7 @@
*/
import React, { EventHandler, ChangeEvent, MouseEvent } from 'react';
import { t, SupersetTheme } from '@superset-ui/core';
import SupersetText from 'src/utils/textUtils';
import Button from 'src/components/Button';
import { StyledInputContainer, wideButton } from './styles';
@ -37,67 +38,76 @@ const SqlAlchemyTab = ({
conf: { SQLALCHEMY_DOCS_URL: string; SQLALCHEMY_DISPLAY_TEXT: string };
isEditMode?: boolean;
testInProgress?: boolean;
}) => (
<>
<StyledInputContainer>
<div className="control-label">
{t('Display Name')}
<span className="required">*</span>
</div>
<div className="input-container">
<input
type="text"
name="database_name"
data-test="database-name-input"
value={db?.database_name || ''}
placeholder={t('Name your database')}
onChange={onInputChange}
/>
</div>
<div className="helper">
{t('Pick a name to help you identify this database.')}
</div>
</StyledInputContainer>
<StyledInputContainer>
<div className="control-label">
{t('SQLAlchemy URI')}
<span className="required">*</span>
</div>
<div className="input-container">
<input
type="text"
name="sqlalchemy_uri"
data-test="sqlalchemy-uri-input"
value={db?.sqlalchemy_uri || ''}
autoComplete="off"
placeholder={t(
'dialect+driver://username:password@host:port/database',
)}
onChange={onInputChange}
/>
</div>
<div className="helper">
{t('Refer to the')}{' '}
<a
href={conf?.SQLALCHEMY_DOCS_URL ?? ''}
target="_blank"
rel="noopener noreferrer"
>
{conf?.SQLALCHEMY_DISPLAY_TEXT ?? ''}
</a>{' '}
{t('for more information on how to structure your URI.')}
</div>
</StyledInputContainer>
<Button
onClick={testConnection}
disabled={testInProgress}
cta
buttonStyle="link"
css={(theme: SupersetTheme) => wideButton(theme)}
>
{t('Test connection')}
</Button>
</>
);
}) => {
let fallbackDocsUrl;
let fallbackDisplayText;
if (SupersetText) {
fallbackDocsUrl =
SupersetText.DB_MODAL_SQLALCHEMY_FORM?.SQLALCHEMY_DOCS_URL;
fallbackDisplayText =
SupersetText.DB_MODAL_SQLALCHEMY_FORM?.SQLALCHEMY_DOCS_URL;
}
return (
<>
<StyledInputContainer>
<div className="control-label">
{t('Display Name')}
<span className="required">*</span>
</div>
<div className="input-container">
<input
type="text"
name="database_name"
data-test="database-name-input"
value={db?.database_name || ''}
placeholder={t('Name your database')}
onChange={onInputChange}
/>
</div>
<div className="helper">
{t('Pick a name to help you identify this database.')}
</div>
</StyledInputContainer>
<StyledInputContainer>
<div className="control-label">
{t('SQLAlchemy URI')}
<span className="required">*</span>
</div>
<div className="input-container">
<input
type="text"
name="sqlalchemy_uri"
data-test="sqlalchemy-uri-input"
value={db?.sqlalchemy_uri || ''}
autoComplete="off"
placeholder={t(
'dialect+driver://username:password@host:port/database',
)}
onChange={onInputChange}
/>
</div>
<div className="helper">
{t('Refer to the')}{' '}
<a
href={fallbackDocsUrl || conf?.SQLALCHEMY_DOCS_URL || ''}
target="_blank"
rel="noopener noreferrer"
>
{fallbackDisplayText || conf?.SQLALCHEMY_DISPLAY_TEXT || ''}
</a>{' '}
{t('for more information on how to structure your URI.')}
</div>
</StyledInputContainer>
<Button
onClick={testConnection}
disabled={testInProgress}
cta
buttonStyle="link"
css={(theme: SupersetTheme) => wideButton(theme)}
>
{t('Test connection')}
</Button>
</>
);
};
export default SqlAlchemyTab;