git ssb

1+

Daan Patchwork / manyverse



Commit 78b220f7b79f7f8cf4582ab82e5cee040b648b6d

dx: [ios] fix MessageFooter buttons

Andre Staltz committed on 1/4/2020, 2:37:13 PM
Parent: 9291c652afdc2c7516775ca9b2c96e90dcacd42d

Files changed

src/frontend/components/Button.tschanged
src/frontend/components/messages/MessageFooter.tschanged
src/frontend/components/Button.tsView
@@ -20,8 +20,13 @@
2020 import {Typography} from '../global-styles/typography';
2121 import {Palette} from '../global-styles/palette';
2222 import {h} from '@cycle/react';
2323
24+const Touchable = Platform.select<any>({
25+ android: TouchableNativeFeedback,
26+ default: TouchableOpacity,
27+});
28+
2429 export const baseContainerStyle = {
2530 borderTopLeftRadius: 3,
2631 borderTopRightRadius: 3,
2732 borderBottomLeftRadius: 3,
@@ -103,35 +108,22 @@
103108 accessible,
104109 accessibilityLabel,
105110 } = this.props;
106111
107- const Touchable = Platform.select<any>({
108- android: TouchableNativeFeedback,
109- default: TouchableOpacity,
110- });
111- const touchableProps = Platform.select<any>({
112- android: {
113- background: TouchableNativeFeedback.Ripple(
114- Palette.transparencyDarkStrong,
115- ),
116- onPress: () => {
117- if (this.props.onPress) {
118- this.props.onPress();
119- }
120- },
121- accessible,
122- accessibilityLabel,
112+ const touchableProps: any = {
113+ onPress: () => {
114+ if (this.props.onPress) {
115+ this.props.onPress();
116+ }
123117 },
124- default: {
125- onPress: () => {
126- if (this.props.onPress) {
127- this.props.onPress();
128- }
129- },
130- accessible,
131- accessibilityLabel,
132- },
133- });
118+ accessible,
119+ accessibilityLabel,
120+ };
121+ if (Platform.OS === 'android') {
122+ touchableProps.background = TouchableNativeFeedback.Ripple(
123+ Palette.transparencyDarkStrong,
124+ );
125+ }
134126
135127 const viewProps = {
136128 style: [
137129 strong ? styles.containerStrong : styles.container,
src/frontend/components/messages/MessageFooter.tsView
@@ -4,9 +4,16 @@
44 * License, v. 2.0. If a copy of the MPL was not distributed with this
55 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
66
77 import {Component, PureComponent} from 'react';
8-import {View, Text, TouchableNativeFeedback, StyleSheet} from 'react-native';
8+import {
9+ View,
10+ Text,
11+ TouchableNativeFeedback,
12+ TouchableOpacity,
13+ StyleSheet,
14+ Platform,
15+} from 'react-native';
916 import {h} from '@cycle/react';
1017 import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
1118 import {Msg, FeedId, PostContent, MsgId} from 'ssb-typescript';
1219 import {Palette} from '../../global-styles/palette';
@@ -14,8 +21,13 @@
1421 import {Typography} from '../../global-styles/typography';
1522 import {Likes} from '../../ssb/types';
1623 import React = require('react');
1724
25+const Touchable = Platform.select<any>({
26+ android: TouchableNativeFeedback,
27+ default: TouchableOpacity,
28+});
29+
1830 export const styles = StyleSheet.create({
1931 row: {
2032 flexDirection: 'row',
2133 flex: 1,
@@ -123,19 +135,19 @@
123135 ]),
124136 ]),
125137 ];
126138
139+ const touchableProps: any = {
140+ onPress,
141+ accessible: true,
142+ accessibilityLabel: 'Like Count Button',
143+ };
144+ if (Platform.OS === 'android') {
145+ touchableProps.background = TouchableNativeFeedback.SelectableBackground();
146+ }
147+
127148 if (count > 0) {
128- return h(
129- TouchableNativeFeedback,
130- {
131- background: TouchableNativeFeedback.SelectableBackground(),
132- onPress,
133- accessible: true,
134- accessibilityLabel: 'Like Count Button',
135- },
136- likesComponent,
137- );
149+ return h(Touchable, touchableProps, likesComponent);
138150 } else {
139151 return h(React.Fragment, likesComponent);
140152 }
141153 }
@@ -164,23 +176,23 @@
164176 : toggled
165177 ? 'yes'
166178 : 'no';
167179
168- return h(
169- TouchableNativeFeedback,
170- {
171- background: TouchableNativeFeedback.SelectableBackground(),
172- onPress: this.onPress,
173- accessible: true,
174- accessibilityLabel: 'Like Button',
175- },
176- [
177- h(View, {style: styles.likeButton}, [
178- h(Icon, iconProps[ilike + 'Liked']),
179- h(Text, {style: styles.likeButtonLabel}, 'Like'),
180- ]),
181- ],
182- );
180+ const touchableProps: any = {
181+ onPress: this.onPress,
182+ accessible: true,
183+ accessibilityLabel: 'Like Button',
184+ };
185+ if (Platform.OS === 'android') {
186+ touchableProps.background = TouchableNativeFeedback.SelectableBackground();
187+ }
188+
189+ return h(Touchable, touchableProps, [
190+ h(View, {style: styles.likeButton}, [
191+ h(Icon, iconProps[ilike + 'Liked']),
192+ h(Text, {style: styles.likeButtonLabel}, 'Like'),
193+ ]),
194+ ]);
183195 }
184196 }
185197
186198 type RProps = {
@@ -188,23 +200,23 @@
188200 };
189201
190202 class ReplyButton extends PureComponent<RProps> {
191203 public render() {
192- return h(
193- TouchableNativeFeedback,
194- {
195- background: TouchableNativeFeedback.SelectableBackground(),
196- onPress: this.props.onPress,
197- accessible: true,
198- accessibilityLabel: 'Reply Button',
199- },
200- [
201- h(View, {style: styles.replyButton}, [
202- h(Icon, iconProps.reply),
203- h(Text, {style: styles.replyButtonLabel}, 'Comment'),
204- ]),
205- ],
206- );
204+ const touchableProps: any = {
205+ onPress: this.props.onPress,
206+ accessible: true,
207+ accessibilityLabel: 'Reply Button',
208+ };
209+ if (Platform.OS === 'android') {
210+ touchableProps.background = TouchableNativeFeedback.SelectableBackground();
211+ }
212+
213+ return h(Touchable, touchableProps, [
214+ h(View, {style: styles.replyButton}, [
215+ h(Icon, iconProps.reply),
216+ h(Text, {style: styles.replyButtonLabel}, 'Comment'),
217+ ]),
218+ ]);
207219 }
208220 }
209221
210222 export type Props = {

Built with git-ssb-web