mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Revert: Scenes/PanelEditor: Fix panel options search crash 82003 (#82439)
This commit is contained in:
parent
44ecb26ea1
commit
04005d770b
@ -5,7 +5,7 @@ import { GrafanaTheme2 } from '@grafana/data';
|
|||||||
import { selectors } from '@grafana/e2e-selectors';
|
import { selectors } from '@grafana/e2e-selectors';
|
||||||
import { SceneComponentProps, SceneObjectBase, SceneObjectState, sceneGraph } from '@grafana/scenes';
|
import { SceneComponentProps, SceneObjectBase, SceneObjectState, sceneGraph } from '@grafana/scenes';
|
||||||
import { Box, ButtonGroup, FilterInput, RadioButtonGroup, ToolbarButton, useStyles2 } from '@grafana/ui';
|
import { Box, ButtonGroup, FilterInput, RadioButtonGroup, ToolbarButton, useStyles2 } from '@grafana/ui';
|
||||||
import { OptionFilter, RenderSearchHits } from 'app/features/dashboard/components/PanelEditor/OptionsPaneOptions';
|
import { OptionFilter, renderSearchHits } from 'app/features/dashboard/components/PanelEditor/OptionsPaneOptions';
|
||||||
import { getFieldOverrideCategories } from 'app/features/dashboard/components/PanelEditor/getFieldOverrideElements';
|
import { getFieldOverrideCategories } from 'app/features/dashboard/components/PanelEditor/getFieldOverrideElements';
|
||||||
import { getPanelFrameCategory2 } from 'app/features/dashboard/components/PanelEditor/getPanelFrameOptions';
|
import { getPanelFrameCategory2 } from 'app/features/dashboard/components/PanelEditor/getPanelFrameOptions';
|
||||||
import { getVisualizationOptions2 } from 'app/features/dashboard/components/PanelEditor/getVisualizationOptions';
|
import { getVisualizationOptions2 } from 'app/features/dashboard/components/PanelEditor/getVisualizationOptions';
|
||||||
@ -97,29 +97,24 @@ export class PanelOptionsPane extends SceneObjectBase<PanelOptionsPaneState> {
|
|||||||
|
|
||||||
if (isSearching) {
|
if (isSearching) {
|
||||||
mainBoxElements.push(
|
mainBoxElements.push(
|
||||||
<RenderSearchHits
|
renderSearchHits([panelFrameOptions, ...(visualizationOptions ?? [])], justOverrides, searchQuery)
|
||||||
allOptions={[panelFrameOptions, ...(visualizationOptions ?? [])]}
|
|
||||||
overrides={justOverrides}
|
|
||||||
searchQuery={searchQuery}
|
|
||||||
key="render-search-hits"
|
|
||||||
/>
|
|
||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
switch (listMode) {
|
switch (listMode) {
|
||||||
case OptionFilter.All:
|
case OptionFilter.All:
|
||||||
mainBoxElements.push(<panelFrameOptions.Render key="panel-frame-options" />);
|
mainBoxElements.push(panelFrameOptions.render());
|
||||||
|
|
||||||
for (const item of visualizationOptions ?? []) {
|
for (const item of visualizationOptions ?? []) {
|
||||||
mainBoxElements.push(<item.Render key={item.props.id} />);
|
mainBoxElements.push(item.render());
|
||||||
}
|
}
|
||||||
|
|
||||||
for (const item of justOverrides) {
|
for (const item of justOverrides) {
|
||||||
mainBoxElements.push(<item.Render key={item.props.id} />);
|
mainBoxElements.push(item.render());
|
||||||
}
|
}
|
||||||
break;
|
break;
|
||||||
case OptionFilter.Overrides:
|
case OptionFilter.Overrides:
|
||||||
for (const item of justOverrides) {
|
for (const item of justOverrides) {
|
||||||
mainBoxElements.push(<item.Render key={item.props.id} />);
|
mainBoxElements.push(item.render());
|
||||||
}
|
}
|
||||||
default:
|
default:
|
||||||
break;
|
break;
|
||||||
|
@ -52,7 +52,7 @@ export class OptionsPaneCategoryDescriptor {
|
|||||||
return sub;
|
return sub;
|
||||||
}
|
}
|
||||||
|
|
||||||
Render = ({ searchQuery }: { searchQuery?: string }) => {
|
render(searchQuery?: string) {
|
||||||
if (this.props.customRender) {
|
if (this.props.customRender) {
|
||||||
return this.props.customRender();
|
return this.props.customRender();
|
||||||
}
|
}
|
||||||
@ -60,10 +60,8 @@ export class OptionsPaneCategoryDescriptor {
|
|||||||
return (
|
return (
|
||||||
<OptionsPaneCategory key={this.props.title} {...this.props}>
|
<OptionsPaneCategory key={this.props.title} {...this.props}>
|
||||||
{this.items.map((item) => item.render(searchQuery))}
|
{this.items.map((item) => item.render(searchQuery))}
|
||||||
{this.categories.map((category) => (
|
{this.categories.map((category) => category.render(searchQuery))}
|
||||||
<category.Render key={category.props.id} searchQuery={searchQuery} />
|
|
||||||
))}
|
|
||||||
</OptionsPaneCategory>
|
</OptionsPaneCategory>
|
||||||
);
|
);
|
||||||
};
|
}
|
||||||
}
|
}
|
||||||
|
@ -54,14 +54,7 @@ export const OptionsPaneOptions = (props: OptionPaneRenderProps) => {
|
|||||||
: [panelFrameOptions, ...vizOptions];
|
: [panelFrameOptions, ...vizOptions];
|
||||||
|
|
||||||
if (isSearching) {
|
if (isSearching) {
|
||||||
mainBoxElements.push(
|
mainBoxElements.push(renderSearchHits(allOptions, justOverrides, searchQuery));
|
||||||
<RenderSearchHits
|
|
||||||
key="render-search-hits"
|
|
||||||
allOptions={allOptions}
|
|
||||||
overrides={justOverrides}
|
|
||||||
searchQuery={searchQuery}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
|
|
||||||
// If searching for angular panel, then we need to add notice that results are limited
|
// If searching for angular panel, then we need to add notice that results are limited
|
||||||
if (props.plugin.angularPanelCtrl) {
|
if (props.plugin.angularPanelCtrl) {
|
||||||
@ -76,10 +69,10 @@ export const OptionsPaneOptions = (props: OptionPaneRenderProps) => {
|
|||||||
case OptionFilter.All:
|
case OptionFilter.All:
|
||||||
if (isPanelModelLibraryPanel(panel)) {
|
if (isPanelModelLibraryPanel(panel)) {
|
||||||
// Library Panel options first
|
// Library Panel options first
|
||||||
mainBoxElements.push(<libraryPanelOptions.Render key="library-panel-options" />);
|
mainBoxElements.push(libraryPanelOptions.render());
|
||||||
}
|
}
|
||||||
// Panel frame options second
|
// Panel frame options second
|
||||||
mainBoxElements.push(<panelFrameOptions.Render key="panel-frame-options" />);
|
mainBoxElements.push(panelFrameOptions.render());
|
||||||
// If angular add those options next
|
// If angular add those options next
|
||||||
if (props.plugin.angularPanelCtrl) {
|
if (props.plugin.angularPanelCtrl) {
|
||||||
mainBoxElements.push(
|
mainBoxElements.push(
|
||||||
@ -88,16 +81,16 @@ export const OptionsPaneOptions = (props: OptionPaneRenderProps) => {
|
|||||||
}
|
}
|
||||||
// Then add all panel and field defaults
|
// Then add all panel and field defaults
|
||||||
for (const item of vizOptions) {
|
for (const item of vizOptions) {
|
||||||
mainBoxElements.push(<item.Render key={item.props.id} />);
|
mainBoxElements.push(item.render());
|
||||||
}
|
}
|
||||||
|
|
||||||
for (const item of justOverrides) {
|
for (const item of justOverrides) {
|
||||||
mainBoxElements.push(<item.Render key={item.props.id} />);
|
mainBoxElements.push(item.render());
|
||||||
}
|
}
|
||||||
break;
|
break;
|
||||||
case OptionFilter.Overrides:
|
case OptionFilter.Overrides:
|
||||||
for (const override of justOverrides) {
|
for (const override of justOverrides) {
|
||||||
mainBoxElements.push(<override.Render key={override.props.id} />);
|
mainBoxElements.push(override.render());
|
||||||
}
|
}
|
||||||
break;
|
break;
|
||||||
case OptionFilter.Recent:
|
case OptionFilter.Recent:
|
||||||
@ -157,13 +150,11 @@ export enum OptionFilter {
|
|||||||
Recent = 'Recent',
|
Recent = 'Recent',
|
||||||
}
|
}
|
||||||
|
|
||||||
interface RenderSearchHitsProps {
|
export function renderSearchHits(
|
||||||
allOptions: OptionsPaneCategoryDescriptor[];
|
allOptions: OptionsPaneCategoryDescriptor[],
|
||||||
overrides: OptionsPaneCategoryDescriptor[];
|
overrides: OptionsPaneCategoryDescriptor[],
|
||||||
searchQuery: string;
|
searchQuery: string
|
||||||
}
|
) {
|
||||||
|
|
||||||
export function RenderSearchHits({ allOptions, overrides, searchQuery }: RenderSearchHitsProps) {
|
|
||||||
const engine = new OptionSearchEngine(allOptions, overrides);
|
const engine = new OptionSearchEngine(allOptions, overrides);
|
||||||
const { optionHits, totalCount, overrideHits } = engine.search(searchQuery);
|
const { optionHits, totalCount, overrideHits } = engine.search(searchQuery);
|
||||||
|
|
||||||
@ -177,9 +168,7 @@ export function RenderSearchHits({ allOptions, overrides, searchQuery }: RenderS
|
|||||||
>
|
>
|
||||||
{optionHits.map((hit) => hit.render(searchQuery))}
|
{optionHits.map((hit) => hit.render(searchQuery))}
|
||||||
</OptionsPaneCategory>
|
</OptionsPaneCategory>
|
||||||
{overrideHits.map((override) => (
|
{overrideHits.map((override) => override.render(searchQuery))}
|
||||||
<override.Render key={override.props.id} searchQuery={searchQuery} />
|
|
||||||
))}
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user