Merge pull request #1356 from kaloudis/tor-icon-location

Tor icon: move out of BalancePane and into WalletHeader
ZeusLN · Mar 15, 2023 · f4fadb0 · f4fadb0
2 parents 55ea7de + 8944ca5
commit f4fadb0
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 28 deletions.
diff --git a/components/WalletHeader.tsx b/components/WalletHeader.tsx
@@ -29,6 +29,8 @@ import { Row } from '../components/layout/Row';
 
 const Contact = require('../assets/images/Mascot.png');
 
+const TorIcon = require('../assets/images/tor.png');
+
 const protectedNavigation = async (
     navigation: any,
     route: string,
@@ -194,6 +196,7 @@ export default class WalletHeader extends React.Component<
         );
 
         const displayName = selectedNode && selectedNode.nickname;
+        const nodeAddress = SettingsStore.host || SettingsStore.url;
 
         let infoValue: string;
         if (NodeInfoStore.nodeInfo.isTestNet) {
@@ -217,6 +220,26 @@ export default class WalletHeader extends React.Component<
             ) : null;
         };
 
+        const TorBadge = () => (
+            <>
+                {nodeAddress && nodeAddress.includes('.onion') ? (
+                    <TouchableOpacity
+                        onPress={() => navigation.navigate('NodeInfo')}
+                    >
+                        <Image
+                            style={{
+                                marginLeft: 5,
+                                marginRight: 5,
+                                width: 25,
+                                height: 25
+                            }}
+                            source={TorIcon}
+                        />
+                    </TouchableOpacity>
+                ) : null}
+            </>
+        );
+
         return (
             <Header
                 leftComponent={loading ? undefined : <SettingsButton />}
@@ -241,10 +264,14 @@ export default class WalletHeader extends React.Component<
                             <Row>
                                 <Body>{displayName}</Body>
                                 <NetworkBadge />
+                                <TorBadge />
                             </Row>
                         </View>
                     ) : (
-                        <NetworkBadge />
+                        <Row>
+                            <NetworkBadge />
+                            <TorBadge />
+                        </Row>
                     )
                 }
                 rightComponent={

diff --git a/views/Wallet/BalancePane.tsx b/views/Wallet/BalancePane.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Image, Text, View, StyleSheet, TouchableOpacity } from 'react-native';
+import { Text, View, StyleSheet } from 'react-native';
 import { inject, observer } from 'mobx-react';
 import Button from '../../components/Button';
 import WalletHeader from '../../components/WalletHeader';
@@ -14,8 +14,6 @@ import SettingsStore from './../../stores/SettingsStore';
 
 import { version, playStore } from './../../package.json';
 
-const TorIcon = require('./../../assets/images/tor.png');
-
 interface BalancePaneProps {
     navigation: any;
     BalanceStore: BalanceStore;
@@ -39,7 +37,6 @@ export default class BalancePane extends React.PureComponent<
             pendingOpenBalance
         } = BalanceStore;
         const { implementation } = SettingsStore;
-        const nodeAddress = SettingsStore.host || SettingsStore.url;
 
         const pendingUnconfirmedBalance =
             Number(pendingOpenBalance) + Number(unconfirmedBlockchainBalance);
@@ -113,21 +110,6 @@ export default class BalancePane extends React.PureComponent<
             </View>
         );
 
-        const NetworkBadge = () => (
-            <>
-                {nodeAddress && nodeAddress.includes('.onion') ? (
-                    <TouchableOpacity
-                        onPress={() => navigation.navigate('NodeInfo')}
-                    >
-                        <Image
-                            style={{ width: 25, height: 25 }}
-                            source={TorIcon}
-                        />
-                    </TouchableOpacity>
-                ) : null}
-            </>
-        );
-
         let balancePane;
         const error = NodeInfoStore.error || SettingsStore.error;
 
@@ -150,14 +132,6 @@ export default class BalancePane extends React.PureComponent<
                         ) : (
                             <BalanceViewCombined />
                         )}
-                        <View
-                            style={{
-                                marginTop: 5,
-                                alignItems: 'center'
-                            }}
-                        >
-                            <NetworkBadge />
-                        </View>
                     </View>
                 </View>
             );