diff --git a/public/app/features/connections/tabs/ConnectData/ConnectData.test.tsx b/public/app/features/connections/tabs/ConnectData/ConnectData.test.tsx
index e0e293e3986..a585ab8d1fb 100644
--- a/public/app/features/connections/tabs/ConnectData/ConnectData.test.tsx
+++ b/public/app/features/connections/tabs/ConnectData/ConnectData.test.tsx
@@ -2,11 +2,11 @@ import { fireEvent, render, RenderResult, screen } from '@testing-library/react'
 import React from 'react';
 import { Provider } from 'react-redux';
 
+import { PluginType } from '@grafana/data';
+import { getCatalogPluginMock, getPluginsStateMock } from 'app/features/plugins/admin/__mocks__';
 import { CatalogPlugin } from 'app/features/plugins/admin/types';
 import { configureStore } from 'app/store/configureStore';
 
-import { getCatalogPluginMock, getPluginsStateMock } from '../../../plugins/admin/__mocks__';
-
 import { ConnectData } from './ConnectData';
 
 jest.mock('app/features/datasources/api');
@@ -22,6 +22,12 @@ const renderPage = (plugins: CatalogPlugin[] = []): RenderResult => {
   );
 };
 
+const mockCatalogDataSourcePlugin = getCatalogPluginMock({
+  type: PluginType.datasource,
+  name: 'Sample data source',
+  id: 'sample-data-source',
+});
+
 describe('Connect Data', () => {
   test('renders no results if the plugins list is empty', async () => {
     renderPage();
@@ -29,20 +35,26 @@ describe('Connect Data', () => {
     expect(screen.queryByText('No results matching your query were found.')).toBeInTheDocument();
   });
 
-  test('renders card if plugins list is populated', async () => {
+  test('renders no results if there is no data source plugin in the list', async () => {
     renderPage([getCatalogPluginMock()]);
 
-    expect(await screen.findByText('Zabbix')).toBeVisible();
+    expect(screen.queryByText('No results matching your query were found.')).toBeInTheDocument();
+  });
+
+  test('renders only data source plugins when list is populated', async () => {
+    renderPage([getCatalogPluginMock(), mockCatalogDataSourcePlugin]);
+
+    expect(await screen.findByText('Sample data source')).toBeVisible();
   });
 
   test('renders card if search term matches', async () => {
-    renderPage([getCatalogPluginMock()]);
+    renderPage([getCatalogPluginMock(), mockCatalogDataSourcePlugin]);
     const searchField = await screen.findByRole('textbox');
 
-    fireEvent.change(searchField, { target: { value: 'abbi' } });
-    expect(await screen.findByText('Zabbix')).toBeVisible();
+    fireEvent.change(searchField, { target: { value: 'ampl' } });
+    expect(await screen.findByText('Sample data source')).toBeVisible();
 
-    fireEvent.change(searchField, { target: { value: 'rabbit' } });
+    fireEvent.change(searchField, { target: { value: 'cramp' } });
     expect(screen.queryByText('No results matching your query were found.')).toBeInTheDocument();
   });
 });
diff --git a/public/app/features/connections/tabs/ConnectData/ConnectData.tsx b/public/app/features/connections/tabs/ConnectData/ConnectData.tsx
index 7507a66229f..f9fcc45fcca 100644
--- a/public/app/features/connections/tabs/ConnectData/ConnectData.tsx
+++ b/public/app/features/connections/tabs/ConnectData/ConnectData.tsx
@@ -1,6 +1,7 @@
 import { css } from '@emotion/css';
 import React, { useMemo, useState } from 'react';
 
+import { PluginType } from '@grafana/data';
 import { useStyles2, LoadingPlaceholder } from '@grafana/ui';
 import { useGetAllWithFilters } from 'app/features/plugins/admin/state/hooks';
 
@@ -25,7 +26,11 @@ export function ConnectData() {
     setSearchTerm(e.currentTarget.value.toLowerCase());
   };
 
-  const { isLoading, error, plugins } = useGetAllWithFilters({ query: searchTerm, filterBy: '' });
+  const { isLoading, error, plugins } = useGetAllWithFilters({
+    query: searchTerm,
+    filterBy: '',
+    filterByType: PluginType.datasource,
+  });
 
   const cardGridItems = useMemo(
     () =>