complete functionality documentMongoTab migration

src/Explorer/Tabs/DocumentsTabContent.tsx

@@ -12,9 +12,8 @@ import {
   SelectionMode,
   Stack,
   Text,
-  TextField,
+  TextField
 } from "@fluentui/react";
-import {} from "@fluentui/react/lib/Image";
 import * as React from "react";
 import SplitterLayout from "react-splitter-layout";
 import CloseIcon from "../../../images/close-black.svg";
@@ -28,6 +27,7 @@ import { Areas } from "../../Common/Constants";
 import { getErrorMessage, getErrorStack } from "../../Common/ErrorHandlingUtils";
 import { logError } from "../../Common/Logger";
 import { createDocument, deleteDocument, queryDocuments, updateDocument } from "../../Common/MongoProxyClient";
+import * as ViewModels from "../../Contracts/ViewModels";
 import { Action } from "../../Shared/Telemetry/TelemetryConstants";
 import * as TelemetryProcessor from "../../Shared/Telemetry/TelemetryProcessor";
 import { userContext } from "../../UserContext";
@@ -36,7 +36,7 @@ import { EditorReact } from "../Controls/Editor/EditorReact";
 import { useCommandBar } from "../Menus/CommandBar/CommandBarComponentAdapter";
 import DocumentId from "../Tree/DocumentId";
 import ObjectId from "../Tree/ObjectId";
-import DocumentsTab from "./DocumentsTab";
+import DocumentsTab from "./DocumentsTab1";
 import { formatDocumentContent, getPartitionKeyDefinition, hasShardKeySpecified } from "./DocumentTabUtils";
 
 const filterIcon: IIconProps = { iconName: "Filter" };
@@ -54,6 +54,7 @@ export interface IDocumentsTabContentState {
   documentIds: Array<DocumentId>;
   editorKey: string;
   selectedDocumentId?: DocumentId;
+  isEditorContentEdited: boolean;
 }
 
 export interface IDocument {
@@ -76,6 +77,8 @@ const imageProps: Partial<IImageProps> = {
 
 const filterSuggestions = [{ value: `{"id": "foo"}` }, { value: "{ qty: { $gte: 20 } }" }];
 const intitalDocumentContent = `{ \n "id": "replace_with_new_document_id" \n }`;
+const idHeader = userContext.apiType === "Mongo" ? "_id" : "id";
+
 export default class DocumentsTabContent extends React.Component<DocumentsTab, IDocumentsTabContentState> {
   public newDocumentButton: IButton;
   public saveNewDocumentButton: IButton;
@@ -115,7 +118,7 @@ export default class DocumentsTabContent extends React.Component<DocumentsTab, I
     const columns: IColumn[] = [
       {
         key: "_id",
-        name: props.idHeader,
+        name: idHeader,
         minWidth: 90,
         maxWidth: 140,
         isResizable: true,
@@ -153,10 +156,12 @@ export default class DocumentsTabContent extends React.Component<DocumentsTab, I
       documentContent: intitalDocumentContent,
       documentIds: [],
       editorKey: "",
+      isEditorContentEdited: false,
     };
   }
 
-  async componentDidMount(): void {
+  componentDidMount(): void {
+    this.props.isExecuting(true);
     this.updateTabButton();
     if (userContext.apiType === "Mongo") {
       this.queryDocumentsData();
@@ -171,17 +176,17 @@ export default class DocumentsTabContent extends React.Component<DocumentsTab, I
       const query: string = filter || "{}";
       const queryDocumentsData = await queryDocuments(
         this.props.collection.databaseId,
-        this.props.collection,
+        this.props.collection as ViewModels.Collection,
         true,
         query,
         undefined
       );
       if (queryDocumentsData) {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         const nextDocumentIds = queryDocumentsData.documents.map((rawDocument: any) => {
-          const partitionKeyValue = rawDocument._partitionKeyValue;
-          return new DocumentId(this.props, rawDocument, partitionKeyValue);
+          const partitionKeyValue = rawDocument.partitionKeyValue;
+          return new DocumentId(this.props as DocumentsTab, rawDocument, partitionKeyValue);
         });
-
         this.setState({ documentIds: nextDocumentIds });
       }
       if (this.props.onLoadStartKey !== undefined) {
@@ -219,6 +224,19 @@ export default class DocumentsTabContent extends React.Component<DocumentsTab, I
   };
 
   handleRow = (row: DocumentId): void => {
+    if (this.state.isEditorContentEdited) {
+      const isChangesConfirmed = window.confirm("Your unsaved changes will be lost.")
+      if (isChangesConfirmed) {
+        this.handleRowContent(row);
+        this.setState({ isEditorContentEdited: false });
+        return;
+      }
+    } else {
+      this.handleRowContent(row);
+    }
+  };
+
+  handleRowContent = (row: DocumentId): void => {
     const formattedDocumentContent = formatDocumentContent(row);
     this.newDocumentButton = {
       visible: false,
@@ -255,7 +273,7 @@ export default class DocumentsTabContent extends React.Component<DocumentsTab, I
         this.updateTabButton();
       }
     );
-  };
+  }
 
   formatDocumentContent = (row: DocumentId): string => {
     const { partitionKeyProperty, partitionKeyValue, rid, self, stringPartitionKeyValue, ts } = row;
@@ -291,7 +309,7 @@ export default class DocumentsTabContent extends React.Component<DocumentsTab, I
     try {
       const updatedDocument = await updateDocument(
         collection.databaseId,
-        collection,
+        collection as ViewModels.Collection,
         selectedDocumentId,
         documentContent
       );
@@ -304,7 +322,7 @@ export default class DocumentsTabContent extends React.Component<DocumentsTab, I
 
           const partitionKeyValue = partitionKeyArray && partitionKeyArray[0];
 
-          const id = new ObjectId(this.props, updatedDocument, partitionKeyValue);
+          const id = new ObjectId(this.props as DocumentsTab, updatedDocument, partitionKeyValue);
           documentId.id(id.id());
         }
       });
@@ -316,6 +334,7 @@ export default class DocumentsTabContent extends React.Component<DocumentsTab, I
         },
         startKey
       );
+      this.setState({ isEditorContentEdited: false });
       isExecuting(false);
     } catch (error) {
       isExecutionError(true);
@@ -427,9 +446,28 @@ export default class DocumentsTabContent extends React.Component<DocumentsTab, I
     this.updateMongoDocument();
   }
 
-  private onDeleteExisitingDocumentClick(): Promise<void> {
-    const { collection } = this.props;
-    return deleteDocument(collection.databaseId, collection, this.state.selectedDocumentId);
+  private async onDeleteExisitingDocumentClick(): Promise<void> {
+    const msg = userContext.apiType !== "Mongo"
+      ? "Are you sure you want to delete the selected item ?"
+      : "Are you sure you want to delete the selected document ?";
+
+    const {
+      isExecutionError,
+      isExecuting,
+      collection,
+    } = this.props;
+
+    if (window.confirm(msg)) {
+      try {
+        isExecuting(true)
+        await deleteDocument(collection.databaseId, collection as ViewModels.Collection, this.state.selectedDocumentId);
+        isExecuting(false)
+      } catch (error) {
+        console.error(error);
+        isExecutionError(true);
+        isExecuting(false)
+      }
+    }
   }
 
   private onRevertExisitingDocumentClick(): void {
@@ -510,7 +548,7 @@ export default class DocumentsTabContent extends React.Component<DocumentsTab, I
     try {
       const savedDocument = await createDocument(
         collection.databaseId,
-        collection,
+        collection as ViewModels.Collection,
         partitionKeyProperty,
         parsedDocumentContent
       );
@@ -525,6 +563,7 @@ export default class DocumentsTabContent extends React.Component<DocumentsTab, I
           startKey
         );
       }
+      this.setState({ isEditorContentEdited: false });
       this.queryDocumentsData();
       isExecuting(false);
     } catch (error) {
@@ -561,7 +600,11 @@ export default class DocumentsTabContent extends React.Component<DocumentsTab, I
     };
 
     this.updateTabButton();
-    this.setState({ isEditorVisible: false });
+    this.setState({
+      isEditorVisible: false,
+      isEditorContentEdited: false,
+    });
+
   };
 
   onRenderCell = (item: { value: string }): JSX.Element => {
@@ -603,7 +646,10 @@ export default class DocumentsTabContent extends React.Component<DocumentsTab, I
       this.updateTabButton();
     }
 
-    this.setState({ documentContent: newContent });
+    this.setState({
+      documentContent: newContent,
+      isEditorContentEdited: true,
+    });
   };
 
   public render(): JSX.Element {

src/Explorer/Tabs/MongoDocumentsTab.ts

@@ -1,33 +1,12 @@
-import { extractPartitionKey, PartitionKeyDefinition } from "@azure/cosmos";
-import * as ko from "knockout";
-import Q from "q";
-import * as Constants from "../../Common/Constants";
-import { getErrorMessage, getErrorStack } from "../../Common/ErrorHandlingUtils";
-import * as Logger from "../../Common/Logger";
-import {
-  createDocument,
-  deleteDocument,
-  queryDocuments,
-  readDocument,
-  updateDocument,
-} from "../../Common/MongoProxyClient";
-import MongoUtility from "../../Common/MongoUtility";
-import * as DataModels from "../../Contracts/DataModels";
 import * as ViewModels from "../../Contracts/ViewModels";
-import { Action } from "../../Shared/Telemetry/TelemetryConstants";
-import * as TelemetryProcessor from "../../Shared/Telemetry/TelemetryProcessor";
-import DocumentId from "../Tree/DocumentId";
-import ObjectId from "../Tree/ObjectId";
 import DocumentsTab from "./DocumentsTab1";
 
 export default class MongoDocumentsTab extends DocumentsTab {
   public collection: ViewModels.Collection;
-  private continuationToken: string;
+  // private continuationToken: string;
 
   constructor(options: ViewModels.DocumentsTabOptions) {
     super(options);
-    this.lastFilterContents = ko.observableArray<string>(['{"id":"foo"}', "{ qty: { $gte: 20 } }"]);
-
     if (this.partitionKeyProperty && ~this.partitionKeyProperty.indexOf(`"`)) {
       this.partitionKeyProperty = this.partitionKeyProperty.replace(/["]+/g, "");
     }
@@ -38,279 +17,279 @@ export default class MongoDocumentsTab extends DocumentsTab {
       this.partitionKeyPropertyHeader = "/" + this.partitionKeyProperty;
     }
 
-    this.isFilterExpanded = ko.observable<boolean>(true);
+    // this.isFilterExpanded = ko.observable<boolean>(true);
     super.buildCommandBarOptions.bind(this);
     super.buildCommandBarOptions();
   }
 
-  public onSaveNewDocumentClick = (): Promise<any> => {
-    const documentContent = JSON.parse(this.selectedDocumentContent());
-    this.displayedError("");
-    const startKey: number = TelemetryProcessor.traceStart(Action.CreateDocument, {
-      dataExplorerArea: Constants.Areas.Tab,
-      tabTitle: this.tabTitle(),
-    });
+  // public onSaveNewDocumentClick = (): Promise<any> => {
+  //   const documentContent = JSON.parse(this.selectedDocumentContent());
+  //   this.displayedError("");
+  //   const startKey: number = TelemetryProcessor.traceStart(Action.CreateDocument, {
+  //     dataExplorerArea: Constants.Areas.Tab,
+  //     tabTitle: this.tabTitle(),
+  //   });
 
-    if (
-      this.partitionKeyProperty &&
-      this.partitionKeyProperty !== "_id" &&
-      !this._hasShardKeySpecified(documentContent)
-    ) {
-      const message = `The document is lacking the shard property: ${this.partitionKeyProperty}`;
-      this.displayedError(message);
-      let that = this;
-      setTimeout(() => {
-        that.displayedError("");
-      }, Constants.ClientDefaults.errorNotificationTimeoutMs);
-      this.isExecutionError(true);
-      TelemetryProcessor.traceFailure(
-        Action.CreateDocument,
-        {
-          dataExplorerArea: Constants.Areas.Tab,
-          tabTitle: this.tabTitle(),
-          error: message,
-        },
-        startKey
-      );
-      Logger.logError("Failed to save new document: Document shard key not defined", "MongoDocumentsTab");
-      throw new Error("Document without shard key");
-    }
+  //   if (
+  //     this.partitionKeyProperty &&
+  //     this.partitionKeyProperty !== "_id" &&
+  //     !this._hasShardKeySpecified(documentContent)
+  //   ) {
+  //     const message = `The document is lacking the shard property: ${this.partitionKeyProperty}`;
+  //     this.displayedError(message);
+  //     let that = this;
+  //     setTimeout(() => {
+  //       that.displayedError("");
+  //     }, Constants.ClientDefaults.errorNotificationTimeoutMs);
+  //     this.isExecutionError(true);
+  //     TelemetryProcessor.traceFailure(
+  //       Action.CreateDocument,
+  //       {
+  //         dataExplorerArea: Constants.Areas.Tab,
+  //         tabTitle: this.tabTitle(),
+  //         error: message,
+  //       },
+  //       startKey
+  //     );
+  //     Logger.logError("Failed to save new document: Document shard key not defined", "MongoDocumentsTab");
+  //     throw new Error("Document without shard key");
+  //   }
 
-    this.isExecutionError(false);
-    this.isExecuting(true);
-    return createDocument(this.collection.databaseId, this.collection, this.partitionKeyProperty, documentContent)
-      .then(
-        (savedDocument: any) => {
-          let partitionKeyArray = extractPartitionKey(
-            savedDocument,
-            this._getPartitionKeyDefinition() as PartitionKeyDefinition
-          );
+  //   this.isExecutionError(false);
+  //   this.isExecuting(true);
+  //   return createDocument(this.collection.databaseId, this.collection, this.partitionKeyProperty, documentContent)
+  //     .then(
+  //       (savedDocument: any) => {
+  //         let partitionKeyArray = extractPartitionKey(
+  //           savedDocument,
+  //           this._getPartitionKeyDefinition() as PartitionKeyDefinition
+  //         );
 
-          let partitionKeyValue = partitionKeyArray && partitionKeyArray[0];
+  //         let partitionKeyValue = partitionKeyArray && partitionKeyArray[0];
 
-          let id = new ObjectId(this, savedDocument, partitionKeyValue);
-          let ids = this.documentIds();
-          ids.push(id);
-          delete savedDocument._self;
+  //         let id = new ObjectId(this, savedDocument, partitionKeyValue);
+  //         let ids = this.documentIds();
+  //         ids.push(id);
+  //         delete savedDocument._self;
 
-          let value: string = this.renderObjectForEditor(savedDocument || {}, null, 4);
-          this.selectedDocumentContent.setBaseline(value);
+  //         let value: string = this.renderObjectForEditor(savedDocument || {}, null, 4);
+  //         this.selectedDocumentContent.setBaseline(value);
 
-          this.selectedDocumentId(id);
-          this.documentIds(ids);
-          this.editorState(ViewModels.DocumentExplorerState.exisitingDocumentNoEdits);
-          TelemetryProcessor.traceSuccess(
-            Action.CreateDocument,
-            {
-              dataExplorerArea: Constants.Areas.Tab,
-              tabTitle: this.tabTitle(),
-            },
-            startKey
-          );
-        },
-        (error) => {
-          this.isExecutionError(true);
-          const errorMessage = getErrorMessage(error);
-          window.alert(errorMessage);
-          TelemetryProcessor.traceFailure(
-            Action.CreateDocument,
-            {
-              dataExplorerArea: Constants.Areas.Tab,
-              tabTitle: this.tabTitle(),
-              error: errorMessage,
-              errorStack: getErrorStack(error),
-            },
-            startKey
-          );
-        }
-      )
-      .finally(() => this.isExecuting(false));
-  };
+  //         this.selectedDocumentId(id);
+  //         this.documentIds(ids);
+  //         this.editorState(ViewModels.DocumentExplorerState.exisitingDocumentNoEdits);
+  //         TelemetryProcessor.traceSuccess(
+  //           Action.CreateDocument,
+  //           {
+  //             dataExplorerArea: Constants.Areas.Tab,
+  //             tabTitle: this.tabTitle(),
+  //           },
+  //           startKey
+  //         );
+  //       },
+  //       (error) => {
+  //         this.isExecutionError(true);
+  //         const errorMessage = getErrorMessage(error);
+  //         window.alert(errorMessage);
+  //         TelemetryProcessor.traceFailure(
+  //           Action.CreateDocument,
+  //           {
+  //             dataExplorerArea: Constants.Areas.Tab,
+  //             tabTitle: this.tabTitle(),
+  //             error: errorMessage,
+  //             errorStack: getErrorStack(error),
+  //           },
+  //           startKey
+  //         );
+  //       }
+  //     )
+  //     .finally(() => this.isExecuting(false));
+  // };
 
-  public onSaveExisitingDocumentClick = (): Promise<any> => {
-    const selectedDocumentId = this.selectedDocumentId();
-    const documentContent = this.selectedDocumentContent();
-    this.isExecutionError(false);
-    this.isExecuting(true);
-    const startKey: number = TelemetryProcessor.traceStart(Action.UpdateDocument, {
-      dataExplorerArea: Constants.Areas.Tab,
-      tabTitle: this.tabTitle(),
-    });
+  // public onSaveExisitingDocumentClick = (): Promise<any> => {
+  //   const selectedDocumentId = this.selectedDocumentId();
+  //   const documentContent = this.selectedDocumentContent();
+  //   this.isExecutionError(false);
+  //   this.isExecuting(true);
+  //   const startKey: number = TelemetryProcessor.traceStart(Action.UpdateDocument, {
+  //     dataExplorerArea: Constants.Areas.Tab,
+  //     tabTitle: this.tabTitle(),
+  //   });
 
-    return updateDocument(this.collection.databaseId, this.collection, selectedDocumentId, documentContent)
-      .then(
-        (updatedDocument: any) => {
-          let value: string = this.renderObjectForEditor(updatedDocument || {}, null, 4);
-          this.selectedDocumentContent.setBaseline(value);
+  //   return updateDocument(this.collection.databaseId, this.collection, selectedDocumentId, documentContent)
+  //     .then(
+  //       (updatedDocument: any) => {
+  //         let value: string = this.renderObjectForEditor(updatedDocument || {}, null, 4);
+  //         this.selectedDocumentContent.setBaseline(value);
 
-          this.documentIds().forEach((documentId: DocumentId) => {
-            if (documentId.rid === updatedDocument._rid) {
-              const partitionKeyArray = extractPartitionKey(
-                updatedDocument,
-                this._getPartitionKeyDefinition() as PartitionKeyDefinition
-              );
+  //         this.documentIds().forEach((documentId: DocumentId) => {
+  //           if (documentId.rid === updatedDocument._rid) {
+  //             const partitionKeyArray = extractPartitionKey(
+  //               updatedDocument,
+  //               this._getPartitionKeyDefinition() as PartitionKeyDefinition
+  //             );
 
-              let partitionKeyValue = partitionKeyArray && partitionKeyArray[0];
+  //             let partitionKeyValue = partitionKeyArray && partitionKeyArray[0];
 
-              const id = new ObjectId(this, updatedDocument, partitionKeyValue);
-              documentId.id(id.id());
-            }
-          });
-          this.editorState(ViewModels.DocumentExplorerState.exisitingDocumentNoEdits);
-          TelemetryProcessor.traceSuccess(
-            Action.UpdateDocument,
-            {
-              dataExplorerArea: Constants.Areas.Tab,
-              tabTitle: this.tabTitle(),
-            },
-            startKey
-          );
-        },
-        (error) => {
-          this.isExecutionError(true);
-          const errorMessage = getErrorMessage(error);
-          window.alert(errorMessage);
-          TelemetryProcessor.traceFailure(
-            Action.UpdateDocument,
-            {
-              dataExplorerArea: Constants.Areas.Tab,
-              tabTitle: this.tabTitle(),
-              error: errorMessage,
-              errorStack: getErrorStack(error),
-            },
-            startKey
-          );
-        }
-      )
-      .finally(() => this.isExecuting(false));
-  };
+  //             const id = new ObjectId(this, updatedDocument, partitionKeyValue);
+  //             documentId.id(id.id());
+  //           }
+  //         });
+  //         this.editorState(ViewModels.DocumentExplorerState.exisitingDocumentNoEdits);
+  //         TelemetryProcessor.traceSuccess(
+  //           Action.UpdateDocument,
+  //           {
+  //             dataExplorerArea: Constants.Areas.Tab,
+  //             tabTitle: this.tabTitle(),
+  //           },
+  //           startKey
+  //         );
+  //       },
+  //       (error) => {
+  //         this.isExecutionError(true);
+  //         const errorMessage = getErrorMessage(error);
+  //         window.alert(errorMessage);
+  //         TelemetryProcessor.traceFailure(
+  //           Action.UpdateDocument,
+  //           {
+  //             dataExplorerArea: Constants.Areas.Tab,
+  //             tabTitle: this.tabTitle(),
+  //             error: errorMessage,
+  //             errorStack: getErrorStack(error),
+  //           },
+  //           startKey
+  //         );
+  //       }
+  //     )
+  //     .finally(() => this.isExecuting(false));
+  // };
 
   public buildQuery(filter: string): string {
     return filter || "{}";
   }
 
-  public async selectDocument(documentId: DocumentId): Promise<void> {
-    this.selectedDocumentId(documentId);
-    const content = await readDocument(this.collection.databaseId, this.collection, documentId);
-    this.initDocumentEditor(documentId, content);
-  }
+  // public async selectDocument(documentId: DocumentId): Promise<void> {
+  //   this.selectedDocumentId(documentId);
+  //   const content = await readDocument(this.collection.databaseId, this.collection, documentId);
+  //   this.initDocumentEditor(documentId, content);
+  // }
 
-  public loadNextPage(): Q.Promise<any> {
-    this.isExecuting(true);
-    this.isExecutionError(false);
-    const filter: string = this.filterContent().trim();
-    const query: string = this.buildQuery(filter);
+  // public loadNextPage(): Q.Promise<any> {
+  // this.isExecuting(true);
+  // this.isExecutionError(false);
+  // const filter: string = this.filterContent().trim();
+  // const query: string = this.buildQuery(filter);
 
-    return Q(queryDocuments(this.collection.databaseId, this.collection, true, query, this.continuationToken))
-      .then(
-        ({ continuationToken, documents }) => {
-          this.continuationToken = continuationToken;
-          let currentDocuments = this.documentIds();
-          const currentDocumentsRids = currentDocuments.map((currentDocument) => currentDocument.rid);
-          const nextDocumentIds = documents
-            .filter((d: any) => {
-              return currentDocumentsRids.indexOf(d._rid) < 0;
-            })
-            .map((rawDocument: any) => {
-              const partitionKeyValue = rawDocument._partitionKeyValue;
-              return new DocumentId(this, rawDocument, partitionKeyValue);
-            });
+  // return Q(queryDocuments(this.collection.databaseId, this.collection, true, query, this.continuationToken))
+  //   .then(
+  //     ({ continuationToken, documents }) => {
+  //       this.continuationToken = continuationToken;
+  //       let currentDocuments = this.documentIds();
+  //       const currentDocumentsRids = currentDocuments.map((currentDocument) => currentDocument.rid);
+  //       const nextDocumentIds = documents
+  //         .filter((d: any) => {
+  //           return currentDocumentsRids.indexOf(d._rid) < 0;
+  //         })
+  //         .map((rawDocument: any) => {
+  //           const partitionKeyValue = rawDocument._partitionKeyValue;
+  //           return new DocumentId(this, rawDocument, partitionKeyValue);
+  //         });
 
-          const merged = currentDocuments.concat(nextDocumentIds);
+  //       const merged = currentDocuments.concat(nextDocumentIds);
 
-          this.documentIds(merged);
-          currentDocuments = this.documentIds();
-          if (this.filterContent().length > 0 && currentDocuments.length > 0) {
-            currentDocuments[0].click();
-          } else {
-            this.selectedDocumentContent("");
-            this.selectedDocumentId(null);
-            this.editorState(ViewModels.DocumentExplorerState.noDocumentSelected);
-          }
-          if (this.onLoadStartKey != null && this.onLoadStartKey != undefined) {
-            TelemetryProcessor.traceSuccess(
-              Action.Tab,
-              {
-                databaseName: this.collection.databaseId,
-                collectionName: this.collection.id(),
+  //       this.documentIds(merged);
+  //       currentDocuments = this.documentIds();
+  //       if (this.filterContent().length > 0 && currentDocuments.length > 0) {
+  //         currentDocuments[0].click();
+  //       } else {
+  //         this.selectedDocumentContent("");
+  //         this.selectedDocumentId(null);
+  //         this.editorState(ViewModels.DocumentExplorerState.noDocumentSelected);
+  //       }
+  //       if (this.onLoadStartKey != null && this.onLoadStartKey != undefined) {
+  //         TelemetryProcessor.traceSuccess(
+  //           Action.Tab,
+  //           {
+  //             databaseName: this.collection.databaseId,
+  //             collectionName: this.collection.id(),
 
-                dataExplorerArea: Constants.Areas.Tab,
-                tabTitle: this.tabTitle(),
-              },
-              this.onLoadStartKey
-            );
-            this.onLoadStartKey = null;
-          }
-        },
-        (error: any) => {
-          if (this.onLoadStartKey != null && this.onLoadStartKey != undefined) {
-            TelemetryProcessor.traceFailure(
-              Action.Tab,
-              {
-                databaseName: this.collection.databaseId,
-                collectionName: this.collection.id(),
+  //             dataExplorerArea: Constants.Areas.Tab,
+  //             tabTitle: this.tabTitle(),
+  //           },
+  //           this.onLoadStartKey
+  //         );
+  //         this.onLoadStartKey = null;
+  //       }
+  //     },
+  //     (error: any) => {
+  //       if (this.onLoadStartKey != null && this.onLoadStartKey != undefined) {
+  //         TelemetryProcessor.traceFailure(
+  //           Action.Tab,
+  //           {
+  //             databaseName: this.collection.databaseId,
+  //             collectionName: this.collection.id(),
 
-                dataExplorerArea: Constants.Areas.Tab,
-                tabTitle: this.tabTitle(),
-                error: getErrorMessage(error),
-                errorStack: getErrorStack(error),
-              },
-              this.onLoadStartKey
-            );
-            this.onLoadStartKey = null;
-          }
-        }
-      )
-      .finally(() => this.isExecuting(false));
-  }
+  //             dataExplorerArea: Constants.Areas.Tab,
+  //             tabTitle: this.tabTitle(),
+  //             error: getErrorMessage(error),
+  //             errorStack: getErrorStack(error),
+  //           },
+  //           this.onLoadStartKey
+  //         );
+  //         this.onLoadStartKey = null;
+  //       }
+  //     }
+  //   )
+  //   .finally(() => this.isExecuting(false));
+  // }
 
-  protected _onEditorContentChange(newContent: string) {
-    try {
-      if (
-        this.editorState() === ViewModels.DocumentExplorerState.newDocumentValid ||
-        this.editorState() === ViewModels.DocumentExplorerState.newDocumentInvalid
-      ) {
-        let parsed: any = JSON.parse(newContent);
-      }
+  // protected _onEditorContentChange(newContent: string) {
+  //   try {
+  //     if (
+  //       this.editorState() === ViewModels.DocumentExplorerState.newDocumentValid ||
+  //       this.editorState() === ViewModels.DocumentExplorerState.newDocumentInvalid
+  //     ) {
+  //       let parsed: any = JSON.parse(newContent);
+  //     }
 
-      // Mongo uses BSON format for _id, trying to parse it as JSON blocks normal flow in an edit
-      this.onValidDocumentEdit();
-    } catch (e) {
-      this.onInvalidDocumentEdit();
-    }
-  }
+  //     // Mongo uses BSON format for _id, trying to parse it as JSON blocks normal flow in an edit
+  //     this.onValidDocumentEdit();
+  //   } catch (e) {
+  //     this.onInvalidDocumentEdit();
+  //   }
+  // }
 
   /** Renders a Javascript object to be displayed inside Monaco Editor */
-  protected renderObjectForEditor(value: any, replacer: any, space: string | number): string {
-    return MongoUtility.tojson(value, null, false);
-  }
+  // protected renderObjectForEditor(value: any, replacer: any, space: string | number): string {
+  //   return MongoUtility.tojson(value, null, false);
+  // }
 
-  private _hasShardKeySpecified(document: any): boolean {
-    return Boolean(extractPartitionKey(document, this._getPartitionKeyDefinition() as PartitionKeyDefinition));
-  }
+  // private _hasShardKeySpecified(document: any): boolean {
+  //   return Boolean(extractPartitionKey(document, this._getPartitionKeyDefinition() as PartitionKeyDefinition));
+  // }
 
-  private _getPartitionKeyDefinition(): DataModels.PartitionKey {
-    let partitionKey: DataModels.PartitionKey = this.partitionKey;
+  // private _getPartitionKeyDefinition(): DataModels.PartitionKey {
+  //   let partitionKey: DataModels.PartitionKey = this.partitionKey;
 
-    if (
-      this.partitionKey &&
-      this.partitionKey.paths &&
-      this.partitionKey.paths.length &&
-      this.partitionKey.paths.length > 0 &&
-      this.partitionKey.paths[0].indexOf("$v") > -1
-    ) {
-      // Convert BsonSchema2 to /path format
-      partitionKey = {
-        kind: partitionKey.kind,
-        paths: ["/" + this.partitionKeyProperty.replace(/\./g, "/")],
-        version: partitionKey.version,
-      };
-    }
+  //   if (
+  //     this.partitionKey &&
+  //     this.partitionKey.paths &&
+  //     this.partitionKey.paths.length &&
+  //     this.partitionKey.paths.length > 0 &&
+  //     this.partitionKey.paths[0].indexOf("$v") > -1
+  //   ) {
+  //     // Convert BsonSchema2 to /path format
+  //     partitionKey = {
+  //       kind: partitionKey.kind,
+  //       paths: ["/" + this.partitionKeyProperty.replace(/\./g, "/")],
+  //       version: partitionKey.version,
+  //     };
+  //   }
 
-    return partitionKey;
-  }
+  //   return partitionKey;
+  // }
 
-  protected __deleteDocument(documentId: DocumentId): Promise<void> {
-    return deleteDocument(this.collection.databaseId, this.collection, documentId);
-  }
+  // protected __deleteDocument(documentId: DocumentId): Promise<void> {
+  //   return deleteDocument(this.collection.databaseId, this.collection, documentId);
+  // }
 }

src/Explorer/Tree/DocumentId.ts

@@ -27,12 +27,12 @@ export default class DocumentId {
     this.isDirty = ko.observable(false);
   }
 
-  public click() {
-    if (!this.container.isEditorDirty() || window.confirm("Your unsaved changes will be lost.")) {
-      this.loadDocument();
-    }
-    return;
-  }
+  // public click() {
+  //   if (!this.container.isEditorDirty() || window.confirm("Your unsaved changes will be lost.")) {
+  //     this.loadDocument();
+  //   }
+  //   return;
+  // }
 
   public partitionKeyHeader(): Object {
     if (!this.partitionKeyProperty) {
@@ -65,7 +65,7 @@ export default class DocumentId {
     return JSON.stringify(partitionKeyValue);
   }
 
-  public async loadDocument(): Promise<void> {
-    await this.container.selectDocument(this);
-  }
+  // public async loadDocument(): Promise<void> {
+  //   await this.container.selectDocument(this);
+  // }
 }