Message Editing and Deleting permissions (#4692)

2017-01-18 18:38:31 +05:30
--- a/webapp/components/admin_console/policy_settings.jsx
+++ b/webapp/components/admin_console/policy_settings.jsx
@@ -6,6 +6,8 @@ import React from 'react';
 import AdminSettings from './admin_settings.jsx';
 import SettingsGroup from './settings_group.jsx';
 import DropdownSetting from './dropdown_setting.jsx';
+import RadioSetting from './radio_setting.jsx';
+import PostEditSetting from './post_edit_setting.jsx';

 import Constants from 'utils/constants.jsx';
 import * as Utils from 'utils/utils.jsx';
@@ -22,6 +24,9 @@ export default class PolicySettings extends AdminSettings {
    }

    getConfigFromState(config) {
+        config.ServiceSettings.RestrictPostDelete = this.state.restrictPostDelete;
+        config.ServiceSettings.AllowEditPost = this.state.allowEditPost;
+        config.ServiceSettings.PostEditTimeLimit = this.parseIntNonZero(this.state.postEditTimeLimit, Constants.DEFAULT_POST_EDIT_TIME_LIMIT);
        config.TeamSettings.RestrictTeamInvite = this.state.restrictTeamInvite;
        config.TeamSettings.RestrictPublicChannelCreation = this.state.restrictPublicChannelCreation;
        config.TeamSettings.RestrictPrivateChannelCreation = this.state.restrictPrivateChannelCreation;
@@ -35,6 +40,9 @@ export default class PolicySettings extends AdminSettings {

    getStateFromConfig(config) {
        return {
+            restrictPostDelete: config.ServiceSettings.RestrictPostDelete,
+            allowEditPost: config.ServiceSettings.AllowEditPost,
+            postEditTimeLimit: config.ServiceSettings.PostEditTimeLimit,
            restrictTeamInvite: config.TeamSettings.RestrictTeamInvite,
            restrictPublicChannelCreation: config.TeamSettings.RestrictPublicChannelCreation,
            restrictPrivateChannelCreation: config.TeamSettings.RestrictPrivateChannelCreation,
@@ -241,6 +249,47 @@ export default class PolicySettings extends AdminSettings {
                        />
                    }
                />
+                <RadioSetting
+                    id='restrictPostDelete'
+                    values={[
+                        {value: Constants.PERMISSIONS_DELETE_POST_ALL, text: Utils.localizeMessage('admin.general.policy.permissionsDeletePostAll', 'Message authors can delete their own messages, and Administrators can delete any message')},
+                        {value: Constants.PERMISSIONS_DELETE_POST_TEAM_ADMIN, text: Utils.localizeMessage('admin.general.policy.permissionsDeletePostAdmin', 'Team Admins and System Admins')},
+                        {value: Constants.PERMISSIONS_DELETE_POST_SYSTEM_ADMIN, text: Utils.localizeMessage('admin.general.policy.permissionsDeletePostSystemAdmin', 'System Admins')}
+                    ]}
+                    label={
+                        <FormattedMessage
+                            id='admin.general.policy.restrictPostDeleteTitle'
+                            defaultMessage='Allow which users to delete messages:'
+                        />
+                    }
+                    value={this.state.restrictPostDelete}
+                    onChange={this.handleChange}
+                    helpText={
+                        <FormattedHTMLMessage
+                            id='admin.general.policy.restrictPostDeleteDescription'
+                            defaultMessage='Set policy on who has permission to delete messages.'
+                        />
+                    }
+                />
+                <PostEditSetting
+                    id='allowEditPost'
+                    timeLimitId='postEditTimeLimit'
+                    label={
+                        <FormattedMessage
+                            id='admin.general.policy.allowEditPostTitle'
+                            defaultMessage='Allow users to edit their messages:'
+                        />
+                    }
+                    value={this.state.allowEditPost}
+                    timeLimitValue={this.state.postEditTimeLimit}
+                    onChange={this.handleChange}
+                    helpText={
+                        <FormattedHTMLMessage
+                            id='admin.general.policy.allowEditPostDescription'
+                            defaultMessage='Set policy on the length of time authors have to edit their messages after posting.'
+                        />
+                    }
+                />
            </SettingsGroup>
        );
    }
--- a/webapp/components/admin_console/post_edit_setting.jsx
+++ b/webapp/components/admin_console/post_edit_setting.jsx
@@ -0,0 +1,99 @@
+// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+import React from 'react';
+
+import Setting from './setting.jsx';
+
+import Constants from 'utils/constants.jsx';
+import * as Utils from 'utils/utils.jsx';
+
+export default class PostEditSetting extends React.Component {
+    constructor(props) {
+        super(props);
+
+        this.handleChange = this.handleChange.bind(this);
+        this.handleTimeLimitChange = this.handleTimeLimitChange.bind(this);
+    }
+
+    handleChange(e) {
+        this.props.onChange(this.props.id, e.target.value);
+    }
+
+    handleTimeLimitChange(e) {
+        this.props.onChange(this.props.timeLimitId, e.target.value);
+    }
+
+    render() {
+        return (
+            <Setting
+                label={this.props.label}
+                inputId={this.props.id}
+                helpText={this.props.helpText}
+            >
+                <div className='radio'>
+                    <label>
+                        <input
+                            type='radio'
+                            value={Constants.ALLOW_EDIT_POST_ALWAYS}
+                            name={this.props.id}
+                            checked={this.props.value === Constants.ALLOW_EDIT_POST_ALWAYS}
+                            onChange={this.handleChange}
+                            disabled={this.props.disabled}
+                        />
+                        {Utils.localizeMessage('admin.general.policy.allowEditPostAlways', 'Any time')}
+                    </label>
+                </div>
+                <div className='radio'>
+                    <label>
+                        <input
+                            type='radio'
+                            value={Constants.ALLOW_EDIT_POST_NEVER}
+                            name={this.props.id}
+                            checked={this.props.value === Constants.ALLOW_EDIT_POST_NEVER}
+                            onChange={this.handleChange}
+                            disabled={this.props.disabled}
+                        />
+                        {Utils.localizeMessage('admin.general.policy.allowEditPostNever', 'Never')}
+                    </label>
+                </div>
+                <div className='radio form-inline'>
+                    <label>
+                        <input
+                            type='radio'
+                            value={Constants.ALLOW_EDIT_POST_TIME_LIMIT}
+                            name={this.props.id}
+                            checked={this.props.value === Constants.ALLOW_EDIT_POST_TIME_LIMIT}
+                            onChange={this.handleChange}
+                            disabled={this.props.disabled}
+                        />
+                        <input
+                            type='text'
+                            value={this.props.timeLimitValue}
+                            className='form-control'
+                            name={this.props.timeLimitId}
+                            onChange={this.handleTimeLimitChange}
+                            disabled={this.props.disabled || this.props.value !== Constants.ALLOW_EDIT_POST_TIME_LIMIT}
+                        />
+                        <span> {Utils.localizeMessage('admin.general.policy.allowEditPostTimeLimit', 'seconds after posting')}</span>
+                    </label>
+                </div>
+            </Setting>
+        );
+    }
+}
+
+PostEditSetting.defaultProps = {
+    isDisabled: false
+};
+
+PostEditSetting.propTypes = {
+    id: React.PropTypes.string.isRequired,
+    timeLimitId: React.PropTypes.string.isRequired,
+    label: React.PropTypes.node.isRequired,
+    value: React.PropTypes.string.isRequired,
+    timeLimitValue: React.PropTypes.number.isRequired,
+    onChange: React.PropTypes.func.isRequired,
+    disabled: React.PropTypes.bool,
+    helpText: React.PropTypes.node
+};
--- a/webapp/components/admin_console/radio_setting.jsx
+++ b/webapp/components/admin_console/radio_setting.jsx
@@ -0,0 +1,63 @@
+// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+import React from 'react';
+
+import Setting from './setting.jsx';
+
+export default class RadioSetting extends React.Component {
+    constructor(props) {
+        super(props);
+
+        this.handleChange = this.handleChange.bind(this);
+    }
+
+    handleChange(e) {
+        this.props.onChange(this.props.id, e.target.value);
+    }
+
+    render() {
+        const options = [];
+        for (const {value, text} of this.props.values) {
+            options.push(
+                <div className='radio'>
+                    <label>
+                        <input
+                            type='radio'
+                            value={value}
+                            name={this.props.id}
+                            checked={value === this.props.value}
+                            onChange={this.handleChange}
+                            disabled={this.props.disabled}
+                        />
+                        {text}
+                    </label>
+                </div>
+            );
+        }
+
+        return (
+            <Setting
+                label={this.props.label}
+                inputId={this.props.id}
+                helpText={this.props.helpText}
+            >
+                {options}
+            </Setting>
+        );
+    }
+}
+
+RadioSetting.defaultProps = {
+    isDisabled: false
+};
+
+RadioSetting.propTypes = {
+    id: React.PropTypes.string.isRequired,
+    values: React.PropTypes.array.isRequired,
+    label: React.PropTypes.node.isRequired,
+    value: React.PropTypes.string.isRequired,
+    onChange: React.PropTypes.func.isRequired,
+    disabled: React.PropTypes.bool,
+    helpText: React.PropTypes.node
+};
--- a/webapp/components/edit_post_modal.jsx
+++ b/webapp/components/edit_post_modal.jsx
@@ -118,6 +118,17 @@ export default class EditPostModal extends React.Component {
    }

    handleEditPostEvent(options) {
+        var post = PostStore.getPost(options.channelId, options.postId);
+        if (global.window.mm_license.IsLicensed === 'true') {
+            if (global.window.mm_config.AllowEditPost === Constants.ALLOW_EDIT_POST_NEVER) {
+                return;
+            }
+            if (global.window.mm_config.AllowEditPost === Constants.ALLOW_EDIT_POST_TIME_LIMIT) {
+                if ((post.create_at + (global.window.mm_config.PostEditTimeLimit * 1000)) < Utils.getTimestamp()) {
+                    return;
+                }
+            }
+        }
        this.setState({
            editText: options.message || '',
            originalText: options.message || '',
--- a/webapp/components/post_view/components/post_info.jsx
+++ b/webapp/components/post_view/components/post_info.jsx
@@ -8,12 +8,10 @@ import PostTime from './post_time.jsx';
 import * as GlobalActions from 'actions/global_actions.jsx';
 import * as PostActions from 'actions/post_actions.jsx';

-import TeamStore from 'stores/team_store.jsx';
-import UserStore from 'stores/user_store.jsx';
-
 import * as Utils from 'utils/utils.jsx';
 import * as PostUtils from 'utils/post_utils.jsx';
 import Constants from 'utils/constants.jsx';
+import DelayedAction from 'utils/delayed_action.jsx';
 import {Tooltip, OverlayTrigger} from 'react-bootstrap';

 import React from 'react';
@@ -28,6 +26,10 @@ export default class PostInfo extends React.Component {
        this.removePost = this.removePost.bind(this);
        this.flagPost = this.flagPost.bind(this);
        this.unflagPost = this.unflagPost.bind(this);
+
+        this.canEdit = false;
+        this.canDelete = false;
+        this.editDisableAction = new DelayedAction(this.handleEditDisable);
    }

    handleDropdownClick(e) {
@@ -38,6 +40,10 @@ export default class PostInfo extends React.Component {
        }
    }

+    handleEditDisable() {
+        this.canEdit = false;
+    }
+
    componentDidMount() {
        $('#post_dropdown' + this.props.post.id).on('shown.bs.dropdown', () => this.props.handleDropdownOpened(true));
        $('#post_dropdown' + this.props.post.id).on('hidden.bs.dropdown', () => this.props.handleDropdownOpened(false));
@@ -45,9 +51,9 @@ export default class PostInfo extends React.Component {

    createDropdown() {
        var post = this.props.post;
-        var isOwner = this.props.currentUser.id === post.user_id;
-        var isAdmin = TeamStore.isTeamAdminForCurrentTeam() || UserStore.isSystemAdminForCurrentUser();
-        const isSystemMessage = post.type && post.type.startsWith(Constants.SYSTEM_MESSAGE_PREFIX);
+
+        this.canDelete = PostUtils.canDeletePost(post);
+        this.canEdit = PostUtils.canEditPost(post, this.editDisableAction);

        if (post.state === Constants.POST_FAILED || post.state === Constants.POST_LOADING) {
            return '';
@@ -139,7 +145,7 @@ export default class PostInfo extends React.Component {
            </li>
        );

-        if (isOwner || isAdmin) {
+        if (this.canDelete) {
            dropdownContents.push(
                <li
                    key='deletePost'
@@ -162,12 +168,12 @@ export default class PostInfo extends React.Component {
            );
        }

-        if (isOwner && !isSystemMessage) {
+        if (this.canEdit) {
            dropdownContents.push(
                <li
                    key='editPost'
                    role='presentation'
-                    className='dropdown-submenu'
+                    className={this.canEdit ? 'dropdown-submenu' : 'dropdown-submenu hide'}
                >
                    <a
                        href='#'
--- a/webapp/components/rhs_comment.jsx
+++ b/webapp/components/rhs_comment.jsx
@@ -9,9 +9,6 @@ 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 TeamStore from 'stores/team_store.jsx';
-import UserStore from 'stores/user_store.jsx';
-
 import * as GlobalActions from 'actions/global_actions.jsx';
 import {flagPost, unflagPost} from 'actions/post_actions.jsx';

@@ -19,6 +16,7 @@ import * as Utils from 'utils/utils.jsx';
 import * as PostUtils from 'utils/post_utils.jsx';

 import Constants from 'utils/constants.jsx';
+import DelayedAction from 'utils/delayed_action.jsx';
 import {Tooltip, OverlayTrigger} from 'react-bootstrap';

 import {FormattedMessage} from 'react-intl';
@@ -36,6 +34,10 @@ export default class RhsComment extends React.Component {
        this.flagPost = this.flagPost.bind(this);
        this.unflagPost = this.unflagPost.bind(this);

+        this.canEdit = false;
+        this.canDelete = false;
+        this.editDisableAction = new DelayedAction(this.handleEditDisable);
+
        this.state = {};
    }

@@ -44,6 +46,10 @@ export default class RhsComment extends React.Component {
        GlobalActions.showGetPostLinkModal(this.props.post);
    }

+    handleEditDisable() {
+        this.canEdit = false;
+    }
+
    removePost() {
        GlobalActions.emitRemovePost(this.props.post);
    }
@@ -110,8 +116,8 @@ export default class RhsComment extends React.Component {
            return '';
        }

-        const isOwner = this.props.currentUser.id === post.user_id;
-        var isAdmin = TeamStore.isTeamAdminForCurrentTeam() || UserStore.isSystemAdminForCurrentUser();
+        this.canDelete = PostUtils.canDeletePost(post);
+        this.canEdit = PostUtils.canEditPost(post, this.editDisableAction);

        var dropdownContents = [];

@@ -170,7 +176,7 @@ export default class RhsComment extends React.Component {
            </li>
        );

-        if (isOwner || isAdmin) {
+        if (this.canDelete) {
            dropdownContents.push(
                <li
                    role='presentation'
@@ -193,11 +199,12 @@ export default class RhsComment extends React.Component {
            );
        }

-        if (isOwner) {
+        if (this.canEdit) {
            dropdownContents.push(
                <li
                    role='presentation'
                    key='edit-button'
+                    className={this.canEdit ? '' : 'hide'}
                >
                    <a
                        href='#'
--- a/webapp/components/rhs_root_post.jsx
+++ b/webapp/components/rhs_root_post.jsx
@@ -11,7 +11,6 @@ import RhsDropdown from 'components/rhs_dropdown.jsx';

 import ChannelStore from 'stores/channel_store.jsx';
 import UserStore from 'stores/user_store.jsx';
-import TeamStore from 'stores/team_store.jsx';

 import * as GlobalActions from 'actions/global_actions.jsx';
 import {flagPost, unflagPost} from 'actions/post_actions.jsx';
@@ -20,6 +19,7 @@ import * as Utils from 'utils/utils.jsx';
 import * as PostUtils from 'utils/post_utils.jsx';

 import Constants from 'utils/constants.jsx';
+import DelayedAction from 'utils/delayed_action.jsx';
 import {Tooltip, OverlayTrigger} from 'react-bootstrap';

 import {FormattedMessage} from 'react-intl';
@@ -34,6 +34,10 @@ export default class RhsRootPost extends React.Component {
        this.flagPost = this.flagPost.bind(this);
        this.unflagPost = this.unflagPost.bind(this);

+        this.canEdit = false;
+        this.canDelete = false;
+        this.editDisableAction = new DelayedAction(this.handleEditDisable);
+
        this.state = {};
    }

@@ -42,6 +46,10 @@ export default class RhsRootPost extends React.Component {
        GlobalActions.showGetPostLinkModal(this.props.post);
    }

+    handleEditDisable() {
+        this.canEdit = false;
+    }
+
    shouldComponentUpdate(nextProps) {
        if (nextProps.status !== this.props.status) {
            return true;
@@ -96,13 +104,13 @@ export default class RhsRootPost extends React.Component {
        const post = this.props.post;
        const user = this.props.user;
        const mattermostLogo = Constants.MATTERMOST_ICON_SVG;
-        var isOwner = this.props.currentUser.id === post.user_id;
-        var isAdmin = TeamStore.isTeamAdminForCurrentTeam() || UserStore.isSystemAdminForCurrentUser();
-        const isSystemMessage = post.type && post.type.startsWith(Constants.SYSTEM_MESSAGE_PREFIX);
        var timestamp = user ? user.last_picture_update : 0;
        var channel = ChannelStore.get(post.channel_id);
        const flagIcon = Constants.FLAG_ICON_SVG;

+        this.canDelete = PostUtils.canDeletePost(post);
+        this.canEdit = PostUtils.canEditPost(post, this.editDisableAction);
+
        var type = 'Post';
        if (post.root_id.length > 0) {
            type = 'Comment';
@@ -189,7 +197,7 @@ export default class RhsRootPost extends React.Component {
            </li>
        );

-        if (isOwner || isAdmin) {
+        if (this.canDelete) {
            dropdownContents.push(
                <li
                    key='rhs-root-delete'
@@ -209,11 +217,12 @@ export default class RhsRootPost extends React.Component {
            );
        }

-        if (isOwner && !isSystemMessage) {
+        if (this.canEdit) {
            dropdownContents.push(
                <li
                    key='rhs-root-edit'
                    role='presentation'
+                    className={this.canEdit ? '' : 'hide'}
                >
                    <a
                        href='#'