fix(connections-navigation): don't show connect button while connecting

COMPASS-8599 (#6550) Add check on connectionStatus in notConnectedConnectionItemActions
mongodb-js · Dec 5, 2024 · 1e21358 · 1e21358
1 parent fe03773
commit 1e21358
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 9 deletions.
diff --git a/packages/compass-connections-navigation/src/connections-navigation-tree.tsx b/packages/compass-connections-navigation/src/connections-navigation-tree.tsx
@@ -183,6 +183,7 @@ const ConnectionsNavigationTree: React.FunctionComponent<
             return {
               actions: notConnectedConnectionItemActions({
                 connectionInfo: item.connectionInfo,
+                connectionStatus: item.connectionStatus,
               }),
               config: {
                 collapseAfter: 1,

diff --git a/packages/compass-connections-navigation/src/item-actions.ts b/packages/compass-connections-navigation/src/item-actions.ts
@@ -2,6 +2,7 @@ import type { ItemAction } from '@mongodb-js/compass-components';
 import { type ConnectionInfo } from '@mongodb-js/connection-info';
 import { type Actions } from './constants';
 import { type ItemSeparator } from '@mongodb-js/compass-components';
+import { type NotConnectedConnectionStatus } from './tree-data';
 
 export type NavigationItemActions = (ItemAction<Actions> | ItemSeparator)[];
 
@@ -137,19 +138,25 @@ export const connectedConnectionItemActions = ({
 
 export const notConnectedConnectionItemActions = ({
   connectionInfo,
+  connectionStatus,
 }: {
   connectionInfo: ConnectionInfo;
+  connectionStatus: NotConnectedConnectionStatus;
 }): NavigationItemActions => {
   const commonActions = commonConnectionItemActions({ connectionInfo });
-  return [
-    {
-      action: 'connection-connect',
-      label: 'Connect',
-      icon: 'Connect',
-      expandedPresentation: 'button',
-    },
-    ...commonActions,
-  ];
+  if (connectionStatus === 'connecting') {
+    return commonActions;
+  } else {
+    return [
+      {
+        action: 'connection-connect',
+        label: 'Connect',
+        icon: 'Connect',
+        expandedPresentation: 'button',
+      },
+      ...commonActions,
+    ];
+  }
 };
 
 export const databaseItemActions = ({