fix: clickable username in post, comments and responses (#234)

* fix: clickable username in post, rcomments and responses

* test: fix test case after clickable username

src/discussions/comments/CommentsView.test.jsx

@@ -12,6 +12,7 @@ import { AppProvider } from '@edx/frontend-platform/react';
 
 import { initializeStore } from '../../store';
 import { executeThunk } from '../../test-utils';
+import { DiscussionContext } from '../common/context';
 import { courseConfigApiUrl } from '../data/api';
 import { fetchCourseConfig } from '../data/thunks';
 import DiscussionContent from '../discussions-home/DiscussionContent';
@@ -81,16 +82,20 @@ function renderComponent(postId) {
   render(
     <IntlProvider locale="en">
       <AppProvider store={store}>
-        <MemoryRouter initialEntries={[`/${courseId}/posts/${postId}`]}>
-          <DiscussionContent />
-          <Route
-            path="*"
-            render={({ location }) => {
-              testLocation = location;
-              return null;
-            }}
-          />
-        </MemoryRouter>
+        <DiscussionContext.Provider
+          value={{ courseId }}
+        >
+          <MemoryRouter initialEntries={[`/${courseId}/posts/${postId}`]}>
+            <DiscussionContent />
+            <Route
+              path="*"
+              render={({ location }) => {
+                testLocation = location;
+                return null;
+              }}
+            />
+          </MemoryRouter>
+        </DiscussionContext.Provider>
       </AppProvider>
     </IntlProvider>,
   );

src/discussions/comments/comment/CommentHeader.jsx

@@ -39,7 +39,7 @@ function CommentHeader({
             height: '32px',
           }}
         />
-        <AuthorLabel author={comment.author} authorLabel={comment.authorLabel} labelColor={colorClass && `text-${colorClass}`} />
+        <AuthorLabel author={comment.author} authorLabel={comment.authorLabel} labelColor={colorClass && `text-${colorClass}`} linkToProfile />
       </div>
       <div className="d-flex align-items-center">
         <span className="btn-icon btn-icon-sm mr-1 align-items-center">

src/discussions/comments/comment/CommentHeader.test.jsx

@@ -7,6 +7,7 @@ import { initializeMockApp } from '@edx/frontend-platform';
 import { AppProvider } from '@edx/frontend-platform/react';
 
 import { initializeStore } from '../../../store';
+import { DiscussionContext } from '../../common/context';
 import CommentHeader from './CommentHeader';
 
 let store;
@@ -15,7 +16,11 @@ function renderComponent(comment, postType, actionHandlers) {
   return render(
     <IntlProvider locale="en">
       <AppProvider store={store}>
-        <CommentHeader comment={comment} postType={postType} actionHandlers={actionHandlers} />
+        <DiscussionContext.Provider
+          value={{ courseId: 'course-v1:edX+TestX+Test_Course' }}
+        >
+          <CommentHeader comment={comment} postType={postType} actionHandlers={actionHandlers} />
+        </DiscussionContext.Provider>
       </AppProvider>
     </IntlProvider>,
   );

src/discussions/comments/comment/Reply.jsx

@@ -77,7 +77,7 @@ function Reply({
         </div>
         <div className="rounded bg-light-300 px-4 pb-2 pt-2.5 flex-fill">
           <div className="d-flex flex-row justify-content-between align-items-center mb-0.5">
-            <AuthorLabel author={reply.author} authorLabel={reply.authorLabel} labelColor={colorClass && `text-${colorClass}`} />
+            <AuthorLabel author={reply.author} authorLabel={reply.authorLabel} labelColor={colorClass && `text-${colorClass}`} linkToProfile />
             <ActionsDropdown
               commentOrPost={{
                 ...reply,