components/Header: add onBack prop for extra functionality

ZeusLN · Apr 1, 2023 · 359f118 · 359f118
1 parent f57911f
commit 359f118
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 17 deletions.
diff --git a/components/Header.tsx b/components/Header.tsx
@@ -9,22 +9,29 @@ interface HeaderProps {
     containerStyle?: any;
     placement?: 'left' | 'center' | 'right' | undefined;
     navigation?: any;
+    onBack?: () => void;
 }
 
 function ZeusHeader(props: HeaderProps) {
-    const BackButton = () => (
+    const BackButton = (onBack?: () => void) => (
         <Icon
             name="arrow-back"
-            onPress={() => props.navigation.goBack()}
+            onPress={() => {
+                if (onBack) onBack();
+                props.navigation.goBack();
+            }}
             color={themeColor('text')}
             underlayColor="transparent"
         />
     );
 
-    const CloseButton = () => (
+    const CloseButton = (onBack?: () => void) => (
         <Icon
             name="close"
-            onPress={() => props.navigation.goBack()}
+            onPress={() => {
+                if (onBack) onBack();
+                props.navigation.goBack();
+            }}
             color={themeColor('text')}
             underlayColor="transparent"
         />
@@ -35,21 +42,22 @@ function ZeusHeader(props: HeaderProps) {
         centerComponent,
         rightComponent,
         containerStyle,
-        placement
+        placement,
+        onBack
     } = props;
     return (
         <Header
             leftComponent={
                 leftComponent === 'Back'
-                    ? BackButton
+                    ? BackButton(onBack)
                     : leftComponent === 'Close'
-                    ? CloseButton
+                    ? CloseButton(onBack)
                     : leftComponent
                     ? leftComponent
-                    : null
+                    : undefined
             }
-            centerComponent={centerComponent ? centerComponent : null}
-            rightComponent={rightComponent ? rightComponent : null}
+            centerComponent={centerComponent ? centerComponent : undefined}
+            rightComponent={rightComponent ? rightComponent : undefined}
             backgroundColor="transparent"
             containerStyle={{
                 ...containerStyle,

diff --git a/views/Receive.tsx b/views/Receive.tsx
@@ -226,19 +226,15 @@ export default class Receive extends React.Component<
         if (this.onChainInterval) clearInterval(this.onChainInterval);
     };
 
-    navBack = () => {
-        const { InvoicesStore, navigation } = this.props;
+    onBack = () => {
+        const { InvoicesStore } = this.props;
         const { reset } = InvoicesStore;
         // kill all listeners and pollers before navigating back
         this.clearListeners();
         this.clearIntervals();
 
         // clear invoice
         reset();
-
-        navigation.navigate('Wallet', {
-            refresh: true
-        });
     };
 
     autoGenerateInvoice = (
@@ -825,7 +821,8 @@ export default class Receive extends React.Component<
         return (
             <Screen>
                 <Header
-                    leftComponent={<BackButton />}
+                    leftComponent="Back"
+                    onBack={this.onBack}
                     centerComponent={{
                         text:
                             posStatus === 'active'
@@ -847,6 +844,7 @@ export default class Receive extends React.Component<
                             )
                         )
                     }
+                    navigation={navigation}
                 />
 
                 <ScrollView style={styles.content}>