Merge branch 'master' into eslint/fixed-TableEntityProcessor-DatabaseSettingsTab

* resolve_eslint_NodePropertiesComponent

* address commit

* Open new screen: Screen reader does not pass the 'Copied' information after selecting 'Copy' button.

* resolve lint error

.eslintignore

@@ -81,22 +81,14 @@ src/Explorer/Tables/DataTable/DataTableBindingManager.ts
 src/Explorer/Tables/DataTable/DataTableBuilder.ts
 src/Explorer/Tables/DataTable/DataTableContextMenu.ts
 src/Explorer/Tables/DataTable/DataTableOperationManager.ts
-# src/Explorer/Tables/DataTable/DataTableOperations.ts
 src/Explorer/Tables/DataTable/DataTableViewModel.ts
-# src/Explorer/Tables/DataTable/TableCommands.ts
-# src/Explorer/Tables/DataTable/TableEntityCache.ts
 src/Explorer/Tables/DataTable/TableEntityListViewModel.ts
-# src/Explorer/Tables/Entities.ts
 src/Explorer/Tables/QueryBuilder/CustomTimestampHelper.ts
 src/Explorer/Tables/TableDataClient.ts
-src/Explorer/Tables/TableEntityProcessor.ts
 src/Explorer/Tables/Utilities.ts
 src/Explorer/Tabs/ConflictsTab.ts
-src/Explorer/Tabs/DatabaseSettingsTab.ts
 src/Explorer/Tabs/DocumentsTab.test.ts
 src/Explorer/Tabs/DocumentsTab.ts
-src/Explorer/Tabs/GraphTab.ts
-src/Explorer/Tabs/MongoDocumentsTab.ts
 src/Explorer/Tabs/NotebookV2Tab.ts
 src/Explorer/Tabs/ScriptTabBase.ts
 src/Explorer/Tabs/TabComponents.ts
@@ -134,20 +126,13 @@ src/Explorer/Controls/Notebook/NotebookTerminalComponent.tsx
 src/Explorer/Controls/NotebookViewer/NotebookViewerComponent.tsx
 src/Explorer/Controls/TreeComponent/TreeComponent.tsx
 src/Explorer/Graph/GraphExplorerComponent/GraphExplorer.test.tsx
-; src/Explorer/Graph/GraphExplorerComponent/GraphExplorer.tsx
-src/Explorer/Graph/GraphExplorerComponent/GraphVizComponent.tsx
-src/Explorer/Graph/GraphExplorerComponent/LeftPaneComponent.tsx
-src/Explorer/Graph/GraphExplorerComponent/MiddlePaneComponent.tsx
-src/Explorer/Graph/GraphExplorerComponent/NodePropertiesComponent.test.tsx
 src/Explorer/Graph/GraphExplorerComponent/NodePropertiesComponent.tsx
 src/Explorer/Graph/GraphExplorerComponent/ReadOnlyNodePropertiesComponent.test.tsx
 src/Explorer/Graph/GraphExplorerComponent/ReadOnlyNodePropertiesComponent.tsx
 src/Explorer/Menus/CommandBar/CommandBarUtil.tsx
 src/Explorer/Notebook/NotebookComponent/NotebookComponentAdapter.tsx
-; src/Explorer/Notebook/NotebookComponent/NotebookComponentBootstrapper.tsx
 src/Explorer/Notebook/NotebookComponent/VirtualCommandBarComponent.tsx
 src/Explorer/Notebook/NotebookComponent/contents/index.tsx
-; src/Explorer/Notebook/NotebookRenderer/NotebookReadOnlyRenderer.tsx
 src/Explorer/Notebook/NotebookRenderer/NotebookRenderer.tsx
 src/Explorer/Notebook/NotebookRenderer/decorators/draggable/index.tsx
 src/Explorer/Notebook/NotebookRenderer/decorators/hijack-scroll/index.tsx

src/Explorer/Graph/GraphExplorerComponent/LeftPaneComponent.tsx

@@ -58,7 +58,7 @@ export class LeftPaneComponent extends React.Component<LeftPaneComponentProps> {
         className={className}
         as="tr"
         aria-label={node.caption}
-        onActivated={(e) => this.props.onRootNodeSelected(node.id)}
+        onActivated={() => this.props.onRootNodeSelected(node.id)}
         key={node.id}
       >
         <td className="resultItem">

src/Explorer/Graph/GraphExplorerComponent/NodePropertiesComponent.test.tsx

@@ -1,8 +1,8 @@
-import React from "react";
 import { mount, ReactWrapper } from "enzyme";
 import * as Q from "q";
-import { NodePropertiesComponent, NodePropertiesComponentProps, Mode } from "./NodePropertiesComponent";
-import { GraphHighlightedNodeData, EditedProperties, EditedEdges, PossibleVertex } from "./GraphExplorer";
+import React from "react";
+import { GraphHighlightedNodeData, PossibleVertex } from "./GraphExplorer";
+import { Mode, NodePropertiesComponent, NodePropertiesComponentProps } from "./NodePropertiesComponent";
 
 describe("Property pane", () => {
   const title = "My Title";
@@ -37,17 +37,18 @@ describe("Property pane", () => {
     return {
       expandedTitle: title,
       isCollapsed: false,
-      onCollapsedChanged: (newValue: boolean): void => {},
+      onCollapsedChanged: jest.fn(),
       node: highlightedNode,
-      getPkIdFromNodeData: (v: GraphHighlightedNodeData): string => null,
-      collectionPartitionKeyProperty: null,
-      updateVertexProperties: (editedProperties: EditedProperties): Q.Promise<void> => Q.resolve(),
-      selectNode: (id: string): void => {},
-      updatePossibleVertices: (): Q.Promise<PossibleVertex[]> => Q.resolve(null),
-      possibleEdgeLabels: null,
-      editGraphEdges: (editedEdges: EditedEdges): Q.Promise<any> => Q.resolve(),
-      deleteHighlightedNode: (): void => {},
-      onModeChanged: (newMode: Mode): void => {},
+      getPkIdFromNodeData: (): string => undefined,
+      collectionPartitionKeyProperty: undefined,
+      updateVertexProperties: (): Q.Promise<void> => Q.resolve(),
+      selectNode: jest.fn(),
+      updatePossibleVertices: (): Q.Promise<PossibleVertex[]> => Q.resolve(undefined),
+      possibleEdgeLabels: undefined,
+      //eslint-disable-next-line
+      editGraphEdges: (): Q.Promise<any> => Q.resolve(),
+      deleteHighlightedNode: jest.fn(),
+      onModeChanged: jest.fn(),
       viewMode: Mode.READONLY_PROP,
     };
   };

src/Explorer/Graph/GraphExplorerComponent/NodePropertiesComponent.tsx

@@ -72,7 +72,7 @@ export class NodePropertiesComponent extends React.Component<
     super(props);
     this.state = {
       editedProperties: {
-        pkId: null,
+        pkId: undefined,
         readOnlyProperties: [],
         existingProperties: [],
         addedProperties: [],
@@ -98,15 +98,12 @@ export class NodePropertiesComponent extends React.Component<
     };
   }
 
-  public static getDerivedStateFromProps(
-    props: NodePropertiesComponentProps,
-    state: NodePropertiesComponentState
-  ): Partial<NodePropertiesComponentState> {
+  public static getDerivedStateFromProps(props: NodePropertiesComponentProps): Partial<NodePropertiesComponentState> {
     if (props.viewMode !== Mode.READONLY_PROP) {
       return { isDeleteConfirm: false };
     }
 
-    return null;
+    return undefined;
   }
 
   public render(): JSX.Element {
@@ -138,10 +135,10 @@ export class NodePropertiesComponent extends React.Component<
    * @param value
    */
   private static getTypeOption(value: any): ViewModels.InputPropertyValueTypeString {
-    if (value == null) {
+    if (value === undefined) {
       return "null";
     }
-    let type = typeof value;
+    const type = typeof value;
     switch (type) {
       case "number":
       case "boolean":
@@ -172,10 +169,9 @@ export class NodePropertiesComponent extends React.Component<
     ];
 
     const existingProps: ViewModels.InputProperty[] = [];
-
     if (this.props.node.hasOwnProperty("properties")) {
       const hProps = this.props.node["properties"];
-      for (let p in hProps) {
+      for (const p in hProps) {
         const propValues = hProps[p];
         (p === partitionKeyProperty ? readOnlyProps : existingProps).push({
           key: p,
@@ -437,7 +433,7 @@ export class NodePropertiesComponent extends React.Component<
         </div>
       );
     } else {
-      return null;
+      return undefined;
     }
   }
 

src/Explorer/OpenFullScreen.tsx

@@ -4,6 +4,8 @@ import * as React from "react";
 import { useFullScreenURLs } from "../hooks/useFullScreenURLs";
 
 export const OpenFullScreen: React.FunctionComponent = () => {
+  const [isReadUrlCopy, setIsReadUrlCopy] = React.useState<boolean>(false);
+  const [isReadWriteUrlCopy, setIsReadWriteUrlCopy] = React.useState<boolean>(false);
   const result = useFullScreenURLs();
   if (!result) {
     return <Spinner label="Generating URLs..." ariaLive="assertive" labelPosition="right" />;
@@ -25,8 +27,9 @@ export const OpenFullScreen: React.FunctionComponent = () => {
           <DefaultButton
             onClick={() => {
               copyToClipboard(readWriteUrl);
+              setIsReadWriteUrlCopy(true);
             }}
-            text="Copy"
+            text={isReadWriteUrlCopy ? "Copied" : "Copy"}
             iconProps={{ iconName: "Copy" }}
           />
           <PrimaryButton
@@ -41,9 +44,10 @@ export const OpenFullScreen: React.FunctionComponent = () => {
         <Stack horizontal tokens={{ childrenGap: 10 }}>
           <DefaultButton
             onClick={() => {
+              setIsReadUrlCopy(true);
               copyToClipboard(readUrl);
             }}
-            text="Copy"
+            text={isReadUrlCopy ? "Copied" : "Copy"}
             iconProps={{ iconName: "Copy" }}
           />
           <PrimaryButton

src/Explorer/Tables/TableEntityProcessor.ts

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import * as ViewModels from "../../Contracts/ViewModels";
 import * as Constants from "./Constants";
 import * as Entities from "./Entities";
@@ -16,12 +17,12 @@ enum DataTypes {
   Int64 = 18,
 }
 
-var tablesIndexers = {
+const tablesIndexers = {
   Value: "$v",
   Type: "$t",
 };
 
-export var keyProperties = {
+export const keyProperties = {
   PartitionKey: "$pk",
   Id: "id",
   Id2: "$id", // This should always be the same value as Id
@@ -33,14 +34,17 @@ export var keyProperties = {
 };
 
 export function convertDocumentsToEntities(documents: any[]): Entities.ITableEntityForTablesAPI[] {
-  let results: Entities.ITableEntityForTablesAPI[] = [];
+  const results: Entities.ITableEntityForTablesAPI[] = [];
   documents &&
     documents.forEach((document) => {
-      if (!document.hasOwnProperty(keyProperties.PartitionKey) || !document.hasOwnProperty(keyProperties.Id)) {
+      if (
+        !Object.prototype.hasOwnProperty.call(document, keyProperties.PartitionKey) ||
+        Object.prototype.hasOwnProperty.call(document, keyProperties.Id)
+      ) {
         //Document does not match the current required format for Tables, so we ignore it
         return; // The rest of the key properties should be guaranteed as DocumentDB properties
       }
-      let entity: Entities.ITableEntityForTablesAPI = <Entities.ITableEntityForTablesAPI>{
+      const entity: Entities.ITableEntityForTablesAPI = <Entities.ITableEntityForTablesAPI>{
         PartitionKey: {
           _: document[keyProperties.PartitionKey],
           $: Constants.TableType.String,
@@ -71,8 +75,8 @@ export function convertDocumentsToEntities(documents: any[]): Entities.ITableEnt
           $: Constants.TableType.String,
         },
       };
-      for (var property in document) {
-        if (document.hasOwnProperty(property)) {
+      for (const property in document) {
+        if (Object.prototype.hasOwnProperty.call(document, property)) {
           if (
             property !== keyProperties.PartitionKey &&
             property !== keyProperties.Id &&
@@ -83,7 +87,10 @@ export function convertDocumentsToEntities(documents: any[]): Entities.ITableEnt
             property !== keyProperties.attachments &&
             property !== keyProperties.Id2
           ) {
-            if (!document[property].hasOwnProperty("$v") || !document[property].hasOwnProperty("$t")) {
+            if (
+              !Object.prototype.hasOwnProperty.call(document[property], "$v") ||
+              !Object.prototype.hasOwnProperty.call(document[property], "$t")
+            ) {
               return; //Document property does not match the current required format for Tables, so we ignore it
             }
             if (DataTypes[document[property][tablesIndexers.Type]] === DataTypes[DataTypes.DateTime]) {
@@ -111,10 +118,10 @@ export function convertEntitiesToDocuments(
   entities: Entities.ITableEntityForTablesAPI[],
   collection: ViewModels.Collection
 ): any[] {
-  let results: any[] = [];
+  const results: any[] = [];
   entities &&
     entities.forEach((entity) => {
-      let document: any = {
+      const document: any = {
         $id: entity.RowKey._,
         id: entity.RowKey._,
         ts: DateTimeUtilities.convertJSDateToUnix(entity.Timestamp._), // Convert back to unix time
@@ -129,7 +136,7 @@ export function convertEntitiesToDocuments(
         document[collection.partitionKeyProperty] = entity.PartitionKey._;
         document["partitionKeyValue"] = entity.PartitionKey._;
       }
-      for (var property in entity) {
+      for (const property in entity) {
         if (
           property !== Constants.EntityKeyNames.PartitionKey &&
           property !== Constants.EntityKeyNames.RowKey &&
@@ -160,7 +167,7 @@ export function convertEntitiesToDocuments(
 }
 
 export function convertEntityToNewDocument(entity: Entities.ITableEntityForTablesAPI): any {
-  let document: any = {
+  const document: any = {
     $pk: entity.PartitionKey._,
     $id: entity.RowKey._,
     id: entity.RowKey._,

src/Explorer/Tabs/DocumentsTab.ts

@@ -92,7 +92,7 @@ export default class DocumentsTab extends TabsBase {
 
     this.partitionKeyPropertyHeader =
       (this.collection && this.collection.partitionKeyPropertyHeader) || this._getPartitionKeyPropertyHeader();
-    this.partitionKeyProperty = !!this.partitionKeyPropertyHeader
+    this.partitionKeyProperty = this.partitionKeyPropertyHeader
       ? this.partitionKeyPropertyHeader.replace(/[/]+/g, ".").substr(1).replace(/[']+/g, "")
       : null;
 
@@ -446,8 +446,8 @@ export default class DocumentsTab extends TabsBase {
             this.partitionKey as PartitionKeyDefinition
           );
           const partitionKeyValue = partitionKeyValueArray && partitionKeyValueArray[0];
-          let id = new DocumentId(this, savedDocument, partitionKeyValue);
-          let ids = this.documentIds();
+          const id = new DocumentId(this, savedDocument, partitionKeyValue);
+          const ids = this.documentIds();
           ids.push(id);
 
           this.selectedDocumentId(id);
@@ -682,10 +682,10 @@ export default class DocumentsTab extends TabsBase {
   }
 
   public createIterator(): QueryIterator<ItemDefinition & Resource> {
-    let filters = this.lastFilterContents();
+    const filters = this.lastFilterContents();
     const filter: string = this.filterContent().trim();
     const query: string = this.buildQuery(filter);
-    let options: any = {};
+    const options: any = {};
     options.enableCrossPartitionQuery = HeadersUtility.shouldEnableCrossPartitionKey();
 
     if (this._resourceTokenPartitionKey) {
@@ -778,7 +778,7 @@ export default class DocumentsTab extends TabsBase {
 
   protected _onEditorContentChange(newContent: string) {
     try {
-      let parsed: any = JSON.parse(newContent);
+      const parsed: any = JSON.parse(newContent);
       this.onValidDocumentEdit();
     } catch (e) {
       this.onInvalidDocumentEdit();

src/Explorer/Tabs/MongoDocumentsTab.ts

@@ -1,3 +1,5 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable @typescript-eslint/no-unused-vars */
 import { extractPartitionKey, PartitionKeyDefinition } from "@azure/cosmos";
 import * as ko from "knockout";
 import Q from "q";
@@ -44,7 +46,7 @@ export default class MongoDocumentsTab extends DocumentsTab {
     super.buildCommandBarOptions();
   }
 
-  public onSaveNewDocumentClick = (): Promise<any> => {
+  public onSaveNewDocumentClick = (): Promise<void> => {
     const documentContent = JSON.parse(this.selectedDocumentContent());
     this.displayedError("");
     const startKey: number = TelemetryProcessor.traceStart(Action.CreateDocument, {
@@ -59,9 +61,8 @@ export default class MongoDocumentsTab extends DocumentsTab {
     ) {
       const message = `The document is lacking the shard property: ${this.partitionKeyProperty}`;
       this.displayedError(message);
-      let that = this;
       setTimeout(() => {
-        that.displayedError("");
+        this.displayedError("");
       }, Constants.ClientDefaults.errorNotificationTimeoutMs);
       this.isExecutionError(true);
       TelemetryProcessor.traceFailure(
@@ -82,19 +83,19 @@ export default class MongoDocumentsTab extends DocumentsTab {
     return createDocument(this.collection.databaseId, this.collection, this.partitionKeyProperty, documentContent)
       .then(
         (savedDocument: any) => {
-          let partitionKeyArray = extractPartitionKey(
+          const partitionKeyArray = extractPartitionKey(
             savedDocument,
             this._getPartitionKeyDefinition() as PartitionKeyDefinition
           );
 
-          let partitionKeyValue = partitionKeyArray && partitionKeyArray[0];
+          const partitionKeyValue = partitionKeyArray && partitionKeyArray[0];
 
-          let id = new ObjectId(this, savedDocument, partitionKeyValue);
-          let ids = this.documentIds();
+          const id = new ObjectId(this, savedDocument, partitionKeyValue);
+          const ids = this.documentIds();
           ids.push(id);
           delete savedDocument._self;
 
-          let value: string = this.renderObjectForEditor(savedDocument || {}, null, 4);
+          const value: string = this.renderObjectForEditor(savedDocument || {}, null, 4);
           this.selectedDocumentContent.setBaseline(value);
 
           this.selectedDocumentId(id);
@@ -128,7 +129,7 @@ export default class MongoDocumentsTab extends DocumentsTab {
       .finally(() => this.isExecuting(false));
   };
 
-  public onSaveExisitingDocumentClick = (): Promise<any> => {
+  public onSaveExisitingDocumentClick = (): Promise<void> => {
     const selectedDocumentId = this.selectedDocumentId();
     const documentContent = this.selectedDocumentContent();
     this.isExecutionError(false);
@@ -141,7 +142,7 @@ export default class MongoDocumentsTab extends DocumentsTab {
     return updateDocument(this.collection.databaseId, this.collection, selectedDocumentId, documentContent)
       .then(
         (updatedDocument: any) => {
-          let value: string = this.renderObjectForEditor(updatedDocument || {}, null, 4);
+          const value: string = this.renderObjectForEditor(updatedDocument || {}, null, 4);
           this.selectedDocumentContent.setBaseline(value);
 
           this.documentIds().forEach((documentId: DocumentId) => {
@@ -151,7 +152,7 @@ export default class MongoDocumentsTab extends DocumentsTab {
                 this._getPartitionKeyDefinition() as PartitionKeyDefinition
               );
 
-              let partitionKeyValue = partitionKeyArray && partitionKeyArray[0];
+              const partitionKeyValue = partitionKeyArray && partitionKeyArray[0];
 
               const id = new ObjectId(this, updatedDocument, partitionKeyValue);
               documentId.id(id.id());
@@ -196,7 +197,7 @@ export default class MongoDocumentsTab extends DocumentsTab {
     this.initDocumentEditor(documentId, content);
   }
 
-  public loadNextPage(): Q.Promise<any> {
+  public loadNextPage(): Q.Promise<void> {
     this.isExecuting(true);
     this.isExecutionError(false);
     const filter: string = this.filterContent().trim();
@@ -228,7 +229,7 @@ export default class MongoDocumentsTab extends DocumentsTab {
             this.selectedDocumentId(null);
             this.editorState(ViewModels.DocumentExplorerState.noDocumentSelected);
           }
-          if (this.onLoadStartKey != null && this.onLoadStartKey != undefined) {
+          if (this.onLoadStartKey !== null && this.onLoadStartKey !== undefined) {
             TelemetryProcessor.traceSuccess(
               Action.Tab,
               {
@@ -243,8 +244,8 @@ export default class MongoDocumentsTab extends DocumentsTab {
             this.onLoadStartKey = null;
           }
         },
-        (error: any) => {
-          if (this.onLoadStartKey != null && this.onLoadStartKey != undefined) {
+        (error: Error) => {
+          if (this.onLoadStartKey !== null && this.onLoadStartKey !== undefined) {
             TelemetryProcessor.traceFailure(
               Action.Tab,
               {
@@ -265,13 +266,13 @@ export default class MongoDocumentsTab extends DocumentsTab {
       .finally(() => this.isExecuting(false));
   }
 
-  protected _onEditorContentChange(newContent: string) {
+  protected _onEditorContentChange(newContent: string): void {
     try {
       if (
         this.editorState() === ViewModels.DocumentExplorerState.newDocumentValid ||
         this.editorState() === ViewModels.DocumentExplorerState.newDocumentInvalid
       ) {
-        let parsed: any = JSON.parse(newContent);
+        const parsed: any = JSON.parse(newContent);
       }
 
       // Mongo uses BSON format for _id, trying to parse it as JSON blocks normal flow in an edit

src/Explorer/Tabs/NotebookV2Tab.ts

@@ -118,7 +118,7 @@ export default class NotebookTabV2 extends NotebookTabBase {
     const saveButtonChildren = [];
     if (this.container.notebookManager?.gitHubOAuthService.isLoggedIn()) {
       saveButtonChildren.push({
-        iconName: "Copy",
+        iconName: copyToLabel,
         onCommandClick: () => this.copyNotebook(),
         commandButtonLabel: copyToLabel,
         hasPopup: false,