mirror of
https://github.com/apache/superset.git
synced 2026-06-06 16:19:18 +00:00
fix: Database connection R6 fixes (#15486)
* split db modal file * split db modal file * hook up available databases * add comment * split db modal file * hook up available databases * use new validation component * first draft * use new validation component * Creating IconButton * Changed naming: logo is now icon * Hard-coded inset values for ellipses * Removed default SVG * Fixed test * get tests passing * Removed logo from test * split db modal file * hook up available databases * use new validation component * feat(db-connection-ui): Allow users to pick engine (#14884) * poc picker for db selection * working select * setup is loading for available dbs and step1 view * fix on close * update on fetch * remove unneeded code * add some styls * saving for now * revisions * fix package-lock.json * update styles * save * # This is a combination of 6 commits. # This is the 1st commit message: feat: validation db modal (#14832) * split db modal file * hook up available databases * use new validation component # This is the commit message #2: feat: Icon Button (#14818) * Creating IconButton * Changed naming: logo is now icon * Hard-coded inset values for ellipses * Removed default SVG * Fixed test * Removed logo from test # This is the commit message #3: chore: Improves the native filters UI/UX - iteration 6 (#14932) # This is the commit message #4: fix: is_temporal should overwrite is_dttm (#14894) * fix: is_temporal should overwrite is_dttm * move up # This is the commit message #5: fix: time parser truncate to first day of year/month (#14945) # This is the commit message #6: hook up available databases * fix test for db modal * feat(db-connection-ui): Allow users to pick engine (#14884) * poc picker for db selection * working select * setup is loading for available dbs and step1 view * fix on close * update on fetch * remove unneeded code * add some styls * more revisions * create 1 function for setting the DB * add function to preferred section * small refactor and added styling * used db.backend * add new footer buttons * add finsh buttong * refactor db modal render * fix comments issue * added engine to model * elizabeth revisions * add header * add bottom footer to sqlalchemy form * # This is a combination of 6 commits. # This is the 1st commit message: feat: validation db modal (#14832) * split db modal file * hook up available databases * use new validation component # This is the commit message #2: feat: Icon Button (#14818) * Creating IconButton * Changed naming: logo is now icon * Hard-coded inset values for ellipses * Removed default SVG * Fixed test * Removed logo from test # This is the commit message #3: chore: Improves the native filters UI/UX - iteration 6 (#14932) # This is the commit message #4: fix: is_temporal should overwrite is_dttm (#14894) * fix: is_temporal should overwrite is_dttm * move up # This is the commit message #5: fix: time parser truncate to first day of year/month (#14945) # This is the commit message #6: hook up available databases * fix test for db modal * feat(db-connection-ui): Allow users to pick engine (#14884) * poc picker for db selection * working select * setup is loading for available dbs and step1 view * fix on close * update on fetch * remove unneeded code * add some styls * elizabeth revisions * add back headers * add step * feat: Dynamic Form for edit DB Modal (#14845) * split db modal file * split db modal file * hook up available databases * add comment * split db modal file * hook up available databases * use new validation component * first draft * use new validation component * get tests passing * split db modal file * hook up available databases * use new validation component * feat(db-connection-ui): Allow users to pick engine (#14884) * poc picker for db selection * working select * setup is loading for available dbs and step1 view * fix on close * update on fetch * remove unneeded code * add some styls * revisions * fix package-lock.json * # This is a combination of 6 commits. # This is the 1st commit message: feat: validation db modal (#14832) * split db modal file * hook up available databases * use new validation component # This is the commit message #2: feat: Icon Button (#14818) * Creating IconButton * Changed naming: logo is now icon * Hard-coded inset values for ellipses * Removed default SVG * Fixed test * Removed logo from test # This is the commit message #3: chore: Improves the native filters UI/UX - iteration 6 (#14932) # This is the commit message #4: fix: is_temporal should overwrite is_dttm (#14894) * fix: is_temporal should overwrite is_dttm * move up # This is the commit message #5: fix: time parser truncate to first day of year/month (#14945) # This is the commit message #6: hook up available databases * fix test for db modal * feat(db-connection-ui): Allow users to pick engine (#14884) * poc picker for db selection * working select * setup is loading for available dbs and step1 view * fix on close * update on fetch * remove unneeded code * add some styls * more revisions * used db.backend * added engine to model * elizabeth revisions * elizabeth revisions Co-authored-by: Elizabeth Thompson <eschutho@gmail.com> Co-authored-by: hughhhh <hughmil3s@gmail.com> * address comments * oops * # This is a combination of 6 commits. # This is the 1st commit message: feat: validation db modal (#14832) * split db modal file * hook up available databases * use new validation component # This is the commit message #2: feat: Icon Button (#14818) * Creating IconButton * Changed naming: logo is now icon * Hard-coded inset values for ellipses * Removed default SVG * Fixed test * Removed logo from test # This is the commit message #3: chore: Improves the native filters UI/UX - iteration 6 (#14932) # This is the commit message #4: fix: is_temporal should overwrite is_dttm (#14894) * fix: is_temporal should overwrite is_dttm * move up # This is the commit message #5: fix: time parser truncate to first day of year/month (#14945) # This is the commit message #6: hook up available databases * fix test for db modal * feat(db-connection-ui): Allow users to pick engine (#14884) * poc picker for db selection * working select * setup is loading for available dbs and step1 view * fix on close * update on fetch * remove unneeded code * add some styls * remove merge conflicts * small fix on blocking creating * feat(db-connection-ui): Big Query Add Database Form (#14829) * fix(native-filters): Manage default value of filters by superset (#14785) * fix:fix get permission function * feat: manage default value in superset * fix(native-filters): loop bug by simplify state handling (#14788) * fix: set table name width to not hide icons when name is too long (#14489) * fix: set table name width to now hide icons when name is too long * fix: table style Co-authored-by: einatnielsen <einat.bertenthal@nielsen.com> * feat(explore): Remove default for time range filter and Metrics (#14661) * feat(explore): Remove default for time range filter and Metrics * Merge errors with same messages * Fix e2e test * Rename a variable * Bump packages * Fix unit tests * feat: chart gallery search improvement (#14484) * feat: chart gallery search improvement * test: adding unit test for VizTypeControl * fix: lint errors Co-authored-by: einatnielsen <einat.bertenthal@nielsen.com> * Update schemas.py * Update bigquery.py * Fix tests * big query form is appearing on the screen * add name to allow for actions to get picked up * working post for saving db via paste * working file upload * switch to textare * better styles * add delete buttong * save formating * wrap encrypted_extra * formatting component * clear out file input before reloading * remove default driver * address comments * fix things off rebase * small refactore * more patches * checkout space file * fix variable ref Co-authored-by: simcha90 <56388545+simcha90@users.noreply.github.com> Co-authored-by: Ville Brofeldt <33317356+villebro@users.noreply.github.com> Co-authored-by: Einat Bertenthal <einatbar@users.noreply.github.com> Co-authored-by: einatnielsen <einat.bertenthal@nielsen.com> Co-authored-by: Kamil Gabryjelski <kamil.gabryjelski@gmail.com> Co-authored-by: Beto Dealmeida <roberto@dealmeida.net> * feat: adding SSL Toggle to Create Database Modal (#14976) * first draft of SSL Toggle * added payload data * Update superset-frontend/src/views/CRUD/data/database/DatabaseModal/DatabaseConnectionForm.tsx Co-authored-by: Beto Dealmeida <roberto@dealmeida.net> * changed tooltips based on stephen advice Co-authored-by: Beto Dealmeida <roberto@dealmeida.net> Co-authored-by: Hugh A. Miles II <hughmil3s@gmail.com> * feat(database-connection-ui) Allow configuration of Database Images from SupersetText (#15023) * saving this for now * fix some styles * add database images * fix * enforce only numbers * add default iamge * fix bug * additional params to the DatabaseConnectionForm (#15071) * additional params to the DatabaseConnectionForm * save passing params up to api * feat: Added Steps and centralized Headers (#15041) * fix superset_text issue (#15095) * fix edit issue by returning parameters properly (#15101) * feat: added alerts (#15103) * added alerts * revisions * fix: add icons (#15122) * added alerts * revisions * added icon * Update superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.tsx Co-authored-by: AAfghahi <48933336+AAfghahi@users.noreply.github.com> * fix: fixing api tests for database connections (#15124) * fixing api tests * added test for no config method on create * added config method to validation tests * fix(db-connection-ui): Additional Query Parameters render (#15150) * working query params * move condition out before update or create * fix type script issues * feat(db-connection-ui): Move fields from Extra section and split engine and metadata (#15143) * working edit extra options * acquired most of json * recontruct json * add schema array * add proper styles * fix tslint issues * remove console.log * this is working * style: Database connect UI Polish - Step 1 (#15119) * save avg * Styled step 1 * Remove Alert * Finished styling, added ellipsis library to IconButton * Fixed text margin Co-authored-by: hughhhh <hughmil3s@gmail.com> * fix app from merge * fix tslint issues * fix all tslint issue on feature branch * catch errors for dialects with no driver set * fix dremio issue * fix dialect issue without driver attr * Styled step 3 (#15187) * feat: adding server-side validation and unmasked password on create (#15151) * fix: add icons (#15122) * added alerts * revisions * added icon * validation and password masking * revisions and validation range * revisions * added beto revisions * added tests for port range * added config to available * testing, rtl * made tests always pass * feat: add Close/Finish buttons to DBModal on Edit (#15199) * fix(db-connection-ui): Allow Dynamic Big Query Edits (#15185) * working big query edits * fix big stoping users from moving to next step * fix default * save defaults * fix tslint * remove object * fix styling * fix: Connect on DB Connection wasn't working (#15201) * fix: add icons (#15122) * added alerts * revisions * added icon * fixed the connect button * make available alphabetically sort * make available alphabetically sort II * fix selection * remove console.log * fix styling * fix: fix api_test and typeScript error (#15202) * fix big query issue * allow for query params * feat: Added Dynamic form link to SQL Alchemy Form (#15208) * fix: add icons (#15122) * added alerts * revisions * added icon * added dynamic form link * fix: fix api tests for test_available (#15210) * fix: add icons (#15122) * added alerts * revisions * added icon * fixes api tests * feat: added Spinner to DB Modal (#15229) * fix: add icons (#15122) * added alerts * revisions * added icon * spinner * Made header sticky (#15204) * fix: make Edit DB modal look similar to create Modal (#15231) * fix: add icons (#15122) * added alerts * revisions * added icon * spinner * changed edit * fix: DB Connection UI R2 Fixes (#15232) * fix display name refill * fix order of additional params to always be at the bottom * remove schema check on validation * make encryption last * fix json file upload * fix additional params issue * remove comments * add back validation * small fixes on bigquery edit * only wrap encrypted with bigquery * specific conditions for wrapping big query items * dix additional params * fix allow display name in sqlalchemy form * backend before engine * fix: do not use Marshmallow validation in partial params validation (#15236) * fix: do not use Marshmallow validation in partial params validation * Fix lint * Update test * make display name required * reset validation errors onClose (#15243) * fix: Edit for all dynamic forms (#15244) * fix edit for dynamic forms * fix linting * fix edit on sqlalchemy forms * fix big query reference * remove extra if * wrap configuration method (#15274) * add more specific engine elastic search (#15287) * do a deep copy of obj before POST (#15298) * feat: add Back button to extra options (#15300) * fix: add icons (#15122) * added alerts * revisions * added icon * spinner * first draft * working * added back button to create modal * revisions and testing * chore: Add tooltips and button to Connect Postgresql DB Modal Form (#15179) * Added tooltips. Still need to place in the right spot. * Revert to where I started. * Added 3 tooltips, 1 Button(need link config). BigQuery not added yet. * Added tooltip BigOuery modal. `span` above upload btn missing `*` * Added tooltip to `Host` field. Alignment needs to be fixed. * Stuck trying to add conditional render of tooltip to LabeledErrorBoundInput * Clean commit for review * Dynamic tooltip componet created. Needs alignment of SVG still. * Fixed typo. * Added line spacing back in * Changed required props to optional/Remove comment * Fixed alignment of tooltips & moved 2tooltips outside of Btn * Added one more line space back in * Removed Typo * Removed another typo * Flixed linter error * Created test for tooltip. * Added expectation for visible tooltipIcon Co-authored-by: andrewbastian <andrewbastian@hosaka-deck.lan> * style: Database Modal UI Polish (#15234) * Corrected polishing tasks from Clubhouse ticket * More UI polish * Added more polish * Moved encryption field and created constant value for viewBox in InfoToolTip * feat: allow editing (#15308) * fix: add icons (#15122) * added alerts * revisions * added icon * spinner * elizabeth fixed the edit issue * feat: Added error alert for DB connection Modal (#15242) * fix: add icons (#15122) * added alerts * revisions * added icon * spinner * added errorAlert * added revisions * current work * revisions * fix: validation on edit (#15310) * fix: Big Query Error messaging (#15334) * remove validation check * remove validation check * fix error messaging * stop validation on big query * add condition for skipping specific engines for validation * if no params * update styles * feat: big Query using back button (#15338) * fix: password errors on validation (#15372) * filter out password supply for validation * filter password * feat: updated Error Alert (#15377) * Updated styling (#15379) * fix password error filter * feat: Arash/password field error (#15388) * fix: Back Button on Create for DB conncetion (#15389) * fix: add icons (#15122) * added alerts * revisions * added icon * spinner * fixing backButton on Create * fix doc (#15393) * style: Database Connection Modal UI Polish R5 (#15412) * Fixed inconsistent header spacing in step 1 * Touched up tooltips * Added red *s to BigQuery form * Centered modal window * make alerts configurable (#15404) * fix: Allow users to override database connection docs (#15434) * allow users to override docs * fix linting issue * fix: Error Icon not showing up on errored input fieds on validation (#15431) * Fixed now-show error icon Signed-off-by: andrewbastian <andrew.bastian@gmail.com> * Changed `%` to `px` * Fixed lint error * Changed units to `theme.gridUnit` * test: RTL testing on DatabaseModal (#15394) * RTL testing on DatabaseModal * Continued RTL testing on DatabaseModal * Code cleanup * Removed a comment that missed my radar * test: Add e2e testing (#15376) * create boilerplate for cypress test * added 1 more test * add more test cases * saving this for development * lit * remove name * update pass * remove unused test * fix merge conflicts * Fixed "connetion" typo (#15458) * fix: Database connection modal touch up (#15463) * Removed unnecessary TODO and named the remaining ones * Added translation functionality * Fixed typo in Database Modal RTL test * Update modal.test.ts * fix: Showing errors for SQLA forms (#15462) * fix documentation links * fix sqlalchemy onCreate * Fixing SQLA error messaging * fix logic for extra save * fix this issue * fix: Update Invalid Port SIP-40 Reference (#15464) * Fixed jumpy header text * fix: Edit Modal not saving properly (#15468) * Aligned info icons on dynamic form * fix: merge conflict (#15479) * chore: simplify errors and issue codes (#15437) * Fix issue number * Fix test * Fixed line-height in header, also fixed translation functions in BigQuery * Updated placeholder text in additional params field * Fixed padding in edit form * Corrected placeholder text in BigQuery > Service Account field * Make linter happy Co-authored-by: Elizabeth Thompson <eschutho@gmail.com> Co-authored-by: Arash <arash.afghahi@gmail.com> Co-authored-by: hughhhh <hughmil3s@gmail.com> Co-authored-by: AAfghahi <48933336+AAfghahi@users.noreply.github.com> Co-authored-by: simcha90 <56388545+simcha90@users.noreply.github.com> Co-authored-by: Ville Brofeldt <33317356+villebro@users.noreply.github.com> Co-authored-by: Einat Bertenthal <einatbar@users.noreply.github.com> Co-authored-by: einatnielsen <einat.bertenthal@nielsen.com> Co-authored-by: Kamil Gabryjelski <kamil.gabryjelski@gmail.com> Co-authored-by: Beto Dealmeida <roberto@dealmeida.net> Co-authored-by: Andrew Bastian <50464395+andrewbastian@users.noreply.github.com> Co-authored-by: andrewbastian <andrewbastian@hosaka-deck.lan>
This commit is contained in:
Lyndsi Kay Williams
committed by
GitHub
GitHub
parent
e5ab9a4091
commit
68704a595b
@@ -77,11 +77,13 @@ const StyledFormGroup = styled('div')`
|
||||
}
|
||||
`;
|
||||
|
||||
const infoTooltip = (theme: SupersetTheme) => css`
|
||||
svg {
|
||||
vertical-align: bottom;
|
||||
margin-bottom: ${theme.gridUnit * 0.25}px;
|
||||
}
|
||||
const StyledAlignment = styled.div`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
`;
|
||||
|
||||
const StyledFormLabel = styled(FormLabel)`
|
||||
margin-bottom: 0;
|
||||
`;
|
||||
|
||||
const LabeledErrorBoundInput = ({
|
||||
@@ -97,16 +99,14 @@ const LabeledErrorBoundInput = ({
|
||||
...props
|
||||
}: LabeledErrorBoundInputProps) => (
|
||||
<StyledFormGroup className={className}>
|
||||
<FormLabel
|
||||
htmlFor={id}
|
||||
required={required}
|
||||
css={(theme: SupersetTheme) => infoTooltip(theme)}
|
||||
>
|
||||
{label}
|
||||
</FormLabel>
|
||||
{hasTooltip && (
|
||||
<InfoTooltip tooltip={`${tooltipText}`} viewBox="0 -6 24 24" />
|
||||
)}
|
||||
<StyledAlignment>
|
||||
<StyledFormLabel htmlFor={id} required={required}>
|
||||
{label}
|
||||
</StyledFormLabel>
|
||||
{hasTooltip && (
|
||||
<InfoTooltip tooltip={`${tooltipText}`} viewBox="0 -1 24 24" />
|
||||
)}
|
||||
</StyledAlignment>
|
||||
<FormItem
|
||||
css={(theme: SupersetTheme) => alertIconStyles(theme, !!errorMessage)}
|
||||
validateTrigger={Object.keys(validationMethods)}
|
||||
|
||||
@@ -65,6 +65,7 @@ export default function InfoTooltip({
|
||||
trigger = 'hover',
|
||||
overlayStyle = defaultOverlayStyle,
|
||||
bgColor = defaultColor,
|
||||
viewBox = '0 -2 24 24',
|
||||
}: InfoTooltipProps) {
|
||||
return (
|
||||
<StyledTooltip
|
||||
@@ -74,7 +75,7 @@ export default function InfoTooltip({
|
||||
overlayStyle={overlayStyle}
|
||||
color={bgColor}
|
||||
>
|
||||
<Icons.InfoSolidSmall className="info-solid-small" />
|
||||
<Icons.InfoSolidSmall className="info-solid-small" viewBox={viewBox} />
|
||||
</StyledTooltip>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -85,7 +85,7 @@ const CredentialsInfo = ({
|
||||
{!isEditMode && (
|
||||
<>
|
||||
<FormLabel required>
|
||||
{`${t('How do you want to enter service account credentials?')}`}
|
||||
{t('How do you want to enter service account credentials?')}
|
||||
</FormLabel>
|
||||
<Select
|
||||
defaultValue={uploadOption}
|
||||
@@ -93,11 +93,11 @@ const CredentialsInfo = ({
|
||||
onChange={option => setUploadOption(option)}
|
||||
>
|
||||
<Select.Option value={CredentialInfoOptions.jsonUpload}>
|
||||
{`${t('Upload JSON file')}`}
|
||||
{t('Upload JSON file')}
|
||||
</Select.Option>
|
||||
|
||||
<Select.Option value={CredentialInfoOptions.copyPaste}>
|
||||
{`${t('Copy and Paste JSON credentials')}`}
|
||||
{t('Copy and Paste JSON credentials')}
|
||||
</Select.Option>
|
||||
</Select>
|
||||
</>
|
||||
@@ -106,22 +106,16 @@ const CredentialsInfo = ({
|
||||
isEditMode ||
|
||||
editNewDb ? (
|
||||
<div className="input-container">
|
||||
<FormLabel required>{`${t('Service Account')}`}</FormLabel>
|
||||
<FormLabel required>{t('Service Account')}</FormLabel>
|
||||
<textarea
|
||||
className="input-form"
|
||||
name="credentials_info"
|
||||
value={db?.parameters?.credentials_info}
|
||||
onChange={changeMethods.onParametersChange}
|
||||
placeholder={JSON.stringify(
|
||||
{
|
||||
credentials_info: '<contents of credentials JSON file>',
|
||||
},
|
||||
null,
|
||||
' ',
|
||||
)}
|
||||
placeholder="Paste content of service credentials JSON file here"
|
||||
/>
|
||||
<span className="label-paste">
|
||||
`${t('Copy and paste the entire service account .json file here')}`
|
||||
{t('Copy and paste the entire service account .json file here')}
|
||||
</span>
|
||||
</div>
|
||||
) : (
|
||||
@@ -130,7 +124,7 @@ const CredentialsInfo = ({
|
||||
css={(theme: SupersetTheme) => infoTooltip(theme)}
|
||||
>
|
||||
<div css={{ display: 'flex', alignItems: 'center' }}>
|
||||
<FormLabel required>{`${t('Upload Credentials')}`}</FormLabel>
|
||||
<FormLabel required>{t('Upload Credentials')}</FormLabel>
|
||||
<InfoTooltip
|
||||
tooltip={t(
|
||||
'Use the JSON file you automatically downloaded when creating your service account in Google BigQuery.',
|
||||
@@ -144,7 +138,7 @@ const CredentialsInfo = ({
|
||||
className="input-upload-btn"
|
||||
onClick={() => document?.getElementById('selectedFile')?.click()}
|
||||
>
|
||||
{`${t('Choose File')}`}
|
||||
{t('Choose File')}
|
||||
</Button>
|
||||
)}
|
||||
{fileToUpload && (
|
||||
@@ -173,7 +167,6 @@ const CredentialsInfo = ({
|
||||
if (event.target.files) {
|
||||
file = event.target.files[0];
|
||||
}
|
||||
|
||||
setFileToUpload(file?.name);
|
||||
changeMethods.onParametersChange({
|
||||
target: {
|
||||
@@ -335,7 +328,7 @@ const queryField = ({
|
||||
value={db?.parameters?.query}
|
||||
validationMethods={{ onBlur: getValidation }}
|
||||
errorMessage={validationErrors?.query}
|
||||
placeholder="e.g. param1=value¶m2=value2"
|
||||
placeholder="e.g. param1=value1¶m2=value2"
|
||||
label="Additional Parameters"
|
||||
onChange={changeMethods.onParametersChange}
|
||||
helpText={t('Add additional custom parameters')}
|
||||
@@ -367,6 +360,7 @@ const forceSSLField = ({
|
||||
<InfoTooltip
|
||||
tooltip={t('SSL Mode "require" will be used.')}
|
||||
placement="right"
|
||||
viewBox="0 0 24 24"
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -22,8 +22,6 @@ import { getDatabaseDocumentationLinks } from 'src/views/CRUD/hooks';
|
||||
import {
|
||||
EditHeaderTitle,
|
||||
EditHeaderSubtitle,
|
||||
CreateHeaderTitle,
|
||||
CreateHeaderSubtitle,
|
||||
StyledFormHeader,
|
||||
StyledStickyHeader,
|
||||
} from './styles';
|
||||
@@ -79,9 +77,9 @@ const ModalHeader = ({
|
||||
);
|
||||
const useSqlAlchemyFormHeader = (
|
||||
<StyledFormHeader>
|
||||
<p className="helper"> STEP 2 OF 2 </p>
|
||||
<CreateHeaderTitle>Enter Primary Credentials</CreateHeaderTitle>
|
||||
<CreateHeaderSubtitle>
|
||||
<p className="helper-top"> STEP 2 OF 2 </p>
|
||||
<h4>Enter Primary Credentials</h4>
|
||||
<p className="helper-bottom">
|
||||
Need help? Learn how to connect your database{' '}
|
||||
<a
|
||||
href={supersetTextDocs?.default || DOCUMENTATION_LINK}
|
||||
@@ -91,18 +89,18 @@ const ModalHeader = ({
|
||||
here
|
||||
</a>
|
||||
.
|
||||
</CreateHeaderSubtitle>
|
||||
</p>
|
||||
</StyledFormHeader>
|
||||
);
|
||||
const hasConnectedDbHeader = (
|
||||
<StyledStickyHeader>
|
||||
<StyledFormHeader>
|
||||
<p className="helper"> STEP 3 OF 3 </p>
|
||||
<h4>
|
||||
<p className="helper-top"> STEP 3 OF 3 </p>
|
||||
<h4 className="step-3-text">
|
||||
Your database was successfully connected! Here are some optional
|
||||
settings for your database
|
||||
</h4>
|
||||
<p className="helper">
|
||||
<p className="helper-bottom">
|
||||
Need help? Learn more about{' '}
|
||||
<a
|
||||
href={documentationLink(db?.engine)}
|
||||
@@ -118,9 +116,9 @@ const ModalHeader = ({
|
||||
const hasDbHeader = (
|
||||
<StyledStickyHeader>
|
||||
<StyledFormHeader>
|
||||
<p className="helper"> STEP 2 OF 3 </p>
|
||||
<p className="helper-top"> STEP 2 OF 3 </p>
|
||||
<h4>Enter the required {dbModel.name} credentials</h4>
|
||||
<p className="helper">
|
||||
<p className="helper-bottom">
|
||||
Need help? Learn more about{' '}
|
||||
<a
|
||||
href={documentationLink(db?.engine)}
|
||||
@@ -136,7 +134,7 @@ const ModalHeader = ({
|
||||
const noDbHeader = (
|
||||
<StyledFormHeader>
|
||||
<div className="select-db">
|
||||
<p className="helper"> STEP 1 OF 3 </p>
|
||||
<p className="helper-top"> STEP 1 OF 3 </p>
|
||||
<h4>Select a database to connect</h4>
|
||||
</div>
|
||||
</StyledFormHeader>
|
||||
|
||||
@@ -67,7 +67,7 @@ import {
|
||||
TabHeader,
|
||||
formHelperStyles,
|
||||
formStyles,
|
||||
StyledBasicTab,
|
||||
StyledAlignment,
|
||||
SelectDatabaseStyles,
|
||||
infoTooltip,
|
||||
StyledFooterButton,
|
||||
@@ -864,9 +864,9 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
|
||||
onTabClick={tabChange}
|
||||
animated={{ inkBar: true, tabPane: true }}
|
||||
>
|
||||
<StyledBasicTab tab={<span>{t('Basic')}</span>} key="1">
|
||||
<Tabs.TabPane tab={<span>{t('Basic')}</span>} key="1">
|
||||
{useSqlAlchemyForm ? (
|
||||
<>
|
||||
<StyledAlignment>
|
||||
<SqlAlchemyForm
|
||||
db={db as DatabaseObject}
|
||||
onInputChange={({ target }: { target: HTMLInputElement }) =>
|
||||
@@ -908,7 +908,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
</StyledAlignment>
|
||||
) : (
|
||||
<DatabaseConnectionForm
|
||||
isEditMode
|
||||
@@ -958,7 +958,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
|
||||
type="info"
|
||||
/>
|
||||
)}
|
||||
</StyledBasicTab>
|
||||
</Tabs.TabPane>
|
||||
<Tabs.TabPane tab={<span>{t('Advanced')}</span>} key="2">
|
||||
<ExtraOptions
|
||||
db={db as DatabaseObject}
|
||||
@@ -1116,7 +1116,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
|
||||
tooltip={t(
|
||||
'Click this link to switch to an alternate form that allows you to input the SQLAlchemy URL for this database manually.',
|
||||
)}
|
||||
viewBox="6 3 24 24"
|
||||
viewBox="6 4 24 24"
|
||||
/>
|
||||
</div>
|
||||
{/* Step 2 */}
|
||||
|
||||
@@ -19,7 +19,6 @@
|
||||
|
||||
import { styled, css, SupersetTheme } from '@superset-ui/core';
|
||||
import { JsonEditor } from 'src/components/AsyncAceEditor';
|
||||
import Tabs from 'src/components/Tabs';
|
||||
import Button from 'src/components/Button';
|
||||
|
||||
const CTAS_CVAS_SCHEMA_FORM_HEIGHT = 102;
|
||||
@@ -42,26 +41,38 @@ export const StyledFormHeader = styled.header`
|
||||
padding: ${({ theme }) => theme.gridUnit * 2}px
|
||||
${({ theme }) => theme.gridUnit * 4}px;
|
||||
line-height: ${({ theme }) => theme.gridUnit * 6}px;
|
||||
.helper {
|
||||
|
||||
.helper-top {
|
||||
padding-bottom: 0;
|
||||
color: ${({ theme }) => theme.colors.grayscale.base};
|
||||
font-size: ${({ theme }) => theme.typography.sizes.s - 1}px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.helper-bottom {
|
||||
padding-top: 0;
|
||||
color: ${({ theme }) => theme.colors.grayscale.base};
|
||||
font-size: ${({ theme }) => theme.typography.sizes.s - 1}px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
h4 {
|
||||
color: ${({ theme }) => theme.colors.grayscale.dark2};
|
||||
font-weight: bold;
|
||||
font-size: ${({ theme }) => theme.typography.sizes.l}px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
line-height: ${({ theme }) => theme.gridUnit * 8}px;
|
||||
}
|
||||
|
||||
.select-db {
|
||||
padding: ${({ theme }) => theme.gridUnit}px;
|
||||
padding-bottom: ${({ theme }) => theme.gridUnit * 2}px;
|
||||
.helper {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
h4 {
|
||||
margin: 0 0 ${({ theme }) => theme.gridUnit * 6}px;
|
||||
margin: 0 0 ${({ theme }) => theme.gridUnit * 4}px;
|
||||
}
|
||||
}
|
||||
`;
|
||||
@@ -377,7 +388,7 @@ export const StyledExpandableForm = styled.div`
|
||||
}
|
||||
`;
|
||||
|
||||
export const StyledBasicTab = styled(Tabs.TabPane)`
|
||||
export const StyledAlignment = styled.div`
|
||||
padding: 0 ${({ theme }) => theme.gridUnit * 4}px;
|
||||
margin-top: ${({ theme }) => theme.gridUnit * 6}px;
|
||||
`;
|
||||
|
||||
Reference in New Issue
Block a user