mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-02-17 02:51:36 -05:00
Clean up button component disposables (#14011)
* Clean up button component disposables * consolidate logic
This commit is contained in:
@@ -283,12 +283,14 @@ export function attachEditableDropdownStyler(widget: IThemable, themeService: IT
|
|||||||
}, widget);
|
}, widget);
|
||||||
}
|
}
|
||||||
|
|
||||||
export function attachButtonStyler(widget: IThemable, themeService: IThemeService, style?: {
|
type ButtonStyle = {
|
||||||
buttonForeground?: cr.ColorIdentifier,
|
buttonForeground?: cr.ColorIdentifier,
|
||||||
buttonBackground?: cr.ColorIdentifier,
|
buttonBackground?: cr.ColorIdentifier,
|
||||||
buttonHoverBackground?: cr.ColorIdentifier,
|
buttonHoverBackground?: cr.ColorIdentifier,
|
||||||
buttonFocusOutline?: cr.ColorIdentifier
|
buttonFocusOutline?: cr.ColorIdentifier
|
||||||
}): IDisposable {
|
};
|
||||||
|
|
||||||
|
export function attachButtonStyler(widget: IThemable, themeService: IThemeService, style?: ButtonStyle): IDisposable {
|
||||||
return attachStyler(themeService, {
|
return attachStyler(themeService, {
|
||||||
buttonForeground: (style && style.buttonForeground) || cr.buttonForeground,
|
buttonForeground: (style && style.buttonForeground) || cr.buttonForeground,
|
||||||
buttonBackground: (style && style.buttonBackground) || cr.buttonBackground,
|
buttonBackground: (style && style.buttonBackground) || cr.buttonBackground,
|
||||||
|
|||||||
@@ -23,6 +23,7 @@ import { IComponentDescriptor, IComponent, IModelStore, ComponentEventType } fro
|
|||||||
import { convertSize } from 'sql/base/browser/dom';
|
import { convertSize } from 'sql/base/browser/dom';
|
||||||
import { createIconCssClass } from 'sql/workbench/browser/modelComponents/iconUtils';
|
import { createIconCssClass } from 'sql/workbench/browser/modelComponents/iconUtils';
|
||||||
import { ILogService } from 'vs/platform/log/common/log';
|
import { ILogService } from 'vs/platform/log/common/log';
|
||||||
|
import { IDisposable } from 'vs/base/common/lifecycle';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'modelview-button',
|
selector: 'modelview-button',
|
||||||
@@ -40,13 +41,13 @@ import { ILogService } from 'vs/platform/log/common/log';
|
|||||||
</ng-template>
|
</ng-template>
|
||||||
`
|
`
|
||||||
})
|
})
|
||||||
|
|
||||||
export default class ButtonComponent extends ComponentWithIconBase<azdata.ButtonProperties> implements IComponent, OnDestroy {
|
export default class ButtonComponent extends ComponentWithIconBase<azdata.ButtonProperties> implements IComponent, OnDestroy {
|
||||||
@Input() descriptor: IComponentDescriptor;
|
@Input() descriptor: IComponentDescriptor;
|
||||||
@Input() modelStore: IModelStore;
|
@Input() modelStore: IModelStore;
|
||||||
private _button: Button | InfoButton;
|
private _button: Button | InfoButton;
|
||||||
public fileType: string = '.sql';
|
public fileType: string = '.sql';
|
||||||
private _currentButtonType?: azdata.ButtonType = undefined;
|
private _currentButtonType?: azdata.ButtonType = undefined;
|
||||||
|
private _buttonStyler: IDisposable | undefined = undefined;
|
||||||
|
|
||||||
@ViewChild('input', { read: ElementRef }) private _inputContainer: ElementRef;
|
@ViewChild('input', { read: ElementRef }) private _inputContainer: ElementRef;
|
||||||
@ViewChild('fileInput', { read: ElementRef }) private _fileInputContainer: ElementRef;
|
@ViewChild('fileInput', { read: ElementRef }) private _fileInputContainer: ElementRef;
|
||||||
@@ -89,9 +90,7 @@ export default class ButtonComponent extends ComponentWithIconBase<azdata.Button
|
|||||||
}
|
}
|
||||||
|
|
||||||
this._register(this._button);
|
this._register(this._button);
|
||||||
this._register(attachButtonStyler(this._button, this.themeService, {
|
this.updateStyler();
|
||||||
buttonBackground: SIDE_BAR_BACKGROUND, buttonHoverBackground: SIDE_BAR_BACKGROUND, buttonForeground: SIDE_BAR_TITLE_FOREGROUND
|
|
||||||
}));
|
|
||||||
this._register(this._button.onDidClick(e => {
|
this._register(this._button.onDidClick(e => {
|
||||||
if (this._fileInputContainer) {
|
if (this._fileInputContainer) {
|
||||||
const self = this;
|
const self = this;
|
||||||
@@ -119,6 +118,7 @@ export default class ButtonComponent extends ComponentWithIconBase<azdata.Button
|
|||||||
}
|
}
|
||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
|
|
||||||
public setProperties(properties: { [key: string]: any; }): void {
|
public setProperties(properties: { [key: string]: any; }): void {
|
||||||
super.setProperties(properties);
|
super.setProperties(properties);
|
||||||
if (this._currentButtonType !== this.buttonType) {
|
if (this._currentButtonType !== this.buttonType) {
|
||||||
@@ -178,17 +178,36 @@ export default class ButtonComponent extends ComponentWithIconBase<azdata.Button
|
|||||||
if (!this._iconClass) {
|
if (!this._iconClass) {
|
||||||
super.updateIcon();
|
super.updateIcon();
|
||||||
this._button.icon = this._iconClass + ' icon';
|
this._button.icon = this._iconClass + ' icon';
|
||||||
// Styling for icon button
|
this.updateStyler();
|
||||||
this._register(attachButtonStyler(this._button, this.themeService, {
|
} else {
|
||||||
|
super.updateIcon();
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.updateStyler();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Updates the styler for this button based on whether it has an icon or not
|
||||||
|
*/
|
||||||
|
private updateStyler(): void {
|
||||||
|
this._buttonStyler?.dispose();
|
||||||
|
if (this.iconPath) {
|
||||||
|
this._buttonStyler = this._register(attachButtonStyler(this._button, this.themeService, {
|
||||||
buttonBackground: Color.transparent.toString(),
|
buttonBackground: Color.transparent.toString(),
|
||||||
buttonHoverBackground: Color.transparent.toString(),
|
buttonHoverBackground: Color.transparent.toString(),
|
||||||
buttonFocusOutline: focusBorder,
|
buttonFocusOutline: focusBorder,
|
||||||
buttonForeground: foreground
|
buttonForeground: foreground
|
||||||
}));
|
}));
|
||||||
} else {
|
} else {
|
||||||
super.updateIcon();
|
this._buttonStyler = this._register(attachButtonStyler(this._button, this.themeService, {
|
||||||
}
|
buttonBackground: SIDE_BAR_BACKGROUND,
|
||||||
|
buttonHoverBackground: SIDE_BAR_BACKGROUND,
|
||||||
|
buttonForeground: SIDE_BAR_TITLE_FOREGROUND
|
||||||
|
}));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
protected get defaultIconHeight(): number {
|
protected get defaultIconHeight(): number {
|
||||||
|
|||||||
Reference in New Issue
Block a user