diff --git a/app/screens/post_options/post_option.js b/app/screens/post_options/post_option.js index 2dbeb0dda..30fc70163 100644 --- a/app/screens/post_options/post_option.js +++ b/app/screens/post_options/post_option.js @@ -7,7 +7,9 @@ import { Image, StyleSheet, Text, + Platform, TouchableHighlight, + TouchableNativeFeedback, View, } from 'react-native'; @@ -41,12 +43,28 @@ export default class PostOption extends PureComponent { const {destructive, icon, onPress, text} = this.props; const image = icons[icon]; + const Touchable = Platform.select({ + ios: TouchableHighlight, + android: TouchableNativeFeedback, + }); + + const touchableProps = Platform.select({ + ios: { + underlayColor: 'rgba(0, 0, 0, 0.05)', + }, + android: { + background: TouchableNativeFeedback.Ripple( //eslint-disable-line new-cap + 'rgba(0, 0, 0, 0.05)', + true, + ), + }, + }); + return ( - @@ -58,7 +76,7 @@ export default class PostOption extends PureComponent { - + ); @@ -70,9 +88,6 @@ const style = StyleSheet.create({ height: 51, width: '100%', }, - flex: { - flex: 1, - }, destructive: { color: '#D0021B', }, diff --git a/app/screens/post_options/post_options.js b/app/screens/post_options/post_options.js index 7d4bf2352..ff091e4bd 100644 --- a/app/screens/post_options/post_options.js +++ b/app/screens/post_options/post_options.js @@ -13,7 +13,6 @@ import {BOTTOM_MARGIN} from 'app/components/slide_up_panel/slide_up_panel'; import PostOption from './post_option'; const OPTION_HEIGHT = 50; -const INITIAL_OPTION_COUNT = 6; export default class PostOptions extends PureComponent { static propTypes = { @@ -294,15 +293,19 @@ export default class PostOptions extends PureComponent { handleFlagPost = () => { const {actions, post} = this.props; - actions.flagPost(post.id); this.closeWithAnimation(); + requestAnimationFrame(() => { + actions.flagPost(post.id); + }); }; handlePinPost = () => { const {actions, post} = this.props; - actions.pinPost(post.id); this.closeWithAnimation(); + requestAnimationFrame(() => { + actions.pinPost(post.id); + }); }; handlePostDelete = () => { @@ -361,15 +364,19 @@ export default class PostOptions extends PureComponent { handleUnflagPost = () => { const {actions, post} = this.props; - actions.unflagPost(post.id); this.closeWithAnimation(); + requestAnimationFrame(() => { + actions.unflagPost(post.id); + }); }; handleUnpinPost = () => { const {actions, post} = this.props; - actions.unpinPost(post.id); this.closeWithAnimation(); + requestAnimationFrame(() => { + actions.unpinPost(post.id); + }); }; refSlideUpPanel = (r) => { @@ -379,7 +386,7 @@ export default class PostOptions extends PureComponent { render() { const {deviceHeight} = this.props; const options = this.getPostOptions(); - const initialPosition = (INITIAL_OPTION_COUNT + 1) * OPTION_HEIGHT; + const initialPosition = (options.length + 1) * OPTION_HEIGHT; const marginFromTop = deviceHeight - BOTTOM_MARGIN - ((options.length + 1) * OPTION_HEIGHT); return (