Enable object detail view on nested native queries (#21883)

* Reproduce #16938

* Fix PK drill unavailable for nested native query

* Clean up ObjectDetailDrill

frontend/src/metabase/modes/components/drill/ObjectDetailDrill.jsx

@@ -38,6 +38,48 @@ function getActionForFKColumn({ targetField, objectId }) {
   ];
 }
 
+function getFKTargetField(question, column) {
+  const fkField = question.metadata().field(column.id);
+  return fkField?.target;
+}
+
+function getBaseActionObject() {
+  return {
+    name: "object-detail",
+    section: "details",
+    title: t`View details`,
+    buttonType: "horizontal",
+    icon: "document",
+    default: true,
+  };
+}
+
+function getPKAction({ question, column, objectId, isDashboard }) {
+  const actionObject = getBaseActionObject();
+  const [actionKey, action] = getActionForPKColumn({
+    question,
+    column,
+    objectId,
+    isDashboard,
+  });
+  actionObject[actionKey] = action;
+  return actionObject;
+}
+
+function getFKAction({ question, column, objectId }) {
+  const actionObject = getBaseActionObject();
+  const targetField = getFKTargetField(question, column);
+  if (!targetField) {
+    return;
+  }
+  const [actionKey, action] = getActionForFKColumn({
+    targetField,
+    objectId,
+  });
+  actionObject[actionKey] = action;
+  return actionObject;
+}
+
 export default ({ question, clicked }) => {
   if (
     !clicked?.column ||
@@ -50,38 +92,8 @@ export default ({ question, clicked }) => {
   const { column, value: objectId, extraData } = clicked;
   const isDashboard = !!extraData?.dashboard;
 
-  let field = question.metadata().field(column.id);
-  if (isFK(column)) {
-    field = field.target;
-  }
-  if (!field) {
-    return [];
-  }
-
-  const actionObject = {
-    name: "object-detail",
-    section: "details",
-    title: t`View details`,
-    buttonType: "horizontal",
-    icon: "document",
-    default: true,
-  };
-
-  if (isPK(column)) {
-    const [actionKey, action] = getActionForPKColumn({
-      question,
-      column,
-      objectId,
-      isDashboard,
-    });
-    actionObject[actionKey] = action;
-  } else {
-    const [actionKey, action] = getActionForFKColumn({
-      targetField: field,
-      objectId,
-    });
-    actionObject[actionKey] = action;
-  }
+  const params = { question, column, objectId, isDashboard };
 
-  return [actionObject];
+  const actionObject = isPK(column) ? getPKAction(params) : getFKAction(params);
+  return actionObject ? [actionObject] : [];
 };

frontend/test/metabase/scenarios/question/question-reproductions.cy.spec.js

@@ -7,6 +7,7 @@ import { issue14957 } from "./reproductions/14957-unable-to-save-question-before
 import { issue15714 } from "./reproductions/15714-cc-postgres-percentile-accepts-two-params";
 import { issue15876 } from "./reproductions/15876-postgres-cast-time";
 import { issue16621 } from "./reproductions/16621-create-multiple-filters-with-same-value";
+import { issue16938 } from "./reproductions/16938-nesed-native-query-pk-drill.cy.spec";
 import { issue17512 } from "./reproductions/17512";
 import { issue17514 } from "./reproductions/17514-ui-overlay";
 import { issue17963 } from "./reproductions/17963-mongo-filter-expression-compare-two-fields";
@@ -27,6 +28,7 @@ issue14957();
 issue15714();
 issue15876();
 issue16621();
+issue16938();
 issue17512();
 issue17514();
 issue17963();

frontend/test/metabase/scenarios/question/reproductions/16938-nesed-native-query-pk-drill.cy.spec.js

+import { restore } from "__support__/e2e/cypress";
+
+export function issue16938() {
+  describe("issue 16938", () => {
+    beforeEach(() => {
+      restore();
+      cy.signInAsAdmin();
+      cy.intercept("POST", "/api/dataset").as("dataset");
+    });
+
+    it("should allow to browse object details when exploring native query results (metabase#16938)", () => {
+      const ORDER_ID = 1;
+
+      cy.createNativeQuestion(
+        {
+          name: "Orders",
+          native: {
+            query: "select * from orders",
+          },
+        },
+        { visitQuestion: true },
+      );
+
+      cy.button(/Explore results/i).click();
+      cy.wait("@dataset");
+
+      getFirstTableColumn()
+        .eq(1)
+        .should("contain", ORDER_ID)
+        .click();
+
+      cy.findByTestId("object-detail").within(() => {
+        cy.findByText(`Order ${ORDER_ID}`);
+      });
+    });
+  });
+}
+
+function getFirstTableColumn() {
+  return cy.get(".TableInteractive-cellWrapper--firstColumn");
+}