New MongoQueryTab and component running nteract

src/Explorer/Tabs/MongoDocumentsTabV2.html

@@ -0,0 +1 @@
+<div data-bind="react:mongoQueryComponentAdapter" style="height: 100%"></div>

src/Explorer/Tabs/MongoDocumentsTabV2.ts

@@ -0,0 +1,45 @@
+import * as Q from "q";
+import NotebookTabBase, { NotebookTabBaseOptions } from "./NotebookTabBase";
+import { MongoQueryComponentAdapter } from "../Notebook/MongoQueryComponent/MongoQueryComponentAdapter";
+
+export default class MongoDocumentsTabV2 extends NotebookTabBase {
+  private mongoQueryComponentAdapter: MongoQueryComponentAdapter;
+
+  constructor(options: NotebookTabBaseOptions) {
+    super(options);
+    this.mongoQueryComponentAdapter = new MongoQueryComponentAdapter({
+      contentRef: undefined,
+      notebookClient: NotebookTabBase.clientManager
+    });
+  }
+
+  public onCloseTabButtonClick(): Q.Promise<void> {
+    super.onCloseTabButtonClick();
+
+    // const cleanup = () => {
+    //   this.notebookComponentAdapter.notebookShutdown();
+    //   this.isActive(false);
+    //   super.onCloseTabButtonClick();
+    // };
+
+    // if (this.notebookComponentAdapter.isContentDirty()) {
+    //   this.container.showOkCancelModalDialog(
+    //     "Close without saving?",
+    //     `File has unsaved changes, close without saving?`,
+    //     "Close",
+    //     cleanup,
+    //     "Cancel",
+    //     undefined
+    //   );
+    //   return Q.resolve(null);
+    // } else {
+    //   cleanup();
+    //   return Q.resolve(null);
+    // }
+    return undefined;
+  }
+
+  protected buildCommandBarOptions(): void {
+    this.updateNavbarWithTabsButtons();
+  }
+}

src/Explorer/Tabs/NotebookTabBase.ts

@@ -0,0 +1,50 @@
+import * as ViewModels from "../../Contracts/ViewModels";
+import TabsBase from "./TabsBase";
+
+import { NotebookClientV2 } from "../Notebook/NotebookClientV2";
+import * as TelemetryProcessor from "../../Shared/Telemetry/TelemetryProcessor";
+import Explorer from "../Explorer";
+import { ActionModifiers } from "../../Shared/Telemetry/TelemetryConstants";
+import { Areas } from "../../Common/Constants";
+
+export interface NotebookTabBaseOptions extends ViewModels.TabOptions {
+  container: Explorer;
+}
+
+/**
+ * Every notebook-based tab inherits from this class. It holds the static reference to a notebook client (singleton)
+ */
+export default class NotebookTabBase extends TabsBase {
+  protected static clientManager: NotebookClientV2;
+  protected container: Explorer;
+
+  constructor(options: NotebookTabBaseOptions) {
+    super(options);
+
+    this.container = options.container;
+
+    if (!NotebookTabBase.clientManager) {
+      NotebookTabBase.clientManager = new NotebookClientV2({
+        connectionInfo: this.container.notebookServerInfo(),
+        databaseAccountName: this.container.databaseAccount().name,
+        defaultExperience: this.container.defaultExperience(),
+        contentProvider: this.container.notebookManager?.notebookContentProvider
+      });
+    }
+  }
+
+  /**
+   * Override base behavior
+   */
+  protected getContainer(): Explorer {
+    return this.container;
+  }
+
+  protected traceTelemetry(actionType: number): void {
+    TelemetryProcessor.trace(actionType, ActionModifiers.Mark, {
+      databaseAccountName: this.container.databaseAccount() && this.container.databaseAccount().name,
+      defaultExperience: this.container.defaultExperience && this.container.defaultExperience(),
+      dataExplorerArea: Areas.Notebook
+    });
+  }
+}

src/Explorer/Tabs/NotebookV2Tab.ts

@@ -2,9 +2,7 @@ import * as _ from "underscore";
 import * as Q from "q";
 import * as ko from "knockout";
 
-import * as ViewModels from "../../Contracts/ViewModels";
 import * as DataModels from "../../Contracts/DataModels";
-import TabsBase from "./TabsBase";
 
 import NewCellIcon from "../../../images/notebook/Notebook-insert-cell.svg";
 import CutIcon from "../../../images/notebook/Notebook-cut.svg";
@@ -17,31 +15,25 @@ import SaveIcon from "../../../images/save-cosmos.svg";
 import ClearAllOutputsIcon from "../../../images/notebook/Notebook-clear-all-outputs.svg";
 import InterruptKernelIcon from "../../../images/notebook/Notebook-stop.svg";
 import KillKernelIcon from "../../../images/notebook/Notebook-stop.svg";
-import * as TelemetryProcessor from "../../Shared/Telemetry/TelemetryProcessor";
-import { Action, ActionModifiers } from "../../Shared/Telemetry/TelemetryConstants";
-import { Areas, ArmApiVersions } from "../../Common/Constants";
+import { Action } from "../../Shared/Telemetry/TelemetryConstants";
+import { ArmApiVersions } from "../../Common/Constants";
 import { CommandBarComponentButtonFactory } from "../Menus/CommandBar/CommandBarComponentButtonFactory";
 import { ConsoleDataType } from "../Menus/NotificationConsole/NotificationConsoleComponent";
 import * as NotificationConsoleUtils from "../../Utils/NotificationConsoleUtils";
 import { NotebookComponentAdapter } from "../Notebook/NotebookComponent/NotebookComponentAdapter";
 import { NotebookConfigurationUtils } from "../../Utils/NotebookConfigurationUtils";
-import { KernelSpecsDisplay, NotebookClientV2 } from "../Notebook/NotebookClientV2";
+import { KernelSpecsDisplay } from "../Notebook/NotebookClientV2";
 import { configContext } from "../../ConfigContext";
-import Explorer from "../Explorer";
 import { NotebookContentItem } from "../Notebook/NotebookContentItem";
 import { CommandButtonComponentProps } from "../Controls/CommandButton/CommandButtonComponent";
 import { toJS, stringifyNotebook } from "@nteract/commutable";
+import NotebookTabBase, { NotebookTabBaseOptions } from "./NotebookTabBase";
 
-export interface NotebookTabOptions extends ViewModels.TabOptions {
-  account: DataModels.DatabaseAccount;
-  masterKey: string;
-  container: Explorer;
+export interface NotebookTabOptions extends NotebookTabBaseOptions {
   notebookContentItem: NotebookContentItem;
 }
 
-export default class NotebookTabV2 extends TabsBase {
-  private static clientManager: NotebookClientV2;
-  private container: Explorer;
+export default class NotebookTabV2 extends NotebookTabBase {
   public notebookPath: ko.Observable<string>;
   private selectedSparkPool: ko.Observable<string>;
   private notebookComponentAdapter: NotebookComponentAdapter;
@@ -50,16 +42,6 @@ export default class NotebookTabV2 extends TabsBase {
     super(options);
 
     this.container = options.container;
-
-    if (!NotebookTabV2.clientManager) {
-      NotebookTabV2.clientManager = new NotebookClientV2({
-        connectionInfo: this.container.notebookServerInfo(),
-        databaseAccountName: this.container.databaseAccount().name,
-        defaultExperience: this.container.defaultExperience(),
-        contentProvider: this.container.notebookManager?.notebookContentProvider
-      });
-    }
-
     this.notebookPath = ko.observable(options.notebookContentItem.path);
 
     this.container.notebookServerInfo.subscribe((newValue: DataModels.NotebookWorkspaceConnectionInfo) => {
@@ -69,7 +51,7 @@ export default class NotebookTabV2 extends TabsBase {
     this.notebookComponentAdapter = new NotebookComponentAdapter({
       contentItem: options.notebookContentItem,
       notebooksBasePath: this.container.getNotebookBasePath(),
-      notebookClient: NotebookTabV2.clientManager,
+      notebookClient: NotebookTabBase.clientManager,
       onUpdateKernelInfo: this.onKernelUpdate
     });
 
@@ -115,10 +97,6 @@ export default class NotebookTabV2 extends TabsBase {
     return await this.configureServiceEndpoints(this.notebookComponentAdapter.getCurrentKernelName());
   }
 
-  protected getContainer(): Explorer {
-    return this.container;
-  }
-
   protected getTabsButtons(): CommandButtonComponentProps[] {
     const availableKernels = NotebookTabV2.clientManager.getAvailableKernelSpecs();
 
@@ -493,12 +471,4 @@ export default class NotebookTabV2 extends TabsBase {
 
     this.container.copyNotebook(notebookContent.name, content);
   };
-
-  private traceTelemetry(actionType: number) {
-    TelemetryProcessor.trace(actionType, ActionModifiers.Mark, {
-      databaseAccountName: this.container.databaseAccount() && this.container.databaseAccount().name,
-      defaultExperience: this.container.defaultExperience && this.container.defaultExperience(),
-      dataExplorerArea: Areas.Notebook
-    });
-  }
 }

src/Explorer/Tabs/TabComponents.ts

@@ -5,6 +5,7 @@ import SparkMasterTabTemplate from "./SparkMasterTab.html";
 import NotebookV2TabTemplate from "./NotebookV2Tab.html";
 import TerminalTabTemplate from "./TerminalTab.html";
 import MongoDocumentsTabTemplate from "./MongoDocumentsTab.html";
+import MongoDocumentsTabV2Template from "./MongoDocumentsTabV2.html";
 import MongoQueryTabTemplate from "./MongoQueryTab.html";
 import MongoShellTabTemplate from "./MongoShellTab.html";
 import QueryTabTemplate from "./QueryTab.html";
@@ -106,6 +107,15 @@ export class MongoQueryTab {
   }
 }
 
+export class MongoDocumentsTabV2 {
+  constructor() {
+    return {
+      viewModel: TabComponent,
+      template: MongoDocumentsTabV2Template
+    };
+  }
+}
+
 export class MongoShellTab {
   constructor() {
     return {