IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Closing timepicker when clicking outside the picker

Browse Source
This commit is contained in:
Hugo Häggmark 2019-02-05 15:41:00 +01:00
parent a344091d82
commit e42b670f5c
1 changed files with 8 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
public/app/features/explore/ExploreToolbar.tsx
View File

@ -8,6 +8,7 @@ import { DataSourcePicker } from 'app/core/components/Select/DataSourcePicker';
import { StoreState } from 'app/types/store'; import { StoreState } from 'app/types/store';
import { changeDatasource, clearQueries, splitClose, runQueries, splitOpen } from './state/actions'; import { changeDatasource, clearQueries, splitClose, runQueries, splitOpen } from './state/actions';
import TimePicker from './TimePicker'; import TimePicker from './TimePicker';
import { ClickOutsideWrapper } from 'app/core/components/ClickOutsideWrapper/ClickOutsideWrapper';
enum IconSide { enum IconSide {
left = 'left', left = 'left',
@ -79,6 +80,10 @@ export class UnConnectedExploreToolbar extends PureComponent<Props, {}> {
this.props.runQuery(this.props.exploreId); this.props.runQuery(this.props.exploreId);
}; };
onCloseTimePicker = () => {
this.props.timepickerRef.current.setState({ isOpen: false });
};
render() { render() {
const { const {
datasourceMissing, datasourceMissing,
@ -137,7 +142,9 @@ export class UnConnectedExploreToolbar extends PureComponent<Props, {}> {
</div> </div>
) : null} ) : null}
<div className="explore-toolbar-content-item timepicker"> <div className="explore-toolbar-content-item timepicker">
<TimePicker ref={timepickerRef} range={range} onChangeTime={this.props.onChangeTime} /> <ClickOutsideWrapper onClick={this.onCloseTimePicker}>
<TimePicker ref={timepickerRef} range={range} onChangeTime={this.props.onChangeTime} />
</ClickOutsideWrapper>
</div> </div>
<div className="explore-toolbar-content-item"> <div className="explore-toolbar-content-item">
<button className="btn navbar-button navbar-button--no-icon" onClick={this.onClearAll}> <button className="btn navbar-button navbar-button--no-icon" onClick={this.onClearAll}>