mirror of https://github.com/grafana/grafana
parent
cfae98fae2
commit
cda7897323
@ -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