diff --git a/wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentItem.js b/wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentItem.js
index 01d99b350a1b987caa8ca4aaf346d59cb6c6f48f..3607a3cac6c49221e633c3cdba17916c4ce01d27 100644
--- a/wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentItem.js
+++ b/wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentItem.js
@@ -37,11 +37,10 @@ const Content = styled.div`
`;
const CommentItem = props => {
- const { className, content, displayName, timestamp } = props;
-
+ const { className, content, displayName, timestamp, active } = props;
return (
- <Wrapper className={className}>
- <Head>
+ <Wrapper active={active} className={className}>
+ <Head active={active}>
<Name>{displayName}</Name>
<Timestamp>
<DateParser timestamp={timestamp}>
@@ -51,12 +50,13 @@ const CommentItem = props => {
</DateParser>
</Timestamp>
</Head>
- <Content>{content}</Content>
+ <Content active={active}>{content}</Content>
</Wrapper>
);
};
CommentItem.propTypes = {
+ active: PropTypes.bool,
/** Actual comment text */
content: PropTypes.string.isRequired,
/** Display name of user that made the comment */
@@ -65,6 +65,8 @@ CommentItem.propTypes = {
timestamp: PropTypes.number.isRequired,
};
-CommentItem.defaultProps = {};
+CommentItem.defaultProps = {
+ active: false,
+};
export default CommentItem;
diff --git a/wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentItemList.js b/wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentItemList.js
index 5fa5bca2f8572b47abcce1ff66aeb695862b1f46..2f1aff65926896758a2701085a2594f578506d4d 100644
--- a/wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentItemList.js
+++ b/wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentItemList.js
@@ -51,6 +51,7 @@ const CommentItemList = props => {
<Wrapper active={active} className={className}>
{items.map(item => (
<CommentItem
+ active={active}
content={item.content}
displayName={item.displayName}
key={uniqueId('comment-item-')}