react-native-actionsheet installed

app/containers/Message.js

@@ -1,13 +1,19 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { View, StyleSheet } from 'react-native';
+import { View, StyleSheet, TouchableOpacity } from 'react-native';
 import { emojify } from 'react-emojione';
 import Markdown from 'react-native-easy-markdown';
+import ActionSheet from 'react-native-actionsheet';
 
 import Card from './message/Card';
 import Avatar from './Avatar';
 import User from './message/User';
 
+const title = 'Message actions';
+const options = ['Cancel', 'Reply', 'Edit', 'Permalink', 'Copy', 'Quote', 'Star Message', 'Delete'];
+const CANCEL_INDEX = 0;
+const DESTRUCTIVE_INDEX = 7;
+
 const styles = StyleSheet.create({
 	content: {
 		flexGrow: 1,
@@ -29,6 +35,12 @@ export default class Message extends React.PureComponent {
 		Message_TimeFormat: PropTypes.string.isRequired
 	}
 
+	constructor(props) {
+		super(props);
+		this.handleActionPress = this.handleActionPress.bind(this);
+		this.showActions = this.showActions.bind(this);
+	}
+
 	attachments() {
 		return this.props.item.attachments.length ? (
 			<Card
@@ -37,6 +49,14 @@ export default class Message extends React.PureComponent {
 		) : null;
 	}
 
+	showActions() {
+		this.ActionSheet.show();
+	}
+
+	handleActionPress = (i) => {
+		console.log(i);
+	}
+
 	render() {
 		const { item } = this.props;
 
@@ -49,6 +69,7 @@ export default class Message extends React.PureComponent {
 		const username = item.alias || item.u.username;
 
 		return (
+			<TouchableOpacity onLongPress={() => this.showActions()}>
 				<View style={[styles.message, extraStyle]}>
 					<Avatar
 						style={{ marginRight: 10 }}
@@ -68,7 +89,16 @@ export default class Message extends React.PureComponent {
 							{msg}
 						</Markdown>
 					</View>
+					<ActionSheet
+						ref={o => this.ActionSheet = o}
+						title={title}
+						options={options}
+						cancelButtonIndex={CANCEL_INDEX}
+						destructiveButtonIndex={DESTRUCTIVE_INDEX}
+						onPress={this.handleActionPress}
+					/>
 				</View>
+			</TouchableOpacity>
 		);
 	}
 }

package.json

@@ -22,6 +22,7 @@
     "react-emojione": "^5.0.0",
     "react-native": "0.50.3",
     "react-native-action-button": "^2.8.1",
+    "react-native-actionsheet": "^2.3.0",
     "react-native-animatable": "^1.2.4",
     "react-native-card-view": "0.0.3",
     "react-native-easy-markdown": "git+https://github.com/lappalj4/react-native-easy-markdown.git",