From b18aa6a0faee953779eae0c0167cc012ff03ee47 Mon Sep 17 00:00:00 2001
From: Anton Kulyk <kuliks.anton@gmail.com>
Date: Wed, 22 Feb 2023 17:32:35 +0000
Subject: [PATCH] Hide run action button when actions are disabled per database
 (#28501)

* Add `aria-label` to the run button

* Assert run action button is shown when expected

* Hide run button when actions are disabled
---
 .../ModelActionDetails/ModelActionListItem.tsx             | 1 +
 .../models/components/ModelDetailPage/ModelDetailPage.tsx  | 4 +++-
 .../models/containers/ModelDetailPage/ModelDetailPage.tsx  | 2 ++
 .../ModelDetailPage/ModelDetailPage.unit.spec.tsx          | 7 +++++--
 4 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/frontend/src/metabase/models/components/ModelDetailPage/ModelActionDetails/ModelActionListItem.tsx b/frontend/src/metabase/models/components/ModelDetailPage/ModelActionDetails/ModelActionListItem.tsx
index 4b5b51b16ad..afea0c559de 100644
--- a/frontend/src/metabase/models/components/ModelDetailPage/ModelActionDetails/ModelActionListItem.tsx
+++ b/frontend/src/metabase/models/components/ModelDetailPage/ModelActionDetails/ModelActionListItem.tsx
@@ -117,6 +117,7 @@ function ModelActionListItem({
                   icon="play"
                   onlyIcon
                   tooltip={t`Run`}
+                  aria-label={t`Run`}
                 />
               </ActionRunButtonContainer>
             }
diff --git a/frontend/src/metabase/models/components/ModelDetailPage/ModelDetailPage.tsx b/frontend/src/metabase/models/components/ModelDetailPage/ModelDetailPage.tsx
index 3b87379ca79..fe918c489eb 100644
--- a/frontend/src/metabase/models/components/ModelDetailPage/ModelDetailPage.tsx
+++ b/frontend/src/metabase/models/components/ModelDetailPage/ModelDetailPage.tsx
@@ -29,6 +29,7 @@ interface Props {
   tab: string;
   hasDataPermissions: boolean;
   hasActionsTab: boolean;
+  canRunActions: boolean;
   onChangeName: (name?: string) => void;
   onChangeDescription: (description?: string | null) => void;
   onChangeCollection: (collection: Collection) => void;
@@ -40,6 +41,7 @@ function ModelDetailPage({
   mainTable,
   hasDataPermissions,
   hasActionsTab,
+  canRunActions,
   onChangeName,
   onChangeDescription,
   onChangeCollection,
@@ -90,7 +92,7 @@ function ModelDetailPage({
               <TabPanelContent>
                 <ModelActionDetails
                   model={model}
-                  canRunActions={hasDataPermissions}
+                  canRunActions={canRunActions}
                 />
               </TabPanelContent>
             </TabPanel>
diff --git a/frontend/src/metabase/models/containers/ModelDetailPage/ModelDetailPage.tsx b/frontend/src/metabase/models/containers/ModelDetailPage/ModelDetailPage.tsx
index 90cdb02e4c2..2f9586c576b 100644
--- a/frontend/src/metabase/models/containers/ModelDetailPage/ModelDetailPage.tsx
+++ b/frontend/src/metabase/models/containers/ModelDetailPage/ModelDetailPage.tsx
@@ -101,6 +101,7 @@ function ModelDetailPage({
   const hasActions = actions.length > 0;
   const hasActionsEnabled = database != null && database.hasActionsEnabled();
   const hasActionsTab = hasActions || hasActionsEnabled;
+  const canRunActions = hasActionsEnabled && hasDataPermissions;
 
   const mainTable = useMemo(
     () => (model.isStructured() ? model.query().sourceTable() : null),
@@ -185,6 +186,7 @@ function ModelDetailPage({
         mainTable={mainTable}
         tab={tab}
         hasDataPermissions={hasDataPermissions}
+        canRunActions={canRunActions}
         hasActionsTab={hasActionsTab}
         onChangeName={handleNameChange}
         onChangeDescription={handleDescriptionChange}
diff --git a/frontend/src/metabase/models/containers/ModelDetailPage/ModelDetailPage.unit.spec.tsx b/frontend/src/metabase/models/containers/ModelDetailPage/ModelDetailPage.unit.spec.tsx
index 013756fd857..152024c3421 100644
--- a/frontend/src/metabase/models/containers/ModelDetailPage/ModelDetailPage.unit.spec.tsx
+++ b/frontend/src/metabase/models/containers/ModelDetailPage/ModelDetailPage.unit.spec.tsx
@@ -511,7 +511,7 @@ describe("ModelDetailPage", () => {
           ).toBeInTheDocument();
         });
 
-        it("shows empty state if actions are disabled for the model's database but there are existing actions", async () => {
+        it("shows alert if actions are disabled for the model's database but there are existing actions", async () => {
           const model = getModel();
           const action = createMockQueryAction({ model_id: model.id() });
 
@@ -530,6 +530,7 @@ describe("ModelDetailPage", () => {
               `Running Actions is not enabled for database ${TEST_DATABASE.name}`,
             ),
           ).toBeInTheDocument();
+          expect(screen.queryByLabelText("Run")).not.toBeInTheDocument();
         });
 
         it("allows to create a new query action from the empty state", async () => {
@@ -548,6 +549,7 @@ describe("ModelDetailPage", () => {
           expect(
             screen.getByText(`Created by ${action.creator.common_name}`),
           ).toBeInTheDocument();
+          expect(await screen.findByLabelText("Run")).toBeInTheDocument();
         });
 
         it("lists existing public query actions with public label", async () => {
@@ -576,6 +578,7 @@ describe("ModelDetailPage", () => {
           expect(screen.getByText("Create")).toBeInTheDocument();
           expect(screen.getByText("Update")).toBeInTheDocument();
           expect(screen.getByText("Delete")).toBeInTheDocument();
+          expect(await screen.findAllByLabelText("Run")).toHaveLength(3);
         });
 
         it("allows to create a new query action", async () => {
@@ -828,7 +831,7 @@ describe("ModelDetailPage", () => {
           ];
           await setupActions({ model, actions, hasDataPermissions: false });
 
-          expect(queryIcon("play")).not.toBeInTheDocument();
+          expect(screen.queryByLabelText("Run")).not.toBeInTheDocument();
         });
       });
     });
-- 
GitLab