chore: adapt DropNamespacePlugin to multiple connections COMPASS-7863 (…

…#5721)

* chore: drop namespace plugin

* chore: remove console.log

* chore: fix tests

* chore: fix linter

* chore: fix linting issues

packages/compass-sidebar/src/components/legacy/sidebar-databases-navigation.tsx

@@ -160,13 +160,13 @@ const onNamespaceAction = (
     const ns = toNS(namespace);
     switch (action) {
       case 'drop-database':
-        emit('open-drop-database', ns.database);
+        emit('open-drop-database', connectionId, ns.database);
         return;
       case 'rename-collection':
         emit('open-rename-collection', connectionId, ns);
         return;
       case 'drop-collection':
-        emit('open-drop-collection', ns);
+        emit('open-drop-collection', connectionId, ns);
         return;
       case 'create-collection':
         emit('open-create-collection', ns);

packages/compass-sidebar/src/components/multiple-connections/active-connections/active-connection-navigation.tsx

@@ -284,13 +284,13 @@ const onNamespaceAction = (
     const ns = toNS(namespace);
     switch (action) {
       case 'drop-database':
-        emit('open-drop-database', ns.database);
+        emit('open-drop-database', connectionId, ns.database);
         return;
       case 'rename-collection':
         emit('open-rename-collection', connectionId, ns);
         return;
       case 'drop-collection':
-        emit('open-drop-collection', ns);
+        emit('open-drop-collection', connectionId, ns);
         return;
       case 'create-collection':
         emit('open-create-collection', ns);

packages/databases-collections-list/src/collections.tsx

@@ -75,12 +75,14 @@ function collectionPropertyToBadge({
 }
 
 const CollectionsList: React.FunctionComponent<{
+  connectionId: string;
   collections: Collection[];
   onCollectionClick(id: string): void;
-  onDeleteCollectionClick?: (id: string) => void;
+  onDeleteCollectionClick?: (connectionId: string, id: string) => void;
   onCreateCollectionClick?: () => void;
   onRefreshClick?: () => void;
 }> = ({
+  connectionId,
   collections,
   onCollectionClick,
   onCreateCollectionClick,
@@ -103,7 +105,7 @@ const CollectionsList: React.FunctionComponent<{
         { name: 'index_size', label: 'Total index size' },
       ]}
       onItemClick={onCollectionClick}
-      onDeleteItemClick={onDeleteCollectionClick}
+      onDeleteItemClick={(ns) => onDeleteCollectionClick?.(connectionId, ns)}
       onCreateItemClick={onCreateCollectionClick}
       onRefreshClick={onRefreshClick}
       renderItem={({

packages/databases-collections-list/src/databases.tsx

@@ -22,12 +22,14 @@ const DATABASE_CARD_HEIGHT = 154;
 const DATABASE_CARD_LIST_HEIGHT = 118;
 
 const DatabasesList: React.FunctionComponent<{
+  connectionId: string;
   databases: Database[];
   onDatabaseClick(id: string): void;
-  onDeleteDatabaseClick?: (id: string) => void;
+  onDeleteDatabaseClick?: (connectionId: string, id: string) => void;
   onCreateDatabaseClick?: () => void;
   onRefreshClick?: () => void;
 }> = ({
+  connectionId,
   databases,
   onDatabaseClick,
   onCreateDatabaseClick,
@@ -48,7 +50,9 @@ const DatabasesList: React.FunctionComponent<{
         { name: 'index_count', label: 'Indexes' },
       ]}
       onItemClick={onDatabaseClick}
-      onDeleteItemClick={onDeleteDatabaseClick}
+      onDeleteItemClick={(database) =>
+        onDeleteDatabaseClick?.(connectionId, database)
+      }
       onCreateItemClick={onCreateDatabaseClick}
       onRefreshClick={onRefreshClick}
       renderItem={({

packages/databases-collections/src/collections-plugin.spec.tsx

@@ -81,6 +81,7 @@ describe('Collections [Plugin]', function () {
       userEvent.click(screen.getByRole('button', { name: /Delete/ }));
       expect(appRegistry.emit).to.have.been.calledWithMatch(
         'open-drop-collection',
+        'TEST',
         { ns: 'foo.bar' }
       );
     });

packages/databases-collections/src/components/collections.tsx

@@ -17,6 +17,7 @@ import {
 import type Collection from 'mongodb-collection-model';
 import toNS from 'mongodb-ns';
 import { useOpenWorkspace } from '@mongodb-js/compass-workspaces/provider';
+import { useConnectionInfo } from '@mongodb-js/compass-connections/provider';
 
 const ERROR_WARNING = 'An error occurred while loading collections';
 
@@ -30,7 +31,7 @@ type CollectionsListProps = {
   collectionsLoadingStatus: string;
   collectionsLoadingError?: string | null;
   isEditable: boolean;
-  onDeleteCollectionClick(ns: string): void;
+  onDeleteCollectionClick(connectionId: string, ns: string): void;
   onCreateCollectionClick(dbName: string): void;
   onRefreshClick(): void;
 };
@@ -45,6 +46,7 @@ const Collections: React.FunctionComponent<CollectionsListProps> = ({
   onCreateCollectionClick: _onCreateCollectionClick,
   onRefreshClick,
 }) => {
+  const { id: connectionId } = useConnectionInfo();
   const { openCollectionWorkspace } = useOpenWorkspace();
 
   useTrackOnChange(
@@ -76,7 +78,13 @@ const Collections: React.FunctionComponent<CollectionsListProps> = ({
     isEditable ? { onDeleteCollectionClick, onCreateCollectionClick } : {}
   );
 
-  return <CollectionsList collections={collections} {...actions} />;
+  return (
+    <CollectionsList
+      connectionId={connectionId}
+      collections={collections}
+      {...actions}
+    />
+  );
 };
 
 const ConnectedCollections = connect(

packages/databases-collections/src/components/databases.tsx

@@ -19,6 +19,7 @@ import {
 } from '../modules/databases';
 import { useTrackOnChange } from '@mongodb-js/compass-logging/provider';
 import { useOpenWorkspace } from '@mongodb-js/compass-workspaces/provider';
+import { useConnectionInfo } from '@mongodb-js/compass-connections/provider';
 
 const errorContainerStyles = css({
   padding: spacing[3],
@@ -64,7 +65,7 @@ type DatabasesProps = {
   isWritable: boolean;
   isGenuineMongoDB: boolean;
   isDataLake: boolean;
-  onDeleteDatabaseClick(ns: string): void;
+  onDeleteDatabaseClick(connectionId: string, ns: string): void;
   onCreateDatabaseClick(): void;
   onRefreshClick(): void;
 };
@@ -80,6 +81,7 @@ const Databases: React.FunctionComponent<DatabasesProps> = ({
   onCreateDatabaseClick,
   onRefreshClick,
 }) => {
+  const { id: connectionId } = useConnectionInfo();
   const isPreferencesReadOnly = usePreference('readOnly');
   const { openCollectionsWorkspace } = useOpenWorkspace();
 
@@ -115,7 +117,13 @@ const Databases: React.FunctionComponent<DatabasesProps> = ({
       : {}
   );
 
-  return <DatabasesList databases={databases} {...actions} />;
+  return (
+    <DatabasesList
+      connectionId={connectionId}
+      databases={databases}
+      {...actions}
+    />
+  );
 };
 
 const mapStateToProps = (state: DatabasesState) => {

packages/databases-collections/src/index.ts

@@ -60,9 +60,7 @@ export const DropNamespacePlugin = registerHadronPlugin(
   },
   {
     logger: createLoggerAndTelemetryLocator('COMPASS-DROP-NAMESPACE-UI'),
-    dataService: dataServiceLocator as DataServiceLocator<
-      'dropDatabase' | 'dropCollection'
-    >,
+    connectionsManager: connectionsManagerLocator,
   }
 );
 

packages/databases-collections/src/modules/collections.ts

@@ -94,10 +94,15 @@ export const createNewCollection = (
 };
 
 export const deleteCollection = (
+  connectionId: string,
   namespace: string
 ): CollectionsThunkAction<void> => {
   return (_dispatch, _getState, { globalAppRegistry }) => {
-    globalAppRegistry.emit('open-drop-collection', toNS(namespace));
+    globalAppRegistry.emit(
+      'open-drop-collection',
+      connectionId,
+      toNS(namespace)
+    );
   };
 };
 

packages/databases-collections/src/modules/databases.ts

@@ -97,9 +97,12 @@ export const createDatabase = (): DatabasesThunkAction<void> => {
   };
 };
 
-export const dropDatabase = (ns: string): DatabasesThunkAction<void> => {
+export const dropDatabase = (
+  connectionId: string,
+  ns: string
+): DatabasesThunkAction<void> => {
   return (_dispatch, _getState, { globalAppRegistry }) => {
-    globalAppRegistry.emit('open-drop-database', ns);
+    globalAppRegistry.emit('open-drop-database', connectionId, ns);
   };
 };
 

packages/databases-collections/src/stores/drop-namespace.spec.tsx

@@ -14,11 +14,14 @@ describe('DropNamespacePlugin', function () {
     dropDatabase: sandbox.stub().resolves(true),
     dropCollection: sandbox.stub().resolves(true),
   };
+  const connectionsManager = {
+    getDataServiceForConnection: sandbox.stub().returns(dataService),
+  } as any;
 
   beforeEach(function () {
     const Plugin = DropNamespacePlugin.withMockServices({
       globalAppRegistry: appRegistry,
-      dataService,
+      connectionsManager,
     });
     render(<Plugin></Plugin>);
   });
@@ -29,7 +32,7 @@ describe('DropNamespacePlugin', function () {
   });
 
   it('should ask for confirmation and delete collection on `open-drop-collection` event', async function () {
-    appRegistry.emit('open-drop-collection', toNS('test.to-drop'));
+    appRegistry.emit('open-drop-collection', 'TEST', toNS('test.to-drop'));
 
     expect(
       screen.getByText(
@@ -58,7 +61,7 @@ describe('DropNamespacePlugin', function () {
   });
 
   it('should ask for confirmation and delete database on `open-drop-database` event', async function () {
-    appRegistry.emit('open-drop-database', 'db-to-drop');
+    appRegistry.emit('open-drop-database', 'TEST', 'db-to-drop');
 
     expect(
       screen.getByText('Are you sure you want to drop database "db-to-drop"?')

packages/databases-collections/src/stores/drop-namespace.tsx

@@ -7,30 +7,38 @@ import {
 } from '@mongodb-js/compass-components';
 import type { LoggerAndTelemetry } from '@mongodb-js/compass-logging/provider';
 import type AppRegistry from 'hadron-app-registry';
-import type { DataService } from '@mongodb-js/compass-connections/provider';
+import type { ConnectionsManager } from '@mongodb-js/compass-connections/provider';
 import toNS from 'mongodb-ns';
 import type { ActivateHelpers } from 'hadron-app-registry';
 
 type NS = ReturnType<typeof toNS>;
 
 type DropNamespaceServices = {
   globalAppRegistry: AppRegistry;
-  dataService: Pick<DataService, 'dropDatabase' | 'dropCollection'>;
+  connectionsManager: ConnectionsManager;
   logger: LoggerAndTelemetry;
 };
 
 export function activatePlugin(
   _: unknown,
-  { globalAppRegistry, dataService, logger: { track } }: DropNamespaceServices,
+  {
+    globalAppRegistry,
+    connectionsManager,
+    logger: { track },
+  }: DropNamespaceServices,
   { on, cleanup, signal }: ActivateHelpers
 ) {
-  const onDropNamespace = async (namespace: string | NS) => {
+  const onDropNamespace = async (
+    connectionId: string,
+    namespace: string | NS
+  ) => {
     // `drop-collection` is emitted with NS, `drop-database` is emitted with a
     // string, we're keeping compat with both for now to avoid conflicts with
     // other refactoring
     if (typeof namespace === 'string') {
       namespace = toNS(namespace);
     }
+
     const {
       ns,
       validCollectionName: isCollection,
@@ -53,6 +61,14 @@ export function activatePlugin(
     if (confirmed) {
       try {
         const method = isCollection ? 'dropCollection' : 'dropDatabase';
+        const dataService =
+          connectionsManager.getDataServiceForConnection(connectionId);
+        if (!dataService) {
+          throw new Error(
+            'unreachable: only available when there is an open connection.'
+          );
+        }
+
         await dataService[method](ns);
         globalAppRegistry.emit(
           isCollection ? 'collection-dropped' : 'database-dropped',