@rango-dev/widget-embedded 0.17.1-next.7 → 0.17.1-next.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rango-dev/widget-embedded",
-  "version": "0.17.1-next.7",
+  "version": "0.17.1-next.9",
   "license": "MIT",
   "type": "module",
   "main": "dist/index.js",
@@ -19,13 +19,13 @@
   "dependencies": {
     "@lingui/core": "4.2.1",
     "@lingui/react": "4.2.1",
-    "@rango-dev/provider-all": "^0.22.1-next.3",
+    "@rango-dev/provider-all": "^0.22.1-next.4",
     "@rango-dev/queue-manager-core": "^0.22.1-next.0",
-    "@rango-dev/queue-manager-rango-preset": "^0.22.1-next.4",
+    "@rango-dev/queue-manager-rango-preset": "^0.22.1-next.5",
     "@rango-dev/queue-manager-react": "^0.22.1-next.0",
-    "@rango-dev/ui": "^0.22.1-next.5",
-    "@rango-dev/wallets-react": "^0.8.1-next.2",
-    "@rango-dev/wallets-shared": "^0.21.1-next.2",
+    "@rango-dev/ui": "^0.22.1-next.6",
+    "@rango-dev/wallets-react": "^0.8.1-next.3",
+    "@rango-dev/wallets-shared": "^0.21.1-next.3",
     "bignumber.js": "^9.1.1",
     "copy-to-clipboard": "^3.3.3",
     "dayjs": "^1.11.7",

package/src/components/AppRouter.tsx

@@ -9,6 +9,7 @@ import { MemoryRouter, useInRouterContext } from 'react-router';
 import { useLocation, useNavigate } from 'react-router-dom';
 
 import { navigationRoutes } from '../constants/navigationRoutes';
+import { useForceAutoConnect } from '../hooks/useForceAutoConnect';
 import { Home } from '../pages/Home';
 import { useAppStore } from '../store/AppStore';
 
@@ -49,6 +50,8 @@ export function AppRouter({
   const blockchains = useAppStore().blockchains();
   const { canSwitchNetworkTo } = useWallets();
 
+  useForceAutoConnect();
+
   const evmChains = blockchains.filter(isEvmBlockchain);
 
   useQueueManager({

package/src/components/UpdateUrl.tsx

@@ -57,6 +57,7 @@ export function UpdateUrl() {
         toChainString = '',
         toTokenString = '',
         fromAmount = '';
+      const autoConnect = searchParamsRef.current[SearchParams.AUTO_CONNECT];
       if (fetchMetaStatus !== 'success') {
         fromChainString = searchParamsRef.current[SearchParams.FROM_CHAIN];
         fromTokenString = searchParamsRef.current[SearchParams.FROM_TOKEN];
@@ -91,6 +92,9 @@ export function UpdateUrl() {
           ...(fromAmount && {
             [SearchParams.FROM_AMOUNT]: fromAmount.toString(),
           }),
+          ...(autoConnect && {
+            [SearchParams.AUTO_CONNECT]: autoConnect,
+          }),
         },
         { replace: true }
       );

package/src/constants/searchParams.ts

@@ -4,4 +4,5 @@ export enum SearchParams {
   'TO_CHAIN' = 'toBlockchain',
   'TO_TOKEN' = 'toToken',
   'FROM_AMOUNT' = 'fromAmount',
+  'AUTO_CONNECT' = 'autoConnect',
 }

package/src/hooks/useForceAutoConnect.ts

@@ -0,0 +1,27 @@
+import { useWallets } from '@rango-dev/wallets-react';
+import { useEffect, useRef } from 'react';
+
+import { SearchParams } from '../constants/searchParams';
+import { useAppStore } from '../store/AppStore';
+
+export function useForceAutoConnect(): void {
+  const { connect, state } = useWallets();
+  const initiated = useRef<{ [key: string]: boolean }>({});
+  const { fetchStatus } = useAppStore();
+  const walletType =
+    new URLSearchParams(location.search).get(SearchParams.AUTO_CONNECT) || '';
+  const walletState = state(walletType);
+
+  useEffect(() => {
+    const shouldTryConnect =
+      fetchStatus === 'success' &&
+      walletType &&
+      walletState.installed &&
+      !walletState.connecting &&
+      !walletState.connected;
+    if (shouldTryConnect && !initiated.current[walletType]) {
+      initiated.current[walletType] = true;
+      void connect(walletType);
+    }
+  }, [walletState, fetchStatus]);
+}