message bug

app/actions/actionsTypes.js

@@ -31,6 +31,8 @@ export const ROOM = createRequestTypes('ROOM', ['ADD_USER_TYPING', 'REMOVE_USER_
 export const APP = createRequestTypes('APP', ['READY', 'INIT']);
 export const MESSAGES = createRequestTypes('MESSAGES', [
 	...defaultTypes,
+	'ACTIONS_SHOW',
+	'ACTIONS_HIDE',
 	'DELETE_REQUEST',
 	'DELETE_SUCCESS',
 	'DELETE_FAILURE',

app/actions/messages.js

@@ -20,6 +20,19 @@ export function messagesFailure(err) {
 	};
 }
 
+export function actionsShow(actionMessage) {
+	return {
+		type: types.MESSAGES.ACTIONS_SHOW,
+		actionMessage
+	};
+}
+
+export function actionsHide() {
+	return {
+		type: types.MESSAGES.ACTIONS_HIDE
+	};
+}
+
 export function deleteRequest(message) {
 	return {
 		type: types.MESSAGES.DELETE_REQUEST,

app/containers/MessageActions.js

@@ -0,0 +1,311 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Alert, Clipboard } from 'react-native';
+import { connect } from 'react-redux';
+import ActionSheet from 'react-native-actionsheet';
+import * as moment from 'moment';
+
+import realm from '../lib/realm';
+import {
+	deleteRequest,
+	editInit,
+	starRequest,
+	permalinkRequest,
+	permalinkClear,
+	togglePinRequest,
+	setInput,
+	actionsHide
+} from '../actions/messages';
+
+@connect(
+	state => ({
+		showActions: state.messages.showActions,
+		actionMessage: state.messages.actionMessage,
+		user: state.login.user,
+		usersTyping: state.room.usersTyping,
+		server: state.server.server,
+		Site_Url: state.settings.Site_Url,
+		Message_TimeFormat: state.settings.Message_TimeFormat,
+		loading: state.messages.isFetching,
+		permissions: state.permissions,
+		permalink: state.messages.permalink,
+		Message_AllowDeleting: state.settings.Message_AllowDeleting,
+		Message_AllowDeleting_BlockDeleteInMinutes: state.settings.Message_AllowDeleting_BlockDeleteInMinutes,
+		Message_AllowEditing: state.settings.Message_AllowEditing,
+		Message_AllowEditing_BlockEditInMinutes: state.settings.Message_AllowEditing_BlockEditInMinutes,
+		Message_AllowPinning: state.settings.Message_AllowPinning,
+		Message_AllowStarring: state.settings.Message_AllowStarring
+	}),
+	dispatch => ({
+		actionsHide: () => dispatch(actionsHide()),
+		deleteRequest: message => dispatch(deleteRequest(message)),
+		editInit: message => dispatch(editInit(message)),
+		starRequest: message => dispatch(starRequest(message)),
+		permalinkRequest: message => dispatch(permalinkRequest(message)),
+		permalinkClear: () => dispatch(permalinkClear()),
+		togglePinRequest: message => dispatch(togglePinRequest(message)),
+		setInput: message => dispatch(setInput(message))
+	})
+)
+export default class MessageActions extends React.Component {
+	static propTypes = {
+		actionsHide: PropTypes.func.isRequired,
+		showActions: PropTypes.bool.isRequired,
+		rid: PropTypes.string,
+		actionMessage: PropTypes.object,
+		user: PropTypes.object,
+		permissions: PropTypes.object.isRequired,
+		deleteRequest: PropTypes.func.isRequired,
+		editInit: PropTypes.func.isRequired,
+		starRequest: PropTypes.func.isRequired,
+		permalinkRequest: PropTypes.func.isRequired,
+		permalinkClear: PropTypes.func.isRequired,
+		togglePinRequest: PropTypes.func.isRequired,
+		setInput: PropTypes.func.isRequired,
+		permalink: PropTypes.string,
+		Message_AllowDeleting: PropTypes.bool,
+		Message_AllowDeleting_BlockDeleteInMinutes: PropTypes.number,
+		Message_AllowEditing: PropTypes.bool,
+		Message_AllowEditing_BlockEditInMinutes: PropTypes.number,
+		Message_AllowPinning: PropTypes.bool,
+		Message_AllowStarring: PropTypes.bool,
+		hasEditPermission: PropTypes.bool,
+		hasDeletePermission: PropTypes.bool,
+		hasForceDeletePermission: PropTypes.bool
+	};
+
+	constructor(props) {
+		super(props);
+		this.state = {
+			copyPermalink: false,
+			reply: false,
+			quote: false
+		};
+		this.handleActionPress = this.handleActionPress.bind(this);
+		this.options = ['Cancel', 'Delete'];
+		// permissions
+		this.room = realm.objects('subscriptions').filtered('rid = $0', this.props.rid);
+		const { roles } = this.room[0];
+		const roomRoles = Array.from(Object.keys(roles), i => roles[i].value);
+		const userRoles = this.props.user.roles || [];
+		const mergedRoles = [...new Set([...roomRoles, ...userRoles])];
+		this.hasEditPermission = this.props.permissions['edit-message']
+			.some(item => mergedRoles.indexOf(item) !== -1);
+		this.hasDeletePermission = this.props.permissions['delete-message']
+			.some(item => mergedRoles.indexOf(item) !== -1);
+		this.hasForceDeletePermission = this.props.permissions['force-delete-message']
+			.some(item => mergedRoles.indexOf(item) !== -1);
+	}
+
+	async componentWillReceiveProps(nextProps) {
+		if (nextProps.showActions !== this.props.showActions && nextProps.showActions) {
+			// Cancel
+			this.options = ['Cancel'];
+			this.CANCEL_INDEX = 0;
+			// Reply
+			this.options.push('Reply');
+			this.REPLY_INDEX = this.options.length - 1;
+			// Edit
+			// if (this.allowEdit()) {
+			// 	this.options.push('Edit');
+			// 	this.EDIT_INDEX = this.options.length - 1;
+			// }
+			// // Permalink
+			// this.options.push('Copy Permalink');
+			// this.PERMALINK_INDEX = this.options.length - 1;
+			// // Copy
+			// this.options.push('Copy Message');
+			// this.COPY_INDEX = this.options.length - 1;
+			// // Quote
+			// this.options.push('Quote');
+			// this.QUOTE_INDEX = this.options.length - 1;
+			// // Star
+			// if (this.props.Message_AllowStarring) {
+			// 	this.options.push('Star');
+			// 	this.STAR_INDEX = this.options.length - 1;
+			// }
+			// // Pin
+			// if (this.props.Message_AllowPinning) {
+			// 	this.options.push('Pin');
+			// 	this.PIN_INDEX = this.options.length - 1;
+			// }
+			// // Delete
+			// if (this.allowDelete()) {
+			// 	this.options.push('Delete');
+			// 	this.DELETE_INDEX = this.options.length - 1;
+			// }
+			setTimeout(() => {
+				this.ActionSheet.show();
+			});
+		} else if (this.props.permalink !== nextProps.permalink && nextProps.permalink) {
+			// copy permalink
+			if (this.state.copyPermalink) {
+				this.setState({ copyPermalink: false });
+				await Clipboard.setString(nextProps.permalink);
+				Alert.alert('Permalink copied to clipboard!');
+				this.props.permalinkClear();
+			// quote
+			} else if (this.state.quote) {
+				this.setState({ quote: false });
+				const msg = `[ ](${ nextProps.permalink }) `;
+				this.props.setInput({ msg });
+
+			// reply
+			} else if (this.state.reply) {
+				this.setState({ reply: false });
+				let msg = `[ ](${ nextProps.permalink }) `;
+
+				// if original message wasn't sent by current user and neither from a direct room
+				if (this.props.user.username !== this.props.actionMessage.u.username && this.room[0].t !== 'd') {
+					msg += `@${ this.props.actionMessage.u.username } `;
+				}
+				this.props.setInput({ msg });
+			}
+		}
+	}
+
+	isOwn = () => this.props.actionMessage.u && this.props.actionMessage.u._id === this.props.user.id;
+
+	allowEdit = () => {
+		const editOwn = this.isOwn();
+		const { Message_AllowEditing: isEditAllowed, hasEditPermission } = this.props;
+		if (!(hasEditPermission || (isEditAllowed && editOwn))) {
+			return false;
+		}
+		const blockEditInMinutes = this.props.Message_AllowEditing_BlockEditInMinutes;
+		if (blockEditInMinutes) {
+			let msgTs;
+			if (this.props.actionMessage.ts != null) {
+				msgTs = moment(this.props.actionMessage.ts);
+			}
+			let currentTsDiff;
+			if (msgTs != null) {
+				currentTsDiff = moment().diff(msgTs, 'minutes');
+			}
+			return currentTsDiff < blockEditInMinutes;
+		}
+		return true;
+	}
+
+	allowDelete = () => {
+		const deleteOwn = this.isOwn();
+		const { hasDeletePermission, hasForceDeletePermission, Message_AllowDeleting: isDeleteAllowed } = this.props;
+		if (!(hasDeletePermission || (isDeleteAllowed && deleteOwn) || this.props.hasForceDeletePermission)) {
+			return false;
+		}
+		if (hasForceDeletePermission) {
+			return true;
+		}
+		const blockDeleteInMinutes = this.props.Message_AllowDeleting_BlockDeleteInMinutes;
+		if (blockDeleteInMinutes != null && blockDeleteInMinutes !== 0) {
+			let msgTs;
+			if (this.props.actionMessage.ts != null) {
+				msgTs = moment(this.props.actionMessage.ts);
+			}
+			let currentTsDiff;
+			if (msgTs != null) {
+				currentTsDiff = moment().diff(msgTs, 'minutes');
+			}
+			return currentTsDiff < blockDeleteInMinutes;
+		}
+		return true;
+	}
+
+	handleDelete() {
+		Alert.alert(
+			'Are you sure?',
+			'You will not be able to recover this message!',
+			[
+				{
+					text: 'Cancel',
+					style: 'cancel'
+				},
+				{
+					text: 'Yes, delete it!',
+					style: 'destructive',
+					onPress: () => this.props.deleteRequest(this.props.actionMessage)
+				}
+			],
+			{ cancelable: false }
+		);
+	}
+
+	handleEdit() {
+		const { _id, msg, rid } = this.props.actionMessage;
+		this.props.editInit({ _id, msg, rid });
+	}
+
+	handleCopy = async() => {
+		await Clipboard.setString(this.props.actionMessage.msg);
+		Alert.alert('Copied to clipboard!');
+	}
+
+	handleStar() {
+		this.props.starRequest(this.props.actionMessage);
+	}
+
+	handlePermalink() {
+		this.setState({ copyPermalink: true });
+		console.warn(this.props.actionMessage)
+		this.props.permalinkRequest(this.props.actionMessage);
+	}
+
+	handlePin() {
+		this.props.togglePinRequest(this.props.actionMessage);
+	}
+
+	handleReply() {
+		this.setState({ reply: true });
+		this.props.permalinkRequest(this.props.actionMessage);
+	}
+
+	handleQuote() {
+		this.setState({ quote: true });
+		this.props.permalinkRequest(this.props.actionMessage);
+	}
+
+	handleActionPress = (actionIndex) => {
+		switch (actionIndex) {
+			case this.REPLY_INDEX:
+				this.handleReply();
+				break;
+			case this.EDIT_INDEX:
+				this.handleEdit();
+				break;
+			case this.PERMALINK_INDEX:
+				this.handlePermalink();
+				break;
+			case this.COPY_INDEX:
+				this.handleCopy();
+				break;
+			case this.QUOTE_INDEX:
+				this.handleQuote();
+				break;
+			case this.STAR_INDEX:
+				this.handleStar();
+				break;
+			case this.PIN_INDEX:
+				this.handlePin();
+				break;
+			case this.DELETE_INDEX:
+				this.handleDelete();
+				break;
+			default:
+				break;
+		}
+		// this.props.actionsHide();
+	}
+
+	render() {
+		return (
+			<ActionSheet
+				ref={o => this.ActionSheet = o}
+				title='Messages actions'
+				options={this.options}
+				cancelButtonIndex={this.CANCEL_INDEX}
+				destructiveButtonIndex={this.DELETE_INDEX}
+				onPress={this.handleActionPress}
+			/>
+		);
+	}
+}

app/containers/MessageBox.js

@@ -56,7 +56,7 @@ export default class MessageBox extends React.Component {
 	}
 
 	componentWillReceiveProps(nextProps) {
-		if (this.props.message !== nextProps.message && nextProps.message) {
+		if (this.props.message !== nextProps.message && nextProps.message && nextProps.editing) {
 			this.component.setNativeProps({ text: nextProps.message.msg });
 			this.component.focus();
 		} else if (!nextProps.message) {

app/containers/message/User.js

@@ -31,7 +31,7 @@ const styles = StyleSheet.create({
 	}
 });
 
-export default class Message extends React.PureComponent {
+export default class User extends React.PureComponent {
 	static propTypes = {
 		item: PropTypes.object.isRequired,
 		Message_TimeFormat: PropTypes.string.isRequired,

app/containers/message/index.js

@@ -1,24 +1,14 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { View, StyleSheet, TouchableOpacity, Text, Alert, Clipboard } from 'react-native';
+import { View, StyleSheet, TouchableOpacity, Text } from 'react-native';
 import { emojify } from 'react-emojione';
 import Markdown from 'react-native-easy-markdown'; // eslint-disable-line
-import ActionSheet from 'react-native-actionsheet';
 import { connect } from 'react-redux';
-import * as moment from 'moment';
 
+import { actionsShow } from '../../actions/messages';
 import Card from './Card';
 import User from './User';
 import Avatar from '../Avatar';
-import {
-	deleteRequest,
-	editInit,
-	starRequest,
-	permalinkRequest,
-	permalinkClear,
-	togglePinRequest,
-	setInput
-} from '../../actions/messages';
 
 const styles = StyleSheet.create({
 	content: {
@@ -43,169 +33,23 @@ const styles = StyleSheet.create({
 
 @connect(state => ({
 	message: state.messages.message,
-	permalink: state.messages.permalink,
+	editing: state.messages.editing
-	user: state.login.user,
-	Message_AllowDeleting: state.settings.Message_AllowDeleting,
-	Message_AllowDeleting_BlockDeleteInMinutes: state.settings.Message_AllowDeleting_BlockDeleteInMinutes,
-	Message_AllowEditing: state.settings.Message_AllowEditing,
-	Message_AllowEditing_BlockEditInMinutes: state.settings.Message_AllowEditing_BlockEditInMinutes,
-	Message_AllowPinning: state.settings.Message_AllowPinning,
-	Message_AllowStarring: state.settings.Message_AllowStarring
 }), dispatch => ({
-	deleteRequest: message => dispatch(deleteRequest(message)),
+	actionsShow: actionMessage => dispatch(actionsShow(actionMessage))
-	editInit: message => dispatch(editInit(message)),
-	starRequest: message => dispatch(starRequest(message)),
-	permalinkRequest: message => dispatch(permalinkRequest(message)),
-	togglePinRequest: message => dispatch(togglePinRequest(message)),
-	setInput: message => dispatch(setInput(message)),
-	permalinkClear: () => dispatch(permalinkClear())
 }))
 export default class Message extends React.Component {
 	static propTypes = {
 		item: PropTypes.object.isRequired,
-		room: PropTypes.object.isRequired,
 		baseUrl: PropTypes.string.isRequired,
 		Message_TimeFormat: PropTypes.string.isRequired,
-		deleteRequest: PropTypes.func.isRequired,
+		message: PropTypes.object.isRequired,
-		editInit: PropTypes.func.isRequired,
+		editing: PropTypes.bool,
-		starRequest: PropTypes.func.isRequired,
+		actionsShow: PropTypes.func
-		permalinkRequest: PropTypes.func.isRequired,
-		permalinkClear: PropTypes.func.isRequired,
-		togglePinRequest: PropTypes.func.isRequired,
-		setInput: PropTypes.func.isRequired,
-		user: PropTypes.object.isRequired,
-		message: PropTypes.object,
-		permalink: PropTypes.string,
-		Message_AllowDeleting: PropTypes.bool,
-		Message_AllowDeleting_BlockDeleteInMinutes: PropTypes.number,
-		Message_AllowEditing: PropTypes.bool,
-		Message_AllowEditing_BlockEditInMinutes: PropTypes.number,
-		Message_AllowPinning: PropTypes.bool,
-		Message_AllowStarring: PropTypes.bool,
-		hasEditPermission: PropTypes.bool,
-		hasDeletePermission: PropTypes.bool,
-		hasForceDeletePermission: PropTypes.bool
 	}
 
-	constructor(props) {
+	onLongPress() {
-		super(props);
+		const { item } = this.props;
-		this.state = {
+		this.props.actionsShow(item);
-			copyPermalink: false,
-			reply: false,
-			quote: false
-		};
-		this.handleActionPress = this.handleActionPress.bind(this);
-		this.showActions = this.showActions.bind(this);
-		// Cancel
-		this.options = ['Cancel'];
-		this.CANCEL_INDEX = 0;
-		// Reply
-		this.options.push('Reply');
-		this.REPLY_INDEX = this.options.length - 1;
-		// Edit
-		if (this.allowEdit()) {
-			this.options.push('Edit');
-			this.EDIT_INDEX = this.options.length - 1;
-		}
-		// Permalink
-		this.options.push('Copy Permalink');
-		this.PERMALINK_INDEX = this.options.length - 1;
-		// Copy
-		this.options.push('Copy Message');
-		this.COPY_INDEX = this.options.length - 1;
-		// Quote
-		this.options.push('Quote');
-		this.QUOTE_INDEX = this.options.length - 1;
-		// Star
-		if (this.props.Message_AllowStarring) {
-			this.options.push('Star');
-			this.STAR_INDEX = this.options.length - 1;
-		}
-		// Pin
-		if (this.props.Message_AllowPinning) {
-			this.options.push('Pin');
-			this.PIN_INDEX = this.options.length - 1;
-		}
-		// Delete
-		if (this.allowDelete()) {
-			this.options.push('Delete');
-			this.DELETE_INDEX = this.options.length - 1;
-		}
-	}
-
-	async componentWillReceiveProps(nextProps) {
-		if (this.props.permalink !== nextProps.permalink && nextProps.permalink) {
-			// copy permalink
-			if (this.state.copyPermalink) {
-				this.setState({ copyPermalink: false });
-				await Clipboard.setString(nextProps.permalink);
-				Alert.alert('Permalink copied to clipboard!');
-				this.props.permalinkClear();
-			// quote
-			} else if (this.state.quote) {
-				this.setState({ quote: false });
-				const msg = `[ ](${ nextProps.permalink }) `;
-				this.props.setInput({ msg });
-
-			// reply
-			} else if (this.state.reply) {
-				this.setState({ reply: false });
-				let msg = `[ ](${ nextProps.permalink }) `;
-
-				// if original message wasn't sent by current user and neither from a direct room
-				if (this.props.user.username !== this.props.item.u.username && this.props.room.t !== 'd') {
-					msg += `@${ this.props.item.u.username } `;
-				}
-				this.props.setInput({ msg });
-			}
-		}
-	}
-
-	isOwn = () => this.props.item.u && this.props.item.u._id === this.props.user.id;
-
-	allowEdit = () => {
-		const editOwn = this.isOwn();
-		const { Message_AllowEditing: isEditAllowed, hasEditPermission } = this.props;
-		if (!(hasEditPermission || (isEditAllowed && editOwn))) {
-			return false;
-		}
-		const blockEditInMinutes = this.props.Message_AllowEditing_BlockEditInMinutes;
-		if (blockEditInMinutes) {
-			let msgTs;
-			if (this.props.item.ts != null) {
-				msgTs = moment(this.props.item.ts);
-			}
-			let currentTsDiff;
-			if (msgTs != null) {
-				currentTsDiff = moment().diff(msgTs, 'minutes');
-			}
-			return currentTsDiff < blockEditInMinutes;
-		}
-		return true;
-	}
-
-	allowDelete = () => {
-		const deleteOwn = this.isOwn();
-		const { hasDeletePermission, hasForceDeletePermission, Message_AllowDeleting: isDeleteAllowed } = this.props;
-		if (!(hasDeletePermission || (isDeleteAllowed && deleteOwn) || this.props.hasForceDeletePermission)) {
-			return false;
-		}
-		if (hasForceDeletePermission) {
-			return true;
-		}
-		const blockDeleteInMinutes = this.props.Message_AllowDeleting_BlockDeleteInMinutes;
-		if (blockDeleteInMinutes != null && blockDeleteInMinutes !== 0) {
-			let msgTs;
-			if (this.props.item.ts != null) {
-				msgTs = moment(this.props.item.ts);
-			}
-			let currentTsDiff;
-			if (msgTs != null) {
-				currentTsDiff = moment().diff(msgTs, 'minutes');
-			}
-			return currentTsDiff < blockDeleteInMinutes;
-		}
-		return true;
 	}
 
 	isDeleted() {
@@ -220,93 +64,6 @@ export default class Message extends React.Component {
 		) : null;
 	}
 
-	showActions = () => {
-		this.ActionSheet.show();
-	}
-
-	handleDelete() {
-		Alert.alert(
-			'Are you sure?',
-			'You will not be able to recover this message!',
-			[
-				{
-					text: 'Cancel',
-					style: 'cancel'
-				},
-				{
-					text: 'Yes, delete it!',
-					style: 'destructive',
-					onPress: () => this.props.deleteRequest(this.props.item)
-				}
-			],
-			{ cancelable: false }
-		);
-	}
-
-	handleEdit() {
-		const { _id, msg, rid } = this.props.item;
-		this.props.editInit({ _id, msg, rid });
-	}
-
-	handleCopy = async() => {
-		await Clipboard.setString(this.props.item.msg);
-		Alert.alert('Copied to clipboard!');
-	}
-
-	handleStar() {
-		this.props.starRequest(this.props.item);
-	}
-
-	handlePermalink() {
-		this.setState({ copyPermalink: true });
-		this.props.permalinkRequest(this.props.item);
-	}
-
-	handlePin() {
-		this.props.togglePinRequest(this.props.item);
-	}
-
-	handleReply() {
-		this.setState({ reply: true });
-		this.props.permalinkRequest(this.props.item);
-	}
-
-	handleQuote() {
-		this.setState({ quote: true });
-		this.props.permalinkRequest(this.props.item);
-	}
-
-	handleActionPress = (actionIndex) => {
-		switch (actionIndex) {
-			case this.REPLY_INDEX:
-				this.handleReply();
-				break;
-			case this.EDIT_INDEX:
-				this.handleEdit();
-				break;
-			case this.PERMALINK_INDEX:
-				this.handlePermalink();
-				break;
-			case this.COPY_INDEX:
-				this.handleCopy();
-				break;
-			case this.QUOTE_INDEX:
-				this.handleQuote();
-				break;
-			case this.STAR_INDEX:
-				this.handleStar();
-				break;
-			case this.PIN_INDEX:
-				this.handlePin();
-				break;
-			case this.DELETE_INDEX:
-				this.handleDelete();
-				break;
-			default:
-				break;
-		}
-	}
-
 	renderMessageContent() {
 		if (this.isDeleted()) {
 			return <Text style={styles.textInfo}>Message removed</Text>;
@@ -321,7 +78,9 @@ export default class Message extends React.Component {
 	}
 
 	render() {
-		const { item } = this.props;
+		const {
+			item, message, editing
+		} = this.props;
 
 		const extraStyle = {};
 		if (item.temp) {
@@ -329,11 +88,11 @@ export default class Message extends React.Component {
 		}
 
 		const username = item.alias || item.u.username;
-		const isEditing = this.props.message._id === item._id;
+		const isEditing = message._id === item._id && editing;
 
 		return (
 			<TouchableOpacity
-				onLongPress={() => this.showActions()}
+				onLongPress={() => this.onLongPress()}
 				disabled={this.isDeleted()}
 				style={[styles.message, extraStyle, isEditing ? styles.editing : null]}
 			>
@@ -354,14 +113,6 @@ export default class Message extends React.Component {
 					{this.attachments()}
 					{this.renderMessageContent(item)}
 				</View>
-				<ActionSheet
-					ref={o => this.ActionSheet = o}
-					title='Messages actions'
-					options={this.options}
-					cancelButtonIndex={this.CANCEL_INDEX}
-					destructiveButtonIndex={this.DELETE_INDEX}
-					onPress={this.handleActionPress}
-				/>
 			</TouchableOpacity>
 		);
 	}

app/reducers/messages.js

@@ -4,8 +4,10 @@ const initialState = {
 	isFetching: false,
 	failure: false,
 	message: {},
+	actionMessage: {},
 	editing: false,
-	permalink: ''
+	permalink: '',
+	showActions: false
 };
 
 export default function messages(state = initialState, action) {
@@ -27,6 +29,17 @@ export default function messages(state = initialState, action) {
 				failure: true,
 				errorMessage: action.err
 			};
+		case types.MESSAGES.ACTIONS_SHOW:
+			return {
+				...state,
+				showActions: true,
+				actionMessage: action.actionMessage
+			};
+		case types.MESSAGES.ACTIONS_HIDE:
+			return {
+				...state,
+				showActions: false
+			};
 		case types.MESSAGES.EDIT_INIT:
 			return {
 				...state,

app/views/RoomView.js

@@ -11,6 +11,7 @@ import { editCancel } from '../actions/messages';
 import realm from '../lib/realm';
 import RocketChat from '../lib/rocketchat';
 import Message from '../containers/message';
+import MessageActions from '../containers/MessageActions';
 import MessageBox from '../containers/MessageBox';
 import KeyboardView from '../presentation/KeyboardView';
 
@@ -55,8 +56,7 @@ const styles = StyleSheet.create({
 		server: state.server.server,
 		Site_Url: state.settings.Site_Url,
 		Message_TimeFormat: state.settings.Message_TimeFormat,
-		loading: state.messages.isFetching,
+		loading: state.messages.isFetching
-		permissions: state.permissions
 	}),
 	dispatch => ({
 		actions: bindActionCreators(actions, dispatch),
@@ -77,8 +77,7 @@ export default class RoomView extends React.Component {
 		Message_TimeFormat: PropTypes.string,
 		loading: PropTypes.bool,
 		usersTyping: PropTypes.array,
-		user: PropTypes.object,
+		user: PropTypes.object
-		permissions: PropTypes.object.isRequired
 	};
 
 	constructor(props) {
@@ -101,18 +100,6 @@ export default class RoomView extends React.Component {
 			loaded: true,
 			joined: typeof props.rid === 'undefined'
 		};
-
-		// permissions
-		const { roles } = this.room[0];
-		const roomRoles = Array.from(Object.keys(roles), i => roles[i].value);
-		const userRoles = this.props.user.roles || [];
-		const mergedRoles = [...new Set([...roomRoles, ...userRoles])];
-		this.hasEditPermission = this.props.permissions['edit-message']
-			.some(item => mergedRoles.indexOf(item) !== -1);
-		this.hasDeletePermission = this.props.permissions['delete-message']
-			.some(item => mergedRoles.indexOf(item) !== -1);
-		this.hasForceDeletePermission = this.props.permissions['force-delete-message']
-			.some(item => mergedRoles.indexOf(item) !== -1);
 	}
 
 	componentWillMount() {
@@ -193,10 +180,6 @@ export default class RoomView extends React.Component {
 			item={item}
 			baseUrl={this.props.Site_Url}
 			Message_TimeFormat={this.props.Message_TimeFormat}
-			room={this.room}
-			hasEditPermission={this.hasEditPermission}
-			hasDeletePermission={this.hasDeletePermission}
-			hasForceDeletePermission={this.hasForceDeletePermission}
 		/>
 	);
 
@@ -242,6 +225,7 @@ export default class RoomView extends React.Component {
 				</SafeAreaView>
 				{this.renderFooter()}
 				<Text style={styles.typing}>{this.usersTyping}</Text>
+				<MessageActions rid={this.rid} />
 			</KeyboardView>
 		);
 	}