diff --git a/src/discussions/comments/comment/CommentHeader.jsx b/src/discussions/comments/comment/CommentHeader.jsx
index 7a84e69f..737e2e11 100644
--- a/src/discussions/comments/comment/CommentHeader.jsx
+++ b/src/discussions/comments/comment/CommentHeader.jsx
@@ -4,7 +4,8 @@ import PropTypes from 'prop-types';
import { useSelector } from 'react-redux';
import { injectIntl } from '@edx/frontend-platform/i18n';
-import { Avatar } from '@edx/paragon';
+import { Avatar, Icon } from '@edx/paragon';
+import { CheckCircle, Verified } from '@edx/paragon/icons';
import { ThreadType } from '../../../data/constants';
import { AuthorLabel } from '../../common';
@@ -24,13 +25,18 @@ function CommentHeader({
-
+
+ {comment.endorsed && (postType === 'question'
+ ?
+ :
)}
+
+
);
}
diff --git a/src/discussions/comments/comment/CommentHeader.test.jsx b/src/discussions/comments/comment/CommentHeader.test.jsx
new file mode 100644
index 00000000..ddfc177c
--- /dev/null
+++ b/src/discussions/comments/comment/CommentHeader.test.jsx
@@ -0,0 +1,52 @@
+import React from 'react';
+
+import { render, screen } from '@testing-library/react';
+import { IntlProvider } from 'react-intl';
+
+import { initializeMockApp } from '@edx/frontend-platform';
+import { AppProvider } from '@edx/frontend-platform/react';
+
+import { initializeStore } from '../../../store';
+import CommentHeader from './CommentHeader';
+
+let store;
+
+function renderComponent(comment, postType, actionHandlers) {
+ return render(
+
+
+
+
+ ,
+ );
+}
+
+const mockComment = {
+ author: 'abc123',
+ authorLabel: 'ABC 123',
+ endorsed: true,
+ editableFields: [],
+};
+
+describe('Comment Header', () => {
+ beforeEach(async () => {
+ initializeMockApp({
+ authenticatedUser: {
+ userId: 3,
+ username: 'abc123',
+ administrator: true,
+ roles: [],
+ },
+ });
+ store = initializeStore();
+ });
+
+ it('should render verified icon for endorsed discussion posts', () => {
+ renderComponent(mockComment, 'discussion', {});
+ expect(screen.queryAllByTestId('verified-icon')).toHaveLength(1);
+ });
+ it('should render check icon for endorsed question posts', () => {
+ renderComponent(mockComment, 'question', {});
+ expect(screen.queryAllByTestId('check-icon')).toHaveLength(1);
+ });
+});