Merge pull request #480 from cosmology-tech/fix/connected-state-not-w…

…orking-on-initial-render

connected state not working on initial render

packages/react/src/context/useSelectedWalletContext.tsx

@@ -1,15 +1,26 @@
-import { createContext, useContext, useState } from "react";
+import { createContext, useContext, useEffect, useState } from "react";
 
 
-export const SelectedWalletRepoContext = createContext(null)
+type SelectedWalletRepoContextType = {
+  selectedWalletRepoName: string, selectWalletRepoName: (name: string) => void
+}
 
+export const SelectedWalletRepoContext = createContext<SelectedWalletRepoContextType>(null)
 
 export const SelectedWalletRepoProvider = ({ children }) => {
 
-  const [selectedWalletRepo, selectWalletRepo] = useState(null)
+  const [selectedWalletRepoName, selectWalletRepoName] = useState<string>('')
+
+  useEffect(() => {
+    const selectedWalletName = localStorage.getItem('cosmos-kit@2:core//current-wallet')
+    if (selectedWalletName) {
+      selectWalletRepoName(selectedWalletName)
+    }
+  }, [])
+
 
   return <SelectedWalletRepoContext.Provider value={{
-    selectedWalletRepo, selectWalletRepo
+    selectedWalletRepoName, selectWalletRepoName
   }}>
     {children}
   </SelectedWalletRepoContext.Provider>

packages/react/src/modal/components/views/WalletList.tsx

@@ -13,10 +13,10 @@ interface DynamicWalletListProps {
 function DynamicWalletList({ wallets, onClose }: DynamicWalletListProps) {
   const [isLargeScreen, setIsLargeScreen] = useState(true);
 
-  const { selectWalletRepo } = useSelectedWalletRepoContext()
+  const { selectWalletRepoName } = useSelectedWalletRepoContext()
 
   const onWalletClicked = useCallback(async (wallet: ChainWalletBase) => {
-    selectWalletRepo(wallet)
+    selectWalletRepoName(wallet.walletName)
     await wallet.connect(wallet.walletStatus !== 'NotExist');
     if (!['Rejected', 'NotExist'].includes(wallet.walletStatus)) {
       onClose();

packages/react/src/modal/modal.tsx

@@ -81,8 +81,8 @@ export function WalletModal({
     beforeConnect: { disconnect: disconnectOptions },
   });
 
-  const { selectedWalletRepo } = useSelectedWalletRepoContext()
-  const current = walletRepo?.wallets.find(w => w.walletName === selectedWalletRepo?.walletName);
+  const { selectedWalletRepoName } = useSelectedWalletRepoContext()
+  const current = walletRepo?.wallets.find(w => w.walletName === selectedWalletRepoName);
 
   (current?.client as any)?.setActions?.({
     qrUrl: {