Angular Individual Service Injection - Decouple bootstrap service (#1457)

* change services to be individually injected into angular

* messing around with injection

* change angular bootstrapping to factory style

* formatting

* formatting

* fix imports

* fix build errors

* fix testsw

* fix tests

* fix compile errors
This commit is contained in:
Anthony Dresser
2018-05-23 16:51:02 -07:00
committed by GitHub
parent cd0f9b71c5
commit 1359354387
68 changed files with 1011 additions and 1116 deletions

View File

@@ -13,11 +13,12 @@ import Event, { Emitter } from 'vs/base/common/event';
import { ComponentBase } from 'sql/parts/modelComponents/componentBase';
import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } from 'sql/parts/modelComponents/interfaces';
import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
import { attachListStyler } from 'vs/platform/theme/common/styler';
import { attachButtonStyler } from 'sql/common/theme/styler';
import { Button } from 'sql/base/browser/ui/button/button';
import { SIDE_BAR_BACKGROUND } from 'vs/workbench/common/theme';
import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
import { attachListStyler } from 'vs/platform/theme/common/styler';
@Component({
selector: 'button',
@@ -32,8 +33,9 @@ export default class ButtonComponent extends ComponentBase implements IComponent
@ViewChild('input', { read: ElementRef }) private _inputContainer: ElementRef;
constructor(
@Inject(forwardRef(() => CommonServiceInterface)) private _commonService: CommonServiceInterface,
@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef) {
@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef,
@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService
) {
super(changeRef);
}
@@ -49,7 +51,7 @@ export default class ButtonComponent extends ComponentBase implements IComponent
this._button = new Button(this._inputContainer.nativeElement);
this._register(this._button);
this._register(attachButtonStyler(this._button, this._commonService.themeService, {
this._register(attachButtonStyler(this._button, this.themeService, {
buttonBackground: SIDE_BAR_BACKGROUND, buttonHoverBackground: SIDE_BAR_BACKGROUND
}));
this._register(this._button.onDidClick(e => {

View File

@@ -9,14 +9,14 @@ import { Component, Input, Inject, ChangeDetectorRef, forwardRef, ComponentFacto
} from '@angular/core';
import * as sqlops from 'sqlops';
import { ITheme, ICssStyleCollector } from 'vs/platform/theme/common/themeService';
import * as colors from 'vs/platform/theme/common/colorRegistry';
import { IColorTheme, IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
import { ComponentBase } from 'sql/parts/modelComponents/componentBase';
import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } from 'sql/parts/modelComponents/interfaces';
import { BOOTSTRAP_SERVICE_ID, IBootstrapService } from 'sql/services/bootstrap/bootstrapService';
import { IColorTheme } from 'vs/workbench/services/themes/common/workbenchThemeService';
import { StatusIndicator, CardProperties, ActionDescriptor } from 'sql/workbench/api/common/sqlExtHostTypes';
@Component({
@@ -30,15 +30,15 @@ export default class CardComponent extends ComponentBase implements IComponent,
constructor(@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef,
@Inject(forwardRef(() => ElementRef)) private _el: ElementRef,
@Inject(BOOTSTRAP_SERVICE_ID) private _bootstrapService: IBootstrapService
@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService
) {
super(changeRef);
}
ngOnInit(): void {
this.baseInit();
this._register(this._bootstrapService.themeService.onDidColorThemeChange(this.updateTheme, this));
this.updateTheme(this._bootstrapService.themeService.getColorTheme());
this._register(this.themeService.onDidColorThemeChange(this.updateTheme, this));
this.updateTheme(this.themeService.getColorTheme());
}

View File

@@ -9,16 +9,19 @@ import {
} from '@angular/core';
import * as sqlops from 'sqlops';
import Event, { Emitter } from 'vs/base/common/event';
import { ComponentBase } from 'sql/parts/modelComponents/componentBase';
import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } from 'sql/parts/modelComponents/interfaces';
import { Dropdown, IDropdownOptions } from 'sql/base/browser/ui/editableDropdown/dropdown';
import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox';
import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
import { attachListStyler } from 'vs/platform/theme/common/styler';
import { attachEditableDropdownStyler , attachSelectBoxStyler} from 'sql/common/theme/styler';
import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
import Event, { Emitter } from 'vs/base/common/event';
import { attachListStyler } from 'vs/platform/theme/common/styler';
@Component({
selector: 'dropdown',
template: `
@@ -38,8 +41,10 @@ export default class DropDownComponent extends ComponentBase implements ICompone
@ViewChild('editableDropDown', { read: ElementRef }) private _editableDropDownContainer: ElementRef;
@ViewChild('dropDown', { read: ElementRef }) private _dropDownContainer: ElementRef;
constructor(
@Inject(forwardRef(() => CommonServiceInterface)) private _commonService: CommonServiceInterface,
@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef) {
@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef,
@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService,
@Inject(IContextViewService) private contextViewService: IContextViewService
) {
super(changeRef);
}
@@ -56,11 +61,11 @@ export default class DropDownComponent extends ComponentBase implements ICompone
maxHeight: 125,
ariaLabel: ''
};
this._editableDropdown = new Dropdown(this._editableDropDownContainer.nativeElement, this._commonService.contextViewService, this._commonService.themeService,
this._editableDropdown = new Dropdown(this._editableDropDownContainer.nativeElement, this.contextViewService, this.themeService,
dropdownOptions);
this._register(this._editableDropdown);
this._register(attachEditableDropdownStyler(this._editableDropdown, this._commonService.themeService));
this._register(attachEditableDropdownStyler(this._editableDropdown, this.themeService));
this._register(this._editableDropdown.onValueChange(e => {
if (this.editable) {
this.value = this._editableDropdown.value;
@@ -72,11 +77,11 @@ export default class DropDownComponent extends ComponentBase implements ICompone
}));
}
if (this._dropDownContainer) {
this._selectBox = new SelectBox(this.values || [], this.value, this._commonService.contextViewService, this._dropDownContainer.nativeElement);
this._selectBox = new SelectBox(this.values || [], this.value, this.contextViewService, this._dropDownContainer.nativeElement);
this._selectBox.render(this._dropDownContainer.nativeElement);
this._register(this._selectBox);
this._register(attachSelectBoxStyler(this._selectBox, this._commonService.themeService));
this._register(attachSelectBoxStyler(this._selectBox, this.themeService));
this._register(this._selectBox.onDidSelect(e => {
if (!this.editable) {
this.value = this._selectBox.value;

View File

@@ -9,14 +9,16 @@ import {
} from '@angular/core';
import * as sqlops from 'sqlops';
import Event, { Emitter } from 'vs/base/common/event';
import * as nls from 'vs/nls';
import { ComponentBase } from 'sql/parts/modelComponents/componentBase';
import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } from 'sql/parts/modelComponents/interfaces';
import { InputBox, IInputOptions, MessageType } from 'vs/base/browser/ui/inputbox/inputBox';
import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
import { attachInputBoxStyler, attachListStyler } from 'vs/platform/theme/common/styler';
import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
import Event, { Emitter } from 'vs/base/common/event';
import * as nls from 'vs/nls';
@Component({
selector: 'inputBox',
@@ -31,8 +33,10 @@ export default class InputBoxComponent extends ComponentBase implements ICompone
@ViewChild('input', { read: ElementRef }) private _inputContainer: ElementRef;
constructor(
@Inject(forwardRef(() => CommonServiceInterface)) private _commonService: CommonServiceInterface,
@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef) {
@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef,
@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService,
@Inject(IContextViewService) private contextViewService: IContextViewService
) {
super(changeRef);
}
@@ -61,11 +65,11 @@ export default class InputBoxComponent extends ComponentBase implements ICompone
useDefaultValidation: true
};
this._input = new InputBox(this._inputContainer.nativeElement, this._commonService.contextViewService, inputOptions);
this._input = new InputBox(this._inputContainer.nativeElement, this.contextViewService, inputOptions);
this._validations.push(() => !this._input.inputElement.validationMessage);
this._register(this._input);
this._register(attachInputBoxStyler(this._input, this._commonService.themeService));
this._register(attachInputBoxStyler(this._input, this.themeService));
this._register(this._input.onDidChange(e => {
this.value = this._input.value;
this._onEventEmitter.fire({

View File

@@ -13,12 +13,11 @@ import { ComponentHostDirective } from 'sql/parts/dashboard/common/componentHost
import { error } from 'sql/base/common/log';
import { AngularDisposable } from 'sql/base/common/lifecycle';
import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
import { IComponent, IComponentConfig, IComponentDescriptor, IModelStore, COMPONENT_CONFIG } from './interfaces';
import { Extensions, IComponentRegistry } from 'sql/platform/dashboard/common/modelComponentRegistry';
import { IDisposable } from 'vs/base/common/lifecycle';
import { IColorTheme } from 'vs/workbench/services/themes/common/workbenchThemeService';
import { IColorTheme, IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
import * as colors from 'vs/platform/theme/common/colorRegistry';
import * as themeColors from 'vs/workbench/common/theme';
import { Action } from 'vs/base/common/actions';
@@ -53,22 +52,22 @@ export class ModelComponentWrapper extends AngularDisposable implements OnInit {
constructor(
@Inject(forwardRef(() => ComponentFactoryResolver)) private _componentFactoryResolver: ComponentFactoryResolver,
@Inject(forwardRef(() => ElementRef)) private _ref: ElementRef,
@Inject(forwardRef(() => CommonServiceInterface)) private _bootstrap: CommonServiceInterface,
@Inject(forwardRef(() => ChangeDetectorRef)) private _changeref: ChangeDetectorRef,
@Inject(forwardRef(() => Injector)) private _injector: Injector
@Inject(forwardRef(() => Injector)) private _injector: Injector,
@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService
) {
super();
}
ngOnInit() {
let self = this;
this._register(self._bootstrap.themeService.onDidColorThemeChange((event: IColorTheme) => {
this._register(self.themeService.onDidColorThemeChange((event: IColorTheme) => {
self.updateTheme(event);
}));
}
ngAfterViewInit() {
this.updateTheme(this._bootstrap.themeService.getColorTheme());
this.updateTheme(this.themeService.getColorTheme());
if (this.componentHost) {
this.loadComponent();
}

View File

@@ -12,9 +12,10 @@ import { BaseEditor } from 'vs/workbench/browser/parts/editor/baseEditor';
import { Dimension } from 'vs/workbench/services/part/common/partService';
import { EditorOptions } from 'vs/workbench/common/editor';
import * as DOM from 'vs/base/browser/dom';
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
import { ModelViewInput } from 'sql/parts/modelComponents/modelEditor/modelViewInput';
import { IBootstrapService } from 'sql/services/bootstrap/bootstrapService';
import { bootstrapAngular } from 'sql/services/bootstrap/bootstrapService';
import { Dialog } from 'sql/platform/dialog/dialogTypes';
import { DialogPane } from 'sql/platform/dialog/dialogPane';
@@ -26,7 +27,7 @@ export class ModelViewEditor extends BaseEditor {
constructor(
@ITelemetryService telemetryService: ITelemetryService,
@IThemeService themeService: IThemeService,
@IBootstrapService private _bootstrapService: IBootstrapService
@IInstantiationService private _instantiationService: IInstantiationService
) {
super(ModelViewEditor.ID, telemetryService, themeService);
}
@@ -52,7 +53,7 @@ export class ModelViewEditor extends BaseEditor {
if (!this._modelViewMap.get(input.modelViewId)) {
let modelViewContainer = DOM.$('div.model-view-container');
let dialogPane = new DialogPane(input.title, input.modelViewId, () => undefined, this._bootstrapService);
let dialogPane = new DialogPane(input.title, input.modelViewId, () => undefined, this._instantiationService);
dialogPane.createBody(modelViewContainer);
this._modelViewMap.set(input.modelViewId, modelViewContainer);
}

View File

@@ -17,9 +17,10 @@ import { TabConfig } from 'sql/parts/dashboard/common/dashboardWidget';
import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
import { IModelView } from 'sql/services/model/modelViewService';
import { AngularDisposable } from 'sql/base/common/lifecycle';
import { ViewBase } from 'sql/parts/modelComponents/viewBase';
import { IModelViewService } from 'sql/services/modelComponents/modelViewService';
import * as sqlops from 'sqlops';
import { ViewBase } from 'sql/parts/modelComponents/viewBase';
@Component({
selector: 'modelview-content',
@@ -42,13 +43,14 @@ export class ModelViewContent extends ViewBase implements OnInit, IModelView {
constructor(
@Inject(forwardRef(() => CommonServiceInterface)) private _commonService: CommonServiceInterface,
@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef
@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef,
@Inject(IModelViewService) private modelViewService: IModelViewService
) {
super(changeRef);
}
ngOnInit() {
this._commonService.modelViewService.registerModelView(this);
this.modelViewService.registerModelView(this);
this._register(addDisposableListener(window, EventType.RESIZE, e => {
this.layout();
}));

View File

@@ -12,11 +12,14 @@ import * as sqlops from 'sqlops';
import Event, { Emitter } from 'vs/base/common/event';
import { Webview } from 'vs/workbench/parts/html/browser/webview';
import { addDisposableListener, EventType } from 'vs/base/browser/dom';
import { Parts } from 'vs/workbench/services/part/common/partService';
import { Parts, IPartService } from 'vs/workbench/services/part/common/partService';
import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
import { IEnvironmentService } from 'vs/platform/environment/common/environment';
import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
import { IThemeService } from 'vs/platform/theme/common/themeService';
import { ComponentBase } from 'sql/parts/modelComponents/componentBase';
import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } from 'sql/parts/modelComponents/interfaces';
import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
@Component({
template: '',
@@ -33,7 +36,12 @@ export default class WebViewComponent extends ComponentBase implements IComponen
constructor(
@Inject(forwardRef(() => CommonServiceInterface)) private _commonService: CommonServiceInterface,
@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef,
@Inject(forwardRef(() => ElementRef)) private _el: ElementRef) {
@Inject(forwardRef(() => ElementRef)) private _el: ElementRef,
@Inject(IPartService) private partService: IPartService,
@Inject(IThemeService) private themeService: IThemeService,
@Inject(IEnvironmentService) private environmentService: IEnvironmentService,
@Inject(IContextViewService) private contextViewService: IContextViewService
) {
super(changeRef);
}
@@ -47,10 +55,10 @@ export default class WebViewComponent extends ComponentBase implements IComponen
private _createWebview(): void {
this._webview = this._register(new Webview(this._el.nativeElement,
this._commonService.partService.getContainer(Parts.EDITOR_PART),
this._commonService.themeService,
this._commonService.environmentService,
this._commonService.contextViewService,
this.partService.getContainer(Parts.EDITOR_PART),
this.themeService,
this.environmentService,
this.contextViewService,
undefined,
undefined,
{
@@ -67,7 +75,7 @@ export default class WebViewComponent extends ComponentBase implements IComponen
});
}));
this._webview.style(this._commonService.themeService.getTheme());
this._webview.style(this.themeService.getTheme());
this.setHtml();
}