diff --git a/src/frontend/src/pages/FlowPage/components/flowSidebarComponent/components/sidebarItemsList.tsx b/src/frontend/src/pages/FlowPage/components/flowSidebarComponent/components/sidebarItemsList.tsx
index 7dfde7838838..20481ac17556 100644
--- a/src/frontend/src/pages/FlowPage/components/flowSidebarComponent/components/sidebarItemsList.tsx
+++ b/src/frontend/src/pages/FlowPage/components/flowSidebarComponent/components/sidebarItemsList.tsx
@@ -38,6 +38,9 @@ const SidebarItemsList = ({
         })
         .map((SBItemName) => {
           const currentItem = dataFilter[item.name][SBItemName];
+          if (SBItemName === "MCPTools") {
+            return null;
+          }
 
           if (SBItemName === "ChatInput" || SBItemName === "Webhook") {
             return (
diff --git a/src/frontend/src/pages/FlowPage/components/flowSidebarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/flowSidebarComponent/index.tsx
index 098b9a47abb5..3390bdbb0beb 100644
--- a/src/frontend/src/pages/FlowPage/components/flowSidebarComponent/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/flowSidebarComponent/index.tsx
@@ -67,7 +67,7 @@ export type SearchContextType = {
   // Additional properties for the sidebar to use
   search?: string;
   setSearch?: (value: string) => void;
-  searchInputRef?: React.RefObject<HTMLInputElement>;
+  searchInputRef?: React.RefObject<HTMLInputElement | null>;
   handleInputFocus?: () => void;
   handleInputBlur?: () => void;
   handleInputChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
@@ -668,7 +668,7 @@ export function FlowSidebarComponent({ isLoading }: FlowSidebarComponentProps) {
               <>
                 {hasResults ? (
                   <>
-                    {showComponents && (
+                    {showComponents && !showMcp && (
                       <CategoryGroup
                         dataFilter={dataFilter}
                         sortedCategories={sortedCategories}
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 fe86e48516cd..d1f5384e4438 100644
--- a/src/frontend/tests/extended/features/mcp-server-tab.spec.ts
+++ b/src/frontend/tests/extended/features/mcp-server-tab.spec.ts
@@ -234,23 +234,11 @@ test(
 
     // Create a new flow with MCP component
     await page.getByTestId("blank-flow").click();
-    await page.getByTestId("sidebar-search-input").click();
-    await page.getByTestId("sidebar-search-input").fill("mcp");
-
-    await page.waitForSelector('[data-testid="models_and_agentsMCP Tools"]', {
-      timeout: 30000,
-    });
-
-    await page
-      .getByTestId("models_and_agentsMCP Tools")
-      .dragTo(page.locator('//*[@id="react-flow-id"]'), {
-        targetPosition: { x: 50, y: 50 },
-      });
+    await page.getByTestId("sidebar-nav-mcp").click();
+    await page.getByTestId("add-component-button-lf-starter_project").click();
 
     await adjustScreenView(page, { numberOfZoomOut: 3 });
 
-    await expect(page.getByTestId("dropdown_str_tool")).toBeHidden();
-
     await openAddMcpServerModal(page);
 
     await page.waitForSelector('[data-testid="json-input"]', {
diff --git a/src/frontend/tests/extended/features/mcp-server.spec.ts b/src/frontend/tests/extended/features/mcp-server.spec.ts
index 4473ccd67a4a..ce71681bd68e 100644
--- a/src/frontend/tests/extended/features/mcp-server.spec.ts
+++ b/src/frontend/tests/extended/features/mcp-server.spec.ts
@@ -16,18 +16,8 @@ test(
       timeout: 30000,
     });
     await page.getByTestId("blank-flow").click();
-    await page.getByTestId("sidebar-search-input").click();
-    await page.getByTestId("sidebar-search-input").fill("mcp tools");
-
-    await page.waitForSelector('[data-testid="models_and_agentsMCP Tools"]', {
-      timeout: 30000,
-    });
-
-    await page
-      .getByTestId("models_and_agentsMCP Tools")
-      .dragTo(page.locator('//*[@id="react-flow-id"]'), {
-        targetPosition: { x: 100, y: 100 },
-      });
+    await page.getByTestId("sidebar-nav-mcp").click();
+    await page.getByTestId("add-component-button-lf-starter_project").click();
 
     // See if the color matches
 
@@ -48,8 +38,6 @@ test(
 
     await adjustScreenView(page, { numberOfZoomOut: 3 });
 
-    await expect(page.getByTestId("dropdown_str_tool")).toBeHidden();
-
     await openAddMcpServerModal(page);
 
     await page.getByTestId("stdio-tab").click();
@@ -337,18 +325,9 @@ test(
       timeout: 30000,
     });
     await page.getByTestId("blank-flow").click();
-    await page.getByTestId("sidebar-search-input").click();
-    await page.getByTestId("sidebar-search-input").fill("mcp tools");
-
-    await page.waitForSelector('[data-testid="models_and_agentsMCP Tools"]', {
-      timeout: 30000,
-    });
+    await page.getByTestId("sidebar-nav-mcp").click();
+    await page.getByTestId("add-component-button-lf-starter_project").click();
 
-    await page
-      .getByTestId("models_and_agentsMCP Tools")
-      .dragTo(page.locator('//*[@id="react-flow-id"]'), {
-        targetPosition: { x: 100, y: 100 },
-      });
     await adjustScreenView(page, { numberOfZoomOut: 3 });
 
     await openAddMcpServerModal(page);
@@ -490,18 +469,9 @@ test(
       timeout: 30000,
     });
     await page.getByTestId("blank-flow").click();
-    await page.getByTestId("sidebar-search-input").click();
-    await page.getByTestId("sidebar-search-input").fill("mcp tools");
-
-    await page.waitForSelector('[data-testid="models_and_agentsMCP Tools"]', {
-      timeout: 30000,
-    });
+    await page.getByTestId("sidebar-nav-mcp").click();
+    await page.getByTestId("add-component-button-lf-starter_project").click();
 
-    await page
-      .getByTestId("models_and_agentsMCP Tools")
-      .dragTo(page.locator('//*[@id="react-flow-id"]'), {
-        targetPosition: { x: 100, y: 100 },
-      });
     await adjustScreenView(page, { numberOfZoomOut: 3 });
 
     await openAddMcpServerModal(page);
@@ -663,18 +633,8 @@ test(
       timeout: 30000,
     });
     await page.getByTestId("blank-flow").click();
-    await page.getByTestId("sidebar-search-input").click();
-    await page.getByTestId("sidebar-search-input").fill("mcp tools");
-
-    await page.waitForSelector('[data-testid="models_and_agentsMCP Tools"]', {
-      timeout: 30000,
-    });
-
-    await page
-      .getByTestId("models_and_agentsMCP Tools")
-      .dragTo(page.locator('//*[@id="react-flow-id"]'), {
-        targetPosition: { x: 100, y: 100 },
-      });
+    await page.getByTestId("sidebar-nav-mcp").click();
+    await page.getByTestId("add-component-button-lf-starter_project").click();
 
     await page.getByTestId("canvas_controls_dropdown").click();
 
@@ -683,8 +643,6 @@ test(
     await zoomOut(page, 3);
     await page.getByTestId("canvas_controls_dropdown").click({ force: true });
 
-    await expect(page.getByTestId("dropdown_str_tool")).toBeHidden();
-
     await openAddMcpServerModal(page);
 
     await page.getByTestId("stdio-tab").click();
@@ -948,18 +906,8 @@ test(
       timeout: 30000,
     });
     await page.getByTestId("blank-flow").click();
-    await page.getByTestId("sidebar-search-input").click();
-    await page.getByTestId("sidebar-search-input").fill("mcp tools");
-
-    await page.waitForSelector('[data-testid="models_and_agentsMCP Tools"]', {
-      timeout: 30000,
-    });
-
-    await page
-      .getByTestId("models_and_agentsMCP Tools")
-      .dragTo(page.locator('//*[@id="react-flow-id"]'), {
-        targetPosition: { x: 100, y: 100 },
-      });
+    await page.getByTestId("sidebar-nav-mcp").click();
+    await page.getByTestId("add-component-button-lf-starter_project").click();
 
     await adjustScreenView(page, { numberOfZoomOut: 3 });
 
diff --git a/src/frontend/tests/utils/open-add-mcp-server-modal.ts b/src/frontend/tests/utils/open-add-mcp-server-modal.ts
index 136b75e2bd61..95df2b3b6ef0 100644
--- a/src/frontend/tests/utils/open-add-mcp-server-modal.ts
+++ b/src/frontend/tests/utils/open-add-mcp-server-modal.ts
@@ -8,7 +8,7 @@ export async function openAddMcpServerModal(page: Page) {
   } else {
     // Otherwise use the dropdown
     await page.getByTestId("mcp-server-dropdown").click({ timeout: 3000 });
-    await page.getByText("Add MCP Server", { exact: true }).click({
+    await page.getByText("Add MCP Server", { exact: true }).last().click({
       timeout: 5000,
     });
   }