Revert "REF: navigation styles"

casmirconsensys · Dec 4, 2020 · 476ba02 · 476ba02
1 parent 7d4d92d
commit 476ba02
Show file tree

Hide file tree

Showing 67 changed files with 797 additions and 864 deletions.
diff --git a/BlueComponents.js b/BlueComponents.js
@@ -485,6 +485,90 @@ export const BlueAlertWalletExportReminder = ({ onSuccess = () => {}, onFailure
   );
 };
 
+export const BlueNavigationStyle = (navigation, withNavigationCloseButton = false, customCloseButtonFunction = undefined) => {
+  let headerRight;
+  const { colors, closeImage } = useTheme();
+  if (withNavigationCloseButton) {
+    headerRight = () => (
+      <TouchableOpacity
+        style={{ width: 40, height: 40, padding: 14 }}
+        onPress={
+          customCloseButtonFunction === undefined
+            ? () => {
+                Keyboard.dismiss();
+                navigation.goBack(null);
+              }
+            : customCloseButtonFunction
+        }
+      >
+        <Image style={{ alignSelf: 'center' }} source={closeImage} />
+      </TouchableOpacity>
+    );
+  } else {
+    headerRight = null;
+  }
+
+  return {
+    headerStyle: {
+      borderBottomWidth: 0,
+      elevation: 0,
+      shadowOpacity: 0,
+      shadowOffset: { height: 0, width: 0 },
+    },
+    headerTitleStyle: {
+      fontWeight: '600',
+      color: colors.foregroundColor,
+    },
+    headerRight,
+    headerBackTitleVisible: false,
+    headerTintColor: colors.foregroundColor,
+  };
+};
+
+export const BlueCreateTxNavigationStyle = (navigation, withAdvancedOptionsMenuButton = false, advancedOptionsMenuButtonAction) => {
+  const { colors, closeImage } = useTheme();
+
+  let headerRight;
+  if (withAdvancedOptionsMenuButton) {
+    headerRight = () => (
+      <TouchableOpacity
+        style={{ minWidth: 40, height: 40, justifyContent: 'center' }}
+        onPress={advancedOptionsMenuButtonAction}
+        testID="advancedOptionsMenuButton"
+      >
+        <Icon size={22} name="kebab-horizontal" type="octicon" color={colors.foregroundColor} />
+      </TouchableOpacity>
+    );
+  } else {
+    headerRight = null;
+  }
+  return {
+    headerStyle: {
+      borderBottomWidth: 0,
+      elevation: 0,
+      shadowOffset: { height: 0, width: 0 },
+    },
+    headerTitleStyle: {
+      fontWeight: '600',
+      color: colors.foregroundColor,
+    },
+    headerTintColor: colors.foregroundColor,
+    headerLeft: () => (
+      <TouchableOpacity
+        style={{ minWidth: 40, height: 40, justifyContent: 'center', paddingHorizontal: 14 }}
+        onPress={() => {
+          Keyboard.dismiss();
+          navigation.goBack(null);
+        }}
+      >
+        <Image style={{}} source={closeImage} />
+      </TouchableOpacity>
+    ),
+    headerRight,
+    headerBackTitle: null,
+  };
+};
+
 export const BluePrivateBalance = () => {
   return Platform.select({
     ios: (

diff --git a/Navigation.js b/Navigation.js
diff --git a/components/navigationStyle.js b/components/navigationStyle.js
diff --git a/loc/en.json b/loc/en.json
@@ -75,7 +75,6 @@
     "item_rating": "{rating} trades",
     "item_rating_no": "No rating",
     "login": "Login",
-    "logout": "logout",
     "mycont": "My contracts",
     "offer_accept": "Accept offer",
     "offer_account_finish": "Looks like you didn't finish setting up account on HodlHodl, would you like to finish setup now?",
@@ -146,8 +145,6 @@
     "header": "Receive"
   },
   "send": {
-    "broadcast_success_screen_msg": "Success! You transaction has been broadcasted!",
-    "broadcast_success_screen_open": "Open link in explorer",
     "broadcastButton": "BROADCAST",
     "broadcastError": "error",
     "broadcastNone": "Input transaction hash",

diff --git a/screen/lnd/browser.js b/screen/lnd/browser.js
@@ -1,6 +1,4 @@
 import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import Ionicons from 'react-native-vector-icons/Ionicons';
 import {
   TouchableOpacity,
   ActivityIndicator,
@@ -14,9 +12,9 @@ import {
   StyleSheet,
 } from 'react-native';
 import { WebView } from 'react-native-webview';
-
-import { SafeBlueArea } from '../../BlueComponents';
-import navigationStyle from '../../components/navigationStyle';
+import { BlueNavigationStyle, SafeBlueArea } from '../../BlueComponents';
+import Ionicons from 'react-native-vector-icons/Ionicons';
+import PropTypes from 'prop-types';
 import Notifications from '../../blue_modules/notifications';
 
 let processedInvoices = {};
@@ -519,8 +517,8 @@ Browser.propTypes = {
   }),
 };
 
-Browser.navigationOptions = navigationStyle({
-  closeButton: true,
+Browser.navigationOptions = ({ navigation }) => ({
+  ...BlueNavigationStyle(navigation, true),
   title: 'Lapp Browser',
   headerLeft: null,
 });
diff --git a/screen/lnd/lndCreateInvoice.js b/screen/lnd/lndCreateInvoice.js
@@ -2,30 +2,34 @@
 import React, { useCallback, useContext, useEffect, useRef, useState } from 'react';
 import {
   ActivityIndicator,
-  Image,
-  Keyboard,
+  View,
+  TextInput,
   KeyboardAvoidingView,
+  Keyboard,
   StatusBar,
-  StyleSheet,
-  Text,
-  TextInput,
-  TouchableOpacity,
   TouchableWithoutFeedback,
-  View,
+  TouchableOpacity,
+  Text,
+  StyleSheet,
+  Image,
 } from 'react-native';
-import ReactNativeHapticFeedback from 'react-native-haptic-feedback';
-import { Icon } from 'react-native-elements';
-import { useFocusEffect, useNavigation, useRoute, useTheme } from '@react-navigation/native';
-
-import { BlueAlertWalletExportReminder, BlueBitcoinAmount, BlueButton, BlueDismissKeyboardInputAccessory } from '../../BlueComponents';
-import navigationStyle from '../../components/navigationStyle';
+import {
+  BlueNavigationStyle,
+  BlueButton,
+  BlueBitcoinAmount,
+  BlueDismissKeyboardInputAccessory,
+  BlueAlertWalletExportReminder,
+} from '../../BlueComponents';
 import * as NavigationService from '../../NavigationService';
 import { LightningCustodianWallet } from '../../class/wallets/lightning-custodian-wallet';
 import { BitcoinUnit, Chain } from '../../models/bitcoinUnits';
+import ReactNativeHapticFeedback from 'react-native-haptic-feedback';
+import { Icon } from 'react-native-elements';
 import loc, { formatBalanceWithoutSuffix, formatBalancePlain } from '../../loc';
 import Lnurl from '../../class/lnurl';
 import { BlueStorageContext } from '../../blue_modules/storage-context';
 import Notifications from '../../blue_modules/notifications';
+import { useFocusEffect, useNavigation, useRoute, useTheme } from '@react-navigation/native';
 const currency = require('../../blue_modules/currency');
 
 const LNDCreateInvoice = () => {
@@ -486,8 +490,8 @@ const styles = StyleSheet.create({
 
 export default LNDCreateInvoice;
 
-LNDCreateInvoice.navigationOptions = navigationStyle({
-  closeButton: true,
+LNDCreateInvoice.navigationOptions = ({ navigation }) => ({
+  ...BlueNavigationStyle(navigation, true),
   headerTitle: loc.receive.header,
   headerLeft: null,
 });
diff --git a/screen/lnd/lndViewAdditionalInvoiceInformation.js b/screen/lnd/lndViewAdditionalInvoiceInformation.js
@@ -1,15 +1,22 @@
 /* global alert */
 import React, { useContext, useEffect, useState } from 'react';
 import { View, Share, StyleSheet } from 'react-native';
+import {
+  BlueLoading,
+  BlueCopyTextToClipboard,
+  SafeBlueArea,
+  BlueButton,
+  BlueNavigationStyle,
+  BlueText,
+  BlueSpacing20,
+} from '../../BlueComponents';
 import QRCode from 'react-native-qrcode-svg';
-import { useNavigation, useRoute, useTheme } from '@react-navigation/native';
-
-import { BlueButton, BlueCopyTextToClipboard, BlueLoading, BlueSpacing20, BlueText, SafeBlueArea } from '../../BlueComponents';
-import navigationStyle from '../../components/navigationStyle';
 import loc from '../../loc';
+import { useNavigation, useRoute, useTheme } from '@react-navigation/native';
 import { BlueStorageContext } from '../../blue_modules/storage-context';
 
 const LNDViewAdditionalInvoiceInformation = () => {
+  // state = { walletInfo: undefined };
   const { walletID } = useRoute().params;
   const { wallets } = useContext(BlueStorageContext);
   const wallet = wallets.find(w => w.getID() === walletID);
@@ -116,6 +123,7 @@ const styles = StyleSheet.create({
 
 export default LNDViewAdditionalInvoiceInformation;
 
-LNDViewAdditionalInvoiceInformation.navigationOptions = navigationStyle({
+LNDViewAdditionalInvoiceInformation.navigationOptions = () => ({
+  ...BlueNavigationStyle(),
   title: loc.lndViewInvoice.additional_info,
 });
diff --git a/screen/lnd/lndViewAdditionalInvoicePreImage.js b/screen/lnd/lndViewAdditionalInvoicePreImage.js
@@ -1,11 +1,9 @@
 import React from 'react';
 import { View, StyleSheet } from 'react-native';
+import { BlueCopyTextToClipboard, SafeBlueArea, BlueNavigationStyle, BlueSpacing20, BlueTextCentered } from '../../BlueComponents';
 import QRCode from 'react-native-qrcode-svg';
-import { useRoute, useTheme } from '@react-navigation/native';
-
-import { BlueCopyTextToClipboard, SafeBlueArea, BlueSpacing20, BlueTextCentered } from '../../BlueComponents';
-import navigationStyle from '../../components/navigationStyle';
 import loc from '../../loc';
+import { useRoute, useTheme } from '@react-navigation/native';
 
 const LNDViewAdditionalInvoicePreImage = () => {
   // state = { walletInfo: undefined };
@@ -61,6 +59,7 @@ const styles = StyleSheet.create({
 
 export default LNDViewAdditionalInvoicePreImage;
 
-LNDViewAdditionalInvoicePreImage.navigationOptions = navigationStyle({
+LNDViewAdditionalInvoicePreImage.navigationOptions = () => ({
+  ...BlueNavigationStyle(),
   title: loc.lndViewInvoice.additional_info,
 });