Add connection to current project database users

Author: leo-generali

packages/compass-collection/src/components/mock-data-generator-modal/mock-data-generator-modal.spec.tsx

@@ -2,7 +2,7 @@ import { expect } from 'chai';
 import React from 'react';
 import {
   screen,
-  render,
+  renderWithActiveConnection,
   waitFor,
   userEvent,
 } from '@mongodb-js/testing-library-compass';
@@ -14,12 +14,19 @@ import { MockDataGeneratorStep } from './types';
 import { StepButtonLabelMap } from './constants';
 import type { CollectionState } from '../../modules/collection-tab';
 import { default as collectionTabReducer } from '../../modules/collection-tab';
+import type { ConnectionInfo } from '@mongodb-js/connection-info';
 
 describe('MockDataGeneratorModal', () => {
-  function renderModal({
+  async function renderModal({
     isOpen = true,
     currentStep = MockDataGeneratorStep.SCHEMA_CONFIRMATION,
     mockServices = createMockServices(),
+    connectionInfo,
+  }: {
+    isOpen?: boolean;
+    currentStep?: MockDataGeneratorStep;
+    mockServices?: any;
+    connectionInfo?: ConnectionInfo;
   } = {}) {
     const initialState: CollectionState = {
       workspaceTabId: 'test-workspace-tab-id',
@@ -52,10 +59,11 @@ describe('MockDataGeneratorModal', () => {
       applyMiddleware(thunk.withExtraArgument(mockServices))
     );
 
-    return render(
+    return await renderWithActiveConnection(
       <Provider store={store}>
         <MockDataGeneratorModal />
-      </Provider>
+      </Provider>,
+      connectionInfo
     );
   }
 
@@ -89,20 +97,20 @@ describe('MockDataGeneratorModal', () => {
   }
 
   describe('generally', () => {
-    it('renders the modal when isOpen is true', () => {
-      renderModal();
+    it('renders the modal when isOpen is true', async () => {
+      await renderModal();
 
       expect(screen.getByTestId('generate-mock-data-modal')).to.exist;
     });
 
-    it('does not render the modal when isOpen is false', () => {
-      renderModal({ isOpen: false });
+    it('does not render the modal when isOpen is false', async () => {
+      await renderModal({ isOpen: false });
 
       expect(screen.queryByTestId('generate-mock-data-modal')).to.not.exist;
     });
 
     it('closes the modal when the close button is clicked', async () => {
-      renderModal();
+      await renderModal();
 
       expect(screen.getByTestId('generate-mock-data-modal')).to.exist;
       userEvent.click(screen.getByLabelText('Close modal'));
@@ -113,7 +121,7 @@ describe('MockDataGeneratorModal', () => {
     });
 
     it('closes the modal when the cancel button is clicked', async () => {
-      renderModal();
+      await renderModal();
 
       expect(screen.getByTestId('generate-mock-data-modal')).to.exist;
       userEvent.click(screen.getByText('Cancel'));
@@ -154,7 +162,7 @@ describe('MockDataGeneratorModal', () => {
 
     it('cancels in-flight faker mapping requests when the cancel button is clicked', async () => {
       const mockServices = createMockServicesWithSlowAiRequest();
-      renderModal({ mockServices: mockServices as any });
+      await renderModal({ mockServices: mockServices as any });
 
       expect(screen.getByTestId('raw-schema-confirmation')).to.exist;
       userEvent.click(screen.getByText('Confirm'));
@@ -170,7 +178,7 @@ describe('MockDataGeneratorModal', () => {
 
     it('cancels in-flight faker mapping requests when the back button is clicked after schema confirmation', async () => {
       const mockServices = createMockServicesWithSlowAiRequest();
-      renderModal({ mockServices: mockServices as any });
+      await renderModal({ mockServices: mockServices as any });
 
       expect(screen.getByTestId('raw-schema-confirmation')).to.exist;
       userEvent.click(screen.getByText('Confirm'));
@@ -186,8 +194,8 @@ describe('MockDataGeneratorModal', () => {
   });
 
   describe('on the schema confirmation step', () => {
-    it('disables the Back button', () => {
-      renderModal();
+    it('disables the Back button', async () => {
+      await renderModal();
 
       expect(
         screen
@@ -197,7 +205,7 @@ describe('MockDataGeneratorModal', () => {
     });
 
     it('renders the faker schema editor when the confirm button is clicked', async () => {
-      renderModal();
+      await renderModal();
 
       expect(screen.getByTestId('raw-schema-confirmation')).to.exist;
       expect(screen.queryByTestId('faker-schema-editor')).to.not.exist;
@@ -212,7 +220,7 @@ describe('MockDataGeneratorModal', () => {
       const mockServices = createMockServices();
       mockServices.atlasAiService.getMockDataSchema = () =>
         Promise.reject('faker schema generation failed');
-      renderModal({ mockServices });
+      await renderModal({ mockServices });
 
       expect(screen.getByTestId('raw-schema-confirmation')).to.exist;
       expect(screen.queryByTestId('faker-schema-editor')).to.not.exist;
@@ -229,8 +237,8 @@ describe('MockDataGeneratorModal', () => {
   });
 
   describe('on the generate data step', () => {
-    it('enables the Back button', () => {
-      renderModal({ currentStep: MockDataGeneratorStep.GENERATE_DATA });
+    it('enables the Back button', async () => {
+      await renderModal({ currentStep: MockDataGeneratorStep.GENERATE_DATA });
 
       expect(
         screen
@@ -239,8 +247,8 @@ describe('MockDataGeneratorModal', () => {
       ).to.not.equal('true');
     });
 
-    it('renders the main sections: Prerequisites, steps, and Resources', () => {
-      renderModal({ currentStep: MockDataGeneratorStep.GENERATE_DATA });
+    it('renders the main sections: Prerequisites, steps, and Resources', async () => {
+      await renderModal({ currentStep: MockDataGeneratorStep.GENERATE_DATA });
 
       expect(screen.getByText('Prerequisites')).to.exist;
       expect(screen.getByText('1. Create a .js file with the following script'))
@@ -250,7 +258,7 @@ describe('MockDataGeneratorModal', () => {
     });
 
     it('closes the modal when the Done button is clicked', async () => {
-      renderModal({ currentStep: MockDataGeneratorStep.GENERATE_DATA });
+      await renderModal({ currentStep: MockDataGeneratorStep.GENERATE_DATA });
 
       expect(screen.getByTestId('generate-mock-data-modal')).to.exist;
       userEvent.click(screen.getByText('Done'));
@@ -260,6 +268,57 @@ describe('MockDataGeneratorModal', () => {
       );
     });
 
+    it('renders the Database Users link with correct URL when projectId is available', async () => {
+      const atlasConnectionInfo: ConnectionInfo = {
+        id: 'test-atlas-connection',
+        connectionOptions: { connectionString: 'mongodb://localhost:27017' },
+        atlasMetadata: {
+          orgId: 'test-org',
+          projectId: 'test-project-123',
+          clusterName: 'test-cluster',
+          clusterUniqueId: 'test-cluster-unique-id',
+          clusterType: 'REPLICASET' as const,
+          clusterState: 'IDLE' as const,
+          metricsId: 'test-metrics-id',
+          metricsType: 'replicaSet' as const,
+          regionalBaseUrl: null,
+          instanceSize: 'M10',
+          supports: {
+            globalWrites: false,
+            rollingIndexes: true,
+          },
+        },
+      };
+
+      await renderModal({
+        currentStep: MockDataGeneratorStep.GENERATE_DATA,
+        connectionInfo: atlasConnectionInfo,
+      });
+
+      const databaseUsersLink = screen.getByRole('link', {
+        name: 'Access your Database Users',
+      });
+      expect(databaseUsersLink.getAttribute('href')).to.equal(
+        '/v2/test-project-123#/security/database/users'
+      );
+    });
+
+    it('does not render the Database Users link when projectId is not available', async () => {
+      const nonAtlasConnectionInfo: ConnectionInfo = {
+        id: 'test-local-connection',
+        connectionOptions: { connectionString: 'mongodb://localhost:27017' },
+        // No atlasMetadata means no projectId
+      };
+
+      await renderModal({
+        currentStep: MockDataGeneratorStep.GENERATE_DATA,
+        connectionInfo: nonAtlasConnectionInfo,
+      });
+
+      expect(screen.queryByRole('link', { name: 'Access your Database Users' }))
+        .to.not.exist;
+    });
+
     // todo: assert that the generated script is displayed in the code block
   });
 
@@ -270,8 +329,8 @@ describe('MockDataGeneratorModal', () => {
 
     // note: these tests can be removed after every modal step is implemented
     steps.forEach((currentStep) => {
-      it(`renders the button with the correct label when the user is in step "${currentStep}"`, () => {
-        renderModal({ currentStep });
+      it(`renders the button with the correct label when the user is in step "${currentStep}"`, async () => {
+        await renderModal({ currentStep });
         expect(screen.getByTestId('next-step-button')).to.have.text(
           StepButtonLabelMap[currentStep]
         );

packages/compass-collection/src/components/mock-data-generator-modal/script-screen.tsx

@@ -13,6 +13,7 @@ import {
   spacing,
   useDarkMode,
 } from '@mongodb-js/compass-components';
+import { useConnectionInfo } from '@mongodb-js/compass-connections/provider';
 
 const RUN_SCRIPT_COMMAND = `
 mongosh "mongodb+srv://<your-cluster>.mongodb.net/mockDataDB" \\
@@ -60,6 +61,7 @@ const resourceSectionHeader = css({
 
 const ScriptScreen = () => {
   const isDarkMode = useDarkMode();
+  const connectionInfo = useConnectionInfo();
 
   return (
     <section className={outerSectionStyles}>
@@ -134,10 +136,16 @@ const ScriptScreen = () => {
               Learn About the MongoDB Shell
             </Link>
           </li>
-          <li>
-            {/* TODO: Update URL */}
-            <Link href="#">Access your Database Users</Link>
-          </li>
+          {connectionInfo.atlasMetadata &&
+            connectionInfo.atlasMetadata.projectId && (
+              <li>
+                <Link
+                  href={`/v2/${connectionInfo.atlasMetadata.projectId}#/security/database/users`}
+                >
+                  Access your Database Users
+                </Link>
+              </li>
+            )}
         </ul>
       </section>
     </section>