diff --git a/packages/concordia-app/src/components/PostList/PostListRow/index.jsx b/packages/concordia-app/src/components/PostList/PostListRow/index.jsx
index cccc576..b27cf8a 100644
--- a/packages/concordia-app/src/components/PostList/PostListRow/index.jsx
+++ b/packages/concordia-app/src/components/PostList/PostListRow/index.jsx
@@ -7,6 +7,7 @@ import {
import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import TimeAgo from 'react-timeago';
+import ReactMarkdown from 'react-markdown';
import { useDispatch, useSelector } from 'react-redux';
import { Link } from 'react-router-dom';
import { FORUM_CONTRACT } from 'concordia-shared/src/constants/contracts/ContractNames';
@@ -18,6 +19,7 @@ import determineKVAddress from '../../../utils/orbitUtils';
import { POST_CONTENT } from '../../../constants/orbit/PostsDatabaseKeys';
import ProfileImage from '../../ProfileImage';
import PostVoting from '../PostVoting';
+import targetBlank from '../../../utils/markdownUtils';
const { orbit } = breeze;
@@ -136,7 +138,15 @@ const PostListRow = (props) => {
{postContent !== null
- ? postContent
+ ? (
+
+ )
: }
diff --git a/packages/concordia-app/src/components/TopicList/TopicListRow/index.jsx b/packages/concordia-app/src/components/TopicList/TopicListRow/index.jsx
index 5fffc4a..f6b323c 100644
--- a/packages/concordia-app/src/components/TopicList/TopicListRow/index.jsx
+++ b/packages/concordia-app/src/components/TopicList/TopicListRow/index.jsx
@@ -7,6 +7,7 @@ import {
import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import TimeAgo from 'react-timeago';
+import ReactMarkdown from 'react-markdown';
import { useHistory } from 'react-router';
import { useDispatch, useSelector } from 'react-redux';
import { Link } from 'react-router-dom';
@@ -18,6 +19,7 @@ import { breeze } from '../../../redux/store';
import './styles.css';
import determineKVAddress from '../../../utils/orbitUtils';
import { TOPIC_SUBJECT } from '../../../constants/orbit/TopicsDatabaseKeys';
+import targetBlank from '../../../utils/markdownUtils';
const { orbit } = breeze;
@@ -118,7 +120,15 @@ const TopicListRow = (props) => {
{topicSubject !== null
- ? topicSubject
+ ? (
+
+ )
: }
diff --git a/packages/concordia-app/src/utils/markdownUtils.jsx b/packages/concordia-app/src/utils/markdownUtils.jsx
new file mode 100644
index 0000000..85660db
--- /dev/null
+++ b/packages/concordia-app/src/utils/markdownUtils.jsx
@@ -0,0 +1,9 @@
+import React from 'react';
+
+const targetBlank = () => ({ href, children }) => (
+
+ {children}
+
+);
+
+export default targetBlank;
diff --git a/packages/concordia-app/src/views/About/index.jsx b/packages/concordia-app/src/views/About/index.jsx
index 52ed3c9..3ad7e09 100644
--- a/packages/concordia-app/src/views/About/index.jsx
+++ b/packages/concordia-app/src/views/About/index.jsx
@@ -5,15 +5,10 @@ import ReactMarkdown from 'react-markdown';
import { Container, Image, Segment } from 'semantic-ui-react';
import AboutMd from '../../assets/About.md';
import appLogo from '../../assets/images/app_logo_circle.svg';
+import targetBlank from '../../utils/markdownUtils';
import './styles.css';
-const targetBlank = () => ({ href, children }) => (
-
- {children}
-
-);
-
const About = () => {
const [aboutMd, setAboutMd] = useState('');
diff --git a/packages/concordia-app/src/views/Topic/TopicView/index.jsx b/packages/concordia-app/src/views/Topic/TopicView/index.jsx
index a602db3..99c0e2e 100644
--- a/packages/concordia-app/src/views/Topic/TopicView/index.jsx
+++ b/packages/concordia-app/src/views/Topic/TopicView/index.jsx
@@ -8,6 +8,7 @@ import { Link } from 'react-router-dom';
import { useHistory } from 'react-router';
import { FORUM_CONTRACT } from 'concordia-shared/src/constants/contracts/ContractNames';
import { TOPICS_DATABASE, USER_DATABASE } from 'concordia-shared/src/constants/orbit/OrbitDatabases';
+import ReactMarkdown from 'react-markdown';
import { breeze, drizzle } from '../../../redux/store';
import { FETCH_USER_DATABASE } from '../../../redux/actions/peerDbReplicationActions';
import './styles.css';
@@ -15,6 +16,7 @@ import TopicPostList from './TopicPostList';
import determineKVAddress from '../../../utils/orbitUtils';
import { TOPIC_SUBJECT } from '../../../constants/orbit/TopicsDatabaseKeys';
import PostCreate from '../../../components/PostCreate';
+import targetBlank from '../../../utils/markdownUtils';
const { contracts: { [FORUM_CONTRACT]: { methods: { getTopic: { cacheCall: getTopicChainData } } } } } = drizzle;
const { orbit } = breeze;
@@ -122,11 +124,21 @@ const TopicView = (props) => {
>