Integrate notebook service with notebook UI (#3143)

Port notebookView code over to notebook.component.ts.
Integrate loading of notebook contents into the UI
This commit is contained in:
Kevin Cunnane
2018-11-06 16:31:37 -08:00
committed by GitHub
parent 5da89ac05b
commit ecd40de7ec
13 changed files with 168 additions and 43 deletions

View File

@@ -12,36 +12,25 @@ import { OnInit, Component, Inject, forwardRef, ElementRef, ChangeDetectorRef, V
import URI from 'vs/base/common/uri';
import { IColorTheme, IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
import * as themeColors from 'vs/workbench/common/theme';
import { INotificationService } from 'vs/platform/notification/common/notification';
import { INotificationService, INotification } from 'vs/platform/notification/common/notification';
import { localize } from 'vs/nls';
import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
import { AngularDisposable } from 'sql/base/common/lifecycle';
import { CellTypes, CellType } from 'sql/parts/notebook/models/contracts';
import { ICellModel } from 'sql/parts/notebook/models/modelInterfaces';
import { CellTypes, CellType, NotebookChangeType } from 'sql/parts/notebook/models/contracts';
import { ICellModel, INotebookModel, IModelFactory, INotebookModelOptions } from 'sql/parts/notebook/models/modelInterfaces';
import { IConnectionManagementService } from 'sql/parts/connection/common/connectionManagement';
import { INotebookService, INotebookParams } from 'sql/services/notebook/notebookService';
import { INotebookService, INotebookParams, INotebookManager } from 'sql/services/notebook/notebookService';
import { IBootstrapParams } from 'sql/services/bootstrap/bootstrapService';
import { NotebookModel, ErrorInfo, MessageLevel, NotebookContentChange } from 'sql/parts/notebook/models/notebookModel';
import { ModelFactory } from 'sql/parts/notebook/models/modelFactory';
import * as notebookUtils from './notebookUtils';
import { Deferred } from 'sql/base/common/promise';
import { IConnectionProfile } from 'sql/parts/connection/common/interfaces';
export const NOTEBOOK_SELECTOR: string = 'notebook-component';
class CellModelStub implements ICellModel {
public cellUri: URI;
constructor(public id: string,
public language: string,
public source: string,
public cellType: CellType,
public trustedMode: boolean = false,
public active: boolean = false
) { }
equals(cellModel: ICellModel): boolean {
throw new Error('Method not implemented.');
}
toJSON(): nb.ICell {
throw new Error('Method not implemented.');
}
}
@Component({
selector: NOTEBOOK_SELECTOR,
@@ -49,8 +38,16 @@ class CellModelStub implements ICellModel {
})
export class NotebookComponent extends AngularDisposable implements OnInit {
@ViewChild('toolbar', { read: ElementRef }) private toolbar: ElementRef;
protected cells: Array<ICellModel> = [];
private _model: NotebookModel;
private _isInErrorState: boolean = false;
private _errorMessage: string;
private _activeCell: ICellModel;
protected isLoading: boolean;
private notebookManager: INotebookManager;
private _modelReadyDeferred = new Deferred<NotebookModel>();
private profile: IConnectionProfile;
constructor(
@Inject(forwardRef(() => CommonServiceInterface)) private _bootstrapService: CommonServiceInterface,
@Inject(forwardRef(() => ChangeDetectorRef)) private _changeRef: ChangeDetectorRef,
@@ -61,17 +58,18 @@ export class NotebookComponent extends AngularDisposable implements OnInit {
@Inject(IBootstrapParams) private notebookParams: INotebookParams
) {
super();
// TODO NOTEBOOK REFACTOR: This is mock data for cells. Will remove this code when we have a service
let cell1 : ICellModel = new CellModelStub ('1', 'sql', 'select * from sys.tables', CellTypes.Code);
let cell2 : ICellModel = new CellModelStub ('2', 'sql', 'select 1', CellTypes.Code);
let cell3 : ICellModel = new CellModelStub ('3', 'markdown', '## This is test!', CellTypes.Markdown);
this.cells.push(cell1, cell2, cell3);
this.profile = this.notebookParams!.profile;
this.isLoading = true;
}
ngOnInit() {
this._register(this.themeService.onDidColorThemeChange(this.updateTheme, this));
this.updateTheme(this.themeService.getColorTheme());
this.doLoad();
}
protected get cells(): ReadonlyArray<ICellModel> {
return this._model ? this._model.cells : [];
}
private updateTheme(theme: IColorTheme): void {
@@ -110,7 +108,84 @@ export class NotebookComponent extends AngularDisposable implements OnInit {
}
}
findCellIndex(cellModel: ICellModel): number {
return this.cells.findIndex((cell) => cell.id === cellModel.id);
private async doLoad(): Promise<void> {
try {
await this.loadModel();
this.setLoading(false);
this._modelReadyDeferred.resolve(this._model);
} catch (error) {
this.setViewInErrorState(localize('displayFailed', 'Could not display contents: {0}', error));
this.setLoading(false);
this._modelReadyDeferred.reject(error);
}
}
private setLoading(isLoading: boolean): void {
this.isLoading = isLoading;
this._changeRef.detectChanges();
}
private async loadModel(): Promise<void> {
this.notebookManager = await this.notebookService.getOrCreateNotebookManager(this.notebookParams.providerId, this.notebookParams.notebookUri);
let model = new NotebookModel({
factory: this.modelFactory,
path: this.notebookParams.notebookUri.fsPath,
connectionService: this.connectionManagementService,
notificationService: this.notificationService,
notebookManager: this.notebookManager
}, false, this.profile);
model.onError((errInfo: INotification) => this.handleModelError(errInfo));
model.backgroundStartSession();
await model.requestModelLoad(this.notebookParams.isTrusted);
model.contentChanged((change) => this.handleContentChanged(change));
this._model = model;
this._register(model);
this._changeRef.detectChanges();
}
private get modelFactory(): IModelFactory {
if (!this.notebookParams.modelFactory) {
this.notebookParams.modelFactory = new ModelFactory();
}
return this.notebookParams.modelFactory;
}
private handleModelError(notification: INotification): void {
this.notificationService.notify(notification);
}
private handleContentChanged(change: NotebookContentChange) {
// Note: for now we just need to set dirty state and refresh the UI.
this.setDirty(true);
this._changeRef.detectChanges();
}
findCellIndex(cellModel: ICellModel): number {
return this._model.cells.findIndex((cell) => cell.id === cellModel.id);
}
private setViewInErrorState(error: any): any {
this._isInErrorState = true;
this._errorMessage = notebookUtils.getErrorMessage(error);
// For now, send message as error notification #870 covers having dedicated area for this
this.notificationService.error(error);
}
public async save(): Promise<boolean> {
try {
let saved = await this._model.saveModel();
return saved;
} catch (err) {
this.notificationService.error(localize('saveFailed', 'Failed to save notebook: {0}', notebookUtils.getErrorMessage(err)));
return false;
}
}
private setDirty(isDirty: boolean): void {
// TODO reenable handling of isDirty
// if (this.editor) {
// this.editor.isDirty = isDirty;
// }
}
}