Use existing method to retrieve accounts

src/App.tsx

@@ -34,7 +34,7 @@ import { NETWORK_METHODS } from "./utils/wallet-connect/common-data";
 import { COSMOS_METHODS } from "./utils/wallet-connect/COSMOSData";
 import styles from "./styles/stylesheet";
 import { Header } from "./components/Header";
-import { WalletEmbed } from "./components/WalletEmbed";
+import { WalletEmbed } from "./screens/WalletEmbed";
 
 const Stack = createStackNavigator<StackParamsList>();
 
@@ -317,6 +317,9 @@ const App = (): React.JSX.Element => {
         <Stack.Screen
           name="WalletEmbed"
           component={WalletEmbed}
+          options={{
+            header: () => <></>,
+          }}
         />
       </Stack.Navigator>
       <PairingModal

src/screens/WalletEmbed.tsx

@@ -1,26 +1,32 @@
-import { useEffect } from 'react';
-import { createWallet } from '../utils/accounts';
+import { useCallback, useEffect } from 'react';
+
+import { createWallet, retrieveAccounts } from '../utils/accounts';
 import { useNetworks } from '../context/NetworksContext';
 
 export const WalletEmbed = () => {
   const { networksData } = useNetworks();
 
-  const getAccountsData = (chainId: string): string => {
-    const accountCount = localStorage.getItem(`addAccountCounter/cosmos:${chainId}`);
-    if (!accountCount) return '';
+  const getAccountsData = useCallback(async (chainId: string) => {
+    const targetNetwork = networksData.find(network => network.chainId === "laconic-testnet-2");
 
-    let accountsData = '';
-    for (let i = 0; i < Number(accountCount); i++) {
-      const account = localStorage.getItem(`accounts/cosmos:${chainId}/${i}`);
-      if (account) accountsData += `${account},`;
+    if (!targetNetwork) {
+      return '';
     }
 
-    return accountsData.slice(0, -1); // Remove trailing comma
-  };
+    const accounts = await retrieveAccounts(targetNetwork);
+
+    if (!accounts || accounts.length === 0) {
+      return '';
+    }
+
+    const accountsData = accounts.map(account => account.address).join(',');
+    return accountsData;
+  }, [networksData]);
+
 
   const getAddressesFromData = (accountsData: string): string[] => {
     return accountsData
-      ? accountsData.split(',').filter((_, index) => (index + 1) % 4 === 0)
+      ? accountsData.split(',')
       : [];
   };
 
@@ -34,12 +40,12 @@ export const WalletEmbed = () => {
   };
 
   useEffect(() => {
-    const handleGetAccounts = (event: MessageEvent) => {
+    const handleGetAccounts = async (event: MessageEvent) => {
       if (event.data.type !== 'REQUEST_WALLET_ACCOUNTS') return;
 
-      const accountsData = getAccountsData(event.data.chainId);
+      const accountsData = await getAccountsData(event.data.chainId);
       if (!accountsData) {
-        sendMessage(event.source as Window, 'ERROR', 'Wallet accounts not found in local storage', event.origin);
+        sendMessage(event.source as Window, 'ERROR', 'Wallet accounts not found', event.origin);
         return;
       }
 
@@ -48,21 +54,24 @@ export const WalletEmbed = () => {
     };
 
     window.addEventListener('message', handleGetAccounts);
-    return () => window.removeEventListener('message', handleGetAccounts);
-  }, []);
+
+    return () => {
+      window.removeEventListener('message', handleGetAccounts);
+    };
+  }, [getAccountsData]);
 
   useEffect(() => {
     const handleCreateAccounts = async (event: MessageEvent) => {
       if (event.data.type !== 'REQUEST_CREATE_OR_GET_ACCOUNTS') return;
 
-      let accountsData = getAccountsData(event.data.chainId);
+      let accountsData = await getAccountsData(event.data.chainId);
 
       if (!accountsData) {
         console.log("Accounts not found, creating wallet...");
         await createWallet(networksData);
 
         // Re-fetch newly created accounts
-        accountsData = getAccountsData(event.data.chainId);
+        accountsData = await getAccountsData(event.data.chainId);
       }
 
       const addresses = getAddressesFromData(accountsData);
@@ -70,8 +79,11 @@ export const WalletEmbed = () => {
     };
 
     window.addEventListener('message', handleCreateAccounts);
-    return () => window.removeEventListener('message', handleCreateAccounts);
-  }, [networksData]);
+
+    return () => {
+      window.removeEventListener('message', handleCreateAccounts);
+    };
+  }, [networksData, getAccountsData]);
 
   return null;
 };