mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
started with component for generic panel help
This commit is contained in:
parent
cfae98fae2
commit
cda7897323
59
public/app/core/components/PanelHelp/PanelHelp.tsx
Normal file
59
public/app/core/components/PanelHelp/PanelHelp.tsx
Normal file
@ -0,0 +1,59 @@
|
||||
import React, { PureComponent } from 'react';
|
||||
import Remarkable from 'remarkable';
|
||||
import { getBackendSrv } from '../../services/backend_srv';
|
||||
import { DataSource } from 'app/types';
|
||||
|
||||
interface Props {
|
||||
dataSource: DataSource;
|
||||
type: string;
|
||||
}
|
||||
|
||||
interface State {
|
||||
isError: boolean;
|
||||
isLoading: boolean;
|
||||
help: any;
|
||||
}
|
||||
|
||||
export default class PanelHelp extends PureComponent<Props, State> {
|
||||
componentDidMount(): void {
|
||||
this.loadHelp();
|
||||
}
|
||||
|
||||
loadHelp = () => {
|
||||
const { dataSource, type } = this.props;
|
||||
this.setState({ isLoading: true });
|
||||
|
||||
getBackendSrv()
|
||||
.get(`/api/plugins/${dataSource.meta.id}/markdown/${type}`)
|
||||
.then(response => {
|
||||
const markdown = new Remarkable();
|
||||
const helpHtml = markdown.render(response);
|
||||
|
||||
this.setState({
|
||||
isError: false,
|
||||
isLoading: false,
|
||||
help: helpHtml,
|
||||
});
|
||||
})
|
||||
.catch(() => {
|
||||
this.setState({
|
||||
isError: true,
|
||||
isLoading: false,
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
render() {
|
||||
const { isError, isLoading, help } = this.state;
|
||||
|
||||
if (isLoading) {
|
||||
return <h2>Loading help...</h2>;
|
||||
}
|
||||
|
||||
if (isError) {
|
||||
return <h3>'Error occurred when loading help'</h3>;
|
||||
}
|
||||
|
||||
return <div className="markdown-html" dangerouslySetInnerHTML={{ __html: help }} />;
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue
Block a user