@dynamic-labs/sdk-react-core 2.5.3 → 2.6.1

package/src/lib/context/SocialRedirectContext/hooks/useRedirectSocialHandler/useRedirectSocialHandler.js

@@ -0,0 +1,146 @@
+'use client'
+import { __awaiter } from '../../../../../../_virtual/_tslib.js';
+import { useState, useCallback } from 'react';
+import '@dynamic-labs/sdk-api-core';
+import '../../../../shared/logger.js';
+import '@dynamic-labs/iconic';
+import '@dynamic-labs/wallet-connector-core';
+import 'react/jsx-runtime';
+import { useViewContext } from '../../../ViewContext/ViewContext.js';
+import '@dynamic-labs/wallet-book';
+import { isSSR } from '../../../../shared/utils/functions/isSSR/isSSR.js';
+import '../../../../utils/constants/colors.js';
+import '../../../../utils/constants/values.js';
+import '../../../../shared/utils/classes/storage/localStorage.js';
+import { useEffectOnce } from '../../../../shared/utils/hooks/useEffectOnce/useEffectOnce.js';
+import '@dynamic-labs/logger';
+import '@dynamic-labs/utils';
+import { useEffectOnceCondition } from '../../../../shared/utils/hooks/useEffectOnceCondition/useEffectOnceCondition.js';
+import '../../../../shared/consts/index.js';
+import '../../../DynamicContext/DynamicContext.js';
+import '../../../../events/dynamicEvents.js';
+import '../../../CaptchaContext/CaptchaContext.js';
+import '../../../ErrorContext/ErrorContext.js';
+import '@dynamic-labs/multi-wallet';
+import 'react-international-phone';
+import { getSocialSignInProviderForProviderEnum } from '../../../../utils/functions/getSocialSignInProviderForProviderEnum/getSocialSignInProviderForProviderEnum.js';
+import 'viem';
+import 'viem/chains';
+import '../../../../config/ApiEndpoint.js';
+import '@dynamic-labs/store';
+import '../../../../locale/locale.js';
+import { searchSocialStorageByState, deleteSocialStorage } from '../../../../utils/functions/socialStorage/socialStorage.js';
+import '../../../AccessDeniedContext/AccessDeniedContext.js';
+import '../../../AccountExistsContext/AccountExistsContext.js';
+import '../../../UserWalletsContext/UserWalletsContext.js';
+import '../../../VerificationContext/VerificationContext.js';
+import 'react-dom';
+import '../../../WalletContext/WalletContext.js';
+import '../../../ThemeContext/ThemeContext.js';
+import '../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/userFieldsSchema.js';
+import '@dynamic-labs/types';
+import { useSocialAuth } from '../../../../utils/hooks/useSocialAuth/useSocialAuth.js';
+import 'yup';
+import '../../../MockContext/MockContext.js';
+import '../../../../views/CollectUserDataView/useFields.js';
+import '../../../FieldsStateContext/FieldsStateContext.js';
+import '../../../UserFieldEditorContext/UserFieldEditorContext.js';
+import '@dynamic-labs/rpc-providers';
+import 'react-i18next';
+import '../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
+import '../../../../components/Alert/Alert.js';
+import '../../../../components/ShadowDOM/ShadowDOM.js';
+import '../../../../components/IconButton/IconButton.js';
+import '../../../../components/InlineWidget/InlineWidget.js';
+import '../../../../components/Input/Input.js';
+import '../../../../components/IsBrowser/IsBrowser.js';
+import '../../../../components/MenuList/Dropdown/Dropdown.js';
+import '../../../../components/Transition/ZoomTransition/ZoomTransition.js';
+import '../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
+import '../../../../components/Transition/OpacityTransition/OpacityTransition.js';
+import '../../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.js';
+import '../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
+import '../../../../components/Popper/Popper/Popper.js';
+import '../../../../components/Popper/PopperContext/PopperContext.js';
+import 'react-focus-lock';
+import 'qrcode';
+import 'formik';
+import '../../../../views/WalletList/WalletList.js';
+import '../../SocialRedirectContext.js';
+import '../../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
+import '@hcaptcha/react-hcaptcha';
+import '../../../LoadingContext/LoadingContext.js';
+import { useWidgetContext } from '../../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
+import '../../../FooterAnimationContext/index.js';
+import '../../../WalletGroupContext/WalletGroupContext.js';
+import '../../../MfaSettingsContext/MfaSettingsContext.js';
+import '../../../IpConfigurationContext/IpConfigurationContext.js';
+import '../../../PasskeyContext/PasskeyContext.js';
+import '../../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
+import '../../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.js';
+import '../../../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
+import { useInternalDynamicContext } from '../../../DynamicContext/useDynamicContext/useInternalDynamicContext.js';
+
+const useRedirectSocialHandler = ({ setSocialProvider, }) => {
+    const { setView } = useViewContext();
+    const { setDynamicWidgetView } = useWidgetContext();
+    const [socialStorageItem, setSocialStorageItem] = useState(null);
+    const { sdkHasLoaded, user, setShowAuthFlow, isRenderingEmbeddedAuthFlow, setShowDynamicUserProfile, } = useInternalDynamicContext();
+    const { completeConnection } = useSocialAuth({
+        sessionTimeout: 10000,
+    });
+    const updateInterfaceStateForSignIn = useCallback((socialStorageItem) => {
+        const socialSignInProvider = getSocialSignInProviderForProviderEnum(socialStorageItem.provider);
+        setSocialProvider(socialSignInProvider);
+        setView('social-redirect-view');
+        // Only open the auth flow when the embedded widget is not rendered
+        if (!isRenderingEmbeddedAuthFlow.current) {
+            setShowAuthFlow(true);
+        }
+    }, [setSocialProvider, setView, isRenderingEmbeddedAuthFlow, setShowAuthFlow]);
+    const updateInterfaceStateForLink = useCallback(() => {
+        setDynamicWidgetView('profile');
+        setShowDynamicUserProfile(true);
+    }, [setDynamicWidgetView, setShowDynamicUserProfile]);
+    useEffectOnce(() => {
+        // Do not run on server side
+        if (isSSR())
+            return;
+        const url = new URL(window.location.href);
+        const dynamicOauthState = url.searchParams.get('dynamicOauthState');
+        const dynamicOauthCode = url.searchParams.get('dynamicOauthCode');
+        if (!dynamicOauthState || !dynamicOauthCode) {
+            return;
+        }
+        const socialStorageItem = searchSocialStorageByState(dynamicOauthState);
+        if (!socialStorageItem)
+            return;
+        // we got back the dynamicOauthCode from the oauth provider, set it here so we can use it to sign in
+        socialStorageItem.code = dynamicOauthCode;
+        setSocialStorageItem(socialStorageItem);
+        // Clear the state from local storage
+        deleteSocialStorage(socialStorageItem.provider);
+    });
+    useEffectOnceCondition(() => __awaiter(void 0, void 0, void 0, function* () {
+        if (!socialStorageItem)
+            return;
+        const authMode = user ? 'link' : 'signin';
+        // Update UI to reflect the original state
+        if (authMode === 'signin') {
+            updateInterfaceStateForSignIn(socialStorageItem);
+        }
+        else if (authMode === 'link') {
+            updateInterfaceStateForLink();
+        }
+        yield completeConnection({
+            authCode: socialStorageItem.code,
+            authMode,
+            captchaToken: socialStorageItem.captchaToken,
+            provider: socialStorageItem.provider,
+            state: socialStorageItem.state,
+            verifier: socialStorageItem.codeVerifier,
+        });
+    }), Boolean(socialStorageItem) && sdkHasLoaded);
+};
+
+export { useRedirectSocialHandler };

package/src/lib/data/api/embeddedWallets/embeddedWallets.cjs

@@ -24,7 +24,7 @@ var storeAuthTokenAndUser = require('../../../store/utils/storeAuthTokenAndUser/
 const createTurnkeyEmbeddedWallet = (_a) => _tslib.__awaiter(void 0, [_a], void 0, function* ({ attestation, challenge, environmentId, chains = [sdkApiCore.ChainEnum.Evm], passkeyAlias, }) {
     const embeddedWallets = [
         {
-            chains,
+            chains: chains,
             embeddedWalletProvider: sdkApiCore.EmbeddedWalletProviderEnum.Turnkeyhd,
             isAuthenticatorAttached: false,
             passkeyAlias,

package/src/lib/data/api/embeddedWallets/embeddedWallets.js

@@ -20,7 +20,7 @@ import { storeAuthTokenAndUser } from '../../../store/utils/storeAuthTokenAndUse
 const createTurnkeyEmbeddedWallet = (_a) => __awaiter(void 0, [_a], void 0, function* ({ attestation, challenge, environmentId, chains = [ChainEnum.Evm], passkeyAlias, }) {
     const embeddedWallets = [
         {
-            chains,
+            chains: chains,
             embeddedWalletProvider: EmbeddedWalletProviderEnum.Turnkeyhd,
             isAuthenticatorAttached: false,
             passkeyAlias,

package/src/lib/data/api/oauth/oauth.cjs

@@ -21,6 +21,18 @@ require('../../../shared/consts/index.cjs');
 var api = require('../api.cjs');
 var storeAuthTokenAndUser = require('../../../store/utils/storeAuthTokenAndUser/storeAuthTokenAndUser.cjs');
 
+const initAuth = (environmentId, providerType, oauthInitAuthRequest) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+    try {
+        yield api.sdkApi().initAuth({
+            environmentId,
+            oauthInitAuthRequest,
+            providerType,
+        });
+    }
+    catch (e) {
+        logger.logger.error(e);
+    }
+});
 const verifyOAuth = (environmentId_1, providerType_1, _a) => _tslib.__awaiter(void 0, [environmentId_1, providerType_1, _a], void 0, function* (environmentId, providerType, { code, codeVerifier, state }) {
     const oauthRequest = {
         code,
@@ -134,6 +146,7 @@ const farcasterVerify = (farcasterVerifyRequest) => _tslib.__awaiter(void 0, voi
 
 exports.farcasterSignIn = farcasterSignIn;
 exports.farcasterVerify = farcasterVerify;
+exports.initAuth = initAuth;
 exports.signInOAuth = signInOAuth;
 exports.unlinkOAuth = unlinkOAuth;
 exports.verifyOAuth = verifyOAuth;

package/src/lib/data/api/oauth/oauth.d.ts

@@ -1,6 +1,7 @@
-import { FarcasterSignInRequest, OauthRequest, OauthResultRequest, OauthResultResponse, ProviderEnum, FarcasterVerifyRequest } from '@dynamic-labs/sdk-api-core';
+import { FarcasterSignInRequest, OauthRequest, OauthResultRequest, OauthResultResponse, ProviderEnum, FarcasterVerifyRequest, OauthInitAuthRequest } from '@dynamic-labs/sdk-api-core';
 import { UserProfile } from '../../../..';
 export declare const getOauthLoginUrl: (environmentId: string, providerType: ProviderEnum) => Promise<string | undefined>;
+export declare const initAuth: (environmentId: string, providerType: ProviderEnum, oauthInitAuthRequest: OauthInitAuthRequest) => Promise<void>;
 export declare const verifyOAuth: (environmentId: string, providerType: ProviderEnum, { code, codeVerifier, state }: OauthRequest) => Promise<UserProfile | undefined>;
 export declare const unlinkOAuth: ({ environmentId, primaryWalletId, verifiedCrentialId, }: {
     environmentId: string;

package/src/lib/data/api/oauth/oauth.js

@@ -17,6 +17,18 @@ import '../../../shared/consts/index.js';
 import { sdkApi } from '../api.js';
 import { storeAuthTokenAndUser } from '../../../store/utils/storeAuthTokenAndUser/storeAuthTokenAndUser.js';
 
+const initAuth = (environmentId, providerType, oauthInitAuthRequest) => __awaiter(void 0, void 0, void 0, function* () {
+    try {
+        yield sdkApi().initAuth({
+            environmentId,
+            oauthInitAuthRequest,
+            providerType,
+        });
+    }
+    catch (e) {
+        logger.error(e);
+    }
+});
 const verifyOAuth = (environmentId_1, providerType_1, _a) => __awaiter(void 0, [environmentId_1, providerType_1, _a], void 0, function* (environmentId, providerType, { code, codeVerifier, state }) {
     const oauthRequest = {
         code,
@@ -128,4 +140,4 @@ const farcasterVerify = (farcasterVerifyRequest) => __awaiter(void 0, void 0, vo
     }
 });
 
-export { farcasterSignIn, farcasterVerify, signInOAuth, unlinkOAuth, verifyOAuth };
+export { farcasterSignIn, farcasterVerify, initAuth, signInOAuth, unlinkOAuth, verifyOAuth };

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

@@ -7,3 +7,4 @@ export { useOnClickOutside } from './useOnClickOutside';
 export { usePreventPageScroll } from './usePreventPageScroll';
 export { useThrottle } from './useThrottle';
 export { usePrefetch } from './usePrefetch';
+export { useEffectOnceCondition } from './useEffectOnceCondition';

package/src/lib/shared/utils/hooks/useEffectOnceCondition/index.d.ts

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

package/src/lib/shared/utils/hooks/useEffectOnceCondition/useEffectOnceCondition.cjs

@@ -0,0 +1,26 @@
+'use client'
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+
+/**
+ * Hook that runs an effect only once based on a condition.
+ *
+ * @param {Function} effect - The effect callback function to run.
+ * @param {boolean} condition - The condition that determines whether the effect should run.
+ */
+const useEffectOnceCondition = (effect, condition) => {
+    const hasRun = React.useRef(false);
+    const effectRef = React.useRef(effect);
+    effectRef.current = effect;
+    React.useEffect(() => {
+        if (condition && !hasRun.current) {
+            effectRef.current();
+            hasRun.current = true;
+        }
+    }, [condition]);
+};
+
+exports.useEffectOnceCondition = useEffectOnceCondition;

package/src/lib/shared/utils/hooks/useEffectOnceCondition/useEffectOnceCondition.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Hook that runs an effect only once based on a condition.
+ *
+ * @param {Function} effect - The effect callback function to run.
+ * @param {boolean} condition - The condition that determines whether the effect should run.
+ */
+export declare const useEffectOnceCondition: (effect: () => void, condition: boolean) => void;

package/src/lib/shared/utils/hooks/useEffectOnceCondition/useEffectOnceCondition.js

@@ -0,0 +1,22 @@
+'use client'
+import { useRef, useEffect } from 'react';
+
+/**
+ * Hook that runs an effect only once based on a condition.
+ *
+ * @param {Function} effect - The effect callback function to run.
+ * @param {boolean} condition - The condition that determines whether the effect should run.
+ */
+const useEffectOnceCondition = (effect, condition) => {
+    const hasRun = useRef(false);
+    const effectRef = useRef(effect);
+    effectRef.current = effect;
+    useEffect(() => {
+        if (condition && !hasRun.current) {
+            effectRef.current();
+            hasRun.current = true;
+        }
+    }, [condition]);
+};
+
+export { useEffectOnceCondition };