feat(sidebar): move db refresh inline COMPASS-9497 (#7065)

Author: Anemy

packages/compass-connections-navigation/src/connections-navigation-tree.tsx

@@ -114,7 +114,7 @@ const ConnectionsNavigationTree: React.FunctionComponent<
 
   const getCollapseAfterForConnectedItem = useCallback(
     (actions: NavigationItemActions) => {
-      const [firstAction, secondAction] = actions;
+      const [, secondAction, thirdAction] = actions;
 
       const actionCanBeShownInline = (
         action: NavigationItemActions[number]
@@ -123,31 +123,32 @@ const ConnectionsNavigationTree: React.FunctionComponent<
           return false;
         }
 
-        return ['create-database', 'open-shell'].includes(
+        return ['refresh-databases', 'create-database', 'open-shell'].includes(
           (action as ItemAction<Actions>).action
         );
       };
 
       // this is the normal case for a connection that is writable and when we
       // also have shell enabled
       if (
-        actionCanBeShownInline(firstAction) &&
-        actionCanBeShownInline(secondAction)
+        actionCanBeShownInline(secondAction) &&
+        actionCanBeShownInline(thirdAction)
       ) {
-        return 2;
+        return 3;
       }
 
       // this will happen when the either the connection is not writable or the
       // preference is readonly, or shell is not enabled in which case we either
       // do not show create-database action or open-shell action
       if (
-        actionCanBeShownInline(firstAction) ||
-        actionCanBeShownInline(secondAction)
+        actionCanBeShownInline(secondAction) ||
+        actionCanBeShownInline(thirdAction)
       ) {
-        return 1;
+        return 2;
       }
 
-      return 0;
+      // Always display the refresh action (firstAction).
+      return 1;
     },
     []
   );

packages/compass-connections-navigation/src/item-actions.ts

@@ -93,6 +93,11 @@ export const connectedConnectionItemActions = ({
     connectionInfo,
   });
   return stripNullActions([
+    {
+      action: 'refresh-databases',
+      label: 'Refresh databases',
+      icon: 'Refresh',
+    },
     hasWriteActionsDisabled
       ? null
       : {
@@ -123,11 +128,6 @@ export const connectedConnectionItemActions = ({
           icon: 'InfoWithCircle',
           label: 'Show connection info',
         },
-    {
-      action: 'refresh-databases',
-      label: 'Refresh databases',
-      icon: 'Refresh',
-    },
     {
       action: 'connection-disconnect',
       icon: 'Disconnect',

packages/compass-e2e-tests/tests/in-use-encryption.test.ts

@@ -25,7 +25,8 @@ async function refresh(browser: CompassBrowser, connectionName: string) {
 
   await browser.selectConnectionMenuItem(
     connectionName,
-    Selectors.RefreshDatabasesItem
+    Selectors.RefreshDatabasesItem,
+    false
   );
 }
 

packages/compass-e2e-tests/tests/instance-sidebar.test.ts

@@ -240,7 +240,8 @@ describe('Instance sidebar', function () {
 
     await browser.selectConnectionMenuItem(
       DEFAULT_CONNECTION_NAME_1,
-      Selectors.RefreshDatabasesItem
+      Selectors.RefreshDatabasesItem,
+      false
     );
 
     // wait for the new collection we added via the driver to appear.

packages/compass-e2e-tests/tests/my-queries-tab.test.ts

@@ -258,7 +258,8 @@ describe('My Queries tab', function () {
 
         await browser.selectConnectionMenuItem(
           DEFAULT_CONNECTION_NAME_1,
-          Selectors.RefreshDatabasesItem
+          Selectors.RefreshDatabasesItem,
+          false
         );
 
         // go to My Queries
@@ -389,7 +390,8 @@ describe('My Queries tab', function () {
 
         await browser.selectConnectionMenuItem(
           DEFAULT_CONNECTION_NAME_1,
-          Selectors.RefreshDatabasesItem
+          Selectors.RefreshDatabasesItem,
+          false
         );
 
         await browser.navigateToMyQueries();
@@ -449,7 +451,8 @@ describe('My Queries tab', function () {
 
         await browser.selectConnectionMenuItem(
           DEFAULT_CONNECTION_NAME_1,
-          Selectors.RefreshDatabasesItem
+          Selectors.RefreshDatabasesItem,
+          false
         );
 
         await browser.navigateToMyQueries();
@@ -495,11 +498,13 @@ describe('My Queries tab', function () {
 
         await browser.selectConnectionMenuItem(
           DEFAULT_CONNECTION_NAME_1,
-          Selectors.RefreshDatabasesItem
+          Selectors.RefreshDatabasesItem,
+          false
         );
         await browser.selectConnectionMenuItem(
           DEFAULT_CONNECTION_NAME_2,
-          Selectors.RefreshDatabasesItem
+          Selectors.RefreshDatabasesItem,
+          false
         );
 
         await browser.navigateToMyQueries();
@@ -557,11 +562,13 @@ describe('My Queries tab', function () {
 
         await browser.selectConnectionMenuItem(
           DEFAULT_CONNECTION_NAME_1,
-          Selectors.RefreshDatabasesItem
+          Selectors.RefreshDatabasesItem,
+          false
         );
         await browser.selectConnectionMenuItem(
           DEFAULT_CONNECTION_NAME_2,
-          Selectors.RefreshDatabasesItem
+          Selectors.RefreshDatabasesItem,
+          false
         );
 
         await browser.navigateToMyQueries();