REF: Use navigation event isFocused

ios/Podfile.lock

@@ -196,13 +196,13 @@ PODS:
     - React
   - react-native-blur (0.8.0):
     - React
-  - react-native-camera (3.23.1):
+  - react-native-camera (3.26.0):
     - React
-    - react-native-camera/RCT (= 3.23.1)
+    - react-native-camera/RCT (= 3.26.0)
-    - react-native-camera/RN (= 3.23.1)
+    - react-native-camera/RN (= 3.26.0)
-  - react-native-camera/RCT (3.23.1):
+  - react-native-camera/RCT (3.26.0):
     - React
-  - react-native-camera/RN (3.23.1):
+  - react-native-camera/RN (3.26.0):
     - React
   - react-native-document-picker (3.2.0):
     - React
@@ -498,7 +498,7 @@ SPEC CHECKSUMS:
   react-native-biometrics: c892904948a32295b128f633bcc11eda020645c5
   react-native-blue-crypto: 23f1558ad3d38d7a2edb7e2f6ed1bc520ed93e56
   react-native-blur: cad4d93b364f91e7b7931b3fa935455487e5c33c
-  react-native-camera: 6fe72fd0a85732e2449928f9c59a2e0bf661ad3b
+  react-native-camera: 9e3d60336e221d62e5b72adf551ca31ff74a94b5
   react-native-document-picker: e3516aff0dcf65ee0785d9bcf190eb10e2261154
   react-native-image-picker: 3637d63fef7e32a230141ab4660d3ceb773c824f
   react-native-randombytes: 991545e6eaaf700b4ee384c291ef3d572e0b2ca8

package-lock.json

@@ -11712,9 +11712,9 @@
       "from": "git+https://github.com/Overtorment/react-native-blue-crypto.git"
     },
     "react-native-camera": {
-      "version": "3.23.1",
+      "version": "3.26.0",
-      "resolved": "https://registry.npmjs.org/react-native-camera/-/react-native-camera-3.23.1.tgz",
+      "resolved": "https://registry.npmjs.org/react-native-camera/-/react-native-camera-3.26.0.tgz",
-      "integrity": "sha512-ghQT2IhiZiNMDgixD/MrfwgFx9arwOb2z79xDJ8dsz8DFcpBMbXjXZETaAK0WaZ/MWOaY84k0eGlx1hoVT77wQ==",
+      "integrity": "sha512-W/h89LN+jujlzc89nWpvukbfnbFO+Fskf6PR23pP6zminpJDIArHabWLd1mQoJ3p6r+gUJ8I4bgsxUmSMgLAgA==",
       "requires": {
         "prop-types": "^15.6.2"
       }

package.json

@@ -104,7 +104,7 @@
     "react-native": "0.61.5",
     "react-native-biometrics": "git+https://github.com/BlueWallet/react-native-biometrics.git#2.0.0",
     "react-native-blue-crypto": "git+https://github.com/Overtorment/react-native-blue-crypto.git",
-    "react-native-camera": "3.23.1",
+    "react-native-camera": "3.26.0",
     "react-native-default-preference": "1.4.1",
     "react-native-device-info": "4.0.1",
     "react-native-document-picker": "git+https://github.com/BlueWallet/react-native-document-picker.git#9ce83792db340d01b1361d24b19613658abef4aa",

screen/receive/details.js

@@ -1,7 +1,7 @@
 import React, { useEffect, useState, useCallback } from 'react';
 import { View, InteractionManager, Platform, TextInput, KeyboardAvoidingView, Keyboard, StyleSheet, ScrollView } from 'react-native';
 import QRCode from 'react-native-qrcode-svg';
-import { useNavigation, useNavigationParam } from 'react-navigation-hooks';
+import { useNavigation, useNavigationParam, useIsFocused } from 'react-navigation-hooks';
 import {
   BlueLoading,
   SafeBlueArea,
@@ -38,6 +38,7 @@ const ReceiveDetails = () => {
   const [isCustom, setIsCustom] = useState(false);
   const [isCustomModalVisible, setIsCustomModalVisible] = useState(false);
   const { navigate, goBack } = useNavigation();
+  const isFocused = useIsFocused();
 
   const renderReceiveDetails = useCallback(async () => {
     console.log('receive/details - componentDidMount');
@@ -210,7 +211,7 @@ const ReceiveDetails = () => {
               </BlueText>
             </>
           )}
-          {bip21encoded === undefined ? (
+          {bip21encoded === undefined && isFocused ? (
             <View style={{ alignItems: 'center', width: 300, height: 300 }}>
               <BlueLoading />
             </View>

screen/send/ScanQRCode.js

@@ -4,23 +4,21 @@ import { Image, View, TouchableOpacity, Platform } from 'react-native';
 import { RNCamera } from 'react-native-camera';
 import { Icon } from 'react-native-elements';
 import ImagePicker from 'react-native-image-picker';
-import PropTypes from 'prop-types';
+import { useNavigationParam, useNavigation, useIsFocused } from 'react-navigation-hooks';
-import { useNavigationParam, useNavigation } from 'react-navigation-hooks';
 import DocumentPicker from 'react-native-document-picker';
 import RNFS from 'react-native-fs';
 const LocalQRCode = require('@remobile/react-native-qrcode-local-image');
 const createHash = require('create-hash');
 
-const ScanQRCode = ({
+const ScanQRCode = () => {
-  showCloseButton = true,
+  const showCloseButton = useNavigationParam('showCloseButton') || true;
-  // eslint-disable-next-line react-hooks/rules-of-hooks
+  const showFileImportButton = useNavigationParam('showFileImportButton') || false;
-  showFileImportButton = useNavigationParam('showFileImportButton') || false,
-}) => {
   const [isLoading, setIsLoading] = useState(false);
   const { navigate } = useNavigation();
   const launchedBy = useNavigationParam('launchedBy');
   const onBarScanned = useNavigationParam('onBarScanned');
   const scannedCache = {};
+  const isFocused = useIsFocused();
 
   const HashIt = function(s) {
     return createHash('sha256')
@@ -79,9 +77,13 @@ const ScanQRCode = ({
     setIsLoading(false);
   };
 
+  const dismiss = () => {
+    navigate(launchedBy);
+  };
+
   return (
     <View style={{ flex: 1, backgroundColor: '#000000' }}>
-      {!isLoading && (
+      {!isLoading && isFocused && (
         <RNCamera
           captureAudio={false}
           androidCameraPermissionOptions={{
@@ -90,7 +92,7 @@ const ScanQRCode = ({
             buttonPositive: 'OK',
             buttonNegative: 'Cancel',
           }}
-          style={{ flex: 1, justifyContent: 'space-between', backgroundColor: '#000000' }}
+          style={{ flex: 1 }}
           onBarCodeRead={onBarCodeRead}
           barCodeTypes={[RNCamera.Constants.BarCodeType.qr]}
         />
@@ -107,7 +109,7 @@ const ScanQRCode = ({
             right: 16,
             top: 44,
           }}
-          onPress={() => navigate(launchedBy)}
+          onPress={dismiss}
         >
           <Image style={{ alignSelf: 'center' }} source={require('../../img/close-white.png')} />
         </TouchableOpacity>
@@ -175,8 +177,5 @@ const ScanQRCode = ({
 ScanQRCode.navigationOptions = {
   header: null,
 };
-ScanQRCode.propTypes = {
+
-  showFileImportButton: PropTypes.bool,
-  showCloseButton: PropTypes.bool,
-};
 export default ScanQRCode;

screen/wallets/list.js

@@ -1,5 +1,16 @@
 import React, { Component } from 'react';
-import { StatusBar, View, TouchableOpacity, Text, StyleSheet, InteractionManager, RefreshControl, SectionList, Alert, Platform } from 'react-native';
+import {
+  StatusBar,
+  View,
+  TouchableOpacity,
+  Text,
+  StyleSheet,
+  InteractionManager,
+  RefreshControl,
+  SectionList,
+  Alert,
+  Platform,
+} from 'react-native';
 import { BlueScanButton, WalletsCarousel, BlueHeaderDefaultMain, BlueTransactionListItem } from '../../BlueComponents';
 import { Icon } from 'react-native-elements';
 import { NavigationEvents } from 'react-navigation';
@@ -69,7 +80,7 @@ export default class WalletsList extends Component {
    * Forcefully fetches TXs and balance for lastSnappedTo (i.e. current) wallet.
    * Triggered manually by user on pull-to-refresh.
    */
-  refreshTransactions() {
+  refreshTransactions = () => {
     if (!(this.lastSnappedTo < BlueApp.getWallets().length) && this.lastSnappedTo !== undefined) {
       // last card, nop
       console.log('last card, nop');
@@ -103,7 +114,7 @@ export default class WalletsList extends Component {
         });
       },
     );
-  }
+  };
 
   redrawScreen = (scrollToEnd = false) => {
     console.log('wallets/list redrawScreen()');
@@ -459,21 +470,19 @@ export default class WalletsList extends Component {
     });
   };
 
+  onNavigationEventDidFocus = () => {
+    StatusBar.setBarStyle('dark-content');
+    this.redrawScreen();
+  };
+
   render() {
     return (
       <View style={{ flex: 1 }}>
-        <NavigationEvents
+        <NavigationEvents onDidFocus={this.onNavigationEventDidFocus} />
-          onDidFocus={() => {
-            StatusBar.setBarStyle('dark-content');
-            this.redrawScreen();
-          }}
-        />
         <View style={styles.walletsListWrapper}>
           {this.renderNavigationHeader()}
           <SectionList
-            refreshControl={
+            refreshControl={<RefreshControl onRefresh={this.refreshTransactions} refreshing={!this.state.isFlatListRefreshControlHidden} />}
-              <RefreshControl onRefresh={() => this.refreshTransactions()} refreshing={!this.state.isFlatListRefreshControlHidden} />
-            }
             renderItem={this.renderSectionItem}
             keyExtractor={this.sectionListKeyExtractor}
             renderSectionHeader={this.renderSectionHeader}