Merge pull request #449 from alephium/detect-injected-providers

Detect injected providers
alephium · Dec 6, 2024 · 966ae58 · 966ae58
2 parents 9b650ab + bb2dce8
commit 966ae58
Show file tree

Hide file tree

Showing 8 changed files with 528 additions and 288 deletions.
diff --git a/packages/web3-react/package.json b/packages/web3-react/package.json
@@ -41,6 +41,7 @@
     "@alephium/get-extension-wallet": "workspace:^",
     "@alephium/walletconnect-provider": "workspace:^",
     "@alephium/walletconnect-qrcode-modal": "^0.1.0",
+    "use-sync-external-store": "^1.2.2",
     "buffer": "^6.0.3",
     "detect-browser": "^5.3.0",
     "framer-motion": "^6.5.1",
@@ -62,6 +63,7 @@
     "@types/react-dom": "^18.0.11",
     "@types/styled-components": "^5.1.26",
     "eslint-plugin-react-hooks": "^4.6.0",
+    "@types/use-sync-external-store": "^0.0.6",
     "rollup": "^2.79.2",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-plugin-terser": "^7.0.2",

diff --git a/packages/web3-react/src/components/AlephiumConnect.tsx b/packages/web3-react/src/components/AlephiumConnect.tsx
@@ -47,6 +47,7 @@ import {
 } from '../contexts/alephiumConnect'
 import { getLastConnectedAccount, removeLastConnectedAccount } from '../utils/storage'
 import { ConnectResult, getConnectorById } from '../utils/connector'
+import { useInjectedProviders } from '../hooks/useInjectedProviders'
 
 export const ConnectSettingProvider: React.FC<{
   theme?: Theme
@@ -132,6 +133,7 @@ export const AlephiumConnectProvider: React.FC<{
   const [_network, setNetwork] = useState<NetworkId>(network)
   const [_addressGroup, setAddressGroup] = useState<number | undefined>(addressGroup)
   const [_keyType, setKeyType] = useState<KeyType>(keyType ?? 'default')
+  const allInjectedProviders = useInjectedProviders()
 
   useEffect(() => setNetwork(network), [network])
   useEffect(() => setAddressGroup(addressGroup), [addressGroup])
@@ -196,7 +198,14 @@ export const AlephiumConnectProvider: React.FC<{
         for (const connectorId of sortedConnectorIds) {
           const connector = getConnectorById(connectorId)
           if (connector.autoConnect !== undefined) {
-            const result = await connector.autoConnect({ network, addressGroup, keyType, onDisconnected, onConnected })
+            const result = await connector.autoConnect({
+              network,
+              addressGroup,
+              keyType,
+              onDisconnected,
+              onConnected,
+              allInjectedProviders: connectorId === 'injected' ? allInjectedProviders : undefined
+            })
             if (result !== undefined) {
               return
             }