fix(databases-collections): fixes the visible "Create collection" but…

…ton despite Compass being in readonly mode (#5842)
mongodb-js · May 27, 2024 · 38043f6 · 38043f6
1 parent 82808f5
commit 38043f6
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 4 deletions.
diff --git a/packages/compass-e2e-tests/tests/read-only.test.ts b/packages/compass-e2e-tests/tests/read-only.test.ts
@@ -182,7 +182,7 @@ describe('readOnly: true / Read-Only Edition', function () {
       await settingsModal.waitForDisplayed({ reverse: true });
 
       databaseCreateCollectionButton = await browser.$(
-        Selectors.SidebarCreateDatabaseButton
+        Selectors.DatabaseCreateCollectionButton
       );
       isDatabaseCreateCollectionButtonExisting =
         await databaseCreateCollectionButton.isExisting();
@@ -218,7 +218,7 @@ describe('readOnly: true / Read-Only Edition', function () {
       // wait for the modal to go away
       await settingsModal.waitForDisplayed({ reverse: true });
 
-      addDataButton = await browser.$(Selectors.SidebarCreateDatabaseButton);
+      addDataButton = await browser.$(Selectors.AddDataButton);
       isAddDataButtonExisting = await addDataButton.isExisting();
       expect(isAddDataButtonExisting).to.be.equal(false);
     } finally {

diff --git a/packages/databases-collections/src/components/collections.tsx b/packages/databases-collections/src/components/collections.tsx
@@ -1,4 +1,4 @@
-import React, { useCallback } from 'react';
+import React, { useCallback, useMemo } from 'react';
 import { connect } from 'react-redux';
 import { CollectionsList } from '@mongodb-js/databases-collections-list';
 import {
@@ -19,6 +19,7 @@ import toNS from 'mongodb-ns';
 import { useOpenWorkspace } from '@mongodb-js/compass-workspaces/provider';
 import { useConnectionInfo } from '@mongodb-js/compass-connections/provider';
 import { getConnectionTitle } from '@mongodb-js/connection-info';
+import { usePreference } from 'compass-preferences-model/provider';
 
 const ERROR_WARNING = 'An error occurred while loading collections';
 
@@ -42,11 +43,15 @@ const Collections: React.FunctionComponent<CollectionsListProps> = ({
   collections,
   collectionsLoadingStatus,
   collectionsLoadingError,
-  isEditable,
+  isEditable: isInstanceWritable,
   onDeleteCollectionClick: _onDeleteCollectionClick,
   onCreateCollectionClick: _onCreateCollectionClick,
   onRefreshClick,
 }) => {
+  const isCompassInWritableMode = !usePreference('readOnly');
+  const isEditable = useMemo(() => {
+    return isCompassInWritableMode && isInstanceWritable;
+  }, [isCompassInWritableMode, isInstanceWritable]);
   const connectionInfo = useConnectionInfo();
   const { id: connectionId } = connectionInfo;
   const { openDatabasesWorkspace, openCollectionWorkspace } =