diff --git a/public/app/features/commandPalette/CommandPalette.tsx b/public/app/features/commandPalette/CommandPalette.tsx
index 0ccb405da39..9e2222bedcd 100644
--- a/public/app/features/commandPalette/CommandPalette.tsx
+++ b/public/app/features/commandPalette/CommandPalette.tsx
@@ -19,6 +19,7 @@ import { reportInteraction } from '@grafana/runtime';
import { Icon, LoadingBar, useStyles2 } from '@grafana/ui';
import { t } from 'app/core/internationalization';
+import { EmptyState } from './EmptyState';
import { KBarResults } from './KBarResults';
import { ResultItem } from './ResultItem';
import { useSearchResults } from './actions/dashboardActions';
@@ -68,7 +69,7 @@ export function CommandPalette() {
-
+
@@ -79,10 +80,11 @@ export function CommandPalette() {
}
interface RenderResultsProps {
+ isFetchingSearchResults: boolean;
searchResults: CommandPaletteAction[];
}
-const RenderResults = ({ searchResults }: RenderResultsProps) => {
+const RenderResults = ({ isFetchingSearchResults, searchResults }: RenderResultsProps) => {
const { results: kbarResults, rootActionId } = useMatches();
const styles = useStyles2(getSearchStyles);
const dashboardsSectionTitle = t('command-palette.section.dashboard-search-results', 'Dashboards');
@@ -117,7 +119,11 @@ const RenderResults = ({ searchResults }: RenderResultsProps) => {
return results;
}, [kbarResults, dashboardsSectionTitle, dashboardResultItems, foldersSectionTitle, folderResultItems]);
- return (
+ const showEmptyState = !isFetchingSearchResults && items.length === 0;
+
+ return showEmptyState ? (
+
+ ) : (
{
+ const styles = useStyles2(getStyles);
+
+ return (
+
+
+
+
+ No results found
+
+
+
+ );
+};
+
+EmptyState.displayName = 'EmptyState';
+
+const getStyles = (theme: GrafanaTheme2) => ({
+ container: css({
+ padding: theme.spacing(8, 0),
+ }),
+});
diff --git a/public/img/grot-not-found.svg b/public/img/grot-not-found.svg
new file mode 100644
index 00000000000..12106ef9a7f
--- /dev/null
+++ b/public/img/grot-not-found.svg
@@ -0,0 +1,29 @@
+
diff --git a/public/locales/en-US/grafana.json b/public/locales/en-US/grafana.json
index 8fa043ef48c..c5a2ea55733 100644
--- a/public/locales/en-US/grafana.json
+++ b/public/locales/en-US/grafana.json
@@ -108,6 +108,9 @@
"dark-theme": "Dark",
"light-theme": "Light"
},
+ "empty-state": {
+ "title": "No results found"
+ },
"search-box": {
"placeholder": "Search or jump to..."
},
diff --git a/public/locales/pseudo-LOCALE/grafana.json b/public/locales/pseudo-LOCALE/grafana.json
index 82ecca9b352..8f2a84999eb 100644
--- a/public/locales/pseudo-LOCALE/grafana.json
+++ b/public/locales/pseudo-LOCALE/grafana.json
@@ -108,6 +108,9 @@
"dark-theme": "Đäřĸ",
"light-theme": "Ŀįģĥŧ"
},
+ "empty-state": {
+ "title": "Ńő řęşūľŧş ƒőūʼnđ"
+ },
"search-box": {
"placeholder": "Ŝęäřčĥ őř ĵūmp ŧő..."
},