Mongo Shell and MS Graph changes (no RBAC functionality)

* revert to old mongo proxy

* revert to old mongo proxy

* cleanup

* cleanup

---------

Co-authored-by: Asier Isayas <aisayas@microsoft.com>

src/ConfigContext.ts

@@ -109,14 +109,14 @@ let configContext: Readonly<ConfigContext> = {
   PORTAL_BACKEND_ENDPOINT: PortalBackendEndpoints.Prod,
   MONGO_PROXY_ENDPOINT: MongoProxyEndpoints.Prod,
   NEW_MONGO_APIS: [
-    "resourcelist",
-    "queryDocuments",
-    "createDocument",
-    "readDocument",
-    "updateDocument",
-    "deleteDocument",
-    "createCollectionWithProxy",
-    "legacyMongoShell",
+    // "resourcelist",
+    // "queryDocuments",
+    // "createDocument",
+    // "readDocument",
+    // "updateDocument",
+    // "deleteDocument",
+    // "createCollectionWithProxy",
+    // "legacyMongoShell",
   ],
   MONGO_PROXY_OUTBOUND_IPS_ALLOWLISTED: false,
   CASSANDRA_PROXY_ENDPOINT: CassandraProxyEndpoints.Prod,

src/Contracts/AzureResourceGraph.ts

@@ -1,7 +1,8 @@
 export interface QueryRequestOptions {
   $skipToken?: string;
   $top?: number;
-  subscriptions: string[];
+  $allowPartialScopes: boolean;
+  subscriptions?: string[];
 }
 
 export interface QueryResponse {

src/Explorer/ContextMenuButtonFactory.tsx

@@ -52,15 +52,12 @@ export const createDatabaseContextMenu = (container: Explorer, databaseId: strin
   if (userContext.apiType !== "Tables" || userContext.features.enableSDKoperations) {
     items.push({
       iconSrc: DeleteDatabaseIcon,
-      onClick: (lastFocusedElement?: React.RefObject<HTMLElement>) =>
+      onClick: () =>
         useSidePanel
           .getState()
           .openSidePanel(
             "Delete " + getDatabaseName(),
-            <DeleteDatabaseConfirmationPanel
-              lastFocusedElement={lastFocusedElement}
-              refreshDatabases={() => container.refreshAllDatabases()}
-            />,
+            <DeleteDatabaseConfirmationPanel refreshDatabases={() => container.refreshAllDatabases()} />,
           ),
       label: `Delete ${getDatabaseName()}`,
       styleClass: "deleteDatabaseMenuItem",
@@ -135,16 +132,13 @@ export const createCollectionContextMenuButton = (
   if (configContext.platform !== Platform.Fabric) {
     items.push({
       iconSrc: DeleteCollectionIcon,
-      onClick: (lastFocusedElement?: React.RefObject<HTMLElement>) => {
+      onClick: () => {
         useSelectedNode.getState().setSelectedNode(selectedCollection);
         useSidePanel
           .getState()
           .openSidePanel(
             "Delete " + getCollectionName(),
-            <DeleteCollectionConfirmationPane
-              lastFocusedElement={lastFocusedElement}
-              refreshDatabases={() => container.refreshAllDatabases()}
-            />,
+            <DeleteCollectionConfirmationPane refreshDatabases={() => container.refreshAllDatabases()} />,
           );
       },
       label: `Delete ${getCollectionName()}`,

src/Explorer/Controls/TreeComponent/TreeNodeComponent.tsx

@@ -21,7 +21,7 @@ import { useCallback } from "react";
 
 export interface TreeNodeMenuItem {
   label: string;
-  onClick: (value?: React.RefObject<HTMLElement>) => void;
+  onClick: () => void;
   iconSrc?: string;
   isDisabled?: boolean;
   styleClass?: string;
@@ -73,7 +73,6 @@ export const TreeNodeComponent: React.FC<TreeNodeComponentProps> = ({
   treeNodeId,
 }: TreeNodeComponentProps): JSX.Element => {
   const [isLoading, setIsLoading] = React.useState<boolean>(false);
-  const contextMenuRef = React.useRef<HTMLButtonElement>(null);
 
   const getSortedChildren = (treeNode: TreeNode): TreeNode[] => {
     if (!treeNode || !treeNode.children) {
@@ -140,7 +139,7 @@ export const TreeNodeComponent: React.FC<TreeNodeComponentProps> = ({
       data-test={`TreeNode/ContextMenuItem:${menuItem.label}`}
       disabled={menuItem.isDisabled}
       key={menuItem.label}
-      onClick={() => menuItem.onClick(contextMenuRef)}
+      onClick={menuItem.onClick}
     >
       {menuItem.label}
     </MenuItem>
@@ -164,7 +163,6 @@ export const TreeNodeComponent: React.FC<TreeNodeComponentProps> = ({
                   aria-label="More options"
                   data-test="TreeNode/ContextMenuTrigger"
                   appearance="subtle"
-                  ref={contextMenuRef}
                   icon={<MoreHorizontal20Regular />}
                 />
               </MenuTrigger>

src/Explorer/Controls/TreeComponent/__snapshots__/TreeNodeComponent.test.tsx.snap

@@ -1560,14 +1560,14 @@ exports[`TreeNodeComponent renders a node with a menu 1`] = `
               <MenuList>
                 <MenuItem
                   data-test="TreeNode/ContextMenuItem:enabledItem"
-                  onClick={[Function]}
+                  onClick={[MockFunction enabledItemClick]}
                 >
                   enabledItem
                 </MenuItem>
                 <MenuItem
                   data-test="TreeNode/ContextMenuItem:disabledItem"
                   disabled={true}
-                  onClick={[Function]}
+                  onClick={[MockFunction disabledItemClick]}
                 >
                   disabledItem
                 </MenuItem>
@@ -1604,7 +1604,7 @@ exports[`TreeNodeComponent renders a node with a menu 1`] = `
       <MenuItem
         data-test="TreeNode/ContextMenuItem:enabledItem"
         key="enabledItem"
-        onClick={[Function]}
+        onClick={[MockFunction enabledItemClick]}
       >
         enabledItem
       </MenuItem>
@@ -1612,7 +1612,7 @@ exports[`TreeNodeComponent renders a node with a menu 1`] = `
         data-test="TreeNode/ContextMenuItem:disabledItem"
         disabled={true}
         key="disabledItem"
-        onClick={[Function]}
+        onClick={[MockFunction disabledItemClick]}
       >
         disabledItem
       </MenuItem>

src/Explorer/Panes/DeleteCollectionConfirmationPane/DeleteCollectionConfirmationPane.test.tsx

@@ -52,9 +52,7 @@ describe("Delete Collection Confirmation Pane", () => {
 
   describe("shouldRecordFeedback()", () => {
     it("should return true if last collection and database does not have shared throughput else false", () => {
-      const wrapper = shallow(
-        <DeleteCollectionConfirmationPane refreshDatabases={() => undefined} lastFocusedElement={undefined} />,
-      );
+      const wrapper = shallow(<DeleteCollectionConfirmationPane refreshDatabases={() => undefined} />);
       expect(wrapper.exists(".deleteCollectionFeedback")).toBe(false);
 
       const database = { id: ko.observable("testDB") } as Database;
@@ -111,9 +109,7 @@ describe("Delete Collection Confirmation Pane", () => {
     });
 
     it("should call delete collection", () => {
-      const wrapper = mount(
-        <DeleteCollectionConfirmationPane refreshDatabases={() => undefined} lastFocusedElement={undefined} />,
-      );
+      const wrapper = mount(<DeleteCollectionConfirmationPane refreshDatabases={() => undefined} />);
       expect(wrapper).toMatchSnapshot();
 
       expect(wrapper.exists("#confirmCollectionId")).toBe(true);
@@ -130,9 +126,7 @@ describe("Delete Collection Confirmation Pane", () => {
     });
 
     it("should record feedback", async () => {
-      const wrapper = mount(
-        <DeleteCollectionConfirmationPane refreshDatabases={() => undefined} lastFocusedElement={undefined} />,
-      );
+      const wrapper = mount(<DeleteCollectionConfirmationPane refreshDatabases={() => undefined} />);
       expect(wrapper.exists("#confirmCollectionId")).toBe(true);
       wrapper
         .find("#confirmCollectionId")

src/Explorer/Panes/DeleteCollectionConfirmationPane/DeleteCollectionConfirmationPane.tsx

@@ -12,19 +12,17 @@ import { getCollectionName } from "Utils/APITypeUtils";
 import * as NotificationConsoleUtils from "Utils/NotificationConsoleUtils";
 import { useSidePanel } from "hooks/useSidePanel";
 import { useTabs } from "hooks/useTabs";
-import React, { FunctionComponent, useEffect, useState } from "react";
+import React, { FunctionComponent, useState } from "react";
 import { useDatabases } from "../../useDatabases";
 import { useSelectedNode } from "../../useSelectedNode";
 import { RightPaneForm, RightPaneFormProps } from "../RightPaneForm/RightPaneForm";
 
 export interface DeleteCollectionConfirmationPaneProps {
   refreshDatabases: () => Promise<void>;
-  lastFocusedElement: React.MutableRefObject<HTMLElement>;
 }
 
 export const DeleteCollectionConfirmationPane: FunctionComponent<DeleteCollectionConfirmationPaneProps> = ({
   refreshDatabases,
-  lastFocusedElement,
 }: DeleteCollectionConfirmationPaneProps) => {
   const closeSidePanel = useSidePanel((state) => state.closeSidePanel);
   const [deleteCollectionFeedback, setDeleteCollectionFeedback] = useState<string>("");
@@ -37,7 +35,7 @@ export const DeleteCollectionConfirmationPane: FunctionComponent<DeleteCollectio
 
   const collectionName = getCollectionName().toLocaleLowerCase();
   const paneTitle = "Delete " + collectionName;
-  const lastItemElement = lastFocusedElement?.current;
+
   const onSubmit = async (): Promise<void> => {
     const collection = useSelectedNode.getState().findSelectedCollection();
     if (!collection || inputCollectionName !== collection.id()) {
@@ -113,14 +111,6 @@ export const DeleteCollectionConfirmationPane: FunctionComponent<DeleteCollectio
   };
   const confirmContainer = `Confirm by typing the ${collectionName.toLowerCase()} id`;
   const reasonInfo = `Help us improve Azure Cosmos DB! What is the reason why you are deleting this ${collectionName}?`;
-  useEffect(() => {
-    return () => {
-      if (lastItemElement) {
-        lastItemElement.focus();
-      }
-    };
-  }, [lastItemElement]);
-
   return (
     <RightPaneForm {...props}>
       <div className="panelFormWrapper">

src/Explorer/Panes/DeleteDatabaseConfirmationPanel.test.tsx

@@ -49,9 +49,7 @@ describe("Delete Database Confirmation Pane", () => {
   });
 
   it("shouldRecordFeedback() should return true if last non empty database or is last database that has shared throughput", () => {
-    const wrapper = shallow(
-      <DeleteDatabaseConfirmationPanel refreshDatabases={() => undefined} lastFocusedElement={undefined} />,
-    );
+    const wrapper = shallow(<DeleteDatabaseConfirmationPanel refreshDatabases={() => undefined} />);
     expect(wrapper.exists(".deleteDatabaseFeedback")).toBe(true);
 
     useDatabases.getState().addDatabases([database]);
@@ -61,9 +59,7 @@ describe("Delete Database Confirmation Pane", () => {
   });
 
   it("Should call delete database", () => {
-    const wrapper = mount(
-      <DeleteDatabaseConfirmationPanel refreshDatabases={() => undefined} lastFocusedElement={undefined} />,
-    );
+    const wrapper = mount(<DeleteDatabaseConfirmationPanel refreshDatabases={() => undefined} />);
     expect(wrapper).toMatchSnapshot();
     expect(wrapper.exists("#confirmDatabaseId")).toBe(true);
 
@@ -78,9 +74,7 @@ describe("Delete Database Confirmation Pane", () => {
   });
 
   it("should record feedback", async () => {
-    const wrapper = mount(
-      <DeleteDatabaseConfirmationPanel refreshDatabases={() => undefined} lastFocusedElement={undefined} />,
-    );
+    const wrapper = mount(<DeleteDatabaseConfirmationPanel refreshDatabases={() => undefined} />);
     expect(wrapper.exists("#confirmDatabaseId")).toBe(true);
     wrapper
       .find("#confirmDatabaseId")

src/Explorer/Panes/DeleteDatabaseConfirmationPanel.tsx

@@ -13,7 +13,7 @@ import { getDatabaseName } from "Utils/APITypeUtils";
 import { logConsoleError } from "Utils/NotificationConsoleUtils";
 import { useSidePanel } from "hooks/useSidePanel";
 import { useTabs } from "hooks/useTabs";
-import React, { FunctionComponent, useEffect, useState } from "react";
+import React, { FunctionComponent, useState } from "react";
 import { useDatabases } from "../useDatabases";
 import { useSelectedNode } from "../useSelectedNode";
 import { PanelInfoErrorComponent, PanelInfoErrorProps } from "./PanelInfoErrorComponent";
@@ -21,12 +21,10 @@ import { RightPaneForm, RightPaneFormProps } from "./RightPaneForm/RightPaneForm
 
 interface DeleteDatabaseConfirmationPanelProps {
   refreshDatabases: () => Promise<void>;
-  lastFocusedElement: React.MutableRefObject<HTMLElement>;
 }
 
 export const DeleteDatabaseConfirmationPanel: FunctionComponent<DeleteDatabaseConfirmationPanelProps> = ({
   refreshDatabases,
-  lastFocusedElement,
 }: DeleteDatabaseConfirmationPanelProps): JSX.Element => {
   const closeSidePanel = useSidePanel((state) => state.closeSidePanel);
   const isLastNonEmptyDatabase = useDatabases((state) => state.isLastNonEmptyDatabase);
@@ -36,7 +34,7 @@ export const DeleteDatabaseConfirmationPanel: FunctionComponent<DeleteDatabaseCo
   const [databaseInput, setDatabaseInput] = useState<string>("");
   const [databaseFeedbackInput, setDatabaseFeedbackInput] = useState<string>("");
   const selectedDatabase: Database = useDatabases.getState().findSelectedDatabase();
-  const lastItemElement = lastFocusedElement?.current;
+
   const submit = async (): Promise<void> => {
     if (selectedDatabase?.id() && databaseInput !== selectedDatabase.id()) {
       setFormError(
@@ -128,13 +126,6 @@ export const DeleteDatabaseConfirmationPanel: FunctionComponent<DeleteDatabaseCo
   };
   const confirmDatabase = `Confirm by typing the ${getDatabaseName()} id`;
   const reasonInfo = `Help us improve Azure Cosmos DB! What is the reason why you are deleting this ${getDatabaseName()}?`;
-  useEffect(() => {
-    return () => {
-      if (lastItemElement) {
-        lastItemElement.focus();
-      }
-    };
-  }, [lastItemElement]);
   return (
     <RightPaneForm {...props}>
       {!formError && <PanelInfoErrorComponent {...errorProps} />}

src/Explorer/Tables/TableDataClient.ts

@@ -363,18 +363,24 @@ export class CassandraAPIDataClient extends TableDataClient {
     entitiesToDelete: Entities.ITableEntity[],
   ): Promise<any> {
     const query = `DELETE FROM ${collection.databaseId}.${collection.id()} WHERE `;
-    const partitionKeyProperty = this.getCassandraPartitionKeyProperty(collection);
-
+    const partitionKeys: CassandraTableKey[] = collection.cassandraKeys.partitionKeys;
     await Promise.all(
       entitiesToDelete.map(async (currEntityToDelete: Entities.ITableEntity) => {
         const clearMessage = NotificationConsoleUtils.logConsoleProgress(`Deleting row ${currEntityToDelete.RowKey._}`);
-        const partitionKeyValue = currEntityToDelete[partitionKeyProperty];
-        const currQuery =
-          query +
-          (this.isStringType(partitionKeyValue.$)
-            ? `${partitionKeyProperty} = '${partitionKeyValue._}'`
-            : `${partitionKeyProperty} = ${partitionKeyValue._}`);
 
+        let currQuery = query;
+        for (let partitionKeyIndex = 0; partitionKeyIndex < partitionKeys.length; partitionKeyIndex++) {
+          const partitionKey: CassandraTableKey = partitionKeys[partitionKeyIndex];
+          const partitionKeyValue: Entities.ITableEntityAttribute = currEntityToDelete[partitionKey.property];
+          currQuery =
+            currQuery +
+            (this.isStringType(partitionKeyValue.$)
+              ? `${partitionKey.property} = '${partitionKeyValue._}'`
+              : `${partitionKey.property} = ${partitionKeyValue._}`);
+          if (partitionKeyIndex < partitionKeys.length - 1) {
+            currQuery = `${currQuery} AND `;
+          }
+        }
         try {
           await this.queryDocuments(collection, currQuery);
           NotificationConsoleUtils.logConsoleInfo(`Successfully deleted row ${currEntityToDelete.RowKey._}`);

src/Explorer/Tabs/DocumentsTabV2/DocumentsTabV2.test.tsx

@@ -340,7 +340,7 @@ describe("Documents tab (noSql API)", () => {
       isPreferredApiMongoDB: false,
       documentIds: [],
       collection: undefined,
-      partitionKey: undefined,
+      partitionKey: { kind: "Hash", paths: ["/foo"], version: 2 },
       onLoadStartKey: 0,
       tabTitle: "",
       onExecutionErrorChange: (isExecutionError: boolean): void => {

src/Explorer/Tabs/DocumentsTabV2/DocumentsTabV2.tsx

@@ -7,7 +7,10 @@ import { getErrorMessage, getErrorStack } from "Common/ErrorHandlingUtils";
 import MongoUtility from "Common/MongoUtility";
 import { StyleConstants } from "Common/StyleConstants";
 import { createDocument } from "Common/dataAccess/createDocument";
-import { deleteDocuments as deleteNoSqlDocuments } from "Common/dataAccess/deleteDocument";
+import {
+  deleteDocument as deleteNoSqlDocument,
+  deleteDocuments as deleteNoSqlDocuments,
+} from "Common/dataAccess/deleteDocument";
 import { queryDocuments } from "Common/dataAccess/queryDocuments";
 import { readDocument } from "Common/dataAccess/readDocument";
 import { updateDocument } from "Common/dataAccess/updateDocument";
@@ -824,7 +827,7 @@ export const DocumentsTabComponent: React.FunctionComponent<IDocumentsTabCompone
   }, [initialDocumentContent, selectedDocumentContentBaseline, setSelectedDocumentContent]);
 
   /**
-   * Implementation using bulk delete
+   * Implementation using bulk delete NoSQL API
    */
   let _deleteDocuments = useCallback(
     async (toDeleteDocumentIds: DocumentId[]): Promise<DocumentId[]> => {
@@ -834,7 +837,14 @@ export const DocumentsTabComponent: React.FunctionComponent<IDocumentsTabCompone
         tabTitle,
       });
       setIsExecuting(true);
-      return deleteNoSqlDocuments(_collection, toDeleteDocumentIds)
+
+      // TODO: Once JS SDK Bug fix for bulk deleting legacy containers (whose systemKey==1) is released:
+      // Remove the check for systemKey, remove call to deleteNoSqlDocument(). deleteNoSqlDocuments() should always be called.
+      return (
+        partitionKey.systemKey
+          ? deleteNoSqlDocument(_collection, toDeleteDocumentIds[0]).then(() => [toDeleteDocumentIds[0]])
+          : deleteNoSqlDocuments(_collection, toDeleteDocumentIds)
+      )
         .then(
           (deletedIds) => {
             TelemetryProcessor.traceSuccess(
@@ -1800,7 +1810,8 @@ export const DocumentsTabComponent: React.FunctionComponent<IDocumentsTabCompone
                   size={tableContainerSizePx}
                   columnHeaders={columnHeaders}
                   isSelectionDisabled={
-                    configContext.platform === Platform.Fabric && userContext.fabricContext?.isReadOnly
+                    (partitionKey.systemKey && !isPreferredApiMongoDB) ||
+                    (configContext.platform === Platform.Fabric && userContext.fabricContext?.isReadOnly)
                   }
                 />
                 {tableItems.length > 0 && (

src/Explorer/Tabs/MongoShellTab/MongoShellTabComponent.tsx

@@ -132,7 +132,7 @@ export default class MongoShellTabComponent extends Component<
         data: {
           resourceId: resourceId,
           accountName: accountName,
-          mongoEndpoint: mongoEndpoint,
+          mongoEndpoint: this._useMongoProxyEndpoint ? documentEndpoint : mongoEndpoint,
           authorization: authorization,
           databaseId: databaseId,
           collectionId: collectionId,

src/hooks/useDatabaseAccounts.tsx

@@ -52,11 +52,17 @@ export async function fetchDatabaseAccountsFromGraph(
     const body = {
       query: databaseAccountsQuery,
       subscriptions: [subscriptionId],
-      ...(skipToken && {
-        options: {
-          $skipToken: skipToken,
-        } as QueryRequestOptions,
-      }),
+      ...(skipToken
+        ? {
+            options: {
+              $skipToken: skipToken,
+            } as QueryRequestOptions,
+          }
+        : {
+            options: {
+              $top: 150,
+            } as QueryRequestOptions,
+          }),
     };
 
     const response = await fetch(managementResourceGraphAPIURL, {

src/hooks/useSubscriptions.tsx

@@ -51,11 +51,13 @@ export async function fetchSubscriptionsFromGraph(accessToken: string): Promise<
   do {
     const body = {
       query: subscriptionsQuery,
-      ...(skipToken && {
-        options: {
+      options: {
+        $allowPartialScopes: true,
+        $top: 150,
+        ...(skipToken && {
           $skipToken: skipToken,
-        } as QueryRequestOptions,
-      }),
+        }),
+      } as QueryRequestOptions,
     };
 
     const response = await fetch(managementResourceGraphAPIURL, {