fix(frontend): duplicate tooltip + raw i18n key on collapsed sidebar nav (1.11.0) (#13652)

fix(frontend): remove duplicate tooltip and raw i18n key on collapsed sidebar nav

The floating canvas control nav (shown when the sidebar is collapsed)
rendered two tooltips per icon: a native `title` attribute on
ControlButton plus the styled ShadTooltip. On top of that,
MemoizedComponents passed the raw i18n key (`item.tooltip`) as the
tooltip text instead of running it through `t()`, so the ShadTooltip
exposed strings like `sidebar.nav.bundles` while the native title showed
the bare id (`bundles`).

- CanvasControlButton: drop the native `title` (the duplicate tooltip);
  keep accessibility via `aria-label`. The ShadTooltip is the single
  visual tooltip. This also removes the redundant native tooltip from the
  zoom/fit/lock control buttons.
- MemoizedComponents: translate the nav tooltip with `t(item.tooltip)`.

Adds an isolated CanvasControlButton regression test asserting no native
`title` and that the label is surfaced via aria-label + ShadTooltip.

Author: keval718

src/frontend/src/components/core/canvasControlsComponent/CanvasControlButton.tsx

@@ -28,7 +28,7 @@ export const CanvasControlButton = ({
       className="group !h-8 !w-8 rounded !p-0"
       onClick={onClick}
       disabled={disabled}
-      title={testId?.replace(/_/g, " ")}
+      aria-label={tooltipText}
     >
       <ShadTooltip content={tooltipText} side="right">
         <div

src/frontend/src/components/core/canvasControlsComponent/__tests__/CanvasControlButton.test.tsx

@@ -0,0 +1,58 @@
+import { render, screen } from "@testing-library/react";
+import CanvasControlButton from "../CanvasControlButton";
+
+// ControlButton renders the real DOM <button> and spreads its props, so we can
+// assert exactly which attributes (title / aria-label) reach the element.
+jest.mock("@xyflow/react", () => ({
+  ControlButton: ({ children, ...props }: any) => (
+    <button type="button" {...props}>
+      {children}
+    </button>
+  ),
+}));
+
+// ShadTooltip is the single, styled tooltip — expose its content so we can
+// confirm the button's label is surfaced through it (and only it).
+jest.mock("@/components/common/shadTooltipComponent", () => ({
+  __esModule: true,
+  default: ({ content, children }: any) => (
+    <div data-testid="shad-tooltip" data-content={content}>
+      {children}
+    </div>
+  ),
+}));
+
+jest.mock("@/components/common/genericIconComponent", () => ({
+  __esModule: true,
+  default: ({ name }: any) => <div data-testid={`icon-${name}`} />,
+}));
+
+// Regression coverage for the duplicate sidebar tooltip bug: the control nav
+// buttons rendered BOTH a native `title` attribute and a ShadTooltip, so
+// hovering surfaced two tooltips at once (one of them exposing a raw i18n key).
+describe("CanvasControlButton — single tooltip (no native title)", () => {
+  const setup = () =>
+    render(
+      <CanvasControlButton
+        iconName="blocks"
+        tooltipText="Bundles"
+        onClick={jest.fn()}
+        testId="bundles"
+      />,
+    );
+
+  it("does not render a native title attribute (would be a second tooltip)", () => {
+    setup();
+    const button = screen.getByRole("button");
+    expect(button).not.toHaveAttribute("title");
+  });
+
+  it("exposes the label via aria-label and the ShadTooltip, not a raw key", () => {
+    setup();
+    expect(screen.getByRole("button")).toHaveAttribute("aria-label", "Bundles");
+    expect(screen.getByTestId("shad-tooltip")).toHaveAttribute(
+      "data-content",
+      "Bundles",
+    );
+  });
+});

src/frontend/src/pages/FlowPage/components/PageComponent/MemoizedComponents.tsx

@@ -54,7 +54,7 @@ export const MemoizedSidebarTrigger = memo(() => {
             iconName={item.icon}
             iconClasses={item.id === "mcp" ? "h-8 w-8" : ""}
             key={item.id}
-            tooltipText={item.tooltip}
+            tooltipText={t(item.tooltip)}
             onClick={() => {
               setActiveSection(item.id);
               if (!open) {