@dynamic-labs/sdk-react-core 0.17.0-RC.18 → 0.17.0-RC.19

package/src/lib/views/SocialRedirectView/SocialRedirectView.js

@@ -14,6 +14,7 @@ import { useInternalDynamicContext } from '../../context/DynamicContext/useInter
 import '@dynamic-labs/multi-wallet';
 import '../../components/ShadowDOM/ShadowDOM.js';
 import '../../context/ThemeContext/ThemeContext.js';
+import { classNames } from '../../utils/functions/classNames/classNames.js';
 import 'react-dom';
 import 'react-focus-lock';
 import '../../components/Transition/ZoomTransition/ZoomTransition.js';
@@ -39,17 +40,11 @@ import { getSocialIcon } from '../../utils/functions/getSocialIcon/getSocialIcon
 const capitalize = (str) => str.charAt(0).toUpperCase() + str.slice(1);
 const SocialRedirectView = () => {
     const { socialProvider, socialWalletConnector } = useSocialRedirectContext();
-    const { termsOfServiceUrl, privacyPolicyUrl } = useInternalDynamicContext();
+    const { termsOfServiceUrl, privacyPolicyUrl, isAuthenticated } = useInternalDynamicContext();
     if (!socialWalletConnector || !socialProvider) {
         return null;
     }
-    return (jsxs("div", Object.assign({ style: {
-            alignItems: 'center',
-            display: 'flex',
-            flexDirection: 'column',
-            justifyContent: 'center',
-            paddingBottom: '3rem',
-        } }, { children: [jsx(IconWithSpinner, { iconSize: 64, Icon: getSocialIcon(socialProvider), isSpinning: true }), jsxs(Typography, { children: ["Connecting to ", capitalize(socialProvider), "..."] }), jsx(TosAndPp, { mode: 'logging in', privacyPolicyUrl: privacyPolicyUrl, termsOfServiceUrl: termsOfServiceUrl })] })));
+    return (jsxs("div", Object.assign({ className: classNames('social-redirect-view__container') }, { children: [jsx(IconWithSpinner, { iconSize: 64, Icon: getSocialIcon(socialProvider), isSpinning: true }), jsxs(Typography, Object.assign({ weight: 'medium', variant: 'title', className: classNames('social-redirect-view__title') }, { children: ["Connecting to ", capitalize(socialProvider), "..."] })), jsx(TosAndPp, { mode: isAuthenticated ? 'connecting' : 'logging in', privacyPolicyUrl: privacyPolicyUrl, termsOfServiceUrl: termsOfServiceUrl })] })));
 };
 
 export { SocialRedirectView };

package/src/lib/views/SocialWrongAccountView/SocialWrongAccountView.cjs

@@ -0,0 +1,58 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var Typography = require('../../components/Typography/Typography.cjs');
+require('@dynamic-labs/sdk-api');
+require('../../shared/logger.cjs');
+require('@dynamic-labs/iconic');
+require('@dynamic-labs/wallet-connector-core');
+require('../../context/ViewContext/ViewContext.cjs');
+require('@dynamic-labs/utils');
+require('../../utils/constants/colors.cjs');
+require('ethers');
+require('../../shared/consts/index.cjs');
+require('../../context/DynamicContext/DynamicContext.cjs');
+require('@dynamic-labs/multi-wallet');
+require('../../components/ShadowDOM/ShadowDOM.cjs');
+require('../../context/ThemeContext/ThemeContext.cjs');
+var classNames = require('../../utils/functions/classNames/classNames.cjs');
+require('react-dom');
+require('react-focus-lock');
+require('../../components/Transition/ZoomTransition/ZoomTransition.cjs');
+require('../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
+require('../../components/Transition/OpacityTransition/OpacityTransition.cjs');
+require('../../config/ApiEndpoint.cjs');
+require('@dynamic-labs/rpc-providers');
+require('../../context/ErrorContext/ErrorContext.cjs');
+require('../../context/MockContext/MockContext.cjs');
+require('../../context/CaptchaContext/CaptchaContext.cjs');
+require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
+var Button = require('../../components/Button/Button.cjs');
+require('../../components/IconButton/IconButton.cjs');
+require('../../components/Alert/Alert.cjs');
+var IconWithSpinner = require('../../components/IconWithSpinner/IconWithSpinner.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
+require('@dynamic-labs/wallet-book');
+require('../../components/SendBalanceForm/SendBalanceForm.cjs');
+var SocialRedirectContext = require('../../context/SocialRedirectContext/SocialRedirectContext.cjs');
+var getSocialIcon = require('../../utils/functions/getSocialIcon/getSocialIcon.cjs');
+
+const SocialWrongAccountView = () => {
+    const [tryAgainClicked, setTryAgainClicked] = React.useState(false);
+    const { socialWalletConnector, socialAccount } = SocialRedirectContext.useSocialRedirectContext();
+    if (!socialAccount || !socialWalletConnector)
+        return null;
+    return (jsxRuntime.jsxs("div", Object.assign({ className: classNames.classNames('social-wrong-account-view__container') }, { children: [jsxRuntime.jsx(IconWithSpinner.IconWithSpinner, { Icon: getSocialIcon.getSocialIcon(socialAccount.oauthProvider), isSpinning: tryAgainClicked, iconSize: 64 }), jsxRuntime.jsx(Typography.Typography, Object.assign({ weight: 'medium', variant: 'title', className: classNames.classNames('social-wrong-account-view__title') }, { children: "Whoops. Wrong Account" })), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', className: classNames.classNames('social-wrong-account-view__copy') }, { children: "You must connect with the same account you originally signed in with." })), jsxRuntime.jsxs(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', className: classNames.classNames('social-wrong-account-view__copy') }, { children: ["Please connect with: ", jsxRuntime.jsx("b", { children: socialAccount.oauthUsername })] })), jsxRuntime.jsx(Button.Button, Object.assign({ buttonClassName: 'social-wrong-account-view__button', buttonRounded: 'medium', buttonVariant: 'primary', buttonPadding: 'large', expanded: true, typographyProps: {
+                    variant: 'button_primary',
+                    weight: 'medium',
+                }, disabled: tryAgainClicked, onClick: () => {
+                    setTryAgainClicked(true);
+                    socialWalletConnector.connect(socialAccount.oauthProvider);
+                } }, { children: "Try again" }))] })));
+};
+
+exports.SocialWrongAccountView = SocialWrongAccountView;

package/src/lib/views/SocialWrongAccountView/SocialWrongAccountView.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const SocialWrongAccountView: () => JSX.Element | null;

package/src/lib/views/SocialWrongAccountView/SocialWrongAccountView.js

@@ -0,0 +1,54 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+import { Typography } from '../../components/Typography/Typography.js';
+import '@dynamic-labs/sdk-api';
+import '../../shared/logger.js';
+import '@dynamic-labs/iconic';
+import '@dynamic-labs/wallet-connector-core';
+import '../../context/ViewContext/ViewContext.js';
+import '@dynamic-labs/utils';
+import '../../utils/constants/colors.js';
+import 'ethers';
+import '../../shared/consts/index.js';
+import '../../context/DynamicContext/DynamicContext.js';
+import '@dynamic-labs/multi-wallet';
+import '../../components/ShadowDOM/ShadowDOM.js';
+import '../../context/ThemeContext/ThemeContext.js';
+import { classNames } from '../../utils/functions/classNames/classNames.js';
+import 'react-dom';
+import 'react-focus-lock';
+import '../../components/Transition/ZoomTransition/ZoomTransition.js';
+import '../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
+import '../../components/Transition/OpacityTransition/OpacityTransition.js';
+import '../../config/ApiEndpoint.js';
+import '@dynamic-labs/rpc-providers';
+import '../../context/ErrorContext/ErrorContext.js';
+import '../../context/MockContext/MockContext.js';
+import '../../context/CaptchaContext/CaptchaContext.js';
+import '../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
+import { Button } from '../../components/Button/Button.js';
+import '../../components/IconButton/IconButton.js';
+import '../../components/Alert/Alert.js';
+import { IconWithSpinner } from '../../components/IconWithSpinner/IconWithSpinner.js';
+import '../../components/Popper/Popper/Popper.js';
+import '../../components/Popper/PopperContext/PopperContext.js';
+import '@dynamic-labs/wallet-book';
+import '../../components/SendBalanceForm/SendBalanceForm.js';
+import { useSocialRedirectContext } from '../../context/SocialRedirectContext/SocialRedirectContext.js';
+import { getSocialIcon } from '../../utils/functions/getSocialIcon/getSocialIcon.js';
+
+const SocialWrongAccountView = () => {
+    const [tryAgainClicked, setTryAgainClicked] = useState(false);
+    const { socialWalletConnector, socialAccount } = useSocialRedirectContext();
+    if (!socialAccount || !socialWalletConnector)
+        return null;
+    return (jsxs("div", Object.assign({ className: classNames('social-wrong-account-view__container') }, { children: [jsx(IconWithSpinner, { Icon: getSocialIcon(socialAccount.oauthProvider), isSpinning: tryAgainClicked, iconSize: 64 }), jsx(Typography, Object.assign({ weight: 'medium', variant: 'title', className: classNames('social-wrong-account-view__title') }, { children: "Whoops. Wrong Account" })), jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'regular', className: classNames('social-wrong-account-view__copy') }, { children: "You must connect with the same account you originally signed in with." })), jsxs(Typography, Object.assign({ variant: 'body_normal', weight: 'regular', className: classNames('social-wrong-account-view__copy') }, { children: ["Please connect with: ", jsx("b", { children: socialAccount.oauthUsername })] })), jsx(Button, Object.assign({ buttonClassName: 'social-wrong-account-view__button', buttonRounded: 'medium', buttonVariant: 'primary', buttonPadding: 'large', expanded: true, typographyProps: {
+                    variant: 'button_primary',
+                    weight: 'medium',
+                }, disabled: tryAgainClicked, onClick: () => {
+                    setTryAgainClicked(true);
+                    socialWalletConnector.connect(socialAccount.oauthProvider);
+                } }, { children: "Try again" }))] })));
+};
+
+export { SocialWrongAccountView };

package/src/lib/views/SocialWrongAccountView/index.d.ts

@@ -0,0 +1 @@
+export * from './SocialWrongAccountView';

package/src/lib/views/viewToComponentMap.cjs

@@ -22,6 +22,7 @@ var WalletList = require('./WalletList/WalletList.cjs');
 var NoAccess = require('./NoAccess/NoAccess.cjs');
 var WalletSignSpinnerView = require('./WalletSignSpinnerView/WalletSignSpinnerView.cjs');
 var WalletUsedView = require('./WalletUsedView/WalletUsedView.cjs');
+var SocialWrongAccountView = require('./SocialWrongAccountView/SocialWrongAccountView.cjs');
 
 const viewToComponentMap = {
     captcha: jsxRuntime.jsx(CaptchaVerifyUser.CaptchaVerifyUser, {}),
@@ -41,6 +42,7 @@ const viewToComponentMap = {
     'pending-signature-without-back-button': jsxRuntime.jsx(PendingSignatureView.PendingSignatureView, {}),
     'qr-code': jsxRuntime.jsx(QrCodeView.QrCodeView, {}),
     'social-redirect-view': jsxRuntime.jsx(SocialRedirectView.SocialRedirectView, {}),
+    'social-wrong-account': jsxRuntime.jsx(SocialWrongAccountView.SocialWrongAccountView, {}),
     'update-email': jsxRuntime.jsx(EmailUpdate.EmailUpdate, {}),
     'verify-email': jsxRuntime.jsx(EmailVerification.EmailVerification, {}),
     'wait-for-email-confirmation-view': jsxRuntime.jsx(EmailConfirmationWaitingView.EmailConfirmationWaitingView, {}),

package/src/lib/views/viewToComponentMap.js

@@ -18,6 +18,7 @@ import { WalletList } from './WalletList/WalletList.js';
 import { NoAccess } from './NoAccess/NoAccess.js';
 import { WalletSignSpinnerView } from './WalletSignSpinnerView/WalletSignSpinnerView.js';
 import { WalletUsedView } from './WalletUsedView/WalletUsedView.js';
+import { SocialWrongAccountView } from './SocialWrongAccountView/SocialWrongAccountView.js';
 
 const viewToComponentMap = {
     captcha: jsx(CaptchaVerifyUser, {}),
@@ -37,6 +38,7 @@ const viewToComponentMap = {
     'pending-signature-without-back-button': jsx(PendingSignatureView, {}),
     'qr-code': jsx(QrCodeView, {}),
     'social-redirect-view': jsx(SocialRedirectView, {}),
+    'social-wrong-account': jsx(SocialWrongAccountView, {}),
     'update-email': jsx(EmailUpdate, {}),
     'verify-email': jsx(EmailVerification, {}),
     'wait-for-email-confirmation-view': jsx(EmailConfirmationWaitingView, {}),

package/src/lib/widgets/DynamicWidget/components/Wallet/Wallet.cjs

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _tslib = require('../../../../../../_virtual/_tslib.cjs');
 var jsxRuntime = require('react/jsx-runtime');
+var walletConnectorCore = require('@dynamic-labs/wallet-connector-core');
 require('@dynamic-labs/iconic');
 require('../../../../context/ViewContext/ViewContext.cjs');
 require('react');
@@ -12,7 +13,6 @@ var unlink = require('../../../../shared/assets/unlink.cjs');
 var switchHorizontal = require('../../../../shared/assets/switch-horizontal.cjs');
 require('@dynamic-labs/sdk-api');
 require('../../../../shared/logger.cjs');
-require('@dynamic-labs/wallet-connector-core');
 var shortenWalletAddress = require('../../../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.cjs');
 require('@dynamic-labs/utils');
 require('../../../../utils/constants/colors.cjs');
@@ -44,6 +44,7 @@ var DotsMenu = require('../DotsMenu/DotsMenu.cjs');
 var helpers = require('../../helpers/helpers.cjs');
 var WalletIconWithStatus = require('../WalletIconWithStatus/WalletIconWithStatus.cjs');
 
+const isEmbeddedConnector = (connector) => walletConnectorCore.isSocialWalletConnector(connector) || walletConnectorCore.isEmailOTPWalletConnector(connector);
 const Wallet = ({ wallet, ens }) => {
     const { id: walletId, connector, address, connected } = wallet;
     const { computeConnectedStateForWallets, setPrimaryWallet, setSelectedWalletConnector, setShowWidgetStatePopup, setSelectedWalletWithAction, } = useInternalDynamicContext.useInternalDynamicContext();
@@ -66,11 +67,14 @@ const Wallet = ({ wallet, ens }) => {
         Icon: jsxRuntime.jsx(copy.ReactComponent, {}),
         callback: () => helpers.copyToClipboard(address || ''),
         text: 'Copy address',
-    }, {
-        Icon: jsxRuntime.jsx(unlink.ReactComponent, {}),
-        callback: () => setSelectedWalletWithAction({ action: 'unlink', wallet }),
-        text: 'Unlink from my account',
     });
+    if (!isEmbeddedConnector(connector)) {
+        options.push({
+            Icon: jsxRuntime.jsx(unlink.ReactComponent, {}),
+            callback: () => setSelectedWalletWithAction({ action: 'unlink', wallet }),
+            text: 'Unlink from my account',
+        });
+    }
     const onSelectWalletClick = () => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         var _a;
         if (connector.connectedChain === 'FLOW') {

package/src/lib/widgets/DynamicWidget/components/Wallet/Wallet.js

@@ -1,5 +1,6 @@
 import { __awaiter } from '../../../../../../_virtual/_tslib.js';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { isSocialWalletConnector, isEmailOTPWalletConnector } from '@dynamic-labs/wallet-connector-core';
 import '@dynamic-labs/iconic';
 import '../../../../context/ViewContext/ViewContext.js';
 import 'react';
@@ -8,7 +9,6 @@ import { ReactComponent as SvgUnlink } from '../../../../shared/assets/unlink.js
 import { ReactComponent as SvgSwitchHorizontal } from '../../../../shared/assets/switch-horizontal.js';
 import '@dynamic-labs/sdk-api';
 import '../../../../shared/logger.js';
-import '@dynamic-labs/wallet-connector-core';
 import { shortenWalletAddress } from '../../../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.js';
 import '@dynamic-labs/utils';
 import '../../../../utils/constants/colors.js';
@@ -40,6 +40,7 @@ import { DotsMenu } from '../DotsMenu/DotsMenu.js';
 import { copyToClipboard } from '../../helpers/helpers.js';
 import { WalletIconWithStatus } from '../WalletIconWithStatus/WalletIconWithStatus.js';
 
+const isEmbeddedConnector = (connector) => isSocialWalletConnector(connector) || isEmailOTPWalletConnector(connector);
 const Wallet = ({ wallet, ens }) => {
     const { id: walletId, connector, address, connected } = wallet;
     const { computeConnectedStateForWallets, setPrimaryWallet, setSelectedWalletConnector, setShowWidgetStatePopup, setSelectedWalletWithAction, } = useInternalDynamicContext();
@@ -62,11 +63,14 @@ const Wallet = ({ wallet, ens }) => {
         Icon: jsx(SvgCopy, {}),
         callback: () => copyToClipboard(address || ''),
         text: 'Copy address',
-    }, {
-        Icon: jsx(SvgUnlink, {}),
-        callback: () => setSelectedWalletWithAction({ action: 'unlink', wallet }),
-        text: 'Unlink from my account',
     });
+    if (!isEmbeddedConnector(connector)) {
+        options.push({
+            Icon: jsx(SvgUnlink, {}),
+            callback: () => setSelectedWalletWithAction({ action: 'unlink', wallet }),
+            text: 'Unlink from my account',
+        });
+    }
     const onSelectWalletClick = () => __awaiter(void 0, void 0, void 0, function* () {
         var _a;
         if (connector.connectedChain === 'FLOW') {