RepoMirrors/prometheus
1
0
Fork 0
mirror of https://github.com/prometheus/prometheus synced 2024-12-26 08:33:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

React UI: broken graph page browser history (#6659)

Browse Source 
* add panel state for the expression input

Signed-off-by: blalov <boiskila@gmail.com>

* remove redundant test

Signed-off-by: blalov <boiskila@gmail.com>
This commit is contained in:
Boyko 2020-01-19 01:40:25 +03:00 committed by Julius Volz
parent 669592a2c4
commit 0f84d5b2cf
3 changed files with 9 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
web/ui/react-app/src/pages/graph/Panel.tsx
View File

@ -28,6 +28,7 @@ interface PanelState {
loading: boolean;
error: string | null;
stats: QueryStats | null;
exprInputValue: string;
}
export interface PanelOptions {
@ -65,6 +66,7 @@ class Panel extends Component<PanelProps & PathPrefixProps, PanelState> {
loading: false,
error: null,
stats: null,
exprInputValue: props.options.expr,
};
}
@ -85,9 +87,12 @@ class Panel extends Component<PanelProps & PathPrefixProps, PanelState> {
}
executeQuery = (): void => {
const { expr } = this.props.options;
const { exprInputValue: expr } = this.state;
const queryStart = Date.now();
this.props.onExecuteQuery(expr);
if (this.props.options.expr !== expr) {
this.setOptions({ expr });
}
if (expr === '') {
return;
}
@ -177,7 +182,7 @@ class Panel extends Component<PanelProps & PathPrefixProps, PanelState> {
}
handleExpressionChange = (expr: string): void => {
this.setOptions({ expr: expr });
this.setState({ exprInputValue: expr });
};
handleChangeRange = (range: number): void => {
@ -215,7 +220,7 @@ class Panel extends Component<PanelProps & PathPrefixProps, PanelState> {
<Row>
<Col>
<ExpressionInput
value={options.expr}
value={this.state.exprInputValue}
onExpressionChange={this.handleExpressionChange}
executeQuery={this.executeQuery}
loading={this.state.loading}

8
web/ui/react-app/src/pages/graph/PanelList.test.tsx
View File

@ -37,12 +37,4 @@ describe('PanelList', () => {
expect(btn.prop('color')).toEqual('primary');
expect(btn.children().text()).toEqual('Add Panel');
});
it('updates URL when a query is executed', () => {
const panelList = mount(<PanelList />);
const instance: any = panelList.instance();
const updateURLSpy = jest.spyOn(instance, 'updateURL');
instance.handleExecuteQuery('new');
expect(updateURLSpy).toHaveBeenCalledTimes(1);
});
});

3
web/ui/react-app/src/pages/graph/PanelList.tsx
View File

@ -109,7 +109,6 @@ class PanelList extends Component<RouteComponentProps & PathPrefixProps, PanelLi
);
localStorage.setItem('history', JSON.stringify(extendedItems.slice(0, 50)));
this.updatePastQueries();
this.updateURL();
};
updateURL() {
@ -119,7 +118,7 @@ class PanelList extends Component<RouteComponentProps & PathPrefixProps, PanelLi
handleOptionsChanged = (id: string, options: PanelOptions) => {
const updatedPanels = this.state.panels.map(p => (id === p.id ? { ...p, options } : p));
this.setState({ panels: updatedPanels });
this.setState({ panels: updatedPanels }, this.updateURL);
};
addPanel = () => {