Added rehype-raw to render HTML in markdown

package.json

@@ -43,6 +43,7 @@
     "redux-devtools-dock-monitor": "^1.2.0",
     "redux-devtools-log-monitor": "^1.4.0",
     "redux-thunk": "^2.3.0",
+    "rehype-raw": "^6.1.1",
     "sendmail": "^1.6.1",
     "webpack": "^4.46.0",
     "webpack-cli": "^3.3.12"

src/components/pages/patron_list.jsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import ReactMarkdown from 'react-markdown/with-html';
 
 //panels
 import CommonLinks from '../panels/common_links.jsx';

src/components/pages/task_list.jsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import ReactMarkdown from 'react-markdown/with-html';
 
 //panels
 import CommonLinks from '../panels/common_links.jsx';

src/components/panels/markdown.jsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import ReactMarkdown from 'react-markdown/with-html';
+import ReactMarkdown from 'react-markdown';
+import rehypeRaw from 'rehype-raw';
 
 class Markdown extends React.Component {
 	constructor(props) {
@@ -20,7 +21,7 @@ class Markdown extends React.Component {
 
 	render() {
 		if (this.state.data) {
-			return (<ReactMarkdown source={this.state.data} escapeHtml={false} {...this.props} />);
+			return (<ReactMarkdown source={this.state.data} rehypePlugins={[rehypeRaw]} {...this.props} />);
 		} else {
 			return (<p className='centered'>Loading markdown...</p>);
 		}

src/components/panels/news.jsx

@@ -1,5 +1,6 @@
 import React from 'react';
-import ReactMarkdown from 'react-markdown/with-html';
+import ReactMarkdown from 'react-markdown';
+import rehypeRaw from 'rehype-raw';
 import PropTypes from 'prop-types';
 
 class News extends React.Component {
@@ -19,7 +20,7 @@ class News extends React.Component {
 		return (
 			<div className='panel'>
 				{Object.keys(this.state).map((key) => <div key={key}>
-					<ReactMarkdown source={this.state[key]} escapeHtml={false} />
+					<ReactMarkdown source={this.state[key]} rehypePlugins={[rehypeRaw]} />
 					<hr className='newsLine' />
 				</div>)}
 			</div>