42701 search type ahead cp (#42716)

* respect search-typeahead-enabled

* updating unit test

* adding e2e test

e2e/test/scenarios/onboarding/search/search-typeahead.cy.spec.js

 import { USERS } from "e2e/support/cypress_data";
-import { restore, visitFullAppEmbeddingUrl } from "e2e/support/helpers";
+import {
+  commandPalette,
+  commandPaletteButton,
+  commandPaletteInput,
+  restore,
+  visitFullAppEmbeddingUrl,
+} from "e2e/support/helpers";
 
 ["admin", "normal"].forEach(user => {
   describe(`search > ${user} user`, () => {
@@ -28,3 +34,22 @@ import { restore, visitFullAppEmbeddingUrl } from "e2e/support/helpers";
     });
   });
 });
+
+describe("command palette", () => {
+  beforeEach(() => {
+    restore();
+    cy.signInAsAdmin();
+    cy.request("PUT", "/api/setting/search-typeahead-enabled", {
+      value: false,
+    });
+    cy.visit("/");
+  });
+
+  it("should not display search results in the palette when search-typeahead-enabled is false", () => {
+    commandPaletteButton().click();
+    commandPaletteInput().type("ord");
+    commandPalette()
+      .findByRole("option", { name: /View search results/ })
+      .should("exist");
+  });
+});

frontend/src/metabase/palette/components/PaletteResults.unit.spec.tsx

+import fetchMock from "fetch-mock";
 import { useKBar } from "kbar";
 import { useEffect } from "react";
 import { Route, withRouter, type WithRouterProps } from "react-router";
@@ -17,6 +18,7 @@ import {
   mockScrollIntoView,
 } from "__support__/ui";
 import { getAdminPaths } from "metabase/admin/app/reducers";
+import type { Settings } from "metabase-types/api";
 import {
   createMockCollection,
   createMockCollectionItem,
@@ -26,6 +28,7 @@ import {
 import {
   createMockAdminAppState,
   createMockAdminState,
+  createMockSettingsState,
 } from "metabase-types/store/mocks";
 
 import { useCommandPaletteBasicActions } from "../hooks/useCommandPaletteBasicActions";
@@ -98,7 +101,10 @@ const recents_2 = createMockRecentCollectionItem({
 mockScrollTo();
 mockScrollIntoView();
 
-const setup = ({ query }: { query?: string } = {}) => {
+const setup = ({
+  query,
+  settings = {},
+}: { query?: string; settings?: Partial<Settings> } = {}) => {
   setupDatabasesEndpoints([DATABASE]);
   setupSearchEndpoints([model_1, model_2, dashboard]);
   setupRecentViewsEndpoints([recents_1, recents_2]);
@@ -114,16 +120,13 @@ const setup = ({ query }: { query?: string } = {}) => {
             paths: getAdminPaths(),
           }),
         }),
+        settings: createMockSettingsState(settings),
       },
     },
   );
 };
 
 describe("PaletteResults", () => {
-  afterAll(() => {
-    jest.resetAllMocks();
-  });
-
   it("should show default actions", async () => {
     setup();
     expect(await screen.findByText("New dashboard")).toBeInTheDocument();
@@ -205,6 +208,9 @@ describe("PaletteResults", () => {
     expect(
       await screen.findByRole("option", { name: "Bar Question" }),
     ).toHaveTextContent("lame collection");
+
+    // One call is always made to determine if the instance has models inside useCommandPaletteBasicActions
+    expect(fetchMock.calls("path:/api/search").length).toBe(2);
   });
 
   it("should provide links to settings pages", async () => {
@@ -218,4 +224,14 @@ describe("PaletteResults", () => {
     expect(await screen.findByText("Admin")).toBeInTheDocument();
     expect(await screen.findByText("Permissions")).toBeInTheDocument();
   });
+
+  it("should not compute search results if 'search-typeahead-enabled' is diabled", async () => {
+    setup({ query: "ques", settings: { "search-typeahead-enabled": false } });
+    expect(
+      await screen.findByRole("option", { name: /View search results/ }),
+    ).toBeInTheDocument();
+
+    // One call is always made to determine if the instance has models inside useCommandPaletteBasicActions
+    expect(fetchMock.calls("path:/api/search").length).toBe(1);
+  });
 });

frontend/src/metabase/palette/hooks/useCommandPalette.tsx

@@ -8,6 +8,7 @@ import { t } from "ttag";
 import { getAdminPaths } from "metabase/admin/app/selectors";
 import { getSectionsWithPlugins } from "metabase/admin/settings/selectors";
 import { useListRecentItemsQuery, useSearchQuery } from "metabase/api";
+import { useSetting } from "metabase/common/hooks";
 import { ROOT_COLLECTION } from "metabase/entities/collections";
 import Search from "metabase/entities/search";
 import { SEARCH_DEBOUNCE_DURATION } from "metabase/lib/constants";
@@ -33,6 +34,7 @@ export const useCommandPalette = ({
   const dispatch = useDispatch();
   const docsUrl = useSelector(state => getDocsUrl(state, {}));
   const showMetabaseLinks = useSelector(getShowMetabaseLinks);
+  const isSearchTypeaheadEnabled = useSetting("search-typeahead-enabled");
 
   // Used for finding actions within the list
   const { searchQuery } = useKBar(state => ({
@@ -64,7 +66,7 @@ export const useCommandPalette = ({
       limit: 20,
     },
     {
-      skip: !debouncedSearchText,
+      skip: !debouncedSearchText || !isSearchTypeaheadEnabled,
       refetchOnMountOrArgChange: true,
     },
   );
@@ -110,7 +112,31 @@ export const useCommandPalette = ({
   ]);
 
   const searchResultActions = useMemo<PaletteAction[]>(() => {
-    if (isSearchLoading) {
+    const searchLocation = {
+      pathname: "search",
+      query: {
+        ...locationQuery,
+        q: debouncedSearchText,
+      },
+    };
+    if (!isSearchTypeaheadEnabled) {
+      return [
+        {
+          id: `search-disabled`,
+          name: t`View search results for "${debouncedSearchText}"`,
+          section: "search",
+          keywords: debouncedSearchText,
+          icon: "link" as const,
+          perform: () => {
+            dispatch(push(searchLocation));
+          },
+          priority: Priority.HIGH,
+          extra: {
+            href: searchLocation,
+          },
+        },
+      ];
+    } else if (isSearchLoading) {
       return [
         {
           id: "search-is-loading",
@@ -129,13 +155,6 @@ export const useCommandPalette = ({
       ];
     } else if (debouncedSearchText) {
       if (searchResults?.data.length) {
-        const searchLocation = {
-          pathname: "search",
-          query: {
-            ...locationQuery,
-            q: debouncedSearchText,
-          },
-        };
         return [
           {
             id: `search-results-metadata`,
@@ -194,6 +213,7 @@ export const useCommandPalette = ({
     searchError,
     searchResults,
     locationQuery,
+    isSearchTypeaheadEnabled,
   ]);
 
   useRegisterActions(searchResultActions, [searchResultActions]);