diff --git a/client/coral-admin/src/components/CommentBodyHighlighter.js b/client/coral-admin/src/components/CommentFormatter.js
similarity index 63%
rename from client/coral-admin/src/components/CommentBodyHighlighter.js
rename to client/coral-admin/src/components/CommentFormatter.js
index 9e381bf0b..6c086b6aa 100644
--- a/client/coral-admin/src/components/CommentBodyHighlighter.js
+++ b/client/coral-admin/src/components/CommentFormatter.js
@@ -1,4 +1,5 @@
import React from 'react';
+import PropTypes from 'prop-types';
import { matchLinks } from '../utils';
import memoize from 'lodash/memoize';
@@ -62,16 +63,43 @@ function markLinks(body) {
return content;
}
-export default ({ suspectWords, bannedWords, body, ...rest }) => {
- // First highlight links.
- const content = markLinks(body).map((element, index) => {
- // Keep highlighted links.
- if (typeof element !== 'string') {
- return element;
- }
+function format(body, { suspectWords, bannedWords, className = 'comment' }) {
+ // Breaking the body by line break
+ const textbreaks = body.split('\n');
- // Highlight suspect and banned phrase inside this part of text.
- return markPhrases(element, suspectWords, bannedWords, index);
- });
- return
{content}
;
+ return (
+
+ {textbreaks.map((line, i) => {
+ const content = markLinks(line).map((element, index) => {
+ // Keep highlighted links.
+ if (typeof element !== 'string') {
+ return element;
+ }
+
+ // Highlight suspect and banned phrase inside this part of text.
+ return markPhrases(element, suspectWords, bannedWords, index);
+ });
+
+ return (
+
+ {content}
+ {i !== textbreaks.length - 1 && (
+
+ )}
+
+ );
+ })}
+
+ );
+}
+
+const CommentFormatter = ({ body, settings, ...rest }) => {
+ return {format(body, settings)}
;
};
+
+CommentFormatter.propTypes = {
+ settings: PropTypes.object,
+ body: PropTypes.string,
+};
+
+export default CommentFormatter;
diff --git a/client/coral-admin/src/routes/Moderation/components/Comment.js b/client/coral-admin/src/routes/Moderation/components/Comment.js
index fc6894a46..504c3e04d 100644
--- a/client/coral-admin/src/routes/Moderation/components/Comment.js
+++ b/client/coral-admin/src/routes/Moderation/components/Comment.js
@@ -8,7 +8,7 @@ import styles from './Comment.css';
import CommentLabels from 'coral-admin/src/components/CommentLabels';
import CommentAnimatedEdit from 'coral-admin/src/components/CommentAnimatedEdit';
import Slot from 'coral-framework/components/Slot';
-import CommentBodyHighlighter from 'coral-admin/src/components/CommentBodyHighlighter';
+import CommentFormatter from 'coral-admin/src/components/CommentFormatter';
import IfHasLink from 'coral-admin/src/components/IfHasLink';
import cn from 'classnames';
import ApproveButton from 'coral-admin/src/components/ApproveButton';
@@ -126,11 +126,14 @@ class Comment extends React.Component {