react-native-actionsheet installed
This commit is contained in:
parent
1ce07fbf82
commit
4d03a2f8d3
|
@ -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' // eslint-disable-line
|
||||
import ActionSheet from 'react-native-actionsheet';
|
||||
|
||||
import Card from './Card';
|
||||
import User from './User';
|
||||
import Avatar from '../Avatar';
|
||||
|
||||
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,26 +69,36 @@ export default class Message extends React.PureComponent {
|
|||
const username = item.alias || item.u.username;
|
||||
|
||||
return (
|
||||
<View style={[styles.message, extraStyle]}>
|
||||
<Avatar
|
||||
style={{ marginRight: 10 }}
|
||||
text={item.avatar ? '' : username}
|
||||
size={40}
|
||||
baseUrl={this.props.baseUrl}
|
||||
avatar={item.avatar}
|
||||
/>
|
||||
<View style={[styles.content]}>
|
||||
<User
|
||||
onPress={this._onPress}
|
||||
item={item}
|
||||
Message_TimeFormat={this.props.Message_TimeFormat}
|
||||
<TouchableOpacity onLongPress={() => this.showActions()}>
|
||||
<View style={[styles.message, extraStyle]}>
|
||||
<Avatar
|
||||
style={{ marginRight: 10 }}
|
||||
text={item.avatar ? '' : username}
|
||||
size={40}
|
||||
baseUrl={this.props.baseUrl}
|
||||
avatar={item.avatar}
|
||||
/>
|
||||
<View style={[styles.content]}>
|
||||
<User
|
||||
onPress={this._onPress}
|
||||
item={item}
|
||||
Message_TimeFormat={this.props.Message_TimeFormat}
|
||||
/>
|
||||
{this.attachments()}
|
||||
<Markdown>
|
||||
{msg}
|
||||
</Markdown>
|
||||
</View>
|
||||
<ActionSheet
|
||||
ref={o => this.ActionSheet = o}
|
||||
title={title}
|
||||
options={options}
|
||||
cancelButtonIndex={CANCEL_INDEX}
|
||||
destructiveButtonIndex={DESTRUCTIVE_INDEX}
|
||||
onPress={this.handleActionPress}
|
||||
/>
|
||||
{this.attachments()}
|
||||
<Markdown>
|
||||
{msg}
|
||||
</Markdown>
|
||||
</View>
|
||||
</View>
|
||||
</TouchableOpacity>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1058,12 +1058,6 @@
|
|||
"integrity": "sha1-NOmzALFHnd2Y7HfqC76TQt/jloQ=",
|
||||
"dev": true
|
||||
},
|
||||
"babel-helper-is-react-class": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/babel-helper-is-react-class/-/babel-helper-is-react-class-1.0.0.tgz",
|
||||
"integrity": "sha1-7282eLBcdtve7a3q16+YwnJNhDE=",
|
||||
"dev": true
|
||||
},
|
||||
"babel-helper-is-void-0": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/babel-helper-is-void-0/-/babel-helper-is-void-0-0.2.0.tgz",
|
||||
|
@ -1807,15 +1801,6 @@
|
|||
"babel-runtime": "6.26.0"
|
||||
}
|
||||
},
|
||||
"babel-plugin-transform-react-inline-elements": {
|
||||
"version": "6.22.0",
|
||||
"resolved": "https://registry.npmjs.org/babel-plugin-transform-react-inline-elements/-/babel-plugin-transform-react-inline-elements-6.22.0.tgz",
|
||||
"integrity": "sha1-ZochGjK0mlLyLFc6K1UEol7xfFM=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"babel-runtime": "6.26.0"
|
||||
}
|
||||
},
|
||||
"babel-plugin-transform-react-jsx": {
|
||||
"version": "6.24.1",
|
||||
"resolved": "https://registry.npmjs.org/babel-plugin-transform-react-jsx/-/babel-plugin-transform-react-jsx-6.24.1.tgz",
|
||||
|
@ -1845,15 +1830,6 @@
|
|||
"babel-runtime": "6.26.0"
|
||||
}
|
||||
},
|
||||
"babel-plugin-transform-react-pure-class-to-function": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/babel-plugin-transform-react-pure-class-to-function/-/babel-plugin-transform-react-pure-class-to-function-1.0.1.tgz",
|
||||
"integrity": "sha1-MqZJyX1lMlC0Gc/RSJMxsCkNnuQ=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"babel-helper-is-react-class": "1.0.0"
|
||||
}
|
||||
},
|
||||
"babel-plugin-transform-react-remove-prop-types": {
|
||||
"version": "0.4.10",
|
||||
"resolved": "https://registry.npmjs.org/babel-plugin-transform-react-remove-prop-types/-/babel-plugin-transform-react-remove-prop-types-0.4.10.tgz",
|
||||
|
@ -2178,26 +2154,6 @@
|
|||
"react-transform-hmr": "1.0.4"
|
||||
}
|
||||
},
|
||||
"babel-preset-react-optimize": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/babel-preset-react-optimize/-/babel-preset-react-optimize-1.0.1.tgz",
|
||||
"integrity": "sha1-wjUJ+6fLx2195wUOfSa80ivDBOg=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"babel-plugin-transform-react-constant-elements": "6.23.0",
|
||||
"babel-plugin-transform-react-inline-elements": "6.22.0",
|
||||
"babel-plugin-transform-react-pure-class-to-function": "1.0.1",
|
||||
"babel-plugin-transform-react-remove-prop-types": "0.2.12"
|
||||
},
|
||||
"dependencies": {
|
||||
"babel-plugin-transform-react-remove-prop-types": {
|
||||
"version": "0.2.12",
|
||||
"resolved": "https://registry.npmjs.org/babel-plugin-transform-react-remove-prop-types/-/babel-plugin-transform-react-remove-prop-types-0.2.12.tgz",
|
||||
"integrity": "sha1-NAZpbfC4tFYIn51ybSfn4SPS+Sk=",
|
||||
"dev": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"babel-preset-stage-0": {
|
||||
"version": "6.24.1",
|
||||
"resolved": "https://registry.npmjs.org/babel-preset-stage-0/-/babel-preset-stage-0-6.24.1.tgz",
|
||||
|
@ -12047,6 +12003,11 @@
|
|||
"prop-types": "15.6.0"
|
||||
}
|
||||
},
|
||||
"react-native-actionsheet": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/react-native-actionsheet/-/react-native-actionsheet-2.3.0.tgz",
|
||||
"integrity": "sha1-qVUqNW3Fk5gpBiNTgE1eVgno+Wk="
|
||||
},
|
||||
"react-native-animatable": {
|
||||
"version": "1.2.4",
|
||||
"resolved": "https://registry.npmjs.org/react-native-animatable/-/react-native-animatable-1.2.4.tgz",
|
||||
|
@ -14881,4 +14842,4 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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",
|
||||
|
|
Loading…
Reference in New Issue