Fix - Admin Email does not Display on Question Timeout Page (#42937)

* Extract EmailAdmin and add tests for it

* Rename EmailAdmin to AdminEmail

* Remove redundant async

* Add a test case for no email

frontend/src/metabase/query_builder/components/VisualizationError/VisualizationError.tsx

@@ -9,7 +9,6 @@ import QueryBuilderS from "metabase/css/query_builder.module.css";
 import { getEngineNativeType } from "metabase/lib/engine";
 import { useSelector } from "metabase/lib/redux";
 import MetabaseSettings from "metabase/lib/settings";
-import { isNotNull } from "metabase/lib/types";
 import { getShowMetabaseLinks } from "metabase/selectors/whitelabel";
 import * as Lib from "metabase-lib";
 import type Question from "metabase-lib/v1/Question";
@@ -25,19 +24,9 @@ import {
   QueryErrorMessage,
   QueryErrorContent,
 } from "./VisualizationError.styled";
+import { AdminEmail } from "./components";
 import { adjustPositions, stripRemarks } from "./utils";
 
-function EmailAdmin(): JSX.Element | null {
-  const hasAdminEmail = isNotNull(MetabaseSettings.adminEmail());
-  return hasAdminEmail ? (
-    <span className={QueryBuilderS.QueryErrorAdminEmail}>
-      <a className={CS.noDecoration} href={`mailto:${hasAdminEmail}`}>
-        {hasAdminEmail}
-      </a>
-    </span>
-  ) : null;
-}
-
 interface VisualizationErrorProps {
   via: Record<string, any>[];
   question: Question;
@@ -65,7 +54,7 @@ export function VisualizationError({
           type="timeout"
           title={t`Your question took too long`}
           message={t`We didn't get an answer back from your database in time, so we had to stop. You can try again in a minute, or if the problem persists, you can email an admin to let them know.`}
-          action={<EmailAdmin />}
+          action={<AdminEmail />}
         />
       );
     } else {
@@ -75,7 +64,7 @@ export function VisualizationError({
           type="serverError"
           title={t`We're experiencing server issues`}
           message={t`Try refreshing the page after waiting a minute or two. If the problem persists we'd recommend you contact an admin.`}
-          action={<EmailAdmin />}
+          action={<AdminEmail />}
         />
       );
     }

frontend/src/metabase/query_builder/components/VisualizationError/components/AdminEmail/AdminEmail.tsx

+import { useSetting } from "metabase/common/hooks";
+import CS from "metabase/css/core/index.css";
+import QueryBuilderS from "metabase/css/query_builder.module.css";
+
+export const AdminEmail = () => {
+  const adminEmail = useSetting("admin-email");
+
+  if (!adminEmail) {
+    return null;
+  }
+
+  return (
+    <span className={QueryBuilderS.QueryErrorAdminEmail}>
+      <a className={CS.noDecoration} href={`mailto:${adminEmail}`}>
+        {adminEmail}
+      </a>
+    </span>
+  );
+};

frontend/src/metabase/query_builder/components/VisualizationError/components/AdminEmail/AdminEmail.unit.spec.tsx

+import { screen } from "@testing-library/react";
+
+import { mockSettings } from "__support__/settings";
+import { renderWithProviders } from "__support__/ui";
+import { createMockSettings } from "metabase-types/api/mocks";
+import { createMockState } from "metabase-types/store/mocks";
+
+import { AdminEmail } from "./AdminEmail";
+
+interface SetupOpts {
+  adminEmail: string;
+}
+
+const setup = ({ adminEmail }: SetupOpts) => {
+  const storeInitialState = createMockState({
+    settings: mockSettings(
+      createMockSettings({
+        "admin-email": adminEmail,
+      }),
+    ),
+  });
+
+  renderWithProviders(<AdminEmail />, {
+    storeInitialState,
+  });
+};
+
+describe("AdminEmail", () => {
+  it("should render admin's email as a link (metabase#42929)", () => {
+    setup({ adminEmail: "admin@metabase.test" });
+
+    const link = screen.getByText("admin@metabase.test");
+    expect(link).toBeInTheDocument();
+    expect(link).toHaveAttribute("href", "mailto:admin@metabase.test");
+  });
+
+  it("renders nothing when there's no admin email", () => {
+    setup({ adminEmail: "" });
+
+    expect(screen.queryByText("admin@metabase.test")).not.toBeInTheDocument();
+  });
+});

frontend/src/metabase/query_builder/components/VisualizationError/components/AdminEmail/index.ts

+export * from "./AdminEmail";

frontend/src/metabase/query_builder/components/VisualizationError/components/index.ts

+export * from "./AdminEmail";