diff --git a/public/app/features/dashboard-scene/panel-edit/PanelVizTypePicker.tsx b/public/app/features/dashboard-scene/panel-edit/PanelVizTypePicker.tsx index e4a8482622c..0da983abab6 100644 --- a/public/app/features/dashboard-scene/panel-edit/PanelVizTypePicker.tsx +++ b/public/app/features/dashboard-scene/panel-edit/PanelVizTypePicker.tsx @@ -3,7 +3,8 @@ import { useEffect, useMemo, useState } from 'react'; import { useLocalStorage } from 'react-use'; import { GrafanaTheme2, PanelData, SelectableValue } from '@grafana/data'; -import { CustomScrollbar, Field, FilterInput, RadioButtonGroup, useStyles2 } from '@grafana/ui'; +import { selectors } from '@grafana/e2e-selectors'; +import { Button, CustomScrollbar, Field, FilterInput, RadioButtonGroup, useStyles2 } from '@grafana/ui'; import { LS_VISUALIZATION_SELECT_TAB_KEY, LS_WIDGET_SELECT_TAB_KEY } from 'app/core/constants'; import { VisualizationSelectPaneTab } from 'app/features/dashboard/components/PanelEditor/types'; import { VisualizationSuggestions } from 'app/features/panel/components/VizTypePicker/VisualizationSuggestions'; @@ -61,15 +62,29 @@ export function PanelVizTypePicker({ vizManager, data, onChange }: Props) { onChange(); }; + const onCloseVizPicker = () => { + onChange(); + }; + return (
- +
+ +
@@ -106,6 +121,13 @@ const getStyles = (theme: GrafanaTheme2) => ({ borderBottom: 'none', borderTopLeftRadius: theme.shape.radius.default, }), + searchRow: css({ + display: 'flex', + marginBottom: theme.spacing(1), + }), + closeButton: css({ + marginLeft: theme.spacing(1), + }), customFieldMargin: css({ marginBottom: theme.spacing(1), }),