ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-01-21 09:35:38 -05:00
Code Issues Packages Projects Releases Wiki Activity

[SQL Migration] Improve IR registration experience (#22926)

Browse Source 
* Add registration instructions to IR page

* Clean up

* Typo

* Fix typo

* Replace link with aka.ms link

* Refactor + implement regenerate auth keys

* Update strings and clean up comments

* Fix sqlMigrationServiceDetailsDialog

* Fix sqlMigrationServiceDetailsDialog width

* Extract helpers to utils

* Add IR registration instructions to sqlMigrationServiceDetailsDialog

* Update SHIR description slightly
This commit is contained in:
Raymond Truong
2023-05-03 16:43:00 -04:00
committed by GitHub
parent 844ed758a5
commit 0d2ed6e517
5 changed files with 280 additions and 447 deletions
Download Patch File Download Diff File Expand all files Collapse all files

184
extensions/sql-migration/src/dialog/sqlMigrationService/sqlMigrationServiceDetailsDialog.ts
View File

@@ -5,22 +5,18 @@
import * as azdata from 'azdata';
import * as vscode from 'vscode';
import { DatabaseMigration, getSqlMigrationServiceAuthKeys, getSqlMigrationServiceMonitoringData, regenerateSqlMigrationServiceAuthKey } from '../../api/azure';
import { DatabaseMigration, getSqlMigrationServiceMonitoringData } from '../../api/azure';
import { IconPathHelper } from '../../constants/iconPathHelper';
import * as constants from '../../constants/strings';
import { MigrationServiceContext } from '../../models/migrationLocalStorage';
import * as styles from '../../constants/styles';
import { createAuthenticationKeyTable, createRegistrationInstructions, refreshAuthenticationKeyTable } from '../../api/utils';
const CONTROL_MARGIN = '10px';
const COLUMN_WIDTH = '50px';
const STRETCH_WIDTH = '100%';
const LABEL_MARGIN = '0 10px 0 10px';
const VALUE_MARGIN = '0 10px 10px 10px';
const INFO_VALUE_MARGIN = '0 10px 0 0';
const ICON_SIZE = '28px';
const IMAGE_SIZE = '21px';
const AUTH_KEY1 = 'authKey1';
const AUTH_KEY2 = 'authKey2';
export class SqlMigrationServiceDetailsDialog {
@@ -35,7 +31,7 @@ export class SqlMigrationServiceDetailsDialog {
this._dialog = azdata.window.createModelViewDialog(
'',
'SqlMigrationServiceDetailsDialog',
580,
750,
'flyout');
}
@@ -62,7 +58,13 @@ export class SqlMigrationServiceDetailsDialog {
}
private async createServiceContent(view: azdata.ModelView, serviceContext: MigrationServiceContext, migration: DatabaseMigration): Promise<void> {
this._migrationServiceAuthKeyTable = this._createIrTable(view);
const instructions = createRegistrationInstructions(view, false);
await instructions.updateCssStyles({
...styles.BODY_CSS,
'margin': LABEL_MARGIN,
})
this._migrationServiceAuthKeyTable = createAuthenticationKeyTable(view, '50px', '100%');
const serviceNode = (await getSqlMigrationServiceMonitoringData(
serviceContext.azureAccount!,
serviceContext.subscription!,
@@ -88,11 +90,7 @@ export class SqlMigrationServiceDetailsDialog {
this._createTextItem(view, serviceContext.migrationService?.properties.resourceGroup!, VALUE_MARGIN),
this._createTextItem(view, constants.SQL_MIGRATION_SERVICE_DETAILS_IR_LABEL, LABEL_MARGIN),
this._createTextItem(view, serviceNodeName, VALUE_MARGIN),
this._createTextItem(
view,
constants.SQL_MIGRATION_SERVICE_DETAILS_AUTH_KEYS_LABEL,
INFO_VALUE_MARGIN,
constants.SQL_MIGRATION_SERVICE_DETAILS_AUTH_KEYS_TITLE),
instructions,
this._migrationServiceAuthKeyTable,
])
.withLayout({ flexFlow: 'column' })
@@ -100,7 +98,16 @@ export class SqlMigrationServiceDetailsDialog {
.component();
await view.initializeModel(flexContainer);
return await this._refreshAuthTable(view, serviceContext, migration);
await refreshAuthenticationKeyTable(
view,
this._migrationServiceAuthKeyTable,
serviceContext.azureAccount!,
serviceContext.subscription!,
serviceContext.migrationService?.properties.resourceGroup!,
serviceContext.migrationService?.location.toUpperCase()!,
serviceContext.migrationService!
);
}
private _createHeading(view: azdata.ModelView, migration: DatabaseMigration): azdata.FlexContainer {
@@ -164,153 +171,4 @@ export class SqlMigrationServiceDetailsDialog {
})
.component();
}
private _createIrTable(view: azdata.ModelView): azdata.DeclarativeTableComponent {
return view.modelBuilder
.declarativeTable()
.withProps({
columns: [
this._createColumn(constants.NAME, COLUMN_WIDTH, azdata.DeclarativeDataType.string),
this._createColumn(constants.AUTH_KEY_COLUMN_HEADER, STRETCH_WIDTH, azdata.DeclarativeDataType.string),
this._createColumn('', COLUMN_WIDTH, azdata.DeclarativeDataType.component),
],
CSSStyles: {
'margin': VALUE_MARGIN,
'text-align': 'left',
},
})
.component();
}
private _createColumn(name: string, width: string, valueType: azdata.DeclarativeDataType): azdata.DeclarativeTableColumn {
return {
displayName: name,
valueType: valueType,
width: width,
isReadOnly: true,
rowCssStyles: {
...styles.BODY_CSS
},
headerCssStyles: {
...styles.BODY_CSS
},
};
}
private async _regenerateAuthKey(view: azdata.ModelView, serviceContext: MigrationServiceContext, migration: DatabaseMigration, keyName: string): Promise<void> {
const keys = await regenerateSqlMigrationServiceAuthKey(
serviceContext.azureAccount!,
serviceContext.subscription!,
serviceContext.migrationService?.properties.resourceGroup!,
serviceContext.migrationService?.properties.location?.toUpperCase()!,
serviceContext.migrationService?.name!,
keyName);
if (keys?.authKey1 && keyName === AUTH_KEY1) {
await this._updateTableCell(this._migrationServiceAuthKeyTable, 0, 1, keys.authKey1, constants.SERVICE_KEY1_LABEL);
}
else if (keys?.authKey2 && keyName === AUTH_KEY2) {
await this._updateTableCell(this._migrationServiceAuthKeyTable, 1, 1, keys.authKey2, constants.SERVICE_KEY2_LABEL);
}
}
private async _updateTableCell(table: azdata.DeclarativeTableComponent, row: number, col: number, value: string, keyName: string): Promise<void> {
const dataValues = table.dataValues!;
dataValues![row][col].value = value;
await table.setDataValues([]);
await table.setDataValues(dataValues);
await vscode.window.showInformationMessage(constants.AUTH_KEY_REFRESHED(keyName));
}
private async _refreshAuthTable(view: azdata.ModelView, serviceContext: MigrationServiceContext, migration: DatabaseMigration): Promise<void> {
const keys = await getSqlMigrationServiceAuthKeys(
serviceContext.azureAccount!,
serviceContext.subscription!,
serviceContext.migrationService?.properties.resourceGroup!,
serviceContext.migrationService?.location.toUpperCase()!,
serviceContext.migrationService?.name!);
const copyKey1Button = view.modelBuilder
.button()
.withProps({
title: constants.COPY_KEY1,
iconPath: IconPathHelper.copy,
height: IMAGE_SIZE,
width: IMAGE_SIZE,
ariaLabel: constants.COPY_KEY1,
})
.component();
this._disposables.push(copyKey1Button.onDidClick(async (e) => {
await vscode.env.clipboard.writeText(keys.authKey1);
void vscode.window.showInformationMessage(constants.SERVICE_KEY1_COPIED_HELP);
}));
const copyKey2Button = view.modelBuilder
.button()
.withProps({
title: constants.COPY_KEY2,
iconPath: IconPathHelper.copy,
height: IMAGE_SIZE,
width: IMAGE_SIZE,
ariaLabel: constants.COPY_KEY2,
})
.component();
this._disposables.push(copyKey2Button.onDidClick(async (e) => {
await vscode.env.clipboard.writeText(keys.authKey2);
void vscode.window.showInformationMessage(constants.SERVICE_KEY2_COPIED_HELP);
}));
const refreshKey1Button = view.modelBuilder
.button()
.withProps({
title: constants.REFRESH_KEY1,
iconPath: IconPathHelper.refresh,
height: IMAGE_SIZE,
width: IMAGE_SIZE,
ariaLabel: constants.REFRESH_KEY1,
})
.component();
this._disposables.push(refreshKey1Button.onDidClick(
async (e) => await this._regenerateAuthKey(view, serviceContext, migration, AUTH_KEY1)));
const refreshKey2Button = view.modelBuilder
.button()
.withProps({
title: constants.REFRESH_KEY2,
iconPath: IconPathHelper.refresh,
height: IMAGE_SIZE,
width: IMAGE_SIZE,
ariaLabel: constants.REFRESH_KEY2,
})
.component();
this._disposables.push(refreshKey2Button.onDidClick(
async (e) => await this._regenerateAuthKey(view, serviceContext, migration, AUTH_KEY2)));
await this._migrationServiceAuthKeyTable.updateProperties({
dataValues: [
[
{ value: constants.SERVICE_KEY1_LABEL },
{ value: keys.authKey1 },
{
value: view.modelBuilder
.flexContainer()
.withItems([copyKey1Button, refreshKey1Button])
.component()
}
],
[
{ value: constants.SERVICE_KEY2_LABEL },
{ value: keys.authKey2 },
{
value: view.modelBuilder
.flexContainer()
.withItems([copyKey2Button, refreshKey2Button])
.component()
}
]
]
});
}
}