From 2f7771e9fc79c8de7ef85a6c0a18c907930eb1ae Mon Sep 17 00:00:00 2001
From: Kshitij Sobti <kshitij@sobti.in>
Date: Wed, 27 Oct 2021 02:12:51 +0530
Subject: [PATCH] feat: add cohort information to post footer

---
 src/discussions/posts/post/LikeButton.jsx |  2 +-
 src/discussions/posts/post/PostFooter.jsx | 20 +++++++++++++++++---
 src/discussions/posts/post/messages.js    |  6 +++++-
 3 files changed, 23 insertions(+), 5 deletions(-)

diff --git a/src/discussions/posts/post/LikeButton.jsx b/src/discussions/posts/post/LikeButton.jsx
index fe4c6036..6eb48601 100644
--- a/src/discussions/posts/post/LikeButton.jsx
+++ b/src/discussions/posts/post/LikeButton.jsx
@@ -26,7 +26,7 @@ function LikeButton(
   };
 
   return (
-    <div className="d-flex align-items-center align-content-center mr-2.5">
+    <div className="d-flex align-items-center align-content-center mr-4.5">
       <OverlayTrigger
         overlay={(
           <Tooltip>
diff --git a/src/discussions/posts/post/PostFooter.jsx b/src/discussions/posts/post/PostFooter.jsx
index a429d1d9..56540c33 100644
--- a/src/discussions/posts/post/PostFooter.jsx
+++ b/src/discussions/posts/post/PostFooter.jsx
@@ -9,7 +9,7 @@ import {
   Icon, IconButton, OverlayTrigger, Tooltip,
 } from '@edx/paragon';
 import {
-  Locked, QuestionAnswer, StarFilled, StarOutline,
+  Locked, Person, QuestionAnswer, StarFilled, StarOutline,
 } from '@edx/paragon/icons';
 
 import { updateExistingThread } from '../data/thunks';
@@ -38,7 +38,7 @@ function PostFooter({
         )}
       >
         {preview
-          ? <Icon src={post.following ? StarFilled : StarOutline} />
+          ? <Icon src={post.following ? StarFilled : StarOutline} className="my-0 mr-4.5" />
           : (
             <IconButton
               onClick={() => {
@@ -56,13 +56,27 @@ function PostFooter({
       {preview
         && (
           <>
-            <Icon src={QuestionAnswer} className="mx-2" />
+            <Icon src={QuestionAnswer} className="mx-2 my-0" />
             <span style={{ minWidth: '2rem' }}>
               {post.commentCount}
             </span>
           </>
         )}
       <div className="d-flex flex-fill justify-content-end align-items-center">
+        {!preview
+          && (
+            <span className="text-gray-500 mr-4 d-flex align-items-center">
+              <Icon
+                src={Person}
+                className="mr-1"
+                style={{
+                  width: '1em',
+                  height: '1em',
+                }}
+              />
+              {post.groupName || intl.formatMessage(messages.visibleToAll)}
+            </span>
+          )}
         <span title={post.createdAt} className="text-gray-500">
           {timeago.format(post.createdAt, intl.locale)}
         </span>
diff --git a/src/discussions/posts/post/messages.js b/src/discussions/posts/post/messages.js
index 6973fe0e..7f43a5f4 100644
--- a/src/discussions/posts/post/messages.js
+++ b/src/discussions/posts/post/messages.js
@@ -47,7 +47,11 @@ const messages = defineMessages({
     defaultMessage: 'Post closed for responses and comments',
     description: 'Tooltip/alttext for icon displayed when post is closed',
   },
-
+  visibleToAll: {
+    id: 'discussions.post.cohort.everyone',
+    defaultMessage: 'Everyone',
+    description: 'Cohort visibility indicator for all people',
+  },
 });
 
 export default messages;