LSPS1: Using new navigation

ZeusLN · May 20, 2024 · cfc012e · cfc012e
1 parent 3506476
commit cfc012e
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 8 deletions.
diff --git a/App.tsx b/App.tsx
@@ -138,6 +138,12 @@ import LspExplanationWrappedInvoices from './views/Explanations/LspExplanationWr
 import LspExplanationOverview from './views/Explanations/LspExplanationOverview';
 import RestoreChannelBackups from './views/Settings/EmbeddedNode/RestoreChannelBackups';
 
+// LSPS1
+import LSPS1 from './views/Settings/LSPS1/index';
+import LSPS1Settings from './views/Settings/LSPS1/Settings';
+import OrdersPane from './views/Settings/LSPS1/OrdersPane';
+import Orders from './views/Settings/LSPS1/Order';
+
 import RawTxHex from './views/RawTxHex';
 
 import CustodialWalletWarning from './views/Settings/CustodialWalletWarning';
@@ -732,6 +738,22 @@ export default class App extends React.PureComponent {
                                                     name="TxHex"
                                                     component={TxHex}
                                                 />
+                                                <Stack.Screen
+                                                    name="LSPS1"
+                                                    component={LSPS1}
+                                                />
+                                                <Stack.Screen
+                                                    name="LSPS1Settings"
+                                                    component={LSPS1Settings}
+                                                />
+                                                <Stack.Screen
+                                                    name="OrdersPane"
+                                                    component={OrdersPane}
+                                                />
+                                                <Stack.Screen
+                                                    name="LSPS1Order"
+                                                    component={Orders}
+                                                />
                                             </Stack.Navigator>
                                         </NavigationContainer>
                                     )}

diff --git a/views/Channels/ChannelsPane.tsx b/views/Channels/ChannelsPane.tsx
@@ -28,8 +28,6 @@ import { localeString } from '../../utils/LocaleUtils';
 
 import Channel from '../../models/Channel';
 
-import NavigationService from '../../NavigationService';
-
 // TODO: does this belong in the model? Or can it be computed from the model?
 export enum Status {
     Good = 'Good',
@@ -46,7 +44,7 @@ interface ChannelsProps {
     SettingsStore?: SettingsStore;
 }
 
-const ColorChangingButton = () => {
+const ColorChangingButton = ({ onPress }) => {
     const [forward, setForward] = useState(true);
     const animation = useRef(new Animated.Value(0)).current;
 
@@ -75,7 +73,7 @@ const ColorChangingButton = () => {
 
     return (
         <TouchableOpacity
-            onPress={() => NavigationService.navigate('LSPS1')}
+            onPress={onPress}
             style={[styles.button, { backgroundColor }]}
         >
             <Text style={styles.buttonText}>
@@ -237,7 +235,11 @@ export default class ChannelsPane extends React.PureComponent<ChannelsProps> {
                 {settings?.lsps1ShowPurchaseButton &&
                     (BackendUtils.supportsLSPS1customMessage() ||
                         BackendUtils.supportsLSPS1rest()) && (
-                        <ColorChangingButton />
+                        <ColorChangingButton
+                            onPress={() => {
+                                navigation.navigate('LSPS1');
+                            }}
+                        />
                     )}
                 {showSearch && <ChannelsFilter />}
                 {loading ? (

diff --git a/views/Settings/LSPS1/OrdersPane.tsx b/views/Settings/LSPS1/OrdersPane.tsx
@@ -2,6 +2,7 @@ import * as React from 'react';
 import EncryptedStorage from 'react-native-encrypted-storage';
 import moment from 'moment';
 import { inject, observer } from 'mobx-react';
+import { StackNavigationProp } from '@react-navigation/stack';
 import { View, FlatList, TouchableOpacity, Text } from 'react-native';
 
 import Header from '../../../components/Header';
@@ -16,7 +17,7 @@ import LSPStore from '../../../stores/LSPStore';
 import { WarningMessage } from '../../../components/SuccessErrorMessage';
 
 interface OrdersPaneProps {
-    navigation: any;
+    navigation: StackNavigationProp<any, any>;
     LSPStore: LSPStore;
 }
 
@@ -41,7 +42,7 @@ export default class OrdersPane extends React.Component<
 
     async componentDidMount() {
         const { navigation, LSPStore } = this.props;
-        navigation.addListener('didFocus', async () => {
+        navigation.addListener('focus', async () => {
             try {
                 // Retrieve saved responses from encrypted storage
                 const responseArrayString = await EncryptedStorage.getItem(

diff --git a/views/Settings/LSPS1/index.tsx b/views/Settings/LSPS1/index.tsx
@@ -11,6 +11,7 @@ import {
 } from 'react-native';
 import EncryptedStorage from 'react-native-encrypted-storage';
 import Slider from '@react-native-community/slider';
+import { StackNavigationProp } from '@react-navigation/stack';
 import { v4 as uuidv4 } from 'uuid';
 
 import CaretDown from '../../../assets/images/SVG/Caret Down.svg';
@@ -45,7 +46,7 @@ interface LSPS1Props {
     ChannelsStore: ChannelsStore;
     SettingsStore: SettingsStore;
     FiatStore: FiatStore;
-    navigation: any;
+    navigation: StackNavigationProp<any, any>;
 }
 
 interface LSPS1State {