wip: minor progress on DataPanel

This commit is contained in:
Torkel Ödegaard committed 2018-07-01 17:34:42 +02:00
1 parent 682c792dfb
commit ab9e1b35cd
2 files changed
+80 -2

No files matched your search

@@ -9,13 +9,13 @@ import { PanelEditor } from './PanelEditor';
const TITLE_HEIGHT = 27;
const PANEL_BORDER = 2;
export interface PanelChromeProps {
export interface Props {
panel: PanelModel;
dashboard: DashboardModel;
component: any;
}
export class PanelChrome extends React.Component<PanelChromeProps, any> {
export class PanelChrome extends React.Component<Props, any> {
constructor(props) {
super(props);
+78
View File
@@ -0,0 +1,78 @@
import React, { Component, ComponentClass } from 'react';
export interface OuterProps {
type: string;
queries: any[];
isVisible: boolean;
}
export interface AddedProps {
data: any[];
}
interface State {
isLoading: boolean;
data: any[];
}
const DataPanel = (ComposedComponent: ComponentClass<AddedProps & OuterProps>) => {
class Wrapper extends Component<OuterProps, State> {
public static defaultProps = {
isVisible: true,
};
constructor(props: OuterProps) {
super(props);
this.state = {
isLoading: false,
data: [],
};
}
public componentDidMount() {
this.issueQueries();
}
public issueQueries = () => {
const { queries, isVisible } = this.props;
if (!isVisible) {
return;
}
if (!queries.length) {
this.setState({ data: [{ message: 'no queries' }] });
return;
}
this.setState({ isLoading: true });
};
public render() {
const { data, isLoading } = this.state;
if (!data.length) {
return (
<div className="no-data">
<p>No Data</p>
</div>
);
}
if (isLoading) {
return (
<div className="loading">
<p>Loading</p>
</div>
);
}
return <ComposedComponent {...this.props} data={data} />;
}
}
return Wrapper;
};
export default DataPanel;