grafana/public/app/features/explore/Panel.tsx
Marcus Efraimsson 1a80885180
explore: fix issues when loading and both graph/table are collapsed (#17113)
Removes the functionality of being able to collapse/expand the logs 
container.
When both graph and table are collapsed and you reload the page 
then the start page should not be displayed.
When both graph and table are collapsed and you reload the page 
then the graph and table panels should be displayed.
Fix so that reducer tests are run. On of the test used fit() instead of 
it() which had the consequence of only 1 reducer test was executed 
and the rest skipped. There was some failing tests that now is 
updated and now passes.

Fixes #17098
2019-05-17 12:45:11 +02:00

44 lines
1.3 KiB
TypeScript

import React, { PureComponent } from 'react';
interface Props {
isOpen: boolean;
label: string;
loading?: boolean;
collapsible?: boolean;
onToggle?: (isOpen: boolean) => void;
}
export default class Panel extends PureComponent<Props> {
onClickToggle = () => {
const { onToggle, isOpen } = this.props;
if (onToggle) {
onToggle(!isOpen);
}
};
render() {
const { isOpen, loading, collapsible } = this.props;
const panelClass = collapsible
? 'explore-panel explore-panel--collapsible panel-container'
: 'explore-panel panel-container';
const iconClass = isOpen ? 'fa fa-caret-up' : 'fa fa-caret-down';
const loaderClass = loading ? 'explore-panel__loader explore-panel__loader--active' : 'explore-panel__loader';
return (
<div className={panelClass}>
<div className="explore-panel__header" onClick={this.onClickToggle}>
<div className="explore-panel__header-buttons">
<span className={iconClass} />
</div>
<div className="explore-panel__header-label">{this.props.label}</div>
</div>
{isOpen && (
<div className="explore-panel__body">
<div className={loaderClass} />
{this.props.children}
</div>
)}
</div>
);
}
}