FIX: Use old modal style for Android

BlueComponents.js

@@ -427,8 +427,8 @@ export const BlueNavigationStyle = (navigation, withNavigationCloseButton = fals
       fontWeight: '600',
       color: BlueApp.settings.foregroundColor,
     },
-    headerTintColor: BlueApp.settings.foregroundColor,
     headerRight,
+    headerTintColor: BlueApp.settings.foregroundColor,
     // headerBackTitle: null,
     headerBackTitleVisible: false,
   };
@@ -2270,6 +2270,12 @@ export class BlueBitcoinAmount extends Component {
     unit: BitcoinUnit.BTC,
   };
 
+  textInput = React.createRef();
+
+  handleTextInputOnPress = () => {
+    this.textInput.current.focus();
+  };
+
   render() {
     const amount = this.props.amount || '0';
     let localCurrency = loc.formatBalanceWithoutSuffix(amount, BitcoinUnit.LOCAL_CURRENCY, false);
@@ -2282,7 +2288,7 @@ export class BlueBitcoinAmount extends Component {
     }
     if (amount === BitcoinUnit.MAX) localCurrency = ''; // we dont want to display NaN
     return (
-      <TouchableWithoutFeedback disabled={this.props.pointerEvents === 'none'} onPress={() => this.textInput.focus()}>
+      <TouchableWithoutFeedback disabled={this.props.pointerEvents === 'none'} onPress={this.handleTextInputOnPress}>
         <View>
           <View style={{ flexDirection: 'row', justifyContent: 'center', paddingTop: 16, paddingBottom: 2 }}>
             <TextInput
@@ -2318,7 +2324,7 @@ export class BlueBitcoinAmount extends Component {
               }}
               placeholder="0"
               maxLength={10}
-              ref={textInput => (this.textInput = textInput)}
+              ref={this.textInput}
               editable={!this.props.isLoading && !this.props.disabled}
               value={amount}
               placeholderTextColor={this.props.disabled ? BlueApp.settings.buttonDisabledTextColor : BlueApp.settings.alternativeTextColor2}

Navigation.js

@@ -56,21 +56,27 @@ import LNDViewInvoice from './screen/lnd/lndViewInvoice';
 import LNDViewAdditionalInvoiceInformation from './screen/lnd/lndViewAdditionalInvoiceInformation';
 import { Platform } from 'react-native';
 
-const defaultScreenOptions = ({ route, navigation }) => ({
-  gestureEnabled: true,
-  cardOverlayEnabled: true,
-  headerStatusBarHeight: navigation.dangerouslyGetState().routes.indexOf(route) > 0 ? 10 : undefined,
-  ...(Platform.OS === 'ios' ? TransitionPresets.ModalPresentationIOS : TransitionPresets.ModalTransition),
-});
-const defaultStackScreenOptions = {
-  gestureEnabled: true,
-  cardOverlayEnabled: true,
-  headerStatusBarHeight: 10,
-};
+const defaultScreenOptions =
+  Platform.OS === 'ios'
+    ? ({ route, navigation }) => ({
+        gestureEnabled: true,
+        cardOverlayEnabled: true,
+        headerStatusBarHeight: navigation.dangerouslyGetState().routes.indexOf(route) > 0 ? 10 : undefined,
+        ...TransitionPresets.ModalPresentationIOS,
+      })
+    : undefined;
+const defaultStackScreenOptions =
+  Platform.OS === 'ios'
+    ? {
+        gestureEnabled: true,
+        cardOverlayEnabled: true,
+        headerStatusBarHeight: 10,
+      }
+    : undefined;
 const WalletsStack = createStackNavigator();
 const WalletsRoot = () => (
-  <WalletsStack.Navigator screenOptions={{ headerTitle: null, headerBackTitleVisible: false }}>
-    <WalletsStack.Screen name="WalletsList" component={WalletsList} options={{ headerShown: false }} />
+  <WalletsStack.Navigator>
+    <WalletsStack.Screen name="WalletsList" component={WalletsList} options={WalletsList.navigationOptions} />
     <WalletsStack.Screen name="WalletTransactions" component={WalletTransactions} options={WalletTransactions.navigationOptions} />
     <WalletsStack.Screen name="WalletDetails" component={WalletDetails} options={WalletDetails.navigationOptions} />
     <WalletsStack.Screen name="TransactionDetails" component={TransactionDetails} options={TransactionDetails.navigationOptions} />
@@ -87,7 +93,10 @@ const WalletsRoot = () => (
           backgroundColor: '#FFFFFF',
           borderBottomWidth: 0,
           elevation: 0,
+          shadowColor: 'transparent',
         },
+        title: '',
+        headerBackTitleVisible: false,
         headerTintColor: '#0c2550',
       }}
     />

screen/wallets/add.js

@@ -408,4 +408,3 @@ WalletsAdd.propTypes = {
     goBack: PropTypes.func,
   }),
 };
-

screen/wallets/list.js

@@ -22,6 +22,7 @@ import { AppStorage, PlaceholderWallet } from '../../class';
 import WalletImport from '../../class/wallet-import';
 import ActionSheet from '../ActionSheet';
 import ImagePicker from 'react-native-image-picker';
+import NavigationService from '../../NavigationService';
 const EV = require('../../events');
 const A = require('../../analytics');
 let BlueApp: AppStorage = require('../../BlueApp');
@@ -148,6 +149,22 @@ const styles = StyleSheet.create({
 });
 
 export default class WalletsList extends Component {
+  static navigationOptions = ({ navigation, route }) => {
+    return {
+      title: '',
+      headerRight: () => (
+        <TouchableOpacity testID="SettingsButton" style={styles.headerTouch} onPress={() => NavigationService.navigate('Settings')}>
+          <Icon size={22} name="kebab-horizontal" type="octicon" color={BlueApp.settings.foregroundColor} />
+        </TouchableOpacity>
+      ),
+      headerStyle: {
+        shadowColor: 'transparent',
+        elevation: 0,
+        shadowOpacity: 0,
+      },
+    };
+  };
+
   walletsCarousel = React.createRef();
 
   constructor(props) {
@@ -413,16 +430,6 @@ export default class WalletsList extends Component {
     );
   };
 
-  renderNavigationHeader = () => {
-    return (
-      <View style={styles.headerStyle}>
-        <TouchableOpacity testID="SettingsButton" style={styles.headerTouch} onPress={() => this.props.navigation.navigate('Settings')}>
-          <Icon size={22} name="kebab-horizontal" type="octicon" color={BlueApp.settings.foregroundColor} />
-        </TouchableOpacity>
-      </View>
-    );
-  };
-
   renderLocalTrader = () => {
     if (BlueApp.getWallets().length > 0 && !BlueApp.getWallets().some(wallet => wallet.type === PlaceholderWallet.type)) {
       return (
@@ -641,7 +648,6 @@ export default class WalletsList extends Component {
     return (
       <View style={styles.root}>
         <View style={styles.walletsListWrapper}>
-          {this.renderNavigationHeader()}
           <SectionList
             refreshControl={<RefreshControl onRefresh={this.refreshTransactions} refreshing={!this.state.isFlatListRefreshControlHidden} />}
             renderItem={this.renderSectionItem}