Library Panels: Remove direct use of legacy search (#112231)

public/app/features/dashboard-scene/panel-edit/SaveLibraryVizPanelModal.tsx

@@ -20,8 +20,8 @@ export const SaveLibraryVizPanelModal = ({ libraryPanel, isUnsavedPrompt, onDism
   const [searchString, setSearchString] = useState('');
   const dashState = useAsync(async () => {
     const searchHits = await getConnectedDashboards(libraryPanel.state.uid);
-    if (searchHits.length > 0) {
-      return searchHits.map((dash) => dash.title);
+    if (searchHits && searchHits.length > 0) {
+      return searchHits.map((dash) => dash.name);
     }
 
     return [];
@@ -50,7 +50,7 @@ export const SaveLibraryVizPanelModal = ({ libraryPanel, isUnsavedPrompt, onDism
   const title = isUnsavedPrompt ? 'Unsaved library panel changes' : 'Save library panel';
 
   return (
-    <Modal title={title} icon="save" onDismiss={onDismiss} isOpen={true}>
+    <Modal title={title} onDismiss={onDismiss} isOpen={true}>
       <div>
         <p className={styles.textInfo}>
           <Trans

public/app/features/library-panels/components/DeleteLibraryPanelModal/actions.ts

@@ -6,6 +6,6 @@ import { searchCompleted } from './reducer';
 export function getConnectedDashboards(libraryPanel: LibraryElementDTO): DispatchResult {
   return async function (dispatch) {
     const dashboards = await apiGetConnectedDashboards(libraryPanel.uid);
-    dispatch(searchCompleted({ dashboards }));
+    dispatch(searchCompleted({ dashboards: dashboards || [] }));
   };
 }

public/app/features/library-panels/components/DeleteLibraryPanelModal/reducer.test.ts

@@ -1,5 +1,5 @@
 import { LoadingState } from '@grafana/data';
-import { DashboardSearchItem } from 'app/features/search/types';
+import { DashboardQueryResult } from 'app/features/search/service/types';
 
 import { reducerTester } from '../../../../../test/core/redux/reducerTester';
 
@@ -25,7 +25,7 @@ describe('deleteLibraryPanelModalReducer', () => {
 
   describe('when searchCompleted is dispatched', () => {
     it('then state should be correct', () => {
-      const dashboards = [{ title: 'A' }, { title: 'B' }] as DashboardSearchItem[];
+      const dashboards = [{ name: 'A' }, { name: 'B' }] as DashboardQueryResult[];
       reducerTester<DeleteLibraryPanelModalState>()
         .givenReducer(deleteLibraryPanelModalReducer, initialDeleteLibraryPanelModalState)
         .whenActionIsDispatched(searchCompleted({ dashboards }))

public/app/features/library-panels/components/DeleteLibraryPanelModal/reducer.ts

@@ -2,7 +2,7 @@ import { createAction } from '@reduxjs/toolkit';
 import { AnyAction } from 'redux';
 
 import { LoadingState } from '@grafana/data';
-import { DashboardSearchItem } from 'app/features/search/types';
+import { DashboardQueryResult } from 'app/features/search/service/types';
 
 export interface DeleteLibraryPanelModalState {
   loadingState: LoadingState;
@@ -14,7 +14,7 @@ export const initialDeleteLibraryPanelModalState: DeleteLibraryPanelModalState =
   dashboardTitles: [],
 };
 
-export const searchCompleted = createAction<{ dashboards: DashboardSearchItem[] }>(
+export const searchCompleted = createAction<{ dashboards: DashboardQueryResult[] }>(
   'libraryPanels/delete/searchCompleted'
 );
 
@@ -25,7 +25,7 @@ export const deleteLibraryPanelModalReducer = (
   if (searchCompleted.match(action)) {
     return {
       ...state,
-      dashboardTitles: action.payload.dashboards.map((d) => d.title),
+      dashboardTitles: action.payload.dashboards.map((d) => d.name),
       loadingState: LoadingState.Done,
     };
   }

public/app/features/library-panels/components/OpenLibraryPanelModal/OpenLibraryPanelModal.tsx

@@ -5,8 +5,8 @@ import { SelectableValue, urlUtil } from '@grafana/data';
 import { Trans, t } from '@grafana/i18n';
 import { locationService } from '@grafana/runtime';
 import { AsyncSelect, Button, Modal } from '@grafana/ui';
+import { DashboardQueryResult } from 'app/features/search/service/types';
 
-import { DashboardSearchItem } from '../../../search/types';
 import { getConnectedDashboards, getLibraryPanelConnectedDashboards } from '../../state/api';
 import { LibraryElementDTO } from '../../types';
 
@@ -18,7 +18,7 @@ export interface OpenLibraryPanelModalProps {
 export function OpenLibraryPanelModal({ libraryPanel, onDismiss }: OpenLibraryPanelModalProps): JSX.Element {
   const [loading, setLoading] = useState(false);
   const [connected, setConnected] = useState(0);
-  const [option, setOption] = useState<SelectableValue<DashboardSearchItem> | undefined>(undefined);
+  const [option, setOption] = useState<SelectableValue<DashboardQueryResult> | undefined>(undefined);
   useEffect(() => {
     const getConnected = async () => {
       const connectedDashboards = await getLibraryPanelConnectedDashboards(libraryPanel.uid);
@@ -90,9 +90,9 @@ async function loadOptionsAsync(uid: string, searchString: string, setLoading: (
   setLoading(true);
   const searchHits = await getConnectedDashboards(uid);
   const options = searchHits
-    .filter((d) => d.title.toLowerCase().includes(searchString.toLowerCase()))
-    .map((d) => ({ label: d.title, value: d }));
+    ?.filter((d) => d.name.toLowerCase().includes(searchString.toLowerCase()))
+    .map((d) => ({ label: d.name, value: d }));
   setLoading(false);
 
-  return options;
+  return options || [];
 }

public/app/features/library-panels/components/SaveLibraryPanelModal/SaveLibraryPanelModal.tsx

@@ -29,8 +29,8 @@ export const SaveLibraryPanelModal = ({
   const [searchString, setSearchString] = useState('');
   const dashState = useAsync(async () => {
     const searchHits = await getConnectedDashboards(panel.libraryPanel.uid);
-    if (searchHits.length > 0) {
-      return searchHits.map((dash) => dash.title);
+    if (searchHits && searchHits.length > 0) {
+      return searchHits.map((dash) => dash.name);
     }
 
     return [];

public/app/features/library-panels/state/api.ts

@@ -6,9 +6,10 @@ import { DashboardModel } from 'app/features/dashboard/state/DashboardModel';
 import { DashboardGridItem } from 'app/features/dashboard-scene/scene/layout-default/DashboardGridItem';
 import { vizPanelToPanel } from 'app/features/dashboard-scene/serialization/transformSceneToSaveModel';
 import { getLibraryPanelBehavior } from 'app/features/dashboard-scene/utils/utils';
+import { getGrafanaSearcher } from 'app/features/search/service/searcher';
+import { DashboardQueryResult } from 'app/features/search/service/types';
 
 import { getBackendSrv } from '../../../core/services/backend_srv';
-import { DashboardSearchItem } from '../../search/types';
 import {
   LibraryElementConnectionDTO,
   LibraryElementDTO,
@@ -141,15 +142,14 @@ export async function getLibraryPanelConnectedDashboards(
   return result;
 }
 
-export async function getConnectedDashboards(uid: string): Promise<DashboardSearchItem[]> {
+export async function getConnectedDashboards(uid: string): Promise<DashboardQueryResult[] | null> {
   const connections = await getLibraryPanelConnectedDashboards(uid);
   if (connections.length === 0) {
-    return [];
+    return null;
   }
 
-  const searchHits = await getBackendSrv().search({ dashboardUIDs: connections.map((c) => c.connectionUid) });
-
-  return searchHits;
+  const result = await getGrafanaSearcher().search({ uid: connections.map((c) => c.connectionUid) });
+  return result.view.toArray();
 }
 
 export function libraryVizPanelToSaveModel(vizPanel: VizPanel) {