From 041d89b85a22b0a498a4176d0d26fd5dc84c33f9 Mon Sep 17 00:00:00 2001
From: JoramWilander <jwawilander@gmail.com>
Date: Wed, 26 Aug 2015 12:09:01 -0400
Subject: Refactored post handling/updating on both the client and server.

---
 web/react/components/rhs_comment.jsx | 207 +++++++++++++++++++++++++++++++++++
 1 file changed, 207 insertions(+)
 create mode 100644 web/react/components/rhs_comment.jsx

(limited to 'web/react/components/rhs_comment.jsx')

diff --git a/web/react/components/rhs_comment.jsx b/web/react/components/rhs_comment.jsx
new file mode 100644
index 000000000..7df2fed9e
--- /dev/null
+++ b/web/react/components/rhs_comment.jsx
@@ -0,0 +1,207 @@
+// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+var PostStore = require('../stores/post_store.jsx');
+var ChannelStore = require('../stores/channel_store.jsx');
+var UserProfile = require('./user_profile.jsx');
+var UserStore = require('../stores/user_store.jsx');
+var AppDispatcher = require('../dispatcher/app_dispatcher.jsx');
+var utils = require('../utils/utils.jsx');
+var Constants = require('../utils/constants.jsx');
+var FileAttachmentList = require('./file_attachment_list.jsx');
+var client = require('../utils/client.jsx');
+var AsyncClient = require('../utils/async_client.jsx');
+var ActionTypes = Constants.ActionTypes;
+
+export default class RhsComment extends React.Component {
+    constructor(props) {
+        super(props);
+
+        this.retryComment = this.retryComment.bind(this);
+
+        this.state = {};
+    }
+    retryComment(e) {
+        e.preventDefault();
+
+        var post = this.props.post;
+        client.createPost(post, post.channel_id,
+            function success(data) {
+                AsyncClient.getPosts(post.channel_id);
+
+                var channel = ChannelStore.get(post.channel_id);
+                var member = ChannelStore.getMember(post.channel_id);
+                member.msg_count = channel.total_msg_count;
+                member.last_viewed_at = (new Date()).getTime();
+                ChannelStore.setChannelMember(member);
+
+                AppDispatcher.handleServerAction({
+                    type: ActionTypes.RECIEVED_POST,
+                    post: data
+                });
+            },
+            function fail() {
+                post.state = Constants.POST_FAILED;
+                PostStore.updatePendingPost(post);
+                this.forceUpdate();
+            }.bind(this)
+        );
+
+        post.state = Constants.POST_LOADING;
+        PostStore.updatePendingPost(post);
+        this.forceUpdate();
+    }
+    shouldComponentUpdate(nextProps) {
+        if (!utils.areStatesEqual(nextProps.post, this.props.post)) {
+            return true;
+        }
+
+        return false;
+    }
+    render() {
+        var post = this.props.post;
+
+        var currentUserCss = '';
+        if (UserStore.getCurrentId() === post.user_id) {
+            currentUserCss = 'current--user';
+        }
+
+        var isOwner = UserStore.getCurrentId() === post.user_id;
+
+        var type = 'Post';
+        if (post.root_id.length > 0) {
+            type = 'Comment';
+        }
+
+        var message = utils.textToJsx(post.message);
+        var timestamp = UserStore.getCurrentUser().update_at;
+
+        var loading;
+        var postClass = '';
+        if (post.state === Constants.POST_FAILED) {
+            postClass += ' post-fail';
+            loading = (
+                <a
+                    className='theme post-retry pull-right'
+                    href='#'
+                    onClick={this.retryComment}
+                >
+                    Retry
+                </a>
+            );
+        } else if (post.state === Constants.POST_LOADING) {
+            postClass += ' post-waiting';
+            loading = (
+                <img
+                    className='post-loading-gif pull-right'
+                    src='/static/images/load.gif'
+                />
+            );
+        }
+
+        var ownerOptions;
+        if (isOwner && post.state !== Constants.POST_FAILED && post.state !== Constants.POST_LOADING) {
+            ownerOptions = (
+                <div
+                    className='dropdown'
+                    onClick={
+                        function scroll() {
+                            $('.post-list-holder-by-time').scrollTop($('.post-list-holder-by-time').scrollTop() + 50);
+                        }
+                    }
+                >
+                    <a
+                        href='#'
+                        className='dropdown-toggle theme'
+                        type='button'
+                        data-toggle='dropdown'
+                        aria-expanded='false'
+                    />
+                    <ul
+                        className='dropdown-menu'
+                        role='menu'
+                    >
+                        <li role='presentation'>
+                            <a
+                                href='#'
+                                role='menuitem'
+                                data-toggle='modal'
+                                data-target='#edit_post'
+                                data-title={type}
+                                data-message={post.message}
+                                data-postid={post.id}
+                                data-channelid={post.channel_id}
+                            >
+                                Edit
+                            </a>
+                        </li>
+                        <li role='presentation'>
+                            <a
+                                href='#'
+                                role='menuitem'
+                                data-toggle='modal'
+                                data-target='#delete_post'
+                                data-title={type}
+                                data-postid={post.id}
+                                data-channelid={post.channel_id}
+                                data-comments={0}
+                            >
+                                Delete
+                            </a>
+                        </li>
+                    </ul>
+                </div>
+            );
+        }
+
+        var fileAttachment;
+        if (post.filenames && post.filenames.length > 0) {
+            fileAttachment = (
+                <FileAttachmentList
+                    filenames={post.filenames}
+                    modalId={'rhs_comment_view_image_modal_' + post.id}
+                    channelId={post.channel_id}
+                    userId={post.user_id} />
+            );
+        }
+
+        return (
+            <div className={'post ' + currentUserCss}>
+                <div className='post-profile-img__container'>
+                    <img
+                        className='post-profile-img'
+                        src={'/api/v1/users/' + post.user_id + '/image?time=' + timestamp}
+                        height='36'
+                        width='36'
+                    />
+                </div>
+                <div className='post__content'>
+                    <ul className='post-header'>
+                        <li className='post-header-col'>
+                            <strong><UserProfile userId={post.user_id} /></strong>
+                        </li>
+                        <li className='post-header-col'>
+                            <time className='post-right-comment-time'>
+                                {utils.displayCommentDateTime(post.create_at)}
+                            </time>
+                        </li>
+                        <li className='post-header-col post-header__reply'>
+                            {ownerOptions}
+                        </li>
+                    </ul>
+                    <div className='post-body'>
+                        <p className={postClass}>{loading}{message}</p>
+                        {fileAttachment}
+                    </div>
+                </div>
+            </div>
+        );
+    }
+}
+
+RhsComment.defaultProps = {
+    post: null
+};
+RhsComment.propTypes = {
+    post: React.PropTypes.object
+};
-- 
cgit v1.2.3-1-g7c22

