Skip to content

Commit 38f3b2e

Browse files
authored
Fix Smart Wallet + In-app wallet connection (#2831)
1 parent 493bf8d commit 38f3b2e

File tree

3 files changed

+48
-5
lines changed

3 files changed

+48
-5
lines changed

.changeset/silver-students-peel.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"thirdweb": patch
3+
---
4+
5+
Fix In-App + Smart wallet Connection issue

packages/thirdweb/src/react/web/ui/ConnectWallet/Modal/ConnectModalContent.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -89,6 +89,7 @@ export const ConnectModalContent = (props: {
8989
}}
9090
done={handleConnected}
9191
goBack={wallets.length > 1 ? handleBack : undefined}
92+
setModalVisibility={setModalVisibility}
9293
/>
9394
);
9495

packages/thirdweb/src/react/web/ui/ConnectWallet/WalletSelector.tsx

Lines changed: 42 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ import { Text } from "../components/text.js";
2727
import { useCustomTheme } from "../design-system/CustomThemeProvider.js";
2828
import { StyledDiv, StyledUl } from "../design-system/elements.js";
2929
import { fontSize, iconSize, radius, spacing } from "../design-system/index.js";
30+
import { SmartConnectUI } from "./Modal/SmartWalletConnectUI.js";
3031
import { TOS } from "./Modal/TOS.js";
3132
import { PoweredByThirdweb } from "./PoweredByTW.js";
3233
import { WalletButton, WalletEntryButton } from "./WalletEntryButton.js";
@@ -39,18 +40,54 @@ const InAppWalletSelectionUI = /* @__PURE__ */ lazy(
3940
// const localWalletId = "local";
4041
const inAppWalletId: WalletId = "inApp";
4142

42-
/**
43-
* @internal
44-
*/
45-
export const WalletSelector: React.FC<{
43+
type WalletSelectorProps = {
4644
wallets: Wallet[];
4745
selectWallet: (wallet: Wallet) => void;
4846
onGetStarted: () => void;
4947
title: string;
5048
done: (wallet: Wallet) => void;
5149
goBack?: () => void;
5250
onShowAll: () => void;
53-
}> = (props) => {
51+
setModalVisibility: (value: boolean) => void;
52+
};
53+
54+
/**
55+
* @internal
56+
*/
57+
export function WalletSelector(props: WalletSelectorProps) {
58+
const { accountAbstraction } = useConnectUI();
59+
const [personalWallet, setPersonalWallet] = useState<Wallet | null>(null);
60+
61+
if (!accountAbstraction) {
62+
return <WalletSelectorInner {...props} />;
63+
}
64+
65+
if (personalWallet) {
66+
return (
67+
<SmartConnectUI
68+
accountAbstraction={accountAbstraction}
69+
done={props.done}
70+
personalWallet={personalWallet}
71+
setModalVisibility={props.setModalVisibility}
72+
onBack={props.goBack}
73+
/>
74+
);
75+
}
76+
77+
return (
78+
<WalletSelectorInner
79+
{...props}
80+
done={(w) => {
81+
setPersonalWallet(w);
82+
}}
83+
/>
84+
);
85+
}
86+
87+
/**
88+
* @internal
89+
*/
90+
const WalletSelectorInner: React.FC<WalletSelectorProps> = (props) => {
5491
const { connectModal, isEmbed, client } = useConnectUI();
5592
const isCompact = connectModal.size === "compact";
5693
const [isWalletGroupExpanded, setIsWalletGroupExpanded] = useState(false);

0 commit comments

Comments
 (0)