add restore default values button for ports and container settings (#4195)

* add restore default values button for ports and container settings

* change some resource strings
This commit is contained in:
Alan Ren
2019-02-26 12:48:35 -08:00
committed by GitHub
parent 109aafcbc0
commit 8bfb1a9d39
5 changed files with 82 additions and 39 deletions

View File

@@ -16,23 +16,23 @@ export enum TargetClusterType {
}
export interface Succeeded<T> {
readonly succeeded: true;
readonly result: T;
readonly succeeded: true;
readonly result: T;
}
export interface Failed {
readonly succeeded: false;
readonly error: string[];
readonly succeeded: false;
readonly error: string[];
}
export type Errorable<T> = Succeeded<T> | Failed;
export function succeeded<T>(e: Errorable<T>): e is Succeeded<T> {
return e.succeeded;
return e.succeeded;
}
export function failed<T>(e: Errorable<T>): e is Failed {
return !e.succeeded;
return !e.succeeded;
}
export interface ClusterPorts {
sql: string;
@@ -59,7 +59,13 @@ export interface TargetClusterTypeInfo {
}
export interface ToolInfo {
name: string,
description: string,
isInstalled: boolean
name: string;
description: string;
status: ToolInstallationStatus;
}
export enum ToolInstallationStatus {
Installed,
NotInstalled,
Installing
}

View File

@@ -20,7 +20,6 @@ const kubectl = kubectlCreate(host, fs, shell, installDependencies);
export let controller: MainController;
export function activate(context: vscode.ExtensionContext) {
kubectl.checkPresent(CheckPresentMessageMode.Activation);
controller = new MainController(context, kubectl);
controller.activate();
}

View File

@@ -4,9 +4,8 @@
*--------------------------------------------------------------------------------------------*/
'use strict';
import { IKubeConfigParser } from '../../data/kubeConfigParser';
import { ClusterInfo, TargetClusterType, ClusterPorts, ContainerRegistryInfo, TargetClusterTypeInfo, ToolInfo } from '../../interfaces';
import { getContexts, KubectlContext } from '../../kubectl/kubectlUtils';
import { TargetClusterType, ClusterPorts, ContainerRegistryInfo, TargetClusterTypeInfo, ToolInfo, ToolInstallationStatus } from '../../interfaces';
import { getContexts, KubectlContext } from '../../kubectl/kubectlUtils';
import { Kubectl } from '../../kubectl/kubectl';
import * as nls from 'vscode-nls';
@@ -16,7 +15,7 @@ export class CreateClusterModel {
private _tmp_tools_installed: boolean = false;
constructor(private _kubectl : Kubectl) {
constructor(private _kubectl: Kubectl) {
}
public async loadClusters(): Promise<KubectlContext[]> {
@@ -40,8 +39,8 @@ export class CreateClusterModel {
public getDefaultContainerRegistryInfo(): Thenable<ContainerRegistryInfo> {
let promise = new Promise<ContainerRegistryInfo>(resolve => {
resolve({
registry: 'http://repo.corp.microsoft.com/',
repository: 'aris-p-master-dsmain-standard',
registry: 'private-repo.microsoft.com',
repository: 'mssql-private-preview',
imageTag: 'latest'
});
});
@@ -74,19 +73,19 @@ export class CreateClusterModel {
public getRequiredToolStatus(): Thenable<ToolInfo[]> {
let kubeCtl = {
name: 'KUBECTL',
description: 'KUBECTL',
isInstalled: true
name: 'kubectl',
description: 'Tool used for managing the Kubernetes cluster',
status: ToolInstallationStatus.Installed
};
let mssqlCtl = {
name: 'MSSQLCTL',
description: 'MSSQLCTL',
isInstalled: true
name: 'mssqlctl',
description: 'Command-line tool for installing and managing the SQL Server big data cluster',
status: ToolInstallationStatus.Installed
};
let azureCli = {
name: 'AzureCLI',
description: 'AzureCLI',
isInstalled: this._tmp_tools_installed
name: 'Azure CLI',
description: 'Tool used for managing Azure services',
status: this._tmp_tools_installed ? ToolInstallationStatus.Installed : ToolInstallationStatus.NotInstalled
};
let promise = new Promise<ToolInfo[]>(resolve => {
setTimeout(() => {

View File

@@ -6,7 +6,7 @@
import * as sqlops from 'sqlops';
import { WizardPageBase } from '../../wizardPageBase';
import { TargetClusterTypeInfo } from '../../../interfaces';
import { TargetClusterTypeInfo, ToolInstallationStatus } from '../../../interfaces';
import * as nls from 'vscode-nls';
import { CreateClusterWizard } from '../createClusterWizard';
@@ -184,13 +184,26 @@ export class SelectTargetClusterTypePage extends WizardPageBase<CreateClusterWiz
this.isLoading = false;
this.toolsLoadingWrapper.loading = false;
this.refreshToolsButton.enabled = true;
this.installToolsButton.enabled = tools.filter(tool => !tool.isInstalled).length !== 0;
this.installToolsButton.enabled = tools.filter(tool => tool.status !== ToolInstallationStatus.Installed).length !== 0;
this.isValid = !this.installToolsButton.enabled;
this.wizard.wizardObject.message = null;
let tableData = tools.map(tool => {
return [tool.name, tool.description, tool.isInstalled ? localize('bdc-create.InstalledText', 'Installed') : localize('bdc-create.NotInstalledText', 'Not Installed')];
return [tool.name, tool.description, this.getStatusText(tool.status)];
});
this.toolsTable.data = tableData;
});
}
private getStatusText(status: ToolInstallationStatus): string {
switch (status) {
case ToolInstallationStatus.Installed:
return localize('bdc-create.InstalledText', 'Installed');
case ToolInstallationStatus.NotInstalled:
return localize('bdc-create.NotInstalledText', 'Not Installed');
case ToolInstallationStatus.Installing:
return localize('bdc-create.InstallingText', 'Installing');
default:
return 'unknown status';
}
}
}

View File

@@ -13,6 +13,7 @@ import { CreateClusterWizard } from '../createClusterWizard';
const localize = nls.loadMessageBundle();
const UserNameInputWidth = '300px';
const PortInputWidth = '100px';
const RestoreDefaultValuesText = localize('bdc-create.RestoreDefaultValuesText', 'Restore Default Values');
export class SettingsPage extends WizardPageBase<CreateClusterWizard> {
constructor(wizard: CreateClusterWizard) {
@@ -44,24 +45,36 @@ export class SettingsPage extends WizardPageBase<CreateClusterWizard> {
}, 'password');
// Port settings
let sqlPortInput = this.createInputWithLabel(view, localize('bdc-create.SQLPortText', 'SQL Master port'), true, PortInputWidth, clusterPorts.sql, (inputBox: sqlops.InputBoxComponent) => {
let sqlPortInput = this.createInputWithLabel(view, localize('bdc-create.SQLPortText', 'SQL Server master'), true, PortInputWidth, clusterPorts.sql, (inputBox: sqlops.InputBoxComponent) => {
this.wizard.model.sqlPort = inputBox.value;
});
let knoxPortInput = this.createInputWithLabel(view, localize('bdc-create.KnoxPortText', 'Knox port'), true, PortInputWidth, clusterPorts.knox, (inputBox: sqlops.InputBoxComponent) => {
let knoxPortInput = this.createInputWithLabel(view, localize('bdc-create.KnoxPortText', 'Knox'), true, PortInputWidth, clusterPorts.knox, (inputBox: sqlops.InputBoxComponent) => {
this.wizard.model.knoxPort = inputBox.value;
});
let controllerPortInput = this.createInputWithLabel(view, localize('bdc-create.ControllerPortText', 'Controller port'), true, PortInputWidth, clusterPorts.controller, (inputBox: sqlops.InputBoxComponent) => {
let controllerPortInput = this.createInputWithLabel(view, localize('bdc-create.ControllerPortText', 'Controller'), true, PortInputWidth, clusterPorts.controller, (inputBox: sqlops.InputBoxComponent) => {
this.wizard.model.controllerPort = inputBox.value;
});
let proxyPortInput = this.createInputWithLabel(view, localize('bdc-create.ProxyPortText', 'Proxy port'), true, PortInputWidth, clusterPorts.proxy, (inputBox: sqlops.InputBoxComponent) => {
let proxyPortInput = this.createInputWithLabel(view, localize('bdc-create.ProxyPortText', 'Proxy'), true, PortInputWidth, clusterPorts.proxy, (inputBox: sqlops.InputBoxComponent) => {
this.wizard.model.proxyPort = inputBox.value;
});
let grafanaPortInput = this.createInputWithLabel(view, localize('bdc-create.GrafanaPortText', 'Grafana port'), true, PortInputWidth, clusterPorts.grafana, (inputBox: sqlops.InputBoxComponent) => {
let grafanaPortInput = this.createInputWithLabel(view, localize('bdc-create.GrafanaPortText', 'Grafana dashboard'), true, PortInputWidth, clusterPorts.grafana, (inputBox: sqlops.InputBoxComponent) => {
this.wizard.model.grafanaPort = inputBox.value;
});
let kibanaPortInput = this.createInputWithLabel(view, localize('bdc-create.KibanaPortText', 'Kibana port'), true, PortInputWidth, clusterPorts.kibana, (inputBox: sqlops.InputBoxComponent) => {
let kibanaPortInput = this.createInputWithLabel(view, localize('bdc-create.KibanaPortText', 'Kibana dashboard'), true, PortInputWidth, clusterPorts.kibana, (inputBox: sqlops.InputBoxComponent) => {
this.wizard.model.kibanaPort = inputBox.value;
});
let restorePortSettingsButton = view.modelBuilder.button().withProperties<sqlops.ButtonProperties>({
label: RestoreDefaultValuesText,
width: 200
}).component();
restorePortSettingsButton.onDidClick(() => {
sqlPortInput.input.value = clusterPorts.sql;
knoxPortInput.input.value = clusterPorts.knox;
controllerPortInput.input.value = clusterPorts.controller;
proxyPortInput.input.value = clusterPorts.proxy;
grafanaPortInput.input.value = clusterPorts.grafana;
kibanaPortInput.input.value = clusterPorts.kibana;
});
// Container Registry Settings
let registryInput = this.createInputWithLabel(view, localize('bdc-create.RegistryText', 'Registry'), true, UserNameInputWidth, containerRegistryInfo.registry, (inputBox: sqlops.InputBoxComponent) => {
@@ -83,10 +96,19 @@ export class SettingsPage extends WizardPageBase<CreateClusterWizard> {
let registryPasswordInput = this.createInputWithLabel(view, localize('bdc-create.RegistryPasswordText', 'Password'), false, UserNameInputWidth, '', (inputBox: sqlops.InputBoxComponent) => {
this.wizard.model.containerRegistryPassword = inputBox.value;
});
let restoreContainerSettingsButton = view.modelBuilder.button().withProperties<sqlops.ButtonProperties>({
label: RestoreDefaultValuesText,
width: 200
}).component();
restoreContainerSettingsButton.onDidClick(() => {
registryInput.input.value = containerRegistryInfo.registry;
repositoryInput.input.value = containerRegistryInfo.repository;
imageTagInput.input.value = containerRegistryInfo.imageTag;
});
let basicSettingsGroup = view.modelBuilder.groupContainer().withItems([adminUserNameInput, adminPasswordInput]).withLayout({ header: localize('bdc-create.BasicSettingsText', 'Basic Settings'), collapsible: true }).component();
let containerSettingsGroup = view.modelBuilder.groupContainer().withItems([registryInput, repositoryInput, imageTagInput, registryUserNameInput, registryPasswordInput]).withLayout({ header: localize('bdc-create.ContainerRegistrySettings', 'Container Registry Settings'), collapsible: true }).component();
let portSettingsGroup = view.modelBuilder.groupContainer().withItems([sqlPortInput, knoxPortInput, controllerPortInput, proxyPortInput, grafanaPortInput, kibanaPortInput]).withLayout({ header: localize('bdc-create.PortSettings', 'Port Settings (Optional)'), collapsible: true, collapsed: true }).component();
let basicSettingsGroup = view.modelBuilder.groupContainer().withItems([adminUserNameInput.row, adminPasswordInput.row]).withLayout({ header: localize('bdc-create.BasicSettingsText', 'Basic Settings'), collapsible: true }).component();
let containerSettingsGroup = view.modelBuilder.groupContainer().withItems([registryInput.row, repositoryInput.row, imageTagInput.row, registryUserNameInput.row, registryPasswordInput.row, restoreContainerSettingsButton]).withLayout({ header: localize('bdc-create.ContainerRegistrySettings', 'Container Registry Settings'), collapsible: true }).component();
let portSettingsGroup = view.modelBuilder.groupContainer().withItems([sqlPortInput.row, knoxPortInput.row, controllerPortInput.row, proxyPortInput.row, grafanaPortInput.row, kibanaPortInput.row, restorePortSettingsButton]).withLayout({ header: localize('bdc-create.PortSettings', 'Port Settings (Optional)'), collapsible: true, collapsed: true }).component();
let acceptEulaCheckbox = view.modelBuilder.checkBox().component();
acceptEulaCheckbox.checked = false;
@@ -129,7 +151,7 @@ export class SettingsPage extends WizardPageBase<CreateClusterWizard> {
});
}
private createInputWithLabel(view: sqlops.ModelView, label: string, isRequiredField: boolean, inputWidth: string, initialValue: string, textChangedHandler: (inputBox: sqlops.InputBoxComponent) => void, inputType: string = 'text'): sqlops.FlexContainer {
private createInputWithLabel(view: sqlops.ModelView, label: string, isRequiredField: boolean, inputWidth: string, initialValue: string, textChangedHandler: (inputBox: sqlops.InputBoxComponent) => void, inputType: string = 'text'): { row: sqlops.FlexContainer, input: sqlops.InputBoxComponent } {
let input = view.modelBuilder.inputBox().withProperties({
required: isRequiredField,
inputType: inputType
@@ -141,7 +163,11 @@ export class SettingsPage extends WizardPageBase<CreateClusterWizard> {
textChangedHandler(input);
});
input.value = initialValue;
return this.createRow(view, [text, input]);
let row = this.createRow(view, [text, input]);
return {
input: input,
row: row
};
}
private createRow(view: sqlops.ModelView, items: sqlops.Component[]): sqlops.FlexContainer {