Implemented basic text formatting package using a modfied version of the marked js library. Supports *bold*, _italics_, and `code`

1 files changed, 25 insertions, 4 deletions

diff --git a/web/react/components/post_right.jsx b/web/react/components/post_right.jsx
index ad8b54012..10a9400f5 100644
--- a/web/react/components/post_right.jsx
+++ b/web/react/components/post_right.jsx
@@ -56,6 +56,7 @@ RhsHeaderPost = React.createClass({
 
 RootPost = React.createClass({
     render: function() {
+        var allowTextFormatting = config.AllowTextFormatting;
         var post = this.props.post;
         var message = utils.textToJsx(post.message);
         var isOwner = UserStore.getCurrentId() == post.user_id;
@@ -76,6 +77,11 @@ RootPost = React.createClass({
             channelName = (channel.type === 'D') ? "Private Message" : channel.display_name;
         }
 
+        var messageHolder = <p>{message}</p>;
+        if (allowTextFormatting) {
+            messageHolder = <div>{message}</div>;
+        }
+
         return (
             <div className={"post post--root " + currentUserCss}>
                 <div className="post-right-channel__name">{ channelName }</div>
@@ -101,7 +107,7 @@ RootPost = React.createClass({
                         </li>
                     </ul>
                     <div className="post-body">
-                        <p>{message}</p>
+                        {messageHolder}
                         { post.filenames && post.filenames.length > 0 ?
                             <FileAttachmentList
                                 filenames={post.filenames}
@@ -119,6 +125,7 @@ RootPost = React.createClass({
 
 CommentPost = React.createClass({
     render: function() {
+        var allowTextFormatting = config.AllowTextFormatting;
         var post = this.props.post;
 
         var commentClass = "post";
@@ -138,6 +145,11 @@ CommentPost = React.createClass({
         var message = utils.textToJsx(post.message);
         var timestamp = UserStore.getCurrentUser().update_at;
 
+        var messageHolder = <p>{message}</p>;
+        if (allowTextFormatting) {
+            messageHolder = <div>{message}</div>;
+        }
+
         return (
             <div className={commentClass + " " + currentUserCss}>
                 <div className="post-profile-img__container">
@@ -160,7 +172,7 @@ CommentPost = React.createClass({
                         </li>
                     </ul>
                     <div className="post-body">
-                        <p>{message}</p>
+                        {messageHolder}
                         { post.filenames && post.filenames.length > 0 ?
                             <FileAttachmentList
                                 filenames={post.filenames}
@@ -273,11 +285,20 @@ module.exports = React.createClass({
             root_post = post_list.posts[selected_post.root_id];
         }
 
+        var rootPostKey = root_post.id
+        if (root_post.lastEditDate != undefined)
+            rootPostKey += root_post.lastEditDate;
+
         var posts_array = [];
 
         for (var postId in post_list.posts) {
             var cpost = post_list.posts[postId];
             if (cpost.root_id == root_post.id) {
+                var cpostKey = cpost.id
+                if (cpost.lastEditDate != undefined)
+                    cpostKey += cpost.lastEditDate;
+
+                cpost.cpostKey = cpostKey;
                 posts_array.push(cpost);
             }
         }
@@ -300,10 +321,10 @@ module.exports = React.createClass({
                 <div className="sidebar-right__body">
                     <RhsHeaderPost fromSearch={this.props.fromSearch} isMentionSearch={this.props.isMentionSearch} />
                     <div className="post-right__scroll">
-                        <RootPost post={root_post} commentCount={posts_array.length}/>
+                        <RootPost key={rootPostKey} post={root_post} commentCount={posts_array.length}/>
                         <div className="post-right-comments-container">
                         { posts_array.map(function(cpost) {
-                                return <CommentPost ref={cpost.id} key={cpost.id} post={cpost} selected={ (cpost.id == selected_post.id) } />
+                                return <CommentPost ref={cpost.id} key={cpost.cpostKey} post={cpost} selected={ (cpost.id == selected_post.id) } />
                         })}
                         </div>
                         <div className="post-create__container">