chore: merge mcp components (#7167)

* take1

* depreacate stdio and sse mcp components

* optionals

* rodrigo fixes

* session management

* update init

* mcp component integration test

* broken

* [autofix.ci] apply automated fixes

* fix url input name

* upated MCP

* Update mcp_component.py

* [autofix.ci] apply automated fixes

* update to the MCP component

* [autofix.ci] apply automated fixes

* mostly working

* [autofix.ci] apply automated fixes

* Update mcp_component.py

* [autofix.ci] apply automated fixes

* update component

* [autofix.ci] apply automated fixes

* Update mcp_component.py

* rename component because Simon

* icon and description for simon

* fix integration test

* fix test

* Update mcp_component.py

* update and basic QoL

* [autofix.ci] apply automated fixes

* refactor clients to util and use flow names not IDs in mcp.py

* integration test

* take out traces

* ✨ (edit-tools.spec.ts): add test for user to be able to edit tools in the frontend application.

* session fix

* fix content output

* ♻️ (util.py): remove redundant constant HTTP_TEMPORARY_REDIRECT and replace its usage with httpx.codes.TEMPORARY_REDIRECT for better code readability and maintainability

* [autofix.ci] apply automated fixes

* 🐛 (utils.ts): fix potential null pointer error when converting words to title case by adding null check before accessing properties

* 🐛 (genericIconComponent/index.tsx): Fix issue with optional chaining in mapping function
🐛 (renderIconComponent/index.tsx): Fix issue with optional chaining in mapping function
🐛 (button.tsx): Fix issue with optional chaining in mapping function
🐛 (utils.ts): Fix issue with optional chaining in mapping functions

* 🐛 (language-select.tsx): Fix potential null pointer error when mapping over allLanguages array

* ✨ (constants.ts): add support for multiple languages in the application by defining an array of language options
♻️ (audio-settings-dialog.tsx, language-select.tsx): refactor to import the array of all languages from constants.ts instead of duplicating it in each file

* ✅ (auto-login-off.spec.ts): add a 2-second delay before continuing the test to ensure proper loading and rendering of elements on the page

* ⬆️ (filterEdge-shard-0.spec.ts): reduce wait time for page interactions to improve test performance
⬆️ (playground.spec.ts): optimize wait times for page interactions to enhance test efficiency

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
Co-authored-by: Edwin Jose <edwin.jose@datastax.com>
Co-authored-by: cristhianzl <cristhian.lousa@gmail.com>

src/frontend/tests/core/features/auto-login-off.spec.ts

@@ -215,6 +215,8 @@ test(
       ).isVisible(),
     );
 
+    await page.waitForTimeout(2000);
+
     await awaitBootstrapTest(page, { skipGoto: true });
 
     await page.getByTestId("side_nav_options_all-templates").click();

src/frontend/tests/core/features/filterEdge-shard-0.spec.ts

@@ -73,9 +73,11 @@ test(
       }
     }
 
-    await page.waitForTimeout(1000);
+    await page.waitForTimeout(500);
 
     await visibleElementHandle.hover().then(async () => {
+      await page.waitForTimeout(1000);
+
       await expect(
         page.getByText("Drag to connect compatible outputs").first(),
       ).toBeVisible();
@@ -105,7 +107,11 @@ test(
       }
     }
 
+    await page.waitForTimeout(500);
+
     await visibleElementHandle.hover().then(async () => {
+      await page.waitForTimeout(1000);
+
       await expect(
         page.getByText("Drag to connect compatible outputs").first(),
       ).toBeVisible();

src/frontend/tests/core/features/playground.spec.ts

@@ -164,13 +164,21 @@ test(
     await page.getByTestId("chat-message-User-session_after_delete").click();
     await expect(page.getByTestId("session-selector")).toBeVisible();
 
+    await page.waitForTimeout(500);
+
     // check helpful button
     await page.getByTestId("chat-message-AI-session_after_delete").hover();
     await page.getByTestId("helpful-button").click();
+
+    await page.waitForTimeout(500);
+
     await page.getByTestId("chat-message-AI-session_after_delete").hover();
     await expect(page.getByTestId("icon-ThumbUpIconCustom")).toBeVisible({
       timeout: 10000,
     });
+
+    await page.waitForTimeout(500);
+
     await page.getByTestId("helpful-button").click();
     await page.getByTestId("chat-message-AI-session_after_delete").hover();
     await expect(page.getByTestId("icon-ThumbUpIconCustom")).toBeVisible({
@@ -178,26 +186,38 @@ test(
       visible: false,
     });
     // check not helpful button
+    await page.waitForTimeout(500);
+
     await page.getByTestId("chat-message-AI-session_after_delete").hover();
     await page.getByTestId("not-helpful-button").click();
+    await page.waitForTimeout(500);
+
     await page.getByTestId("chat-message-AI-session_after_delete").hover();
     await expect(page.getByTestId("icon-ThumbDownIconCustom")).toBeVisible({
       timeout: 10000,
     });
     await page.getByTestId("not-helpful-button").click();
+    await page.waitForTimeout(500);
+
     await page.getByTestId("chat-message-AI-session_after_delete").hover();
     await expect(page.getByTestId("icon-ThumbDownIconCustom")).toBeVisible({
       timeout: 10000,
       visible: false,
     });
     // check switch feedback
+    await page.waitForTimeout(500);
+
     await page.getByTestId("chat-message-AI-session_after_delete").hover();
     await page.getByTestId("helpful-button").click();
+    await page.waitForTimeout(500);
+
     await page.getByTestId("chat-message-AI-session_after_delete").hover();
     await expect(page.getByTestId("icon-ThumbUpIconCustom")).toBeVisible({
       timeout: 10000,
     });
     await page.getByTestId("not-helpful-button").click();
+    await page.waitForTimeout(500);
+
     await page.getByTestId("chat-message-AI-session_after_delete").hover();
     await expect(page.getByTestId("icon-ThumbDownIconCustom")).toBeVisible({
       timeout: 10000,

src/frontend/tests/extended/features/edit-tools.spec.ts

@@ -0,0 +1,76 @@
+import { expect, test } from "@playwright/test";
+import { awaitBootstrapTest } from "../../utils/await-bootstrap-test";
+test(
+  "user should be able to edit tools",
+  { tag: ["@release"] },
+  async ({ page }) => {
+    await awaitBootstrapTest(page);
+
+    await page.getByTestId("blank-flow").click();
+
+    await page.getByTestId("sidebar-search-input").click();
+    await page.getByTestId("sidebar-search-input").fill("api request");
+
+    await page.waitForSelector('[data-testid="dataAPI Request"]', {
+      timeout: 3000,
+    });
+
+    await page
+      .getByTestId("dataAPI Request")
+      .hover()
+      .then(async () => {
+        await page.getByTestId("add-component-button-api-request").click();
+      });
+
+    await page.waitForSelector(
+      '[data-testid="generic-node-title-arrangement"]',
+      {
+        timeout: 3000,
+      },
+    );
+
+    await page.getByTestId("generic-node-title-arrangement").click();
+
+    await page.waitForTimeout(500);
+
+    await page.getByTestId("tool-mode-button").click();
+
+    await page.locator('[data-testid="icon-Hammer"]').nth(1).waitFor({
+      timeout: 3000,
+      state: "visible",
+    });
+
+    await page.getByTestId("icon-Hammer").nth(1).click();
+
+    await page.waitForSelector("text=edit tools", { timeout: 30000 });
+
+    const rowsCount = await page.getByRole("gridcell").count();
+
+    expect(rowsCount).toBeGreaterThan(3);
+
+    expect(await page.getByRole("switch").nth(0).isChecked()).toBe(true);
+
+    await page.getByRole("switch").nth(0).click();
+
+    expect(await page.getByRole("switch").nth(0).isChecked()).toBe(false);
+
+    await page.getByText("Save").last().click();
+
+    await page.waitForSelector(
+      '[data-testid="generic-node-title-arrangement"]',
+      {
+        timeout: 3000,
+      },
+    );
+
+    await page.waitForTimeout(500);
+
+    await page.getByTestId("icon-Hammer").nth(1).click();
+
+    await page.waitForSelector("text=edit tools", { timeout: 30000 });
+
+    await page.waitForTimeout(500);
+
+    expect(await page.getByRole("switch").nth(0).isChecked()).toBe(false);
+  },
+);