Register disposables for cleanup - Part 1 (#24092)

This commit is contained in:
Cheena Malhotra
2023-08-07 16:44:23 -07:00
committed by GitHub
parent 18a79c8d82
commit 7a417f01ed
33 changed files with 127 additions and 124 deletions

View File

@@ -141,7 +141,7 @@ export class Designer extends Disposable {
this._propertiesPaneContainer = DOM.$('.properties-container');
this._verticalSplitView = new SplitView(this._verticalSplitViewContainer, { orientation: Orientation.VERTICAL });
this._horizontalSplitView = new SplitView(this._horizontalSplitViewContainer, { orientation: Orientation.HORIZONTAL });
this._contentTabbedPanel = new TabbedPanel(this._tabbedPanelContainer);
this._contentTabbedPanel = this._register(new TabbedPanel(this._tabbedPanelContainer));
this._container.appendChild(this._verticalSplitViewContainer);
this._contentContainer.appendChild(this._topContentContainer);
this._contentContainer.appendChild(this._tabbedPanelContainer);
@@ -154,7 +154,7 @@ export class Designer extends Disposable {
maximumSize: Number.POSITIVE_INFINITY,
onDidChange: Event.None
}, Sizing.Distribute);
this._scriptTabbedPannel = new TabbedPanel(this._editorContainer);
this._scriptTabbedPannel = this._register(new TabbedPanel(this._editorContainer));
this._issuesView = this._instantiationService.createInstance(DesignerIssuesTabPanelView);
this._register(this._issuesView.onIssueSelected((path) => {
if (path && path.length > 0) {
@@ -638,6 +638,7 @@ export class Designer extends Disposable {
dropdown.select(idx);
}
}
this._register(dropdown);
break;
default:
break;
@@ -693,24 +694,24 @@ export class Designer extends Disposable {
container.appendChild(DOM.$('')).appendChild(DOM.$('span.component-label')).innerText = componentDefinition.componentProperties?.title ?? '';
const inputContainer = container.appendChild(DOM.$(''));
const inputProperties = componentDefinition.componentProperties as InputBoxProperties;
const input = new InputBox(inputContainer, this._contextViewProvider, {
const input = this._register(new InputBox(inputContainer, this._contextViewProvider, {
ariaLabel: inputProperties.title,
type: inputProperties.inputType,
ariaDescription: componentDefinition.description,
inputBoxStyles: defaultInputBoxStyles
});
input.onLoseFocus((args) => {
}));
this._register(input.onLoseFocus((args) => {
if (args.hasChanged) {
this.handleEdit({ type: DesignerEditType.Update, path: propertyPath, value: args.value, source: view });
}
});
input.onInputFocus(() => {
}));
this._register(input.onInputFocus(() => {
if (view === 'PropertiesView') {
this._propertiesPane.updateDescription(componentDefinition);
} else if (view === 'TabsView' || view === 'TopContentView') {
this.updatePropertiesPane(DesignerRootObjectPath);
}
});
}));
if (view === 'TopContentView' && inputProperties.width) {
input.width = inputProperties.width as number;
}
@@ -722,39 +723,39 @@ export class Designer extends Disposable {
const dropdownProperties = componentDefinition.componentProperties as DropDownProperties;
let dropdown;
if (dropdownProperties.isEditable) {
dropdown = new Dropdown(dropdownContainer, this._contextViewProvider, {
dropdown = this._register(new Dropdown(dropdownContainer, this._contextViewProvider, {
values: dropdownProperties.values as string[] || [],
ariaLabel: componentDefinition.componentProperties?.title,
ariaDescription: componentDefinition.description,
...defaultEditableDropdownStyles
});
dropdown.onValueChange((value) => {
}));
this._register(dropdown.onValueChange((value) => {
this.handleEdit({ type: DesignerEditType.Update, path: propertyPath, value: value, source: view });
});
dropdown.onFocus(() => {
}));
this._register(dropdown.onFocus(() => {
if (view === 'PropertiesView') {
this._propertiesPane.updateDescription(componentDefinition);
} else if (view === 'TabsView' || view === 'TopContentView') {
this.updatePropertiesPane(DesignerRootObjectPath);
}
});
}));
} else {
dropdown = new SelectBox(dropdownProperties.values as string[] || [], undefined, defaultSelectBoxStyles, this._contextViewProvider, undefined, {
dropdown = this._register(new SelectBox(dropdownProperties.values as string[] || [], undefined, defaultSelectBoxStyles, this._contextViewProvider, undefined, {
ariaLabel: componentDefinition.componentProperties?.title,
ariaDescription: componentDefinition.description
});
}));
dropdown.render(dropdownContainer);
dropdown.selectElem.style.height = '25px';
dropdown.onDidSelect((e) => {
this._register(dropdown.onDidSelect((e) => {
this.handleEdit({ type: DesignerEditType.Update, path: propertyPath, value: e.selected, source: view });
});
dropdown.onDidFocus(() => {
}));
this._register(dropdown.onDidFocus(() => {
if (view === 'PropertiesView') {
this._propertiesPane.updateDescription(componentDefinition);
} else if (view === 'TabsView' || view === 'TopContentView') {
this.updatePropertiesPane(DesignerRootObjectPath);
}
});
}));
}
component = dropdown;
break;
@@ -762,17 +763,17 @@ export class Designer extends Disposable {
container.appendChild(DOM.$('')).appendChild(DOM.$('span.component-label')).innerText = componentDefinition.componentProperties?.title ?? '';
const checkboxContainer = container.appendChild(DOM.$(''));
const checkboxProperties = componentDefinition.componentProperties as CheckBoxProperties;
const checkbox = new Checkbox(checkboxContainer, { ...defaultCheckboxStyles, label: '', ariaLabel: checkboxProperties.title, ariaDescription: componentDefinition.description });
checkbox.onChange((newValue) => {
const checkbox = this._register(new Checkbox(checkboxContainer, { ...defaultCheckboxStyles, label: '', ariaLabel: checkboxProperties.title, ariaDescription: componentDefinition.description }));
this._register(checkbox.onChange((newValue) => {
this.handleEdit({ type: DesignerEditType.Update, path: propertyPath, value: newValue, source: view });
});
checkbox.onFocus(() => {
}));
this._register(checkbox.onFocus(() => {
if (view === 'PropertiesView') {
this._propertiesPane.updateDescription(componentDefinition);
} else if (view === 'TabsView' || view === 'TopContentView') {
this.updatePropertiesPane(DesignerRootObjectPath);
}
});
}));
component = checkbox;
break;
case 'table':
@@ -782,7 +783,7 @@ export class Designer extends Disposable {
const tableProperties = componentDefinition.componentProperties as DesignerTableProperties;
const taskbar = this.addTableTaskbar(container, tableProperties);
const tableContainer = container.appendChild(DOM.$('.full-row'));
const table = new Table(tableContainer, this._accessibilityService, this._quickInputService, getTableStyles({
const table = this._register(new Table(tableContainer, this._accessibilityService, this._quickInputService, getTableStyles({
listActiveSelectionBackground: undefined,
listActiveSelectionForeground: undefined,
listFocusAndSelectionBackground: undefined,
@@ -805,7 +806,7 @@ export class Designer extends Disposable {
rowHeight: TableRowHeight,
headerRowHeight: TableHeaderRowHeight,
editorLock: new Slick.EditorLock()
});
}));
table.grid.setSelectionModel(new RowSelectionModel());
if (taskbar) {
taskbar.context = { table: table, path: propertyPath, source: view };
@@ -854,14 +855,14 @@ export class Designer extends Disposable {
width: propertyDefinition.componentProperties.width as number
});
table.registerPlugin(checkboxColumn);
checkboxColumn.onChange((e) => {
this._register(checkboxColumn.onChange((e) => {
this.handleEdit({
type: DesignerEditType.Update,
path: [...propertyPath, e.row, propertyDefinition.propertyName],
value: e.value,
source: view
});
});
}));
return checkboxColumn.definition;
case 'dropdown':
const dropdownProperties = propertyDefinition.componentProperties as DropDownProperties;

View File

@@ -123,7 +123,7 @@ export class OptionsDialog extends Modal {
let option: azdata.ServiceOption = options[i];
let rowContainer = DialogHelper.appendRow(container, option.displayName, 'optionsDialog-label', 'optionsDialog-input', `option-${option.name}`, option.isRequired);
const optionElement = OptionsDialogHelper.createOptionElement(option, rowContainer, this._optionValues, this._optionElements, this._contextViewService, (name) => this.onOptionLinkClicked(name));
this.disposableStore.add(optionElement.optionWidget);
this._register(optionElement.optionWidget);
}
}

View File

@@ -43,7 +43,7 @@ export abstract class ComponentBase<TPropertyBag extends azdata.ComponentPropert
abstract descriptor: IComponentDescriptor;
abstract modelStore: IModelStore;
protected _onEventEmitter = new Emitter<IComponentEventArgs>();
protected _onEventEmitter = this._register(new Emitter<IComponentEventArgs>());
public layout(): void {
if (!this._changeRef['destroyed']) {

View File

@@ -48,7 +48,7 @@ export default class ListBoxComponent extends ComponentBase<azdata.ListBoxProper
items: [],
...defaultListBoxStyles
}, this.contextViewService);
this._input.onKeyDown(e => {
this._register(this._input.onKeyDown(e => {
if (this._input.selectedOptions.length > 0) {
const key = e.keyCode;
const ctrlOrCmd = e.ctrlKey || e.metaKey;
@@ -65,7 +65,7 @@ export default class ListBoxComponent extends ComponentBase<azdata.ListBoxProper
e.stopPropagation();
}
}
});
}));
this._input.render(this._inputContainer.nativeElement);
this._register(this._input);

View File

@@ -326,7 +326,7 @@ export class ChartView extends Disposable implements IPanelView {
let value = this.state ? this.state.options[entry] || option.default : option.default;
switch (option.type) {
case ControlType.checkbox:
let checkbox = new Checkbox(optionInput, {
let checkbox = this._register(new Checkbox(optionInput, {
label: option.label,
ariaLabel: option.label,
checked: value,
@@ -338,25 +338,25 @@ export class ChartView extends Disposable implements IPanelView {
}
}
}
});
}));
setFunc = (val: boolean) => {
checkbox.checked = val;
};
break;
case ControlType.combo:
//pass options into changeAltNames in order for SelectBox to show user-friendly names.
let dropdown = new SelectBox(option.displayableOptions || this.changeToAltNames(option.options!), undefined!, defaultSelectBoxStyles, this._contextViewService);
let dropdown = this._register(new SelectBox(option.displayableOptions || this.changeToAltNames(option.options!), undefined!, defaultSelectBoxStyles, this._contextViewService));
dropdown.setAriaLabel(option.label);
dropdown.select(option.options!.indexOf(value));
dropdown.render(optionInput);
dropdown.onDidSelect(e => {
this._register(dropdown.onDidSelect(e => {
if (this._options[entry] !== option.options![e.index]) {
(this._options[entry] as any) = option.options![e.index];
if (this.insight) {
this.insight.options = this._options;
}
}
});
}));
setFunc = (val: string) => {
if (!isUndefinedOrNull(val)) {
dropdown.select(option.options!.indexOf(val));
@@ -364,19 +364,19 @@ export class ChartView extends Disposable implements IPanelView {
};
break;
case ControlType.input:
let input = new InputBox(optionInput, this._contextViewService, {
let input = this._register(new InputBox(optionInput, this._contextViewService, {
ariaLabel: option.label,
inputBoxStyles: defaultInputBoxStyles
});
}));
input.value = value || '';
input.onDidChange(e => {
this._register(input.onDidChange(e => {
if (this._options[entry] !== e) {
(this._options[entry] as any) = e;
if (this.insight) {
this.insight.options = this._options;
}
}
});
}));
setFunc = (val: string) => {
if (!isUndefinedOrNull(val)) {
input.value = val;
@@ -384,13 +384,13 @@ export class ChartView extends Disposable implements IPanelView {
};
break;
case ControlType.numberInput:
let numberInput = new InputBox(optionInput, this._contextViewService, {
let numberInput = this._register(new InputBox(optionInput, this._contextViewService, {
type: 'number',
ariaLabel: option.label,
inputBoxStyles: defaultInputBoxStyles
});
}));
numberInput.value = value || '';
numberInput.onDidChange(e => {
this._register(numberInput.onDidChange(e => {
if (this._options[entry] !== e) {
// When user clears the input box, the value we get from the input box will be empty string.
(this._options[entry] as any) = (e === '' ? undefined : Number(e));
@@ -398,7 +398,7 @@ export class ChartView extends Disposable implements IPanelView {
this.insight.options = this._options;
}
}
});
}));
setFunc = (val: string) => {
if (!isUndefinedOrNull(val)) {
numberInput.value = val;
@@ -406,21 +406,21 @@ export class ChartView extends Disposable implements IPanelView {
};
break;
case ControlType.dateInput:
let dateInput = new InputBox(optionInput, this._contextViewService, {
let dateInput = this._register(new InputBox(optionInput, this._contextViewService, {
type: 'datetime-local',
ariaLabel: option.label,
inputBoxStyles: defaultInputBoxStyles
});
}));
dateInput.value = value || '';
dateInput.onDidChange(e => {
this._register(dateInput.onDidChange(e => {
if (this._options[entry] !== e) {
(this._options[entry] as any) = e;
if (this.insight) {
this.insight.options = this._options;
}
}
});
}));
setFunc = (val: string) => {
if (!isUndefinedOrNull(val)) {
dateInput.value = val;

View File

@@ -161,7 +161,7 @@ export class ChangeMaxRowsActionItem extends Disposable implements IActionViewIt
super();
this._options = ['200', '1000', '10000'];
this._currentOptionsIndex = 0;
this.selectBox = new SelectBox(this._options, this._options[this._currentOptionsIndex], defaultSelectBoxStyles, contextViewService);
this.selectBox = this._register(new SelectBox(this._options, this._options[this._currentOptionsIndex], defaultSelectBoxStyles, contextViewService));
this._registerListeners();
this._refreshOptions();
this.defaultRowCount = Number(this._options[this._currentOptionsIndex]);

View File

@@ -115,16 +115,16 @@ export class ImageCalloutDialog extends Modal {
DOM.append(locationRow, this._imageLocationLabel);
let radioButtonGroup = DOM.$('.radio-group');
this._imageLocalRadioButton = new RadioButton(radioButtonGroup, {
this._imageLocalRadioButton = this._register(new RadioButton(radioButtonGroup, {
label: constants.localImageLabel,
enabled: true,
checked: true
});
this._imageRemoteRadioButton = new RadioButton(radioButtonGroup, {
}));
this._imageRemoteRadioButton = this._register(new RadioButton(radioButtonGroup, {
label: constants.remoteImageLabel,
enabled: true,
checked: false
});
}));
this._imageLocalRadioButton.name = this._editorImageLocationGroup;
this._imageLocalRadioButton.value = constants.locationLocal;
this._imageRemoteRadioButton.name = this._editorImageLocationGroup;

View File

@@ -365,7 +365,7 @@ export class ProfilerEditor extends EditorPane {
let editorContainer = this._createProfilerEditor();
let tabbedPanelContainer = document.createElement('div');
tabbedPanelContainer.className = 'profiler-tabbedPane';
this._tabbedPanel = new TabbedPanel(tabbedPanelContainer);
this._tabbedPanel = this._register(new TabbedPanel(tabbedPanelContainer));
attachTabbedPanelStyler(this._tabbedPanel, this.themeService);
const expandPanel = () => {
@@ -415,7 +415,7 @@ export class ProfilerEditor extends EditorPane {
});
const detailTableCopyKeybind = new CopyKeybind<IDetailData>();
detailTableCopyKeybind.onCopy((ranges: Slick.Range[]) => {
this._register(detailTableCopyKeybind.onCopy((ranges: Slick.Range[]) => {
// we always only get 1 item in the ranges
if (ranges && ranges.length === 1) {
handleCopyRequest(this._clipboardService, this.textResourcePropertiesService, ranges[0], (row, cell) => {
@@ -424,7 +424,7 @@ export class ProfilerEditor extends EditorPane {
return cell === 0 ? item.label : item.value;
});
}
});
}));
this._detailTable.setSelectionModel(new CellSelectionModel());
this._detailTable.registerPlugin(detailTableCopyKeybind);
this._register(this._componentContextService.registerTable(this._detailTable));

View File

@@ -106,7 +106,7 @@ export class ProfilerTableEditor extends EditorPane implements IProfilerControll
});
this._profilerTable.setSelectionModel(new RowSelectionModel());
const copyKeybind = new CopyKeybind();
copyKeybind.onCopy((e) => {
this._register(copyKeybind.onCopy((e) => {
// in context of this table, the selection mode is row selection, copy the whole row will get a lot of unwanted data
// ignore the passed in range and create a range so that it only copies the currently selected cell value.
const activeCell = this._profilerTable.activeCell;
@@ -114,7 +114,7 @@ export class ProfilerTableEditor extends EditorPane implements IProfilerControll
const fieldName = this._input.columns[cell].field;
return this._input.data.getItem(row)[fieldName];
});
});
}));
this._profilerTable.registerPlugin(copyKeybind);
this._register(this._componentContextService.registerTable(this._profilerTable));

View File

@@ -646,12 +646,12 @@ export class ListDatabasesActionItem extends Disposable implements IActionViewIt
) {
super();
this._databaseListDropdown = $('.databaseListDropdown');
this._dropdown = new Dropdown(this._databaseListDropdown, contextViewProvider, {
this._dropdown = this._register(new Dropdown(this._databaseListDropdown, contextViewProvider, {
strictSelection: true,
placeholder: this._selectDatabaseString,
ariaLabel: this._selectDatabaseString,
...defaultEditableDropdownStyles
});
}));
// Allows database selector to commit typed or pasted DB names without the need to click
// or press enter to make a selection when focus is moved away from the selector.

View File

@@ -340,6 +340,7 @@ export class AccountDialog extends Modal {
AddAccountAction,
newProvider.addedProvider.id
);
this._register(addAccountAction);
addAccountAction.addAccountErrorEvent(msg => this._onAddAccountErrorEmitter.fire(msg));
let providerView = new AccountPanel(

View File

@@ -146,10 +146,11 @@ export class AccountPicker extends Disposable {
};
// Create the add account action
const addAccountAction = this._instantiationService.createInstance(AddAccountAction, undefined);
addAccountAction.addAccountCompleteEvent(() => this._addAccountCompleteEmitter.fire());
addAccountAction.addAccountErrorEvent((msg) => this._addAccountErrorEmitter.fire(msg));
addAccountAction.addAccountStartEvent(() => this._addAccountStartEmitter.fire());
const addAccountAction = this._register(this._instantiationService.createInstance(AddAccountAction, undefined));
this._register(addAccountAction.addAccountCompleteEvent(() => this._addAccountCompleteEmitter.fire()));
this._register(addAccountAction.addAccountErrorEvent((msg) => this._addAccountErrorEmitter.fire(msg)));
this._register(addAccountAction.addAccountStartEvent(() => this._addAccountStartEmitter.fire()));
this._register(addAccountAction);
this._dropdown = this._register(new DropdownList(this._accountContainer, accountOptions, this._accountListContainer, this._accountList, addAccountAction));
this._tenantDropdown = this._register(new DropdownList(this._tenantContainer, tenantOption, this._tenantListContainer, this._tenantList));

View File

@@ -56,7 +56,7 @@ export class CmsConnectionWidget extends ConnectionWidget {
if (authTypeOption) {
let authTypeDefault = this.getAuthTypeDefault(authTypeOption, OS);
let authTypeDefaultDisplay = this.getAuthTypeDisplayName(authTypeDefault);
this._authTypeSelectBox = new SelectBox(authTypeOption.categoryValues.map(c => c.displayName), authTypeDefaultDisplay, defaultSelectBoxStyles, this._contextViewService, undefined, { ariaLabel: authTypeOption.displayName });
this._authTypeSelectBox = this._register(new SelectBox(authTypeOption.categoryValues.map(c => c.displayName), authTypeDefaultDisplay, defaultSelectBoxStyles, this._contextViewService, undefined, { ariaLabel: authTypeOption.displayName }));
}
}

View File

@@ -192,7 +192,7 @@ export class ConnectionDialogWidget extends Modal {
this._body = DOM.append(container, DOM.$('.connection-dialog'));
const connectTypeLabel = localize('connectType', "Connection type");
this._providerTypeSelectBox = new SelectBox(this.providerDisplayNameOptions, this.selectedProviderType, defaultSelectBoxStyles, this.contextViewService, undefined, { ariaLabel: connectTypeLabel });
this._providerTypeSelectBox = this._register(new SelectBox(this.providerDisplayNameOptions, this.selectedProviderType, defaultSelectBoxStyles, this.contextViewService, undefined, { ariaLabel: connectTypeLabel }));
// Recent connection tab
const recentConnectionTab = DOM.$('.connection-recent-tab');
const recentConnectionContainer = DOM.append(recentConnectionTab, DOM.$('.connection-recent', { id: 'recentConnection' }));
@@ -202,7 +202,7 @@ export class ConnectionDialogWidget extends Modal {
this.createRecentConnections();
DOM.hide(this._recentConnection);
this._panel = new TabbedPanel(this._body);
this._panel = this._register(new TabbedPanel(this._body));
this._panel.element.style.margin = '0px 10px';
attachTabbedPanelStyler(this._panel, this._themeService);
this._recentConnectionTabId = this._panel.pushTab({

View File

@@ -59,7 +59,7 @@ export class DialogPane extends Disposable {
let modelViewId = typeof this._content === 'string' ? this._content : this._content[0].content;
this.initializeModelViewContainer(this._body, modelViewId, undefined, this.setInitialFocus);
} else {
this._tabbedPanel = new TabbedPanel(this._body);
this._tabbedPanel = this._register(new TabbedPanel(this._body));
attachTabbedPanelStyler(this._tabbedPanel, this._themeService);
this._content.forEach((tab, tabIndex) => {
if (this._selectedTabIndex === tabIndex) {

View File

@@ -95,7 +95,7 @@ export class FileBrowserDialog extends Modal {
});
let filterLabel = localize('fileFilter', "Files of type");
this._fileFilterSelectBox = new SelectBox(['*'], '*', defaultSelectBoxStyles, this._contextViewService);
this._fileFilterSelectBox = this._register(new SelectBox(['*'], '*', defaultSelectBoxStyles, this._contextViewService));
this._fileFilterSelectBox.setAriaLabel(filterLabel);
let filterBuilder = DialogHelper.appendRow(tableContainer, filterLabel, 'file-input-label', 'file-input-box');
DialogHelper.appendInputSelectBox(filterBuilder, this._fileFilterSelectBox);

View File

@@ -187,7 +187,7 @@ export class ProfilerFilterDialog extends Modal {
}
private createSelectBox(container: HTMLElement, options: string[], selectedOption: string, ariaLabel: string): SelectBox {
const dropdown = new SelectBox(options, selectedOption, defaultSelectBoxStyles, this.contextViewService, undefined, { ariaLabel: ariaLabel });
const dropdown = this._register(new SelectBox(options, selectedOption, defaultSelectBoxStyles, this.contextViewService, undefined, { ariaLabel: ariaLabel }));
dropdown.render(container);
return dropdown;
}

View File

@@ -268,17 +268,17 @@ export class RestoreDialog extends Modal {
...defaultEditableDropdownStyles
}
));
this._databaseDropdown.onValueChange(s => {
this._register(this._databaseDropdown.onValueChange(s => {
this.databaseSelected(s);
});
}));
this._databaseDropdown.onBlur(() => {
this._register(this._databaseDropdown.onBlur(() => {
this.databaseSelected(this._databaseDropdown!.value);
});
}));
this._databaseDropdown.onFocus(() => {
this._register(this._databaseDropdown.onFocus(() => {
this._onDatabaseListFocused.fire();
});
}));
this._databaseDropdown.value = this.viewModel.targetDatabaseName!;
@@ -402,7 +402,7 @@ export class RestoreDialog extends Modal {
const restorePanel = DOM.$('.restore-panel');
container.appendChild(restorePanel);
this._panel = new TabbedPanel(restorePanel);
this._panel = this._register(new TabbedPanel(restorePanel));
attachTabbedPanelStyler(this._panel, this._themeService);
this._generalTab = {
identifier: 'general',

View File

@@ -192,11 +192,10 @@ export class ServerGroupDialog extends Modal {
for (let i = 0; i < this.withViewModel.colors.length; i++) {
const color = this.withViewModel.colors[i];
const colorBox = new Colorbox(container, {
const colorBox = this._register(new Colorbox(container, {
name: 'server-group-color',
color: color
});
}));
this._register(colorBox.onSelect((viaKeyboard) => {
this.onSelectGroupColor(color);
}));