From e6a81d01cce67d9eef62f7cf1102e7fb487e43c5 Mon Sep 17 00:00:00 2001 From: Aasim Khan Date: Wed, 24 Mar 2021 00:49:33 -0700 Subject: [PATCH] Making source config more intiutive (#14849) Adding loading component for assessment card --- .../sql-migration/src/constants/strings.ts | 3 ++ .../sql-migration/src/models/stateMachine.ts | 7 +++- .../src/wizard/skuRecommendationPage.ts | 24 +++++------ .../src/wizard/sqlSourceConfigurationPage.ts | 40 ++++++++++++++----- 4 files changed, 50 insertions(+), 24 deletions(-) diff --git a/extensions/sql-migration/src/constants/strings.ts b/extensions/sql-migration/src/constants/strings.ts index 1991743c47..1692dd2a09 100644 --- a/extensions/sql-migration/src/constants/strings.ts +++ b/extensions/sql-migration/src/constants/strings.ts @@ -274,3 +274,6 @@ export function ENTER_YOUR_SQL_CREDS(sqlServerName: string) { return localize('sql.migration.enter.your.sql.creds', "Enter the credentials for source SQL server instance ‘{0}’", sqlServerName); } export const USERNAME = localize('sql.migration.username', "Username"); +export const AUTHENTICATION_TYPE = localize('sql.migration.authentication.type', "Authentication Type"); +export const SQL_LOGIN = localize('sql.migration.sql.login', "SQL Login"); +export const WINDOWS_AUTHENTICATION = localize('sql.migration.windows.auth', "Windows Authentication"); diff --git a/extensions/sql-migration/src/models/stateMachine.ts b/extensions/sql-migration/src/models/stateMachine.ts index ab75ae6d29..3a6c56708f 100644 --- a/extensions/sql-migration/src/models/stateMachine.ts +++ b/extensions/sql-migration/src/models/stateMachine.ts @@ -38,6 +38,11 @@ export enum MigrationTargetType { SQLMI = 'sqlmi' } +export enum MigrationSourceAuthenticationType { + Integrated = 'WindowsAuthentication', + Sql = 'SqlAuthentication' +} + export enum MigrationCutover { ONLINE, OFFLINE @@ -88,7 +93,7 @@ export class MigrationStateModel implements Model, vscode.Disposable { public _accountTenants!: azurecore.Tenant[]; public _connecionProfile!: azdata.connection.ConnectionProfile; - public _authenticationType!: string; + public _authenticationType!: MigrationSourceAuthenticationType; public _sqlServerUsername!: string; public _sqlServerPassword!: string; diff --git a/extensions/sql-migration/src/wizard/skuRecommendationPage.ts b/extensions/sql-migration/src/wizard/skuRecommendationPage.ts index c2c27dba87..81dca3f961 100644 --- a/extensions/sql-migration/src/wizard/skuRecommendationPage.ts +++ b/extensions/sql-migration/src/wizard/skuRecommendationPage.ts @@ -30,6 +30,7 @@ export class SKURecommendationPage extends MigrationWizardPage { private _resourceDropdown!: azdata.DropDownComponent; private _rbg!: azdata.RadioCardGroupComponent; private eventListener!: vscode.Disposable; + private _rbgLoader!: azdata.LoadingComponent; private _supportedProducts: Product[] = [ { @@ -222,10 +223,13 @@ export class SKURecommendationPage extends MigrationWizardPage { this._rbg.selectedCardId = MigrationTargetType.SQLMI; + this._rbgLoader = this._view.modelBuilder.loadingComponent().withItem( + this._rbg + ).component(); const component = view.modelBuilder.divContainer().withItems( [ - this._rbg + this._rbgLoader ] ).component(); return component; @@ -246,9 +250,11 @@ export class SKURecommendationPage extends MigrationWizardPage { private async constructDetails(): Promise { const serverName = (await this.migrationStateModel.getSourceConnectionProfile()).serverName; this._igComponent.value = constants.ASSESSMENT_COMPLETED(serverName); - await this.migrationStateModel.getServerAssessments(); - if (this.migrationStateModel._assessmentResults) { + try { + await this.migrationStateModel.getServerAssessments(); this._detailsComponent.value = constants.SKU_RECOMMENDATION_ALL_SUCCESSFUL(this.migrationStateModel._assessmentResults.databaseAssessments.length); + } catch (e) { + console.log(e); } this.refreshCardText(); } @@ -298,14 +304,7 @@ export class SKURecommendationPage extends MigrationWizardPage { public async onPageEnter(): Promise { - try { - this.migrationStateModel.getServerAssessments().then((result) => { - this.constructDetails(); - }); - } catch (e) { - console.log(e); - } - + this.constructDetails(); this.populateSubscriptionDropdown(); this.wizard.registerNavigationValidator((pageChangeInfo) => { const errors: string[] = []; @@ -362,6 +361,7 @@ export class SKURecommendationPage extends MigrationWizardPage { } public refreshCardText(): void { + this._rbgLoader.loading = true; this.wizard.message = { text: '', level: azdata.window.MessageLevel.Error @@ -399,7 +399,7 @@ export class SKURecommendationPage extends MigrationWizardPage { cards: this._rbg.cards }); } - + this._rbgLoader.loading = false; } } diff --git a/extensions/sql-migration/src/wizard/sqlSourceConfigurationPage.ts b/extensions/sql-migration/src/wizard/sqlSourceConfigurationPage.ts index a189db21f0..905b84fa2b 100644 --- a/extensions/sql-migration/src/wizard/sqlSourceConfigurationPage.ts +++ b/extensions/sql-migration/src/wizard/sqlSourceConfigurationPage.ts @@ -6,12 +6,14 @@ import * as azdata from 'azdata'; import * as os from 'os'; import { MigrationWizardPage } from '../models/migrationWizardPage'; -import { MigrationStateModel, StateChangeEvent } from '../models/stateMachine'; +import { MigrationSourceAuthenticationType, MigrationStateModel, StateChangeEvent } from '../models/stateMachine'; import * as constants from '../constants/strings'; import { createLabelTextComponent, createHeadingTextComponent } from './wizardController'; export class SqlSourceConfigurationPage extends MigrationWizardPage { private _view!: azdata.ModelView; + private _usernameInput!: azdata.InputBoxComponent; + private _password!: azdata.InputBoxComponent; constructor(wizard: azdata.window.Wizard, migrationStateModel: MigrationStateModel) { super(wizard, azdata.window.createWizardPage(constants.SOURCE_CONFIGURATION, 'MigrationModePage'), migrationStateModel); @@ -50,11 +52,15 @@ export class SqlSourceConfigurationPage extends MigrationWizardPage { switch (connectionProfile.authenticationType) { case 'SqlLogin': username = connectionProfile.userName; - this.migrationStateModel._authenticationType = 'SqlAuthentication'; + this.migrationStateModel._authenticationType = MigrationSourceAuthenticationType.Sql; break; case 'Integrated': - username = os.userInfo().username; - this.migrationStateModel._authenticationType = 'WindowsAuthentication'; + if (process.env.USERDOMAIN && process.env.USERNAME) { + username = process.env.USERDOMAIN + '\\' + process.env.USERNAME; + } else { + username = os.userInfo().username; + } + this.migrationStateModel._authenticationType = MigrationSourceAuthenticationType.Integrated; break; default: username = ''; @@ -70,15 +76,25 @@ export class SqlSourceConfigurationPage extends MigrationWizardPage { } ); + const authenticationTypeLable = this._view.modelBuilder.text().withProps({ + value: constants.AUTHENTICATION_TYPE + }).component(); + + const authenticationTypeInput = this._view.modelBuilder.inputBox().withProps({ + value: this.migrationStateModel._authenticationType === MigrationSourceAuthenticationType.Sql ? 'SQL Login' : 'Windows Authentication', + enabled: false + }).component(); + const usernameLable = this._view.modelBuilder.text().withProps({ value: constants.USERNAME, requiredIndicator: true }).component(); - const usernameInput = this._view.modelBuilder.inputBox().withProps({ + this._usernameInput = this._view.modelBuilder.inputBox().withProps({ value: username, - required: true + required: true, + enabled: false }).component(); - usernameInput.onTextChanged(value => { + this._usernameInput.onTextChanged(value => { this.migrationStateModel._sqlServerUsername = value; }); @@ -86,12 +102,12 @@ export class SqlSourceConfigurationPage extends MigrationWizardPage { value: constants.DATABASE_BACKUP_NETWORK_SHARE_PASSWORD_LABEL, requiredIndicator: true }).component(); - const passwordInput = this._view.modelBuilder.inputBox().withProps({ + this._password = this._view.modelBuilder.inputBox().withProps({ value: (await azdata.connection.getCredentials(this.migrationStateModel.sourceConnectionId)).password, required: true, inputType: 'password' }).component(); - passwordInput.onTextChanged(value => { + this._password.onTextChanged(value => { this.migrationStateModel._sqlServerPassword = value; }); @@ -99,10 +115,12 @@ export class SqlSourceConfigurationPage extends MigrationWizardPage { [ sourceCredText, enterYourCredText, + authenticationTypeLable, + authenticationTypeInput, usernameLable, - usernameInput, + this._usernameInput, passwordLabel, - passwordInput + this._password ] ).withLayout({ flexFlow: 'column'