|
|
@@ -22,10 +22,13 @@ export interface AddPanelPanelState {
|
|
|
}
|
|
|
|
|
|
export class AddPanelPanel extends React.Component<AddPanelPanelProps, AddPanelPanelState> {
|
|
|
+ private scrollbar: ScrollBar;
|
|
|
+
|
|
|
constructor(props) {
|
|
|
super(props);
|
|
|
this.handleCloseAddPanel = this.handleCloseAddPanel.bind(this);
|
|
|
this.renderPanelItem = this.renderPanelItem.bind(this);
|
|
|
+ this.panelSizeChanged = this.panelSizeChanged.bind(this);
|
|
|
|
|
|
this.state = {
|
|
|
panelPlugins: this.getPanelPlugins(''),
|
|
|
@@ -35,6 +38,20 @@ export class AddPanelPanel extends React.Component<AddPanelPanelProps, AddPanelP
|
|
|
};
|
|
|
}
|
|
|
|
|
|
+ componentDidMount() {
|
|
|
+ this.props.panel.events.on('panel-size-changed', this.panelSizeChanged);
|
|
|
+ }
|
|
|
+
|
|
|
+ componentWillUnmount() {
|
|
|
+ this.props.panel.events.off('panel-size-changed', this.panelSizeChanged);
|
|
|
+ }
|
|
|
+
|
|
|
+ panelSizeChanged() {
|
|
|
+ setTimeout(() => {
|
|
|
+ this.scrollbar.update();
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
getPanelPlugins(filter) {
|
|
|
let panels = _.chain(config.panels)
|
|
|
.filter({ hideFromList: false })
|
|
|
@@ -207,7 +224,7 @@ export class AddPanelPanel extends React.Component<AddPanelPanelProps, AddPanelP
|
|
|
<i className="fa fa-close" />
|
|
|
</button>
|
|
|
</div>
|
|
|
- <ScrollBar className="add-panel__items">
|
|
|
+ <ScrollBar ref={element => (this.scrollbar = element)} className="add-panel__items">
|
|
|
<div className="add-panel__searchbar">
|
|
|
<label className="gf-form gf-form--grow gf-form--has-input-icon">
|
|
|
<input
|