Add route to auto sign in

src/App.tsx

@@ -35,6 +35,7 @@ import { COSMOS_METHODS } from "./utils/wallet-connect/COSMOSData";
 import styles from "./styles/stylesheet";
 import { Header } from "./components/Header";
 import { WalletEmbed } from "./screens/WalletEmbed";
+import { AutoSignIn } from "./screens/AutoSignIn";
 
 const Stack = createStackNavigator<StackParamsList>();
 
@@ -321,6 +322,13 @@ const App = (): React.JSX.Element => {
             header: () => <></>,
           }}
         />
+        <Stack.Screen
+          name="auto-sign-in"
+          component={AutoSignIn}
+          options={{
+            header: () => <></>,
+          }}
+        />
       </Stack.Navigator>
       <PairingModal
         visible={modalVisible}

src/screens/AutoSignIn.tsx

@@ -0,0 +1,92 @@
+import React, { useEffect, useCallback } from 'react';
+
+import { createWallet, retrieveAccounts } from '../utils/accounts';
+import { useNetworks } from '../context/NetworksContext';
+import { Account } from '../types';
+import { signMessage } from '../utils/sign-message';
+import { EIP155 } from '../utils/constants';
+
+export const AutoSignIn = () => {
+  const { networksData } = useNetworks();
+
+  const getAccountsData = useCallback(async (chainId: string): Promise<Account[]> => {
+    const targetNetwork = networksData.find(network => network.chainId === chainId);
+
+    if (!targetNetwork) {
+      return [];
+    }
+
+    const accounts = await retrieveAccounts(targetNetwork);
+
+    if (!accounts || accounts.length === 0) {
+      return [];
+    }
+
+    return accounts
+  }, [networksData]);
+
+  const sendMessage = (
+    source: Window | null,
+    type: string,
+    data: any,
+    origin: string
+  ): void => {
+    source?.postMessage({ type, data }, origin);
+  };
+
+  useEffect(() => {
+    const handleSignIn = async (event: MessageEvent) => {
+      if (event.data.type !== 'AUTO_SIGN_IN') return;
+
+      const accountsData = await getAccountsData(event.data.chainId);
+
+      if (!accountsData.length) {
+        return
+      }
+
+      const signature = await signMessage({message: event.data.message, accountId: accountsData[0].index, chainId: event.data.chainId, namespace: EIP155})
+
+      sendMessage(event.source as Window, 'SIGN_IN_RESPONSE', { message: event.data.message, signature }, event.origin);
+    };
+
+    window.addEventListener('message', handleSignIn);
+
+    return () => {
+      window.removeEventListener('message', handleSignIn);
+    };
+  }, [networksData, getAccountsData]);
+
+  useEffect(() => {
+    const getAccountAddress = async (event: MessageEvent) => {
+      if (event.data.type !== 'GET_ACCOUNT_ADDRESS') return;
+
+      let accountsData = await getAccountsData(event.data.chainId);
+
+      if (accountsData.length === 0) {
+        console.log("Accounts not found, creating wallet...");
+        await createWallet(networksData);
+
+        // Re-fetch newly created accounts
+        accountsData = await getAccountsData(event.data.chainId);
+      }
+
+      if (!accountsData.length) {
+        return
+      }
+
+      sendMessage(event.source as Window, 'ACCOUNT_ADDRESS_RESPONSE', accountsData[0].address, event.origin);
+    };
+
+    window.addEventListener('message', getAccountAddress);
+
+    return () => {
+      window.removeEventListener('message', getAccountAddress);
+    };
+  }, [networksData, getAccountsData]);
+
+  return (
+    <>
+    Auto sign in
+    </>
+  )
+};

src/types.ts

@@ -37,6 +37,7 @@ export type StackParamsList = {
     requestSessionData: SessionTypes.Struct;
   };
   "wallet-embed": undefined;
+  "auto-sign-in": undefined;
 };
 
 export type Account = {