Minor Ui improvements (#6515)

* PLT-6645 - Improving copy pasting behaviour

* PLT-6149 - Fixing edited indicator in search

6 files changed, 52 insertions, 46 deletions

diff --git a/webapp/components/post_view/components/post_header.jsx b/webapp/components/post_view/components/post_header.jsx
index ce67cd653..570a04f8f 100644
--- a/webapp/components/post_view/components/post_header.jsx
+++ b/webapp/components/post_view/components/post_header.jsx
@@ -53,7 +53,7 @@ export default class PostHeader extends React.Component {
                 );
             }
 
-            botIndicator = <li className='bot-indicator'>{Constants.BOT_NAME}</li>;
+            botIndicator = <div className='bot-indicator'>{Constants.BOT_NAME}</div>;
         } else if (isSystemMessage) {
             userProfile = (
                 <UserProfile
@@ -75,10 +75,10 @@ export default class PostHeader extends React.Component {
         }
 
         return (
-            <ul className='post__header'>
-                <li className='col col__name'>{userProfile}{colon}</li>
+            <div className='post__header'>
+                <div className='col col__name'>{userProfile}{colon}</div>
                 {botIndicator}
-                <li className='col'>
+                <div className='col'>
                     <PostInfo
                         post={post}
                         lastPostCount={this.props.lastPostCount}
@@ -92,8 +92,8 @@ export default class PostHeader extends React.Component {
                         useMilitaryTime={this.props.useMilitaryTime}
                         isFlagged={this.props.isFlagged}
                     />
-                </li>
-            </ul>
+                </div>
+            </div>
         );
     }
 }
diff --git a/webapp/components/post_view/components/post_info.jsx b/webapp/components/post_view/components/post_info.jsx
index 06e7b33fd..74ce32817 100644
--- a/webapp/components/post_view/components/post_info.jsx
+++ b/webapp/components/post_view/components/post_info.jsx
@@ -388,16 +388,16 @@ export default class PostInfo extends React.Component {
         let options;
         if (isEphemeral) {
             options = (
-                <li className='col col__remove'>
+                <div className='col col__remove'>
                     {this.createRemovePostButton()}
-                </li>
+                </div>
             );
         } else if (!isPending) {
             const dropdown = this.createDropdown(isSystemMessage);
 
             if (dropdown) {
                 options = (
-                    <li className='col col__reply'>
+                    <div className='col col__reply'>
                         <div
                             className='dropdown'
                             ref='dotMenu'
@@ -406,7 +406,7 @@ export default class PostInfo extends React.Component {
                         </div>
                         {react}
                         {comments}
-                    </li>
+                    </div>
                 );
             }
         }
@@ -424,8 +424,8 @@ export default class PostInfo extends React.Component {
         }
 
         return (
-            <ul className='post__header--info'>
-                <li className='col'>
+            <div className='post__header--info'>
+                <div className='col'>
                     <PostTime
                         eventTime={post.create_at}
                         sameUser={this.props.sameUser}
@@ -442,9 +442,9 @@ export default class PostInfo extends React.Component {
                         isFlagged={this.props.isFlagged}
                         isEphemeral={isEphemeral}
                     />
-                </li>
+                </div>
                 {options}
-            </ul>
+            </div>
         );
     }
 }
diff --git a/webapp/components/rhs_comment.jsx b/webapp/components/rhs_comment.jsx
index ce6360c7e..85c2fc1de 100644
--- a/webapp/components/rhs_comment.jsx
+++ b/webapp/components/rhs_comment.jsx
@@ -436,7 +436,7 @@ export default class RhsComment extends React.Component {
                 );
             }
 
-            botIndicator = <li className='col col__name bot-indicator'>{'BOT'}</li>;
+            botIndicator = <div className='col col__name bot-indicator'>{'BOT'}</div>;
         } else if (isSystemMessage) {
             userProfile = (
                 <UserProfile
@@ -573,17 +573,17 @@ export default class RhsComment extends React.Component {
         let options;
         if (isEphemeral) {
             options = (
-                <li className='col col__remove'>
+                <div className='col col__remove'>
                     {this.createRemovePostButton()}
-                </li>
+                </div>
             );
         } else if (!isSystemMessage) {
             options = (
-                <li className='col col__reply'>
+                <div className='col col__reply'>
                     {reactOverlay}
                     {this.createDropdown(isSystemMessage)}
                     {react}
-                </li>
+                </div>
             );
         }
 
@@ -613,12 +613,12 @@ export default class RhsComment extends React.Component {
                 <div className='post__content'>
                     {profilePicContainer}
                     <div>
-                        <ul className='post__header'>
-                            <li className='col col__name'>
+                        <div className='post__header'>
+                            <div className='col col__name'>
                                 <strong>{userProfile}</strong>
-                            </li>
+                            </div>
                             {botIndicator}
-                            <li className='col'>
+                            <div className='col'>
                                 {this.renderTimeTag(post, timeOptions)}
                                 {pinnedBadge}
                                 <PostFlagIcon
@@ -628,9 +628,9 @@ export default class RhsComment extends React.Component {
                                     isFlagged={this.props.isFlagged}
                                     isEphemeral={isEphemeral}
                                 />
-                            </li>
+                            </div>
                             {options}
-                        </ul>
+                        </div>
                         <div className='post__body' >
                             <div className={postClass}>
                                 {loading}
diff --git a/webapp/components/rhs_root_post.jsx b/webapp/components/rhs_root_post.jsx
index 408bce395..f48b4e86a 100644
--- a/webapp/components/rhs_root_post.jsx
+++ b/webapp/components/rhs_root_post.jsx
@@ -454,7 +454,7 @@ export default class RhsRootPost extends React.Component {
                 );
             }
 
-            botIndicator = <li className='col col__name bot-indicator'>{'BOT'}</li>;
+            botIndicator = <div className='col col__name bot-indicator'>{'BOT'}</div>;
         } else if (isSystemMessage) {
             userProfile = (
                 <UserProfile
@@ -559,10 +559,10 @@ export default class RhsRootPost extends React.Component {
                 <div className='post__content'>
                     {profilePicContainer}
                     <div>
-                        <ul className='post__header'>
-                            <li className='col__name'>{userProfile}</li>
+                        <div className='post__header'>
+                            <div className='col__name'>{userProfile}</div>
                             {botIndicator}
-                            <li className='col'>
+                            <div className='col'>
                                 {this.renderTimeTag(post, timeOptions)}
                                 {pinnedBadge}
                                 <PostFlagIcon
@@ -570,13 +570,13 @@ export default class RhsRootPost extends React.Component {
                                     postId={post.id}
                                     isFlagged={this.props.isFlagged}
                                 />
-                            </li>
-                            <li className='col col__reply'>
+                            </div>
+                            <div className='col col__reply'>
                                 {reactOverlay}
                                 {rootOptions}
                                 {react}
-                            </li>
-                        </ul>
+                            </div>
+                        </div>
                         <div className='post__body'>
                             <div className={postClass}>
                                 <PostBodyAdditionalContent
diff --git a/webapp/components/search_results_item.jsx b/webapp/components/search_results_item.jsx
index 71240ca48..4eb738065 100644
--- a/webapp/components/search_results_item.jsx
+++ b/webapp/components/search_results_item.jsx
@@ -150,7 +150,7 @@ export default class SearchResultsItem extends React.Component {
 
         let botIndicator;
         if (post.props && post.props.from_webhook) {
-            botIndicator = <li className='bot-indicator'>{Constants.BOT_NAME}</li>;
+            botIndicator = <div className='bot-indicator'>{Constants.BOT_NAME}</div>;
         }
 
         const profilePic = (
@@ -169,6 +169,11 @@ export default class SearchResultsItem extends React.Component {
             compactClass = ' post--compact';
         }
 
+        let postClass = '';
+        if (PostUtils.isEdited(this.props.post)) {
+            postClass += ' post--edited';
+        }
+
         let fileAttachment = null;
         if (post.file_ids && post.file_ids.length > 0) {
             fileAttachment = (
@@ -202,7 +207,7 @@ export default class SearchResultsItem extends React.Component {
             );
 
             rhsControls = (
-                <li className='col__controls'>
+                <div className='col__controls'>
                     <CommentIcon
                         idPrefix={'searchCommentIcon'}
                         idCount={idCount}
@@ -243,7 +248,7 @@ export default class SearchResultsItem extends React.Component {
                             defaultMessage='Jump'
                         />
                     </a>
-                </li>
+                </div>
             );
 
             message = (
@@ -289,8 +294,8 @@ export default class SearchResultsItem extends React.Component {
                     <div className='post__content'>
                         {profilePicContainer}
                         <div>
-                            <ul className='post__header'>
-                                <li className='col col__name'><strong>
+                            <div className='post__header'>
+                                <div className='col col__name'><strong>
                                     <UserProfile
                                         user={user}
                                         overwriteName={overrideUsername}
@@ -298,18 +303,20 @@ export default class SearchResultsItem extends React.Component {
                                         status={this.props.status}
                                         isBusy={this.props.isBusy}
                                     />
-                                </strong></li>
+                                </strong></div>
                                 {botIndicator}
-                                <li className='col'>
+                                <div className='col'>
                                     {this.renderTimeTag(post)}
                                     {pinnedBadge}
                                     {flagContent}
-                                </li>
+                                </div>
                                 {rhsControls}
-                            </ul>
+                            </div>
                             <div className='search-item-snippet post__body'>
-                                {message}
-                                {fileAttachment}
+                                <div className={postClass}>
+                                    {message}
+                                    {fileAttachment}
+                                </div>
                             </div>
                         </div>
                     </div>
diff --git a/webapp/sass/layout/_post.scss b/webapp/sass/layout/_post.scss
index 2b84d01f9..85a4bb2cd 100644
--- a/webapp/sass/layout/_post.scss
+++ b/webapp/sass/layout/_post.scss
@@ -1028,11 +1028,10 @@
     }
 
     .post__header {
-        list-style: none;
         margin-bottom: 2px;
         padding: 0;
 
-        li {
+        > div {
             display: inline-block;
             vertical-align: top;
         }