From ab67f6e257f6e8f08145a02a7b93550f99641be4 Mon Sep 17 00:00:00 2001
From: Joram Wilander <jwawilander@gmail.com>
Date: Sun, 18 Jun 2017 14:42:32 -0400
Subject: PLT-6215 Major post list refactor (#6501)

* Major post list refactor

* Fix post and thread deletion

* Fix preferences not selecting correctly

* Fix military time displaying

* Fix UP key for editing posts

* Fix ESLint error

* Various fixes and updates per feedback

* Fix for permalink view

* Revert to old scrolling method and various fixes

* Add floating timestamp, new message indicator, scroll arrows

* Update post loading for focus mode and add visibility limit

* Fix pinning posts and a react warning

* Add loading UI updates from Asaad

* Fix refreshing loop

* Temporarily bump post visibility limit

* Update infinite scrolling

* Remove infinite scrolling
---
 .../post_message_view/post_message_view.jsx        | 139 +++++++++++++++++++++
 1 file changed, 139 insertions(+)
 create mode 100644 webapp/components/post_view/post_message_view/post_message_view.jsx

(limited to 'webapp/components/post_view/post_message_view/post_message_view.jsx')

diff --git a/webapp/components/post_view/post_message_view/post_message_view.jsx b/webapp/components/post_view/post_message_view/post_message_view.jsx
new file mode 100644
index 000000000..66a8d01f8
--- /dev/null
+++ b/webapp/components/post_view/post_message_view/post_message_view.jsx
@@ -0,0 +1,139 @@
+// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import {FormattedMessage} from 'react-intl';
+
+import * as PostUtils from 'utils/post_utils.jsx';
+import * as TextFormatting from 'utils/text_formatting.jsx';
+import * as Utils from 'utils/utils.jsx';
+
+import {getChannelsNameMapInCurrentTeam} from 'mattermost-redux/selectors/entities/channels';
+import {Posts} from 'mattermost-redux/constants';
+import store from 'stores/redux_store.jsx';
+
+import {renderSystemMessage} from './system_message_helpers.jsx';
+
+export default class PostMessageView extends React.PureComponent {
+    static propTypes = {
+
+        /*
+         * The post to render the message for
+         */
+        post: PropTypes.object.isRequired,
+
+        /*
+         * Object using emoji names as keys with custom emojis as the values
+         */
+        emojis: PropTypes.object.isRequired,
+
+        /*
+         * The team the post was made in
+         */
+        team: PropTypes.object.isRequired,
+
+        /*
+         * Set to enable Markdown formatting
+         */
+        enableFormatting: PropTypes.bool,
+
+        /*
+         * An array of words that can be used to mention a user
+         */
+        mentionKeys: PropTypes.arrayOf(PropTypes.string),
+
+        /*
+         * Object mapping usernames to users
+         */
+        usernameMap: PropTypes.object,
+
+        /*
+         * The URL that the app is hosted on
+         */
+        siteUrl: PropTypes.string,
+
+        /*
+         * Options specific to text formatting
+         */
+        options: PropTypes.object,
+
+        /*
+         * Post identifiers for selenium tests
+         */
+        lastPostCount: PropTypes.number
+    };
+
+    static defaultProps = {
+        options: {},
+        mentionKeys: [],
+        usernameMap: {}
+    };
+
+    renderDeletedPost() {
+        return (
+            <p>
+                <FormattedMessage
+                    id='post_body.deleted'
+                    defaultMessage='(message deleted)'
+                />
+            </p>
+        );
+    }
+
+    renderEditedIndicator() {
+        if (!PostUtils.isEdited(this.props.post)) {
+            return null;
+        }
+
+        return (
+            <span className='post-edited-indicator'>
+                <FormattedMessage
+                    id='post_message_view.edited'
+                    defaultMessage='(edited)'
+                />
+            </span>
+        );
+    }
+
+    render() {
+        if (this.props.post.state === Posts.POST_DELETED) {
+            return this.renderDeletedPost();
+        }
+
+        if (!this.props.enableFormatting) {
+            return <span>{this.props.post.message}</span>;
+        }
+
+        const options = Object.assign({}, this.props.options, {
+            emojis: this.props.emojis,
+            siteURL: this.props.siteUrl,
+            mentionKeys: this.props.mentionKeys,
+            usernameMap: this.props.usernameMap,
+            channelNamesMap: getChannelsNameMapInCurrentTeam(store.getState()),
+            team: this.props.team
+        });
+
+        const renderedSystemMessage = renderSystemMessage(this.props.post, options);
+        if (renderedSystemMessage) {
+            return <div>{renderedSystemMessage}</div>;
+        }
+
+        let postId = null;
+        if (this.props.lastPostCount >= 0) {
+            postId = Utils.createSafeId('lastPostMessageText' + this.props.lastPostCount);
+        }
+
+        return (
+            <div>
+                <span
+                    id={postId}
+                    className='post-message__text'
+                    onClick={Utils.handleFormattedTextClick}
+                    dangerouslySetInnerHTML={{__html: TextFormatting.formatText(this.props.post.message, options)}}
+                />
+                {this.renderEditedIndicator()}
+            </div>
+        );
+    }
+}
-- 
cgit v1.2.3-1-g7c22