Panel Inspect: Fix crash when transform removes selected data frame (#25924)

This commit is contained in:
Tobias Skarhed 2020-07-01 08:53:29 +02:00 committed by GitHub
parent 199f772bcf
commit 07df165b86
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -131,6 +131,14 @@ export class InspectDataTab extends PureComponent<Props, State> {
data = this.getTransformedData();
}
// In case the transform removes the currently selected data frame
if (!data[this.state.dataFrameIndex]) {
this.setState({
dataFrameIndex: 0,
selectedDataFrame: 0,
});
}
// We need to apply field config even though it was already applied in the PanelQueryRunner.
// That's because transformers create new fields and data frames, so i.e. display processor is no longer there
return applyFieldOverrides({
@ -147,6 +155,7 @@ export class InspectDataTab extends PureComponent<Props, State> {
getActiveString = () => {
const { selectedDataFrame } = this.state;
const { options, data } = this.props;
let activeString = '';
if (selectedDataFrame === DataTransformerID.seriesToColumns) {
activeString = 'series joined by time';
@ -173,6 +182,7 @@ export class InspectDataTab extends PureComponent<Props, State> {
renderDataOptions = (dataFrames: DataFrame[]) => {
const { options, onOptionsChange, panel, data } = this.props;
const { transformId, transformationOptions, selectedDataFrame } = this.state;
const styles = getPanelInspectorStyles();
const panelTransformations = panel.getTransformations();
@ -207,21 +217,21 @@ export class InspectDataTab extends PureComponent<Props, State> {
>
<div className={styles.options}>
<VerticalGroup spacing="lg">
{data.length > 1 && (
<Field
label="Show data frame"
className={css`
margin-bottom: 0;
`}
>
<Select
options={selectableOptions}
value={selectedDataFrame}
onChange={this.onDataFrameChange}
width={30}
/>
</Field>
)}
<Field
label="Show data frame"
className={css`
margin-bottom: 0;
`}
disabled={!(data.length > 1)}
>
<Select
options={selectableOptions}
value={selectedDataFrame}
onChange={this.onDataFrameChange}
width={30}
/>
</Field>
<HorizontalGroup>
{showPanelTransformationsOption && (
<Field
@ -271,6 +281,10 @@ export class InspectDataTab extends PureComponent<Props, State> {
return <div>No Data</div>;
}
if (!dataFrames[dataFrameIndex]) {
return <div>Could not find the Data Frame</div>;
}
return (
<div className={styles.dataTabContent} aria-label={selectors.components.PanelInspector.Data.content}>
<div className={styles.actionsWrapper}>