From 0e89d9be1d6a2a1ca470f9ca92e0d59e5945ca18 Mon Sep 17 00:00:00 2001
From: Saturnino Abril <saturnino.abril@gmail.com>
Date: Thu, 15 Jun 2017 07:45:46 +0800
Subject: create DotMenu components and add dotmenu IDs to posts at center and
 RHS (#6642)

---
 webapp/components/rhs_root_post.jsx | 179 +++---------------------------------
 1 file changed, 11 insertions(+), 168 deletions(-)

(limited to 'webapp/components/rhs_root_post.jsx')

diff --git a/webapp/components/rhs_root_post.jsx b/webapp/components/rhs_root_post.jsx
index e77fb7992..c617477af 100644
--- a/webapp/components/rhs_root_post.jsx
+++ b/webapp/components/rhs_root_post.jsx
@@ -7,8 +7,8 @@ import PostMessageContainer from 'components/post_view/components/post_message_c
 import FileAttachmentListContainer from './file_attachment_list_container.jsx';
 import ProfilePicture from 'components/profile_picture.jsx';
 import ReactionListContainer from 'components/post_view/components/reaction_list_container.jsx';
-import RhsDropdown from 'components/rhs_dropdown.jsx';
 import PostFlagIcon from 'components/common/post_flag_icon.jsx';
+import DotMenu from 'components/dot_menu/dot_menu.jsx';
 
 import ChannelStore from 'stores/channel_store.jsx';
 import UserStore from 'stores/user_store.jsx';
@@ -44,8 +44,6 @@ export default class RhsRootPost extends React.Component {
         this.reactEmojiClick = this.reactEmojiClick.bind(this);
         this.handleDropdownOpened = this.handleDropdownOpened.bind(this);
 
-        this.canEdit = false;
-        this.canDelete = false;
         this.editDisableAction = new DelayedAction(this.handleEditDisable);
 
         this.state = {
@@ -75,10 +73,6 @@ export default class RhsRootPost extends React.Component {
         GlobalActions.showGetPostLinkModal(this.props.post);
     }
 
-    handleEditDisable() {
-        this.canEdit = false;
-    }
-
     shouldComponentUpdate(nextProps, nextState) {
         if (nextProps.status !== this.props.status) {
             return true;
@@ -225,18 +219,10 @@ export default class RhsRootPost extends React.Component {
         var timestamp = user ? user.last_picture_update : 0;
         var channel = ChannelStore.get(post.channel_id);
 
-        this.canDelete = PostUtils.canDeletePost(post);
-        this.canEdit = PostUtils.canEditPost(post, this.editDisableAction);
-
         const isEphemeral = Utils.isPostEphemeral(post);
         const isPending = post.state === Constants.POST_FAILED || post.state === Constants.POST_LOADING;
         const isSystemMessage = PostUtils.isSystemMessage(post);
 
-        var type = 'Post';
-        if (post.root_id.length > 0) {
-            type = 'Comment';
-        }
-
         var channelName;
         if (channel) {
             if (channel.type === 'D') {
@@ -274,158 +260,6 @@ export default class RhsRootPost extends React.Component {
             );
         }
 
-        var dropdownContents = [];
-
-        if (Utils.isMobile()) {
-            if (this.props.isFlagged) {
-                dropdownContents.push(
-                    <li
-                        key='mobileFlag'
-                        role='presentation'
-                    >
-                        <a
-                            href='#'
-                            onClick={this.unflagPost}
-                        >
-                            <FormattedMessage
-                                id='rhs_root.mobile.unflag'
-                                defaultMessage='Unflag'
-                            />
-                        </a>
-                    </li>
-                );
-            } else {
-                dropdownContents.push(
-                    <li
-                        key='mobileFlag'
-                        role='presentation'
-                    >
-                        <a
-                            href='#'
-                            onClick={this.flagPost}
-                        >
-                            <FormattedMessage
-                                id='rhs_root.mobile.flag'
-                                defaultMessage='Flag'
-                            />
-                        </a>
-                    </li>
-                );
-            }
-        }
-
-        if (!isSystemMessage) {
-            dropdownContents.push(
-                <li
-                    key='rhs-root-permalink'
-                    role='presentation'
-                >
-                    <a
-                        href='#'
-                        onClick={this.handlePermalink}
-                    >
-                        <FormattedMessage
-                            id='rhs_root.permalink'
-                            defaultMessage='Permalink'
-                        />
-                    </a>
-                </li>
-            );
-
-            if (post.is_pinned) {
-                dropdownContents.push(
-                    <li
-                        key='rhs-root-unpin'
-                        role='presentation'
-                    >
-                        <a
-                            href='#'
-                            onClick={this.unpinPost}
-                        >
-                            <FormattedMessage
-                                id='rhs_root.unpin'
-                                defaultMessage='Un-pin from channel'
-                            />
-                        </a>
-                    </li>
-                );
-            } else {
-                dropdownContents.push(
-                    <li
-                        key='rhs-root-pin'
-                        role='presentation'
-                    >
-                        <a
-                            href='#'
-                            onClick={this.pinPost}
-                        >
-                            <FormattedMessage
-                                id='rhs_root.pin'
-                                defaultMessage='Pin to channel'
-                            />
-                        </a>
-                    </li>
-                );
-            }
-        }
-
-        if (this.canDelete) {
-            dropdownContents.push(
-                <li
-                    key='rhs-root-delete'
-                    role='presentation'
-                >
-                    <a
-                        href='#'
-                        role='menuitem'
-                        onClick={() => GlobalActions.showDeletePostModal(post, this.props.commentCount)}
-                    >
-                        <FormattedMessage
-                            id='rhs_root.del'
-                            defaultMessage='Delete'
-                        />
-                    </a>
-                </li>
-            );
-        }
-
-        if (this.canEdit) {
-            dropdownContents.push(
-                <li
-                    key='rhs-root-edit'
-                    role='presentation'
-                    className={this.canEdit ? '' : 'hide'}
-                >
-                    <a
-                        href='#'
-                        role='menuitem'
-                        data-toggle='modal'
-                        data-target='#edit_post'
-                        data-refocusid='#reply_textbox'
-                        data-title={type}
-                        data-message={post.message}
-                        data-postid={post.id}
-                        data-channelid={post.channel_id}
-                    >
-                        <FormattedMessage
-                            id='rhs_root.edit'
-                            defaultMessage='Edit'
-                        />
-                    </a>
-                </li>
-            );
-        }
-
-        var rootOptions = '';
-        if (dropdownContents.length > 0) {
-            rootOptions = (
-                <RhsDropdown
-                    dropdownContents={dropdownContents}
-                    handleDropdownOpened={this.handleDropdownOpened}
-                />
-            );
-        }
-
         let fileAttachment = null;
         if (post.file_ids && post.file_ids.length > 0) {
             fileAttachment = (
@@ -559,6 +393,15 @@ export default class RhsRootPost extends React.Component {
             hour12: !this.props.useMilitaryTime
         };
 
+        const dotMenu = (
+            <DotMenu
+                idPrefix={Constants.RHS_ROOT}
+                post={this.props.post}
+                isFlagged={this.props.isFlagged}
+                handleDropdownOpened={this.handleDropdownOpened}
+            />
+        );
+
         return (
             <div
                 id='thread--root'
@@ -584,7 +427,7 @@ export default class RhsRootPost extends React.Component {
                                 ref='dotMenu'
                                 className='col col__reply'
                             >
-                                {rootOptions}
+                                {dotMenu}
                                 {react}
                             </div>
                         </div>
-- 
cgit v1.2.3-1-g7c22