Move navigation to index.js

App.tsx

@@ -2,8 +2,11 @@ import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import { Snackbar } from 'react-native-paper';
 
 import { SignClientTypes } from '@walletconnect/types';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
+import { useNavigation } from '@react-navigation/native';
+import {
+  NativeStackNavigationProp,
+  createNativeStackNavigator,
+} from '@react-navigation/native-stack';
 
 import SignMessage from './components/SignMessage';
 import HomeScreen from './components/HomeScreen';
@@ -18,7 +21,6 @@ import useInitialization, {
 import { EIP155_SIGNING_METHODS } from './utils/wallet-connect/EIP155Lib';
 import { useAccounts } from './context/AccountsContext';
 import { getSignParamsMessage } from './utils/wallet-connect/Helpers';
-import { navigationRef, navigateTo } from './utils/RootNavigation';
 import { useRequests } from './context/RequestContext';
 
 const Stack = createNativeStackNavigator<StackParamsList>();
@@ -26,6 +28,9 @@ const Stack = createNativeStackNavigator<StackParamsList>();
 const App = (): React.JSX.Element => {
   useInitialization();
 
+  const navigation =
+    useNavigation<NativeStackNavigationProp<StackParamsList>>();
+
   const { accounts } = useAccounts();
 
   const { requestSession, setRequestSession } = useRequests();
@@ -65,7 +70,7 @@ const App = (): React.JSX.Element => {
         case EIP155_SIGNING_METHODS.PERSONAL_SIGN:
           setRequestSession(requestSessionData);
           if (address && message) {
-            navigateTo('SignRequest', {
+            navigation.navigate('SignRequest', {
               network: 'eth',
               address,
               message,
@@ -89,19 +94,8 @@ const App = (): React.JSX.Element => {
     //TODO: Investigate dependencies
   });
 
-  const linking = {
-    prefixes: ['https://wallet.laconic.com'],
-    config: {
-      screens: {
-        SignRequest: {
-          path: 'sign/:network/:address/:message',
-        },
-      },
-    },
-  };
-
   return (
-    <NavigationContainer linking={linking} ref={navigationRef}>
+    <>
       <Stack.Navigator>
         <Stack.Screen
           name="Laconic"
@@ -161,7 +155,7 @@ const App = (): React.JSX.Element => {
         }}>
         Session approved
       </Snackbar>
-    </NavigationContainer>
+    </>
   );
 };
 

index.js

@@ -7,13 +7,26 @@ import App from './App';
 import { AccountsProvider } from './context/AccountsContext';
 import { RequestProvider } from './context/RequestContext';
 import { name as appName } from './app.json';
+import { NavigationContainer } from '@react-navigation/native';
 
 export default function Main() {
+  const linking = {
+    prefixes: ['https://wallet.laconic.com'],
+    config: {
+      screens: {
+        SignRequest: {
+          path: 'sign/:network/:address/:message',
+        },
+      },
+    },
+  };
   return (
     <PaperProvider>
       <AccountsProvider>
         <RequestProvider>
-          <App />
+          <NavigationContainer linking={linking}>
+            <App />
+          </NavigationContainer>
         </RequestProvider>
       </AccountsProvider>
     </PaperProvider>

utils/RootNavigation.ts

@@ -1,14 +0,0 @@
-import {
-  CommonActions,
-  createNavigationContainerRef,
-} from '@react-navigation/native';
-
-import { StackParamsList } from '../types';
-
-export const navigationRef = createNavigationContainerRef<StackParamsList>();
-
-export function navigateTo(routeName: string, params?: object) {
-  if (navigationRef.isReady()) {
-    navigationRef.dispatch(CommonActions.navigate(routeName, params));
-  }
-}