Fix document title when opening a multi-series question from dashboard (#46004)

* Add repro

* Fix onOpenQuestion uses unexpected card object

e2e/test/scenarios/dashboard/dashboard-reproductions.cy.spec.js

@@ -43,12 +43,15 @@ import {
 } from "e2e/support/helpers";
 import { createSegment } from "e2e/support/helpers/e2e-table-metadata-helpers";
 import { DASHBOARD_SLOW_TIMEOUT } from "metabase/dashboard/constants";
-import { createMockDashboardCard } from "metabase-types/api/mocks";
+import {
+  createMockDashboardCard,
+  createMockParameter,
+} from "metabase-types/api/mocks";
 
 const { SAMPLE_DATABASE } = require("e2e/support/cypress_sample_database");
 
 const { ALL_USERS_GROUP, COLLECTION_GROUP } = USER_GROUPS;
-const { ORDERS_ID, ORDERS, PRODUCTS_ID, PRODUCTS } = SAMPLE_DATABASE;
+const { ORDERS_ID, ORDERS, PRODUCTS_ID, PRODUCTS, PEOPLE } = SAMPLE_DATABASE;
 
 describe("issue 12578", () => {
   const ORDERS_QUESTION = {
@@ -1412,3 +1415,88 @@ describe("issue 40695", () => {
     });
   });
 });
+
+describe("issue 42165", () => {
+  const peopleSourceFieldRef = [
+    "field",
+    PEOPLE.SOURCE,
+    { "base-type": "type/Text", "source-field": ORDERS.USER_ID },
+  ];
+  const ordersCreatedAtFieldRef = [
+    "field",
+    ORDERS.CREATED_AT,
+    { "base-type": "type/DateTime", "temporal-unit": "month" },
+  ];
+
+  beforeEach(() => {
+    restore();
+    cy.signInAsAdmin();
+
+    cy.intercept("POST", "/api/dataset").as("dataset");
+    cy.intercept("POST", "/api/dashboard/*/dashcard/*/card/*/query").as(
+      "dashcardQuery",
+    );
+
+    cy.createDashboardWithQuestions({
+      dashboardDetails: {
+        parameters: [
+          createMockParameter({
+            id: "param-1",
+            name: "Date",
+            slug: "date",
+            type: "date/all-options",
+          }),
+        ],
+      },
+      questions: [
+        {
+          name: "fooBarQuestion",
+          display: "bar",
+          query: {
+            aggregation: [["count"]],
+            breakout: [peopleSourceFieldRef, ordersCreatedAtFieldRef],
+            "source-table": ORDERS_ID,
+          },
+        },
+      ],
+    }).then(({ dashboard: _dashboard }) => {
+      cy.request("GET", `/api/dashboard/${_dashboard.id}`).then(
+        ({ body: dashboard }) => {
+          const [dashcard] = dashboard.dashcards;
+          const [parameter] = dashboard.parameters;
+          cy.request("PUT", `/api/dashboard/${dashboard.id}`, {
+            dashcards: [
+              {
+                ...dashcard,
+                parameter_mappings: [
+                  {
+                    card_id: dashcard.card_id,
+                    parameter_id: parameter.id,
+                    target: ["dimension", ordersCreatedAtFieldRef],
+                  },
+                ],
+              },
+            ],
+          }).then(() => {
+            cy.wrap(_dashboard.id).as("dashboardId");
+          });
+        },
+      );
+    });
+  });
+
+  it("should use card name instead of series names when navigating to QB from dashcard title", () => {
+    cy.get("@dashboardId").then(dashboardId => {
+      visitDashboard(dashboardId);
+
+      filterWidget().click();
+      popover().findByText("Last 30 Days").click();
+      cy.wait("@dashcardQuery");
+
+      getDashboardCard(0).findByText("fooBarQuestion").click();
+
+      cy.wait("@dataset");
+      cy.title().should("eq", "fooBarQuestion · Metabase");
+    });
+  });
+});

frontend/src/metabase/visualizations/visualizations/CartesianChart/CartesianChart.tsx

@@ -98,7 +98,9 @@ function _CartesianChart(props: VisualizationProps) {
           icon={headerIcon}
           actionButtons={actionButtons}
           getHref={canSelectTitle ? getHref : undefined}
-          onSelectTitle={canSelectTitle ? onOpenQuestion : undefined}
+          onSelectTitle={
+            canSelectTitle ? () => onOpenQuestion(card.id) : undefined
+          }
           width={outerWidth}
         />
       )}