Create project from database UI dialog (#13179)

* UI hook up

* Add tests

* Add back the missing statement for opening project

* Fix failures

* Add a few more tests

* Fix test failure

* Addressed comments

* Update UI to match the mocks

* Update UI to match updated mockups

* Addressed comments to match UI with mockup

* Updated all import strings to be called as Create Project From Database strings

* Fix a couple of test failures and one comment addressed

* Update one missed import string

* Skipping a failing test for now

* Fix failures. Fix alignment of icons

* Addressed PR comments

* Addressed couple more PR comments
This commit is contained in:
Sakshi Sharma
2020-11-20 09:38:16 -08:00
committed by GitHub
parent 8d42182db8
commit 749989cd0b
11 changed files with 672 additions and 312 deletions

View File

@@ -14,6 +14,7 @@ import { IPublishSettings, IGenerateScriptSettings } from '../models/IPublishSet
import { DeploymentOptions, SchemaObjectType } from '../../../mssql/src/mssql';
import { IconPathHelper } from '../common/iconHelper';
import { cssStyles } from '../common/uiConstants';
import { getConnectionName } from './utils';
interface DataSourceDropdownValue extends azdata.CategoryValue {
dataSource: SqlConnectionDataSource;
@@ -286,7 +287,7 @@ export class PublishDatabaseDialog {
value: '',
ariaLabel: constants.targetConnectionLabel,
placeHolder: constants.selectConnection,
width: cssStyles.publishDialogTextboxWidth,
width: cssStyles.textboxWidth,
enabled: false
}).component();
@@ -350,12 +351,12 @@ export class PublishDatabaseDialog {
this.loadProfileTextBox = view.modelBuilder.inputBox().withProperties({
placeHolder: constants.loadProfilePlaceholderText,
ariaLabel: constants.profile,
width: cssStyles.publishDialogTextboxWidth
width: cssStyles.textboxWidth
}).component();
const profileLabel = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({
value: constants.profile,
width: cssStyles.publishDialogLabelWidth
width: cssStyles.labelWidth
}).component();
const profileRow = view.modelBuilder.flexContainer().withItems([profileLabel, this.loadProfileTextBox], { flex: '0 0 auto', CSSStyles: { 'margin-right': '10px' } }).withLayout({ flexFlow: 'row', alignItems: 'center' }).component();
@@ -371,7 +372,7 @@ export class PublishDatabaseDialog {
const serverLabel = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({
value: constants.server,
requiredIndicator: true,
width: cssStyles.publishDialogLabelWidth
width: cssStyles.labelWidth
}).component();
const connectionRow = view.modelBuilder.flexContainer().withItems([serverLabel, this.targetConnectionTextBox], { flex: '0 0 auto', CSSStyles: { 'margin-right': '10px' } }).withLayout({ flexFlow: 'row', alignItems: 'center' }).component();
@@ -386,7 +387,7 @@ export class PublishDatabaseDialog {
value: this.getDefaultDatabaseName(),
ariaLabel: constants.databaseNameLabel,
required: true,
width: cssStyles.publishDialogTextboxWidth,
width: cssStyles.textboxWidth,
editable: true,
fireOnTextChange: true
}).component();
@@ -398,7 +399,7 @@ export class PublishDatabaseDialog {
const databaseLabel = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({
value: constants.databaseNameLabel,
requiredIndicator: true,
width: cssStyles.publishDialogLabelWidth
width: cssStyles.labelWidth
}).component();
const databaseRow = view.modelBuilder.flexContainer().withItems([databaseLabel, <azdata.DropDownComponent>this.targetDatabaseDropDown], { flex: '0 0 auto', CSSStyles: { 'margin-right': '10px' } }).withLayout({ flexFlow: 'row', alignItems: 'center' }).component();
@@ -481,18 +482,7 @@ export class PublishDatabaseDialog {
let connection = await azdata.connection.openConnectionDialog();
this.connectionId = connection.connectionId;
// show connection name if there is one, otherwise show connection in format that shows in OE
let connectionTextboxValue: string;
if (connection.options['connectionName']) {
connectionTextboxValue = connection.options['connectionName'];
} else {
let user = connection.options['user'];
if (!user) {
user = constants.defaultUser;
}
connectionTextboxValue = `${connection.options['server']} (${user})`;
}
let connectionTextboxValue: string = getConnectionName(connection);
this.updateConnectionComponents(connectionTextboxValue, this.connectionId);