Add Secure Enclaves dropdown with customizable Advanced options (#22019)

This commit is contained in:
Cheena Malhotra
2023-03-01 11:01:50 -08:00
committed by GitHub
parent bf05ea69ef
commit 35f7736b96
7 changed files with 163 additions and 16 deletions

View File

@@ -21,7 +21,7 @@ import * as styler from 'vs/platform/theme/common/styler';
import { InputBox } from 'vs/base/browser/ui/inputbox/inputBox';
import { Widget } from 'vs/base/browser/ui/widget';
import { IClipboardService } from 'vs/platform/clipboard/common/clipboardService';
import { append, $, clearNode } from 'vs/base/browser/dom';
import { append, $, clearNode, createCSSRule } from 'vs/base/browser/dom';
import { IThemeService, IColorTheme } from 'vs/platform/theme/common/themeService';
import { ILogService } from 'vs/platform/log/common/log';
import { IAdsTelemetryService } from 'sql/platform/telemetry/common/telemetry';
@@ -30,6 +30,8 @@ import { ServiceOptionType } from 'sql/platform/connection/common/interfaces';
import { ILayoutService } from 'vs/platform/layout/browser/layoutService';
import { GroupHeaderBackground } from 'sql/platform/theme/common/colorRegistry';
import { ITextResourcePropertiesService } from 'vs/editor/common/services/textResourceConfiguration';
import { AdsWidget } from 'sql/base/browser/ui/adsWidget';
import { Actions } from 'sql/platform/connection/common/constants';
export interface IOptionsDialogOptions extends IModalOptions {
cancelLabel?: string;
@@ -123,7 +125,7 @@ export class OptionsDialog extends Modal {
private fillInOptions(container: HTMLElement, options: azdata.ServiceOption[]): void {
for (let i = 0; i < options.length; i++) {
let option: azdata.ServiceOption = options[i];
let rowContainer = DialogHelper.appendRow(container, option.displayName, 'optionsDialog-label', 'optionsDialog-input');
let rowContainer = DialogHelper.appendRow(container, option.displayName, 'optionsDialog-label', 'optionsDialog-input', `option-${option.name}`);
const optionElement = OptionsDialogHelper.createOptionElement(option, rowContainer, this._optionValues, this._optionElements, this._contextViewService, (name) => this.onOptionLinkClicked(name));
this.disposableStore.add(optionElement.optionWidget);
}
@@ -204,6 +206,7 @@ export class OptionsDialog extends Modal {
let bodyContainer = $('table.optionsDialog-table');
bodyContainer.setAttribute('role', 'presentation');
this.fillInOptions(bodyContainer, serviceOptions);
this.registerOnSelectionChangeEvents(optionValues, bodyContainer);
append(this._optionGroupsContainer!, bodyContainer);
}
this.updateTheme(this._themeService.getColorTheme());
@@ -211,6 +214,71 @@ export class OptionsDialog extends Modal {
this.show();
}
/**
* Registers on selection change event for connection options configured with 'onSelectionChange' property.
*/
private registerOnSelectionChangeEvents(options: { [name: string]: any }, container: HTMLElement): void {
//Register on selection change event for all advanced options
for (let optionName in this._optionElements) {
let widget: Widget = this._optionElements[optionName].optionWidget;
if (widget instanceof SelectBox) {
this._registerSelectionChangeEvents([this._optionElements], this._optionElements[optionName].option, widget, container);
}
}
}
private _registerSelectionChangeEvents(collections: { [optionName: string]: OptionsDialogHelper.IOptionElement }[], option: azdata.ServiceOption, widget: SelectBox, container: HTMLElement) {
if (option?.onSelectionChange) {
option.onSelectionChange.forEach((event) => {
this._register(widget.onDidSelect(value => {
let selectedValue = value.selected;
event?.dependentOptionActions?.forEach((optionAction) => {
let defaultValue: string | undefined = collections[optionAction.optionName]?.option.defaultValue ?? '';
let widget: AdsWidget | undefined = this._findWidget(collections, optionAction.optionName);
if (widget) {
createCSSRule(`.hide-${widget.id} .option-${widget.id}`, `display: none;`);
this._onValueChangeEvent(container, selectedValue, event.values, widget, defaultValue, optionAction.action);
}
});
}));
});
// Clear selection change actions once event is registered.
option.onSelectionChange = undefined;
if (this.optionValues[option.name]) {
widget.selectWithOptionName(this.optionValues[option.name], true);
} else {
widget.select(0, true);
}
}
}
private _onValueChangeEvent(container: HTMLElement, selectedValue: string, acceptedValues: string[],
widget: AdsWidget, defaultValue: string, action: string): void {
if ((acceptedValues.includes(selectedValue.toLocaleLowerCase()) && action === Actions.Show)
|| (!acceptedValues.includes(selectedValue.toLocaleLowerCase()) && action === Actions.Hide)) {
container.classList.remove(`hide-${widget.id}`);
} else {
// Support more Widget classes here as needed.
if (widget instanceof SelectBox) {
widget.select(widget.values.indexOf(defaultValue));
} else if (widget instanceof InputBox) {
widget.value = defaultValue;
}
container.classList.add(`hide-${widget.id}`);
widget.hideMessage();
}
}
/**
* Finds Widget from provided collection of widgets using option name.
* @param collections collections of widgets to search for the widget with the widget Id
* @param id Widget Id
* @returns Widget if found, undefined otherwise
*/
private _findWidget(collections: { [optionName: string]: OptionsDialogHelper.IOptionElement }[], id: string): AdsWidget | undefined {
return collections.find(collection => !!collection[id].optionWidget)[id]?.optionWidget;
}
protected layout(height?: number): void {
}

View File

@@ -42,11 +42,11 @@ export function createOptionElement(option: azdata.ServiceOption, rowContainer:
}
},
ariaLabel: option.displayName
});
}, option.name);
optionWidget.value = optionValue;
inputElement = findElement(rowContainer, 'input');
} else if (option.valueType === ServiceOptionType.category || option.valueType === ServiceOptionType.boolean) {
optionWidget = new SelectBox(possibleInputs, optionValue.toString(), contextViewService, undefined, { ariaLabel: option.displayName });
optionWidget = new SelectBox(possibleInputs, optionValue.toString(), contextViewService, undefined, { ariaLabel: option.displayName }, option.name);
DialogHelper.appendInputSelectBox(rowContainer, optionWidget);
inputElement = findElement(rowContainer, 'monaco-select-box');
} else if (option.valueType === ServiceOptionType.string || option.valueType === ServiceOptionType.password) {
@@ -55,7 +55,7 @@ export function createOptionElement(option: azdata.ServiceOption, rowContainer:
validation: (value: string) => (!value && option.isRequired) ? ({ type: MessageType.ERROR, content: option.displayName + missingErrorMessage }) : null
},
ariaLabel: option.displayName
});
}, option.name);
optionWidget.value = optionValue;
if (option.valueType === ServiceOptionType.password) {
optionWidget.inputElement.type = 'password';