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) => { >
- {topicSubject || ( - - - - )} + {topicSubject + ? ( + + ) + : ( + + + + )}