PanelTitleSearch: Show datasource usage in plugins (#83922)

public/app/features/plugins/admin/components/PluginUsage.tsx

@@ -4,7 +4,7 @@ import { useAsync } from 'react-use';
 import AutoSizer from 'react-virtualized-auto-sizer';
 import { of } from 'rxjs';
 
-import { GrafanaTheme2, PluginMeta } from '@grafana/data';
+import { GrafanaTheme2, PluginMeta, PluginType } from '@grafana/data';
 import { config } from '@grafana/runtime';
 import { Alert, Spinner, useStyles2 } from '@grafana/ui';
 import EmptyListCTA from 'app/core/components/EmptyListCTA/EmptyListCTA';
@@ -19,6 +19,13 @@ export function PluginUsage({ plugin }: Props) {
   const styles = useStyles2(getStyles);
 
   const searchQuery = useMemo<SearchQuery>(() => {
+    if (plugin.type === PluginType.datasource) {
+      return {
+        query: '*',
+        ds_type: plugin.id,
+        kind: ['dashboard'],
+      };
+    }
     return {
       query: '*',
       panel_type: plugin.id,

public/app/features/plugins/admin/hooks/usePluginDetailsTabs.tsx

@@ -51,7 +51,10 @@ export const usePluginDetailsTabs = (plugin?: CatalogPlugin, pageId?: PluginTabI
       });
     }
 
-    if (config.featureToggles.panelTitleSearch && pluginConfig.meta.type === PluginType.panel) {
+    if (
+      config.featureToggles.panelTitleSearch &&
+      (pluginConfig.meta.type === PluginType.panel || pluginConfig.meta.type === PluginType.datasource)
+    ) {
       navModelChildren.push({
         text: PluginTabLabels.USAGE,
         icon: 'list-ul',