From faff2015c428404efc948c49aab9b5268dddf2ad Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <62335616+lucaseduoli@users.noreply.github.com>
Date: Wed, 13 Aug 2025 17:14:30 -0300
Subject: [PATCH] fix: make tools be selected on mcp server after opening for
 the first time (#9377)

* Add on grid ready handler to select required nodes after opening

* [autofix.ci] apply automated fixes

* Updated mcp server tab test to test if state is maintained after refresh

* [autofix.ci] apply automated fixes

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
Co-authored-by: Carlos Coelho <80289056+carlosrcoelho@users.noreply.github.com>
---
 .../components/toolsTable/index.tsx           | 46 ++++++++++++-------
 .../extended/features/mcp-server-tab.spec.ts  | 27 ++++++++++-
 2 files changed, 55 insertions(+), 18 deletions(-)

diff --git a/src/frontend/src/modals/toolsModal/components/toolsTable/index.tsx b/src/frontend/src/modals/toolsModal/components/toolsTable/index.tsx
index 1302b4a33..23c7295d1 100644
--- a/src/frontend/src/modals/toolsModal/components/toolsTable/index.tsx
+++ b/src/frontend/src/modals/toolsModal/components/toolsTable/index.tsx
@@ -57,25 +57,31 @@ export default function ToolsTable({
     setSelectedRows(filter);
   }, [rows, open]);
 
-  useEffect(() => {
+  const applyInitialSelection = () => {
+    if (!agGrid.current?.api) return;
+
     const initialData = cloneDeep(rows);
     const filter = initialData.filter((row) => row.status === true);
-    if (agGrid.current) {
-      agGrid.current?.api?.forEachNode((node) => {
-        if (
-          filter.some(
-            (row) =>
-              (row.display_name ?? row.name) ===
-              (node.data.display_name ?? node.data.name),
-          )
-        ) {
-          node.setSelected(true);
-        } else {
-          node.setSelected(false);
-        }
-      });
-    }
-  }, [agGrid.current]);
+
+    agGrid.current.api.forEachNode((node) => {
+      if (
+        filter.some(
+          (row) =>
+            (row.display_name ?? row.name) ===
+            (node.data.display_name ?? node.data.name),
+        )
+      ) {
+        node.setSelected(true);
+      } else {
+        node.setSelected(false);
+      }
+    });
+  };
+
+  // Apply initial selection when data changes and grid is ready
+  useEffect(() => {
+    applyInitialSelection();
+  }, [rows, data]);
 
   useEffect(() => {
     if (!open) {
@@ -251,6 +257,11 @@ export default function ToolsTable({
     setSidebarOpen(true);
   };
 
+  const handleGridReady = () => {
+    // Apply initial selection when grid is ready
+    applyInitialSelection();
+  };
+
   const rowName = useMemo(() => {
     return parseString(focusedRow?.display_name || focusedRow?.name || "", [
       "space_case",
@@ -284,6 +295,7 @@ export default function ToolsTable({
             tableOptions={tableOptions}
             onRowClicked={handleRowClicked}
             getRowId={getRowId}
+            onGridReady={handleGridReady}
           />
         </div>
       </main>
diff --git a/src/frontend/tests/extended/features/mcp-server-tab.spec.ts b/src/frontend/tests/extended/features/mcp-server-tab.spec.ts
index 312a24b47..348f45101 100644
--- a/src/frontend/tests/extended/features/mcp-server-tab.spec.ts
+++ b/src/frontend/tests/extended/features/mcp-server-tab.spec.ts
@@ -85,12 +85,37 @@ test(
           await page.waitForTimeout(1000);
         }
 
+        // Verify if the state is maintained
+
+        await page.locator('input[data-ref="eInput"]').first().click();
+
+        await page.waitForTimeout(1000);
+
+        await page.reload();
+
+        // Navigate to MCP server tab
+        await page.getByTestId("mcp-btn").click({ timeout: 10000 });
+
+        // Verify MCP server tab is visible
+        await expect(page.getByTestId("mcp-server-title")).toBeVisible();
+        await expect(page.getByText("Flows/Tools")).toBeVisible();
+
+        // Click on Edit Tools button
+        await page.getByTestId("button_open_actions").click();
+        await page.waitForTimeout(500);
+
+        // Verify actions modal is open
+        await expect(page.getByText("MCP Server Tools")).toBeVisible();
+
         const isCheckedAgainAgain = await page
           .locator('input[data-ref="eInput"]')
           .first()
           .isChecked();
 
-        expect(isCheckedAgainAgain).toBeFalsy();
+        expect(isCheckedAgainAgain).toBeTruthy();
+
+        await page.locator('input[data-ref="eInput"]').first().click();
+        await page.waitForTimeout(1000);
 
         // Select first action
         let element = page.locator('input[data-ref="eInput"]').last();