@dynamic-labs/wagmi-connector 0.18.4 → 0.18.6

package/CHANGELOG.md

@@ -1,4 +1,19 @@
 
+### [0.18.6](https://github.com/dynamic-labs/DynamicAuth/compare/v0.18.5...v0.18.6) (2023-08-21)
+
+
+### Bug Fixes
+
+* detect when user closes oauth window when linking social account  ([#3063](https://github.com/dynamic-labs/DynamicAuth/issues/3063)) ([1afa8f7](https://github.com/dynamic-labs/DynamicAuth/commit/1afa8f7b1c82759c90554fd4395d11779023f1ff))
+* sync connected wallets with wagmi client ([#3072](https://github.com/dynamic-labs/DynamicAuth/issues/3072)) ([570c83d](https://github.com/dynamic-labs/DynamicAuth/commit/570c83dd426862a2151c9858824a34d6b5133588))
+
+### [0.18.5](https://github.com/dynamic-labs/DynamicAuth/compare/v0.18.4...v0.18.5) (2023-08-19)
+
+
+### Bug Fixes
+
+* ensure social sign in embedded wallets sync correctly with wagmi ([ae8784d](https://github.com/dynamic-labs/DynamicAuth/commit/ae8784d1dff047b370e0ccafbcb8180fa64bb99b))
+
 ### [0.18.4](https://github.com/dynamic-labs/DynamicAuth/compare/v0.18.2...v0.18.4) (2023-08-17)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dynamic-labs/wagmi-connector",
-  "version": "0.18.4",
+  "version": "0.18.6",
   "repository": {
     "type": "git",
     "url": "https://github.com/dynamic-labs/DynamicAuth.git",
@@ -11,9 +11,9 @@
     "react": "^17.0.2 || ^18.0.0",
     "ethers": "5.7.2",
     "wagmi": "~0.12.13",
-    "@dynamic-labs/sdk-react-core": "0.18.4",
-    "@dynamic-labs/types": "0.18.4",
-    "@dynamic-labs/wallet-connector-core": "0.18.4"
+    "@dynamic-labs/sdk-react-core": "0.18.6",
+    "@dynamic-labs/types": "0.18.6",
+    "eventemitter3": "5.0.1"
   },
   "license": "MIT",
   "main": "./src/index.cjs",

package/src/lib/DynamicWagmiConnector.js

@@ -19,7 +19,8 @@ const client = createClient({
 let connector = undefined;
 const DynamicWagmiConnector = ({ evmNetworks: customerSuppliedEvmNetworks, children, }) => {
     var _a;
-    const { networkConfigurations, handleLogOut, connectedWallets, sendWagmiSettings, } = useDynamicContext();
+    const { networkConfigurations, handleLogOut, connectedWallets, linkedWallets, authMode, sendWagmiSettings, } = useDynamicContext();
+    const wallets = authMode === 'connect-only' ? connectedWallets : linkedWallets;
     sendWagmiSettings({
         dynamicWagmiSettings: customerSuppliedEvmNetworks,
     });
@@ -30,7 +31,7 @@ const DynamicWagmiConnector = ({ evmNetworks: customerSuppliedEvmNetworks, child
     const mappedChains = getWagmiChainsFromDynamicChains(evmNetworks);
     const mappedProviders = getWagmiProvidersFromDynamicChains(evmNetworks);
     const { chains, provider } = configureChains(mappedChains, mappedProviders);
-    connector = getConnector(connectedWallets, (wallet) => new Connector({
+    connector = getConnector(wallets, (wallet) => new Connector({
         chains,
         handleLogOut,
         walletConnector: wallet.connector,

package/src/lib/SyncDynamicWagmi.js

@@ -1,29 +1,39 @@
-import React from 'react';
+import React, { useRef, useEffect } from 'react';
 import { useClient, useConnect, useDisconnect } from 'wagmi';
 import { useDynamicContext } from '@dynamic-labs/sdk-react-core';
-import { useSyncConnectState } from './hooks/useSyncConnectState/useSyncConnectState.js';
 
 const SyncDynamicWagmi = ({ children, connector, }) => {
     const { status: clientStatus } = useClient();
-    const { walletConnector } = useDynamicContext();
-    const { connect, status } = useConnect();
+    const { connect } = useConnect();
     const { disconnect } = useDisconnect();
-    if (walletConnector) {
-        // after connection is successful, re-setup event listeners after a short delay
-        // so that they are not cleared by the teardown in useWalletEventListeners
-        if (status === 'success') {
-            setTimeout(() => {
-                connector === null || connector === void 0 ? void 0 : connector.setupEventListeners();
-            }, 100);
+    const { internalEvents, walletConnector } = useDynamicContext();
+    const lastConnectedConnectorId = useRef(undefined);
+    useEffect(() => {
+        const events = internalEvents.current;
+        const handleDisconnect = () => {
+            lastConnectedConnectorId.current = undefined;
+            disconnect();
+        };
+        events.on('clearPrimaryWallet', handleDisconnect);
+        return () => {
+            events.off('clearPrimaryWallet', handleDisconnect);
+        };
+    }, [disconnect, internalEvents]);
+    useEffect(() => {
+        if (walletConnector &&
+            connector &&
+            (connector === null || connector === void 0 ? void 0 : connector.id) !== lastConnectedConnectorId.current) {
+            lastConnectedConnectorId.current = connector.id;
+            connect({ connector });
         }
-    }
-    useSyncConnectState({
+    }, [
         clientStatus,
         connect,
         connector,
         disconnect,
+        lastConnectedConnectorId,
         walletConnector,
-    });
+    ]);
     // use React.createElement to prevent bunding react/jsx-runtime,
     // which is not compatible when bundling apps using React 17
     return React.createElement(React.Fragment, null, children);

package/src/lib/hooks/index.d.ts

@@ -1,2 +0,0 @@
-export * from './useWalletConnectorEverPresent';
-export * from './useSyncConnectState';

package/src/lib/hooks/useSyncConnectState/index.d.ts

@@ -1 +0,0 @@
-export { useSyncConnectState } from './useSyncConnectState';

package/src/lib/hooks/useSyncConnectState/usePrevious.d.ts

@@ -1,19 +0,0 @@
-/**
- * This is used to track a previous value of a variable.
- *
- * Example:
- *   const someHook = ({ value }) => {
- *     const previousValue = usePrevious(value);
- *     useEffect(() => {
- *      if (previousValue !== value) {
- *        // do something
- *      }
- *     }, [value, previousValue]);
- *   }
- *
- * When someHook is rendered for the first time with value = true, previousValue will be undefined
- * so the condition will be true and the effect will run. When someHook is rendered again with
- * value = true, previousValue will have been set to true so the condition will be false and the
- * effect will not run.
- */
-export declare const usePrevious: <T>(value: T) => T | undefined;

package/src/lib/hooks/useSyncConnectState/usePrevious.js

@@ -1,29 +0,0 @@
-import { useRef, useEffect } from 'react';
-
-/**
- * This is used to track a previous value of a variable.
- *
- * Example:
- *   const someHook = ({ value }) => {
- *     const previousValue = usePrevious(value);
- *     useEffect(() => {
- *      if (previousValue !== value) {
- *        // do something
- *      }
- *     }, [value, previousValue]);
- *   }
- *
- * When someHook is rendered for the first time with value = true, previousValue will be undefined
- * so the condition will be true and the effect will run. When someHook is rendered again with
- * value = true, previousValue will have been set to true so the condition will be false and the
- * effect will not run.
- */
-const usePrevious = (value) => {
-    const ref = useRef();
-    useEffect(() => {
-        ref.current = value;
-    }, [value]);
-    return ref.current;
-};
-
-export { usePrevious };

package/src/lib/hooks/useSyncConnectState/useSyncConnectState.d.ts

@@ -1,11 +0,0 @@
-import { Connector } from 'wagmi';
-import { ConnectArgs } from '@wagmi/core';
-import { WalletConnector } from '@dynamic-labs/wallet-connector-core';
-export type SyncConnectStateHookProps = {
-    clientStatus: 'connected' | 'connecting' | 'reconnecting' | 'disconnected';
-    connect: (args?: Partial<ConnectArgs> | undefined) => void;
-    connector: Connector | undefined;
-    disconnect: () => void;
-    walletConnector: WalletConnector | null;
-};
-export declare const useSyncConnectState: ({ walletConnector, disconnect, clientStatus, connect, connector, }: SyncConnectStateHookProps) => void;

package/src/lib/hooks/useSyncConnectState/useSyncConnectState.js

@@ -1,28 +0,0 @@
-import { useEffect } from 'react';
-import { useWalletConnectorEverPresent } from '../useWalletConnectorEverPresent/useWalletConnectorEverPresent.js';
-import { usePrevious } from './usePrevious.js';
-
-const useSyncConnectState = ({ walletConnector, disconnect, clientStatus, connect, connector, }) => {
-    const wasWalletConnectEverPresent = useWalletConnectorEverPresent(walletConnector);
-    const prevConnectorId = usePrevious(connector === null || connector === void 0 ? void 0 : connector.id);
-    useEffect(() => {
-        if (!walletConnector) {
-            if (wasWalletConnectEverPresent) {
-                disconnect();
-            }
-        }
-        else if ((connector === null || connector === void 0 ? void 0 : connector.id) !== prevConnectorId) {
-            connect({ connector });
-        }
-    }, [
-        clientStatus,
-        connect,
-        connector,
-        disconnect,
-        prevConnectorId,
-        walletConnector,
-        wasWalletConnectEverPresent,
-    ]);
-};
-
-export { useSyncConnectState };

package/src/lib/hooks/useWalletConnectorEverPresent/index.d.ts

@@ -1 +0,0 @@
-export { useWalletConnectorEverPresent } from './useWalletConnectorEverPresent';

package/src/lib/hooks/useWalletConnectorEverPresent/useWalletConnectorEverPresent.d.ts

@@ -1,2 +0,0 @@
-import { WalletConnector } from '@dynamic-labs/wallet-connector-core';
-export declare const useWalletConnectorEverPresent: (walletConnector: WalletConnector | null) => boolean;

package/src/lib/hooks/useWalletConnectorEverPresent/useWalletConnectorEverPresent.js

@@ -1,13 +0,0 @@
-import { useState, useEffect } from 'react';
-
-const useWalletConnectorEverPresent = (walletConnector) => {
-    const [present, setPresent] = useState(false);
-    useEffect(() => {
-        if (walletConnector) {
-            setPresent(true);
-        }
-    }, [walletConnector]);
-    return present;
-};
-
-export { useWalletConnectorEverPresent };