diff --git a/public/app/features/dashboard-scene/panel-edit/PanelOptionsPane.tsx b/public/app/features/dashboard-scene/panel-edit/PanelOptionsPane.tsx index 30e999ca90d..85566677b42 100644 --- a/public/app/features/dashboard-scene/panel-edit/PanelOptionsPane.tsx +++ b/public/app/features/dashboard-scene/panel-edit/PanelOptionsPane.tsx @@ -9,6 +9,7 @@ import { PanelPluginMeta, restoreCustomOverrideRules, PluginType, + SelectableValue, } from '@grafana/data'; import { selectors } from '@grafana/e2e-selectors'; import { config, locationService, reportInteraction } from '@grafana/runtime'; @@ -21,7 +22,7 @@ import { VizPanel, sceneGraph, } from '@grafana/scenes'; -import { Button, Card, FilterInput, Stack, ToolbarButton, useStyles2 } from '@grafana/ui'; +import { Button, Card, FilterInput, RadioButtonGroup, Stack, ToolbarButton, useStyles2 } from '@grafana/ui'; import { Trans } from 'app/core/internationalization'; import { OptionFilter } from 'app/features/dashboard/components/PanelEditor/OptionsPaneOptions'; import { getPanelPluginNotFound } from 'app/features/panel/components/PanelPluginError'; @@ -104,6 +105,13 @@ export class PanelOptionsPane extends SceneObjectBase { }); }; + getOptionRadioFilters(): Array> { + return [ + { label: OptionFilter.All, value: OptionFilter.All }, + { label: OptionFilter.Overrides, value: OptionFilter.Overrides }, + ]; + } + static Component = ({ model }: SceneComponentProps) => { const { isVizPickerOpen, searchQuery, listMode, panelRef } = model.useState(); const panel = panelRef.resolve(); @@ -111,6 +119,8 @@ export class PanelOptionsPane extends SceneObjectBase { const { data } = sceneGraph.getData(panel).useState(); const styles = useStyles2(getStyles); const isAngularPanel = isUsingAngularPanelPlugin(panel); + const isSearching = searchQuery.length > 0; + const showSearchRadioButtons = !isSearching && !panel.getPlugin()?.fieldConfigRegistry.isEmpty(); return ( <> {!isVizPickerOpen && ( @@ -123,6 +133,14 @@ export class PanelOptionsPane extends SceneObjectBase { placeholder="Search options" onChange={model.onSetSearchQuery} /> + {showSearchRadioButtons && ( + + )} {isAngularPanel && (